:root {
  --bg: #fcfcfa;
  --panel: #f0f2ee;
  --text: #222c27;
  --muted: #546059;
  --accent: #215d47;
  --line: #d8dfd9;
  --on-accent: #fff;
  --focus: #b84b28;
  --max: 1520px;
  color-scheme: light dark;
  font-family: "Segoe UI", Arial, sans-serif;
  font-size: 16px;
}
* {
  box-sizing: border-box;
}
html,
body {
  max-width: 100%;
  overflow-x: clip;
}
body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  line-height: 1.65;
  padding-bottom: 84px;
}
html {
  scroll-behavior: smooth;
  scroll-padding-bottom: 100px;
}
.nav-toggle {
  display: none;
}
.format-grid figure {
  margin-bottom: 18px;
}
.product-image-link {
  display: block;
  text-decoration: none;
}
.product-image-link img {
  transition: filter 0.2s ease;
}
.product-image-link:hover img {
  filter: brightness(0.97);
}
.format-grid figure img {
  aspect-ratio: 1;
  object-fit: contain;
  background: #f4f0e8;
}
main > *,
.two-columns > *,
.inquiry-layout > * {
  min-width: 0;
}
h1,
h2,
h3 {
  text-wrap: balance;
  overflow-wrap: break-word;
}
.site-header [aria-current="page"] {
  color: var(--accent);
  text-decoration: underline;
}
.contact-panel {
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  gap: 48px;
  padding: 42px;
  margin: 0 0 60px;
  background: var(--panel);
  border-top: 1px solid var(--line);
  scroll-margin-top: 24px;
}
.contact-panel h2 {
  font-size: clamp(1.8rem, 3vw, 2.8rem);
}
.contact-status {
  display: block;
  font-weight: 600;
  margin-bottom: 16px;
}
.contact-dock {
  position: fixed;
  bottom: 18px;
  right: 24px;
  z-index: 20;
  display: flex;
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: 0 5px 24px #222c2715;
  border-radius: 6px;
  overflow: hidden;
}
.contact-dock a {
  padding: 12px 20px;
  min-height: 52px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-decoration: none;
  font-size: 0.9rem;
}
.contact-dock a:last-child {
  background: var(--accent);
  color: var(--on-accent);
}
.contact-dock span {
  font-size: 0.65rem;
  line-height: 1.2;
}
.contact-dock a:focus-visible {
  outline-offset: -4px;
}
@media (max-width: 767px) {
  body {
    padding-bottom: 0;
  }
  .enhanced-nav .nav-toggle {
    display: block;
    min-height: 44px;
    padding: 8px 14px;
    background: var(--bg);
    border: 1px solid var(--line);
    border-radius: 4px;
    color: var(--text);
  }
  .enhanced-nav .site-header > .button {
    display: none;
  }
  .enhanced-nav .site-header nav:not(.is-open) {
    display: none;
  }
  .contact-panel {
    grid-template-columns: 1fr;
    padding: 24px;
    gap: 18px;
    margin-bottom: 32px;
  }
  .contact-dock {
    position: static;
    left: 12px;
    right: 12px;
    bottom: auto;
    width: calc(100% - 24px);
    max-width: none;
    margin: 12px;
  }
  .contact-dock a {
    flex: 1;
    min-width: 0;
    align-items: center;
    padding: 10px;
    overflow-wrap: anywhere;
  }
  .site-header {
    flex-wrap: wrap;
    width: 100%;
    min-width: 0;
  }
  .site-header nav {
    width: 100%;
    order: 3;
  }
  .site-header nav a,
  .site-header summary {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .site-header .dropdown {
    max-width: calc(100vw - 40px);
  }
}
@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }
}
a {
  color: inherit;
  text-underline-offset: 5px;
}
a:hover {
  color: var(--accent);
}
button,
input,
select,
textarea {
  font: inherit;
}
button,
a,
input,
select,
textarea,
summary {
  -webkit-tap-highlight-color: transparent;
}
button,
summary {
  cursor: pointer;
}
button:disabled {
  cursor: not-allowed;
  opacity: 0.55;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible {
  outline: 3px solid var(--focus);
  outline-offset: 5px;
}
h1,
h2,
h3,
p {
  margin: 0 0 1rem;
}
h1,
h2,
h3 {
  line-height: 1.12;
  font-weight: 550;
  letter-spacing: -0.035em;
}
h1 {
  font-size: clamp(2.6rem, 4.6vw, 4.5rem);
  max-width: 18ch;
}
h2 {
  font-size: clamp(1.9rem, 3vw, 3rem);
  max-width: 25ch;
}
h3 {
  font-size: 1.4rem;
  letter-spacing: -0.02em;
}
p {
  color: var(--muted);
  max-width: 68ch;
}
img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}
figure {
  margin: 0;
  min-width: 0;
}
figcaption {
  font-size: 0.76rem;
  line-height: 1.5;
  color: var(--muted);
  padding: 0.65rem 0;
  overflow-wrap: anywhere;
}
section {
  padding: 72px 0;
}
main {
  max-width: var(--max);
  margin: auto;
  padding: 0 40px;
}
main:focus {
  outline: 0;
}
.skip {
  position: absolute;
  left: 16px;
  top: -80px;
  padding: 12px;
  background: var(--bg);
  z-index: 30;
}
.skip:focus {
  top: 10px;
}
.site-header {
  max-width: 1440px;
  margin: auto;
  min-height: 80px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
  padding: 16px 40px;
  border-bottom: 1px solid var(--line);
}
.brand {
  font-size: 1.65rem;
  letter-spacing: -0.075em;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}
