/* Cross-theme UX polish. The seven-design concept remains intentional. */
@media (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}

.design-story {
  display: grid;
  grid-template-columns: minmax(140px,.35fr) minmax(0,1fr) auto;
  align-items: center;
  gap: clamp(20px,4vw,64px);
  padding-block: 24px;
  border-block: 1px solid var(--border);
}
.design-story p { margin: 0; max-width: 72ch; color: #59645e; font-size: 14px; line-height: 1.7; }
.design-story a { border-bottom: 1px solid currentColor; padding-bottom: 5px; font-size: 12px; font-weight: 800; white-space: nowrap; }

.contact-steps { display: grid; gap: 0; max-width: 430px; margin: 34px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--border); }
.contact-steps li { display: grid; grid-template-columns: 34px 1fr; gap: 10px; padding: 13px 0; border-bottom: 1px solid var(--border); color: #59645e; font-size: 13px; line-height: 1.55; }
.contact-steps span { color: #7a867c; font-size: 10px; font-weight: 800; letter-spacing: .08em; }

.work-process { padding: clamp(76px,9vw,130px) 0; background: var(--gray); }
.work-process__head { display: grid; grid-template-columns: 1.2fr .8fr; align-items: end; gap: 8%; margin: 20px 0 55px; }
.work-process__head h2 { margin: 0; font-size: clamp(42px,5vw,74px); line-height: 1.1; letter-spacing: -.065em; }
.work-process__head p { max-width: 500px; margin: 0; color: #5e6a62; font-size: 14px; line-height: 1.8; }
.work-process__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 0 0 42px; padding: 0; list-style: none; border-block: 1px solid #c9cec7; }
.work-process__grid li { min-width: 0; padding: 25px 22px 30px; border-right: 1px solid #c9cec7; }
.work-process__grid li:last-child { border-right: 0; }
.work-process__grid span { font-size: 10px; font-weight: 800; letter-spacing: .12em; color: #718076; }
.work-process__grid h3 { margin: 32px 0 12px; font-size: clamp(20px,2vw,29px); line-height: 1.2; letter-spacing: -.04em; }
.work-process__grid p { margin: 0; color: #606c64; font-size: 13px; line-height: 1.7; }

.form-errors:focus { outline: 3px solid #a53929; outline-offset: 4px; }
.demo-marker, .demo-notice { text-wrap: balance; }

@media (max-width: 1100px) {
}

@media (max-width: 820px) {
  .design-story { grid-template-columns: 1fr; gap: 10px; }
  .design-story a { justify-self: start; white-space: normal; }
  .work-process__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .work-process__grid li:nth-child(2) { border-right: 0; }
  .work-process__grid li:nth-child(-n+2) { border-bottom: 1px solid #c9cec7; }
}

@media (max-width: 620px) {
  .design-rail__caption { display: none; }
  .design-story { padding-block: 20px; }
  .design-story p { font-size: 15px; line-height: 1.6; }
  .contact-steps { margin-top: 24px; }
  .contact-steps li { font-size: 14px; }
  .form-field input, .form-field textarea, .form-field select { font-size: 16px; min-height: 44px; }
  .consent-field label { font-size: 12px; }
  .work-process__head { grid-template-columns: 1fr; gap: 18px; margin-bottom: 32px; }
  .work-process__head h2 { font-size: clamp(36px,10vw,49px); }
  .work-process__head p { font-size: 15px; line-height: 1.65; }
  .work-process__grid { grid-template-columns: 1fr; }
  .work-process__grid li, .work-process__grid li:nth-child(2) { padding: 22px 0; border-right: 0; border-bottom: 1px solid #c9cec7; }
  .work-process__grid li:last-child { border-bottom: 0; }
  .work-process__grid h3 { margin-top: 12px; }
  .work-process__grid p { font-size: 14px; }
  .pill-button, .inline-arrow, .text-link { font-size: 12px; }
  .lightbox-caption { white-space: normal; line-height: 1.3; }
}

@media (forced-colors: active) {
  :focus-visible { outline: 3px solid CanvasText !important; }
  [aria-pressed="true"], [aria-current="page"] { border: 2px solid CanvasText !important; }
  .status-dot, .accent-mark { forced-color-adjust: none; }
}

/* Final production audit corrections. */
html:is([data-design="3"],[data-design="7"]) { color-scheme: dark; }
html[data-design] :is(.legal-page h1,.case-header h1,.catalog-head h1,.page-hero h1,.contact-intro h1,.service-row h2,.d6-inspector > h2,.d6-catalog-entry strong,.d7-scene-info h3) {
  overflow-wrap: normal;
  word-break: normal;
  hyphens: manual;
}
html[data-design="7"] .d7-opening-title h1 {
  max-width: 12ch;
  font-size: clamp(64px,9vw,126px);
  line-height: .98;
}
.form-unavailable,.empty-profile { padding: 24px; border: 1px solid var(--border); background: color-mix(in srgb,var(--paper) 88%,transparent); }
.form-unavailable h2,.empty-profile h3 { margin: 0 0 8px; }
.form-unavailable p,.empty-profile p { margin: 0; }

@media (max-width: 620px) {
  body { font-size: 16px; }
  .hero-lede,.page-hero > p,.contact-intro > p,.about-copy .prose,.service-row p,
  html[data-design="6"] :is(.d6-stage-copy p,.d6-inspector > p,.d6-preview-description p),
  html[data-design="7"] :is(.d7-opening-title p,.d7-scenes-heading p) { font-size: 16px; line-height: 1.65; }
  .hero h1,.page-hero h1,.contact-intro h1,html[data-design="7"] .d7-opening-title h1 {
    font-size: clamp(38px,12vw,52px);
    line-height: 1.04;
  }
  .design-rail,.has-design-switch .design-rail { min-height: 52px; height: auto; padding: 4px 0; }
  .design-rail__caption,.design-rail__progress { display: none; }
  .design-rail__numbers {
    display: grid;
    grid-template-columns: repeat(7,44px);
    justify-content: center;
    gap: 0;
    width: 308px;
    max-width: 100%;
    overflow: visible;
    padding: 0;
  }
  .design-rail button { width: 44px; min-width: 44px; height: 44px; }
}

/* Keep artwork labels in their own space instead of laying text over previews. */
.classic-home .hero-art { margin-bottom: 30px; }
.classic-home .hero-art .art-index {
  right: 0;
  bottom: -30px;
  z-index: 5;
  max-width: 100%;
  padding-top: 8px;
  background: var(--paper);
  white-space: normal;
  text-align: right;
}

/* Long editorial labels must wrap inside their columns, never cross media. */
html[data-design] :is(.section-kicker,.eyebrow,.tiny-label,.meta-line,.results-bar,
  .case-cover__label,.gallery-item figcaption,.direction-top,.direction-bottom,
  .d6-panel-top,.d6-stage-foot,.d7-opening-bottom,.d7-scene-count,.d7-scene-kind) {
  min-width: 0;
  max-width: 100%;
  overflow-wrap: break-word;
}

html[data-design] :is(.hero-copy,.section-heading>div,.project-card__info>div,
  .case-header__body>div,.service-row>div,.d6-stage-copy,.d6-inspector,
  .d7-opening-title,.d7-scene-info) {
  min-width: 0;
}