.brand-mark {
  display: inline-block;
  color: var(--accent);
  margin-left: 7px;
}.brand-logo {
  display: block;
  width: 178px;
  height: auto;
  object-fit: contain;
}
.site-header nav {
  display: flex;
  align-items: center;
  column-gap: 28px;
  row-gap: 10px;
  font-size: 0.9rem;
  white-space: nowrap;
}
.site-header nav a,
.site-header nav summary {
  text-decoration: none;
}
.button,
.secondary {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  padding: 12px 22px;
  border: 1px solid var(--accent);
  border-radius: 4px;
  background: var(--accent);
  color: var(--on-accent);
  font-weight: 600;
  text-decoration: none;
  line-height: 1.4;
  white-space: nowrap;
  font-size: 0.9rem;
}
.button:hover {
  background: var(--text);
  border-color: var(--text);
  color: var(--bg);
}
.secondary {
  background: transparent;
  color: var(--text);
  border-color: var(--line);
}
.text-link {
  display: inline-block;
  font-weight: 600;
  font-size: 0.95rem;
  padding: 10px 0;
}
.actions {
  display: flex;
  align-items: center;
  gap: 24px;
  flex-wrap: wrap;
}
.product-menu {
  position: relative;
}
.product-menu summary {
  list-style: none;
}
.product-menu summary::-webkit-details-marker {
  display: none;
}
.product-menu summary::after {
  content: "⌄";
  margin-left: 5px;
}
.dropdown {
  position: absolute;
  top: 38px;
  left: -20px;
  z-index: 20;
  width: 270px;
  padding: 15px;
  background: var(--bg);
  border: 1px solid var(--line);
  box-shadow: 0 16px 30px #17312614;
}
.dropdown a {
  display: block;
  padding: 10px;
}
.dropdown a:hover {
  background: var(--panel);
}
.hero {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 60px;
  align-items: center;
  padding: 44px 0 36px;
}
.hero-copy p {
  font-size: 1.15rem;
  max-width: 39ch;
  margin: 24px 0 30px;
}
.hero figure img {
  aspect-ratio: 1.13;
  object-fit: cover;
  border-radius: 4px;
}
.hero h1 {
  font-size: clamp(2.8rem, 4.5vw, 4.2rem);
  max-width: 13ch;
}
.custom-strip {
  border-block: 1px solid var(--line);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 25px 0;
  flex-wrap: wrap;
}
.custom-strip h2 {
  font-size: 1rem;
  letter-spacing: 0;
  margin: 0;
}
.custom-strip a {
  font-size: 0.85rem;
  text-decoration: none;
  font-weight: 600;
}
.intro {
  margin-bottom: 32px;
}
.category-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 30px;
}
.category {
  grid-column: span 2;
  min-width: 0;
}
.category:nth-child(-n + 2) {
  grid-column: span 3;
}
.category a {
  text-decoration: none;
}
.category img {
  aspect-ratio: 1.4;
  transition: transform 0.35s ease;
  border-radius: 4px;
}
.category figure {
  overflow: hidden;
}
.category a:hover img {
  transform: scale(1.025);
}
.category h3 {
  display: flex;
  justify-content: space-between;
  margin-top: 12px;
}
.category p {
  font-size: 0.95rem;
}
.category figcaption {
  font-size: 0.7rem;
}
.process-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 90px;
  border-top: 1px solid var(--line);
}
.process {
  margin: 0;
  padding: 0;
  list-style: none;
  counter-reset: steps;
}
.process li {
  padding: 0 0 24px 50px;
  position: relative;
  counter-increment: steps;
}
.process li:before {
  content: counter(steps);
  position: absolute;
  left: 0;
  top: 0;
  font-size: 1rem;
  color: var(--accent);
  font-weight: 700;
}
.process h3 {
  font-size: 1.35rem;
}
.feature-case {
  display: grid;
  grid-template-columns: 1.2fr 1fr;
  gap: 64px;
  align-items: center;
}
.feature-case img {
  aspect-ratio: 1.25;
}
.guide-list {
  border-top: 1px solid var(--line);
  margin-top: 32px;
}
.guide-list .text-card {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 30px;
  padding: 28px 0;
}
.guide-list .text-card h3 {
  font-size: 1.4rem;
}
.guide-list .text-card p {
  margin: 0;
}
.text-card {
  padding: 26px 0;
  border-bottom: 1px solid var(--line);
}
.text-card h3 a {
  text-decoration: none;
}
.text-card h3 a:hover {
  text-decoration: underline;
}
.closing {
  background: var(--panel);
  padding: 50px;
  margin: 28px 0 72px;
  border-radius: 4px;
}
.closing h2 {
  max-width: 30ch;
}
.closing p {
  margin-bottom: 24px;
}
footer {
  border-top: 1px solid var(--line);
  padding: 52px 40px 20px;
  max-width: 1440px;
  margin: auto;
}
.footer-top {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 50px;
}
.footer-top h2 {
  font-size: 1rem;
  letter-spacing: 0;
}
.footer-top a:not(.brand) {
  display: block;
  margin: 8px 0;
  font-size: 0.9rem;
  text-decoration: none;
}
.footer-top p {
  margin-top: 20px;
}
.footer-bottom {
  border-top: 1px solid var(--line);
  padding-top: 20px;
  margin-top: 35px;
  display: flex;
  gap: 25px;
  justify-content: space-between;
  font-size: 0.75rem;
  color: var(--muted);
}
.crumb {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  font-size: 0.8rem;
  color: var(--muted);
  padding-top: 24px;
}
.page-heading {
  padding: 55px 0 30px;
}
.page-heading p {
  font-size: 1.1rem;
  max-width: 64ch;
  margin-top: 22px;
}
.page-heading h1 {
  max-width: 22ch;
}
.tight {
  padding-top: 10px;
}
.split-heading,
.product-detail,
.customizer,
.case-detail {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  align-items: center;
  padding-top: 40px;
}
.split-heading h1,
.product-detail h1 {
  font-size: clamp(2.3rem, 4vw, 3.5rem);
}
.split-heading figure img,
.product-detail figure img,
.customizer figure img,
.case-detail figure img {
  aspect-ratio: 1.1;
  border-radius: 4px;
}
.lead {
  font-size: 1.25rem;
}
.split-heading .button {
  margin-top: 15px;
}
.format-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 14px 40px;
}
.category-name {
  font-size: 0.8rem;
  font-weight: 600;
  color: var(--accent);
  margin-bottom: 12px;
}
.two-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 64px;
  border-top: 1px solid var(--line);
}
.two-columns h2 {
  font-size: 2rem;
}
.filters {
  display: grid;
  grid-template-columns: 2fr 1fr;
  gap: 25px;
  margin: 30px 0;
}
.filters label {
  font-size: 0.9rem;
}
.notice {
  background: var(--panel);
  padding: 14px 18px;
  border-left: 3px solid var(--accent);
  font-size: 0.9rem;
}
.product-detail h2 {
  font-size: 1.2rem;
  margin-top: 25px;
  letter-spacing: 0;
}
.product-detail .text-link {
  display: block;
  margin-top: 12px;
}
.faq {
  max-width: 900px;
}
.faq details {
  border-bottom: 1px solid var(--line);
  padding: 18px 0;
}
.faq summary {
  font-weight: 600;
}
.faq details p {
  margin: 15px 0;
}
.related .text-card {
  max-width: 700px;
}
.customizer {
  align-items: start;
}
.customizer > div:first-child {
  position: sticky;
  top: 20px;
}
.customizer label {
  font-size: 0.9rem;
}
fieldset {
  border: 0;
  padding: 0;
  margin: 28px 0;
}
legend {
  font-size: 1.1rem;
  font-weight: 650;
  margin-bottom: 8px;
}
fieldset[id] {
  scroll-margin-top: 24px;
}
.helper {
  font-size: 0.84rem;
  color: var(--muted);
}
.choices {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.choices label {
  display: block;
  position: relative;
}
.choices input {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
}
.choices span {
  display: block;
  border: 1px solid var(--line);
  padding: 10px 14px;
  border-radius: 4px;
  cursor: pointer;
}
.choices input:checked + span {
  background: var(--accent);
  border-color: var(--accent);
  color: var(--on-accent);
}
.choices input:focus-visible + span {
  outline: 3px solid var(--focus);
  outline-offset: 3px;
}
label {
  display: block;
  font-weight: 600;
}
input:not([type="radio"]),
select,
textarea {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px;
  background: var(--bg);
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 4px;
  margin: 8px 0 20px;
  font-weight: 400;
  max-width: 100%;
}
input::placeholder,
textarea::placeholder {
  color: var(--muted);
  opacity: 1;
}
textarea {
  resize: vertical;
}
.service-list article {
  display: grid;
  grid-template-columns: 1fr 2fr;
  gap: 60px;
  border-bottom: 1px solid var(--line);
  padding: 32px 0;
}
.service-list article h2 {
  font-size: 2rem;
}
.case-list article,
.guide-item {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 50px;
  align-items: center;
  padding: 30px 0;
  border-bottom: 1px solid var(--line);
}
.case-list img,
.guide-item img {
  aspect-ratio: 1.4;
}
.case-list h2,
.guide-item h2 {
  font-size: 2.2rem;
}
.case-list h2 a,
.guide-item h2 a {
  text-decoration: none;
}
.case-detail {
  align-items: start;
}
.case-detail h2 {
  font-size: 1.5rem;
  margin-top: 20px;
}
.case-detail h2:first-child {
  margin-top: 0;
}
.article {
  max-width: 800px;
  margin: 0 auto 70px;
}
.article h2 {
  font-size: 1.85rem;
  margin: 40px 0 16px;
}
.article p {
  max-width: none;
}
.article .page-heading h1 {
  max-width: none;
}
.answer {
  font-size: 1.25rem;
  border-left: 3px solid var(--accent);
  padding-left: 22px;
}
.article pre,
#brief-text {
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  font:
    1rem/1.8 "Segoe UI",
    Arial,
    sans-serif;
  background: var(--panel);
  padding: 24px;
  border-radius: 4px;
}
.sources {
  margin-top: 40px;
  border-top: 1px solid var(--line);
}
.sources p {
  font-size: 0.8rem;
}
.article-cta {
  margin-top: 40px;
  padding: 25px;
  background: var(--panel);
}
.article-cta h2 {
  margin-top: 0;
}
.article-cta .text-link {
  display: block;
}
.inquiry-layout {
  display: grid;
  grid-template-columns: 1.6fr 1fr;
  gap: 80px;
  padding-top: 0;
}
.inquiry-layout fieldset {
  margin-top: 0;
}
.inquiry-aside {
  background: var(--panel);
  padding: 30px;
  height: fit-content;
  border-radius: 4px;
}
.inquiry-aside h2 {
  font-size: 1.65rem;
}
.inquiry-aside h3 {
  font-size: 1.2rem;
  margin-top: 30px;
}
.inquiry-aside ol {
  padding-left: 22px;
  color: var(--muted);
}
.inquiry-aside li {
  margin-bottom: 16px;
}
.optional-fields {
  border-block: 1px solid var(--line);
  padding: 18px 0;
  margin-bottom: 25px;
}
.optional-fields[open] summary {
  margin-bottom: 25px;
}
#brief-result {
  padding: 0;
}
#brief-result h2 {
  font-size: 2rem;
}
#brief-result .actions {
  gap: 10px;
}
[hidden] {
  display: none !important;
}
:root {
  --control-border: #78867c;
}
input:not([type="radio"]),
select,
textarea,
.choices span,
.secondary {
  border-color: var(--control-border);
}
@media (prefers-color-scheme: dark) {
  :root {
    --bg: #1d2420;
    --panel: #28332c;
    --text: #edf1ed;
    --muted: #b9c6be;
    --accent: #add1b8;
    --on-accent: #15291d;
    --line: #48574e;
    --control-border: #85988b;
    --focus: #eda589;
  }
  .dropdown {
    box-shadow: none;
  }
  .notice {
    border-left-color: var(--accent);
  }
}
:root[data-theme="dark"] {
  --bg: #1d2420;
  --panel: #28332c;
  --text: #edf1ed;
  --muted: #b9c6be;
  --accent: #add1b8;
  --on-accent: #15291d;
  --line: #48574e;
  --control-border: #85988b;
  --focus: #eda589;
  color-scheme: dark;
}
:root[data-theme="light"] {
  --bg: #fcfcfa;
  --panel: #f0f2ee;
  --text: #222c27;
  --muted: #546059;
  --accent: #215d47;
  --on-accent: #fff;
  --line: #d8dfd9;
  --control-border: #78867c;
  --focus: #b84b28;
  color-scheme: light;
}
#theme-toggle {
  background: transparent;
  border: 1px solid var(--control-border);
  color: var(--text);
  border-radius: 4px;
  padding: 8px 12px;
}
@media (prefers-reduced-motion: no-preference) {
  .button,
  .secondary {
    transition:
      background 0.2s,
      transform 0.2s;
  }
  .button:active,
  .secondary:active {
    transform: translateY(1px);
  }
  .hero-copy {
    animation: enter 0.5s ease-out;
  }
  @keyframes enter {
    from {
      opacity: 0.65;
      transform: translateY(10px);
    }
    to {
      opacity: 1;
      transform: none;
    }
  }
}
@media (prefers-reduced-motion: reduce) {
  *,
  *:before,
  *:after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }
}
@media (max-width: 1100px) {
  .site-header {
    flex-wrap: wrap;
  }
  .site-header nav {
    order: 3;
    width: 100%;
    justify-content: center;
  }
  .site-header {
    gap: 12px;
  }
  .hero {
    gap: 30px;
  }
  .hero h1 {
    font-size: 3.2rem;
  }
  .guide-list .text-card {
    grid-template-columns: 1fr 1fr;
  }
  .guide-list .text-card > .text-link {
    grid-column: 1/-1;
  }
  .inquiry-layout {
    gap: 35px;
  }
  .customizer {
    gap: 30px;
  }
}
@media (max-width: 767px) {
  main {
    padding: 0 20px;
  }
  .site-header {
    padding: 14px 20px;
  }
  .brand {
    font-size: 1.4rem;
  }  .brand-logo {
    width: 142px;
  }
  .site-header > .button {
    padding: 10px 12px;
    font-size: 0.76rem;
    min-height: 42px;
  }
  .site-header nav {
    justify-content: flex-start;
    gap: 18px;
    font-size: 0.82rem;
    flex-wrap: wrap;
  }
  .dropdown {
    left: 0;
  }
  .hero,
  .split-heading,
  .product-detail,
  .customizer,
  .case-detail {
    grid-template-columns: 1fr;
    gap: 24px;
    padding-top: 30px;
  }
  .hero h1 {
    font-size: 2.8rem;
  }
  .hero-copy p {
    font-size: 1rem;
    margin: 18px 0 25px;
  }
  .hero figure img {
    aspect-ratio: 1.2;
  }
  .hero .actions {
    display: grid;
    grid-template-columns: 1fr;
    justify-items: start;
    gap: 10px;
  }
  .hero .actions .button,
  .hero .actions .text-link {
    max-width: 100%;
    white-space: normal;
  }
  .custom-strip {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }
  .custom-strip h2 {
    grid-column: 1/-1;
  }
  section {
    padding: 42px 0;
  }
  .category-grid {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  .category,
  .category:nth-child(-n + 2) {
    grid-column: auto;
  }
  .category img {
    aspect-ratio: 1.5;
  }
  .process-section,
  .feature-case,
  .two-columns,
  .inquiry-layout,
  .service-list article,
  .case-list article,
  .guide-item {
    grid-template-columns: 1fr;
    gap: 26px;
  }
  .process {
    margin-top: 10px;
  }
  .guide-list .text-card {
    display: block;
  }
  .guide-list .text-card > .text-link {
    margin-top: 6px;
  }
  .format-grid {
    grid-template-columns: 1fr;
  }
  .closing {
    padding: 28px;
    margin-bottom: 42px;
  }
  .footer-top {
    grid-template-columns: 1fr 1fr;
    gap: 25px;
  }
  .footer-top > div:first-child {
    grid-column: 1/-1;
  }
  .footer-bottom {
    display: block;
  }
  .footer-bottom > * {
    display: block;
    margin-bottom: 10px;
  }
  footer {
    padding: 35px 20px 20px;
  }
  .filters {
    grid-template-columns: 1fr;
    gap: 0;
  }
  .page-heading {
    padding-top: 35px;
  }
  .page-heading h1 {
    font-size: 2.5rem;
  }
  .customizer > div:first-child {
    position: static;
  }
  .product-detail > figure {
    order: 2;
  }
  .product-detail > div {
    display: contents;
  }
  .product-detail > div > * {
    order: 3;
  }
  .product-detail > div > .category-name {
    order: 0;
    margin: 0;
  }
  .product-detail > div > h1 {
    order: 1;
    margin: 0;
  }
  .product-detail h1 {
    font-size: 2.5rem;
  }
  .inquiry-aside {
    padding: 24px;
  }
  .case-list h2,
  .guide-item h2 {
    font-size: 1.8rem;
  }
  .article pre,
  #brief-text {
    padding: 16px;
  }
  .article .page-heading h1 {
    font-size: 2.4rem;
  }
  .button {
    max-width: 100%;
    white-space: normal;
    text-align: center;
  }
  .crumb {
    font-size: 0.75rem;
  }
}

/* Editorial homepage: visible buyer information, no scroll-dependent reveals. */
.visual-customization { border-top:1px solid var(--line); }
.sample-library { padding-bottom:0; }
.sample-explorer { display:grid; grid-template-columns:1fr 1.1fr; gap:48px; align-items:start; border-top:1px solid var(--line); padding:40px 0; }
.sample-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.sample-choice { display:block; color:var(--text); text-decoration:none; padding:5px; border:2px solid transparent; transition:border-color .18s,transform .18s; }
.sample-choice:hover,.sample-choice:focus-visible { border-color:var(--accent); outline:2px solid var(--accent); outline-offset:2px; }
.sample-choice[aria-pressed=true] { border-color:var(--accent); background:var(--panel); }
.sample-choice strong { display:block; font-size:.9rem; margin-top:9px; }
.sample-choice small { display:block; font-size:.72rem; color:var(--muted); margin:5px 0; }
.atlas-window { display:block; position:relative; overflow:hidden; aspect-ratio:1; background:#eee7db; }
.atlas-window img { position:absolute; width:300%; max-width:none; height:200%; object-fit:fill; left:0; top:0; }
.tile-1 img,.tile-4 img { left:-100%; }.tile-2 img,.tile-5 img { left:-200%; }
.tile-3 img,.tile-4 img,.tile-5 img { top:-100%; }
.sample-preview { min-width:0; }
.sample-caption { padding:24px; background:var(--panel); min-height:245px; }
.sample-caption h3 { margin:12px 0; }.sample-caption p { font-size:.9rem; }
.sample-check { border-left:2px solid var(--accent); padding-left:12px; }
.sample-selection { display:grid; grid-template-columns:1fr auto; gap:24px; background:var(--panel); padding:28px; }
.sample-clear { display:block; margin-top:14px; min-height:44px; border:0; background:transparent; color:var(--text); text-decoration:underline; cursor:pointer; }
@media(max-width:767px) {
 .sample-explorer { grid-template-columns:1fr; gap:20px; padding:28px 0; }
 .sample-grid { gap:6px; }.sample-choice strong { font-size:.78rem; }
 .sample-choice small { font-size:.65rem; }.sample-caption { padding:20px; min-height:0; }
 .sample-selection { grid-template-columns:1fr; padding:20px; }
}
@media(prefers-reduced-motion:reduce) { .sample-choice { transition:none; } }
.visual-workbench { display:grid; grid-template-columns:1.65fr 1fr; gap:48px; align-items:center; }
.visual-stage { position:relative; background:#eee8dd; }
.visual-photo { position:relative; }
.part-marker,.part-button-label { display:none; }
.visual-stage img { width:100%; aspect-ratio:1.5; object-fit:contain; }
.part-dot { position:absolute; width:44px; height:44px; display:grid; place-items:center; border:2px solid #fff; border-radius:50%; background:#215d47; color:#fff; text-decoration:none; font-size:14px; font-weight:700; transform:translate(-50%,-50%); box-shadow:0 2px 12px #172e2340; }
.part-dot:hover,.part-dot:focus-visible { background:#a24b2b; }
.part-sleeve { left:25%; top:36%; }.part-tray { left:59%; top:62%; }.part-insert { left:44%; top:56%; }.part-tab { left:51%; top:72%; }
.visual-controls h3 { font-size:clamp(1.7rem,2.5vw,2.6rem); }
.visual-look-controls { display:flex; flex-direction:column; gap:10px; margin:24px 0; }
.look-option { display:flex; gap:14px; align-items:center; width:100%; min-height:52px; border:1px solid var(--line); padding:10px 14px; text-decoration:none; color:var(--text); background:transparent; font:inherit; text-align:left; cursor:pointer; }
.look-option[aria-current] { border:2px solid var(--accent); padding:9px 13px; background:var(--panel); }
.look-swatch { width:28px; height:28px; border-radius:50%; border:1px solid #777; flex-shrink:0; }
.swatch-forest { background:#304c3d; }.swatch-ivory { background:#ede1cf; }.swatch-logo { background:linear-gradient(120deg,#6d5121,#f4daa0,#96722e); }
.swatch-navy { background:#243957; }.swatch-blush { background:#c18f82; }
@media(max-width:767px) {
 .visual-workbench { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; }
 .visual-controls { display:contents; }
 .visual-controls > .eyebrow { display:none; }
 .visual-controls h3 { grid-row:1; }
 .visual-look-controls { grid-row:2; margin:0; }
 .visual-workbench > div:first-child { grid-row:3; min-width:0; }
 .visual-look-note { grid-row:4; }
 .visual-enlarge { grid-row:5; }
 .visual-brief { grid-row:6; }
 .visual-controls > .helper { grid-row:7; }
 .visual-look-controls { display:grid; grid-template-columns:1fr 1fr; }
 .look-option { font-size:.85rem; gap:8px; }
 .visual-controls h3 { margin-bottom:10px; }
}
.visual-look-note { min-height:5.5em; font-size:.9rem; }
.visual-brief { display:flex; margin:18px 0; }
.part-legend { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; margin-top:28px; }
.part-legend article { padding:22px 18px; background:var(--panel); scroll-margin-top:30px; }
.part-legend article > span { font-size:.75rem; color:var(--accent); }
.part-legend h3 { font-size:1.2rem; margin:12px 0; }.part-legend p { font-size:.85rem; margin:0; }
.part-legend .part-active,.part-legend article:target { outline:2px solid var(--accent); outline-offset:3px; }
.visual-samples { padding-bottom:0; }
.sample-enlarge { display:block; position:relative; text-decoration:none; }
.sample-enlarge > span { position:absolute; bottom:16px; right:16px; background:#fcfcfa; color:#222c27; padding:10px 14px; font-size:.85rem; }
.sample-notes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:28px; margin-top:24px; }
.sample-notes article > span { font-size:.7rem; letter-spacing:.1em; color:var(--accent); }.sample-notes h3 { margin:12px 0; }.sample-notes p { font-size:.9rem; }
.visual-disclaimer { padding:20px 0; margin:30px 0 0; border-top:1px solid var(--line); font-size:.8rem; max-width:none; }
@media(max-width:1000px) { .visual-workbench { gap:28px; grid-template-columns:1.3fr 1fr; } .part-legend { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) {
 .part-hotspots { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:12px; }
 .part-dot { position:static; transform:none; width:auto; height:auto; min-height:48px; border-radius:4px; display:flex; justify-content:center; gap:8px; box-shadow:none; font-size:12px; }
 .part-button-label { display:inline; }
 .part-marker { position:absolute; display:grid; place-items:center; width:22px; height:22px; transform:translate(-50%,-50%); border:1px solid #fff; border-radius:50%; background:#215d47; color:white; font-size:11px; }
 .visual-workbench { grid-template-columns:1fr; gap:24px; }
 .visual-look-note { min-height:0; }
 .part-legend { gap:16px; }.part-legend article { padding:18px 14px; }
 .sample-notes { grid-template-columns:1fr; gap:8px; }.sample-notes article { border-bottom:1px solid var(--line); padding-bottom:8px; }
 .visual-samples { padding-top:42px; }
}
.scope-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:0 32px; }
.scope-item { position:relative; border-top:1px solid var(--line); padding:28px 0 32px; }
.scope-number { display:block; color:var(--accent); font-size:.8rem; margin-bottom:30px; font-variant-numeric:tabular-nums; }
.scope-item h3 { font-size:1.45rem; }
.scope-item p { font-size:.9rem; }
.scope-item .scope-choices { color:var(--text); font-weight:600; }
.scope-item dl { font-size:.85rem; margin-top:22px; }
.scope-item dt { font-weight:600; margin-top:16px; }
.scope-item dd { margin:6px 0 0; color:var(--muted); }
.scope-item:target { outline:2px solid var(--accent); outline-offset:8px; }
@media(max-width:1100px) { .scope-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:540px) { .scope-grid { grid-template-columns:1fr; } .scope-number { margin-bottom:14px; } }
.showroom-products { display:grid; grid-template-columns:1.6fr 1fr; gap:40px; }
.showroom-products a { text-decoration:none; display:block; }
.showroom-feature { align-self:start; position:static; }
.showroom-products h3 { font-size:clamp(1.5rem,2.5vw,2.7rem); margin:10px 0; }
.showroom-products a > span { display:block; margin-top:18px; font-size:.75rem; color:var(--muted); }
.showroom-secondary { display:grid; gap:40px; }
.showroom-secondary img { aspect-ratio:1.7; object-fit:cover; }
.showroom-products img { transition:filter .25s ease; }
.showroom-products a:hover img { filter:brightness(1.04); }
.showroom-products a:hover h3 { text-decoration:underline; text-underline-offset:6px; }
.drawer-showroom { display:grid; grid-template-columns:1.4fr 1fr; gap:clamp(30px,5vw,80px); align-items:start; padding-top:32px; }
.drawer-summary h1 { font-size:clamp(2.7rem,4.5vw,4.7rem); }
.drawer-summary h2 { font-size:1.1rem; letter-spacing:0; margin:24px 0 14px; }
.drawer-summary > .text-link { display:block; margin:12px 0; }
.product-gallery { min-width:0; }
#gallery-frame img { aspect-ratio:1.25; object-fit:contain; background:var(--panel); }
.gallery-controls { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin:16px 0; }
.gallery-controls button,.gallery-controls a { font:inherit; font-size:.8rem; padding:10px 14px; border:1px solid var(--line); background:var(--bg); color:var(--text); cursor:pointer; }
.gallery-controls button[aria-pressed="true"] { background:var(--accent); color:var(--on-accent); border-color:var(--accent); }
.product-facts { margin:26px 0; }
.product-facts > div,.specification-list > div { display:grid; grid-template-columns:1fr 1.5fr; gap:18px; border-top:1px solid var(--line); padding:16px 0; }
.product-facts dt,.specification-list dt { font-weight:600; }
.product-facts dd,.specification-list dd { margin:0; color:var(--muted); }
.product-facts { font-size:.85rem; }
.drawer-details { display:grid; grid-template-columns:1fr 1fr; gap:80px; }
.detail-notes article { border-top:1px solid var(--line); padding:28px 0; }
.detail-notes article > span { display:block; font-size:.7rem; letter-spacing:.1em; margin-bottom:16px; }
.image-dialog { width:min(1100px,94vw); max-height:94dvh; padding:16px; border:1px solid var(--line); background:var(--bg); color:var(--text); }
.image-dialog::backdrop { background:rgba(18,28,23,.8); }
.image-dialog button { font:inherit; display:block; margin:0 0 12px auto; padding:10px 16px; cursor:pointer; background:var(--accent); color:var(--on-accent); border:0; }
.image-dialog img { max-height:78dvh; object-fit:contain; }
.button,.text-link { transition:background-color .2s ease,color .2s ease,transform .2s ease; }
.button:active { transform:translateY(1px); }
@media (max-width:767px) {
  .showroom-products,.drawer-showroom,.drawer-details { grid-template-columns:1fr; gap:28px; }
  .showroom-feature { position:static; }
  .showroom-secondary { grid-template-columns:1fr 1fr; gap:16px; }
  .showroom-secondary h3 { font-size:1.25rem; }
  .showroom-secondary img { aspect-ratio:1; }
  .product-facts > div,.specification-list > div { grid-template-columns:1fr; gap:4px; }
}
@media (prefers-reduced-motion:reduce) {
  .showroom-products img,.button,.text-link { transition:none; }
}
.eyebrow { display:block; font-size:.7rem; font-weight:650; letter-spacing:.14em; margin-bottom:22px; color:var(--accent); }
.hero-editorial { gap:clamp(32px,5vw,90px); padding:52px 0 26px; }
.hero-editorial h1 { font-size:clamp(3.4rem,5.7vw,6rem); max-width:13ch; line-height:1.02; letter-spacing:-.055em; }
.hero-editorial .hero-copy > p { max-width:45ch; }
.hero-editorial .hero-copy .hero-note { font-size:.8rem; line-height:1.8; margin:28px 0 0; }
.hero-stage { position:relative; min-width:0; background:var(--panel); }
.hero-editorial .hero-stage img { aspect-ratio:1.08; border-radius:0; }
.hero-stage figcaption { padding:12px 18px; }
.hero-product-link { display:flex; flex-direction:column; padding:18px 24px 24px; text-decoration:none; border-top:1px solid var(--line); }
.hero-product-link span { font-size:.75rem; color:var(--muted); }
.hero-product-link strong { font-size:1.2rem; font-weight:550; }
.hero-customization-entry { display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:18px 24px; border-top:1px solid var(--line); }
.hero-customization-entry > span { font-size:.75rem; color:var(--muted); }
.hero-customization-entry > div { display:flex; gap:8px; }
.hero-swatch { width:24px; height:24px; border-radius:50%; border:1px solid #777; }
.visual-customization,.customization-scope { scroll-margin-top:24px; }
.format-rail { display:flex; flex-wrap:wrap; gap:12px 28px; padding:22px 0; border-bottom:1px solid var(--line); }
.format-rail a { text-decoration:none; padding:8px 0; font-weight:600; font-size:.95rem; }
.format-rail a:hover,.hero-product-link:hover strong { text-decoration:underline; text-underline-offset:5px; }
.section-heading { display:grid; grid-template-columns:1.5fr 1fr; gap:60px; align-items:end; margin-bottom:40px; }
.section-heading h2 { margin-bottom:0; }
.section-heading > p { max-width:42ch; margin-bottom:0; }
.buyer-start,.buyer-answers { display:grid; grid-template-columns:1fr 1.3fr; gap:clamp(32px,7vw,110px); align-items:start; border-top:1px solid var(--line); }
.buyer-start { background:var(--panel); padding:clamp(28px,3.2vw,48px); margin:20px 0 48px; }
.buyer-paths article,.answer-list article { padding:20px 0; border-top:1px solid var(--line); }
.buyer-paths article:first-child,.answer-list article:first-child { padding-top:0; border-top:0; }
.buyer-paths article:last-child,.answer-list article:last-child { padding-bottom:0; }
.buyer-paths article > span { display:block; color:var(--accent); font-size:.7rem; letter-spacing:.12em; margin-bottom:14px; }
.buyer-paths p,.answer-list p { margin-bottom:8px; }
.buyer-answers h3 { font-size:1.3rem; }
@media (min-width:1600px) { .site-header { max-width:1520px; } }
@media (max-width:1000px) {
  .hero-editorial { gap:30px; }
  .hero-editorial h1 { font-size:clamp(3rem,5.6vw,5rem); }
  .section-heading { gap:30px; }
}
@media (max-width:767px) {
  .hero-editorial { grid-template-columns:1fr; padding-top:30px; }
  .hero-editorial h1 { font-size:clamp(2.8rem,10.5vw,4.2rem); }
  .hero-editorial .eyebrow { font-size:.62rem; letter-spacing:.09em; margin-bottom:16px; }
  .hero-editorial .hero-copy .hero-note { margin-top:18px; }
  .hero-editorial .hero-stage img { aspect-ratio:1.3; }
  .hero-customization-entry { grid-template-columns:1fr; padding:16px; }
  .hero-customization-entry > div { flex-wrap:wrap; }
  .hero-customization-entry .text-link { grid-column:auto; }
  .format-rail { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 18px; padding:16px 0; }
  .format-rail a { font-size:.85rem; }
  .section-heading,.buyer-start,.buyer-answers { grid-template-columns:1fr; gap:28px; }
  .section-heading { margin-bottom:28px; }
  .buyer-start { padding:28px 20px; margin:8px 0 42px; }
}

/* Review refinements: visible state and shorter, purpose-led mobile paths. */
.branding-example { border-top:1px solid var(--line); padding-top:18px; margin-top:20px; }
.branding-example .eyebrow { margin-bottom:8px; }
.branding-example .look-option { margin-top:12px; }
.reference-summary { padding:22px; border:1px solid var(--accent); background:var(--panel); margin-bottom:28px; }
.reference-summary h2 { font-size:1.3rem; }
.reference-summary p { overflow-wrap:anywhere; }
.sample-selected-label { font-size:.9rem; font-weight:650; color:var(--accent); }
.sample-choice { position:relative; }
.sample-choice[aria-pressed=true]::after { content:'✓ Selected'; position:absolute; top:8px; left:8px; padding:4px 7px; background:var(--accent); color:var(--on-accent); font-size:.7rem; font-weight:700; }
.catalogue-card { display:flex; flex-direction:column; }
.catalogue-card > .category-name { order:-3; }
.catalogue-card > h3 { order:-2; margin-top:0; }
.catalogue-card > p:not(.category-name) { order:-1; }
.mobile-product-intro { display:none; }
@media(max-width:767px) {
 .branding-example { grid-row:5; margin:0; }
 .visual-enlarge { grid-row:6; }
 .visual-brief { grid-row:7; }
 .visual-controls > .helper { grid-row:8; }
 .mobile-product-intro { display:block; padding-top:20px; }
 .mobile-product-name { font-size:2rem; line-height:1.1; color:var(--text); margin:8px 0 16px; font-weight:650; }
 .mobile-product-intro .eyebrow { margin-bottom:12px; }
 .drawer-summary h1 { font-size:2rem; }
}