*, *::before, *::after { margin: 0; padding: 0; box-sizing: border-box; }

  :root {
    --cream: #F4F0E8;
    --sand: #C8B89A;
    --stone: #8A7560;
    --dark: #2A2118;
    --mid: #5A4E40;
    --light-sand: #EAE4D8;
    --hairline: rgba(138,117,96,0.18);
    --hairline-strong: rgba(138,117,96,0.32);
    --ease: cubic-bezier(0.22, 1, 0.36, 1);
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    /* Diagram ink — used by the scientific tech visual; per-mood overrides below */
    --ink-strong:  rgba(42,33,24,0.85);
    --ink-stroke:  rgba(42,33,24,0.55);
    --ink-fill:    rgba(42,33,24,0.7);
    --ink-faint:   rgba(42,33,24,0.42);
    --ink-fainter: rgba(42,33,24,0.28);
  }

  html { scroll-behavior: smooth; }

  body {
    background: var(--cream);
    color: var(--dark);
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-feature-settings: "ss01", "kern";
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    cursor: none;
    overflow-x: hidden;
  }

  /* Headings use serif w/ oldstyle figures + tighter optical balance */
  h1, h2, h3 {
    font-feature-settings: "liga", "dlig", "onum", "kern";
    text-wrap: balance;
  }
  p { text-wrap: pretty; }

  /* CUSTOM CURSOR */
  .cursor-dot {
    position: fixed;
    width: 6px; height: 6px;
    background: var(--dark);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9999;
    transform: translate(-50%, -50%);
    transition: transform 0.1s ease, background 0.3s ease;
  }
  .cursor-ring {
    position: fixed;
    width: 28px; height: 28px;
    border: 0.5px solid var(--stone);
    border-radius: 50%;
    pointer-events: none;
    z-index: 9998;
    transform: translate(-50%, -50%);
    transition: transform 0.18s ease, opacity 0.18s ease;
  }
  body.cursor-hover .cursor-dot { transform: translate(-50%, -50%) scale(2.5); background: var(--sand); }
  body.cursor-hover .cursor-ring { transform: translate(-50%, -50%) scale(1.5); opacity: 0.4; }

  /* GRAIN OVERLAY */
  body::before {
    content: '';
    position: fixed; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.04'/%3E%3C/svg%3E");
    pointer-events: none;
    z-index: 1000;
    opacity: 0.35;
  }

  /* NAVIGATION */
  nav {
    position: fixed; top: 0; left: 0; right: 0;
    z-index: 900;
    padding: 2.2rem 4rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
    mix-blend-mode: normal;
    transition: padding 0.5s ease;
  }
  nav.scrolled {
    padding: 1.4rem 4rem;
    background: color-mix(in oklab, var(--cream) 92%, transparent);
    backdrop-filter: blur(12px);
    border-bottom: 0.5px solid var(--hairline);
  }
  .nav-logo {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-size: 1.1rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--dark);
    text-decoration: none;
    white-space: nowrap;
  }
  .nav-links {
    display: flex; gap: 2.6rem; list-style: none;
  }
  .nav-links a {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.7rem;
    letter-spacing: 0.24em;
    text-transform: uppercase;
    color: var(--mid);
    text-decoration: none;
    transition: color 0.35s var(--ease);
    cursor: none;
    position: relative;
    padding-bottom: 3px;
  }
  .nav-links a::after {
    content: '';
    position: absolute;
    left: 0; right: 0; bottom: 0;
    height: 0.5px;
    background: var(--stone);
    transform: scaleX(0);
    transform-origin: right center;
    transition: transform 0.5s var(--ease);
  }
  .nav-links a:hover { color: var(--dark); }
  .nav-links a:hover::after { transform: scaleX(1); transform-origin: left center; }
  .nav-cta {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.72rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--dark);
    text-decoration: none;
    border-bottom: 0.5px solid var(--stone);
    padding-bottom: 2px;
    transition: color 0.3s ease, border-color 0.3s ease;
    cursor: none;
  }
  .nav-cta:hover { color: var(--stone); border-color: var(--sand); }

  /* MOBILE NAV */
  .nav-hamburger {
    display: none;
    flex-direction: column;
    gap: 5px;
    cursor: pointer;
    padding: 4px;
    background: none;
    border: none;
  }
  .nav-hamburger span {
    display: block;
    width: 22px;
    height: 0.5px;
    background: var(--dark);
    transition: all 0.35s ease;
    transform-origin: center;
  }
  .nav-hamburger.open span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  .nav-hamburger.open span:nth-child(2) { opacity: 0; transform: scaleX(0); }
  .nav-hamburger.open span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

  .mobile-menu {
    display: none;
    position: fixed;
    inset: 0;
    background: var(--cream);
    z-index: 800;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2.8rem;
    opacity: 0;
    transform: translateY(-12px);
    transition: opacity 0.4s ease, transform 0.4s ease;
    pointer-events: none;
  }
  .mobile-menu.open {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
  }
  .mobile-menu a {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: 2.2rem;
    letter-spacing: 0.08em;
    color: var(--dark);
    text-decoration: none;
    transition: color 0.3s ease;
  }
  .mobile-menu a:hover { color: var(--stone); }
  .mobile-menu .mob-cta {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.72rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--stone);
    border-bottom: 0.5px solid var(--stone);
    padding-bottom: 3px;
    margin-top: 1rem;
  }

  /* SECTIONS — FADE IN */
  .reveal {
    opacity: 0;
    transform: translateY(32px);
    transition: opacity 1.1s var(--ease-out), transform 1.1s var(--ease-out);
    will-change: opacity, transform;
  }
  .reveal.visible {
    opacity: 1;
    transform: translateY(0);
  }

  /* Staggered children — set --i on each child or rely on nth-child */
  .stagger > * {
    opacity: 0;
    transform: translateY(22px);
    transition: opacity 0.95s var(--ease-out), transform 0.95s var(--ease-out);
    transition-delay: calc(var(--i, 0) * 80ms);
  }
  .stagger.visible > * { opacity: 1; transform: translateY(0); }

  /* ── HERO ── */
  #hero {
    height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .hero-bg {
    position: absolute; inset: 0;
    background: linear-gradient(160deg, #EDE8DD 0%, #F4F0E8 40%, #EAE2D5 100%);
    z-index: 0;
  }
  .hero-ambient {
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 80% 60% at 50% 60%, rgba(200,184,154,0.18) 0%, transparent 70%);
    z-index: 0;
  }
  .hero-content { position: relative; z-index: 2; max-width: 1100px; padding: 0 2rem; }
  .hero-parallax { transform: translateY(var(--py, 0px)); will-change: transform; }
  .hero-eyebrow {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.68rem;
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--stone);
    margin-bottom: 3.2rem;
    opacity: 0;
    animation: fadeUp 1.6s var(--ease-out) 0.35s forwards;
    display: inline-flex;
    align-items: center;
    gap: 1.1em;
  }
  .hero-eyebrow .dot {
    width: 3px; height: 3px;
    border-radius: 50%;
    background: var(--sand);
    display: inline-block;
  }
  .hero-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(4rem, 9.2vw, 9.5rem);
    line-height: 0.98;
    letter-spacing: -0.018em;
    color: var(--dark);
  }
  .hero-headline .line {
    display: block;
    overflow: hidden;
  }
  .hero-headline .line > span {
    display: inline-block;
    transform: translateY(105%);
    animation: lineRise 1.4s var(--ease-out) forwards;
  }
  .hero-headline .line:nth-child(1) > span { animation-delay: 0.55s; }
  .hero-headline .line:nth-child(2) > span { animation-delay: 0.68s; }
  .hero-headline .line:nth-child(3) > span { animation-delay: 0.81s; }
  @keyframes lineRise {
    from { transform: translateY(105%); }
    to { transform: translateY(0); }
  }
  .hero-headline em {
    font-style: italic;
    color: var(--stone);
  }
  .hero-sub {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.82rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--mid);
    margin-top: 3.5rem;
    opacity: 0;
    animation: fadeUp 1.4s var(--ease-out) 1.25s forwards;
  }
  .hero-scroll-indicator {
    position: absolute;
    bottom: 3rem;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.9rem;
    opacity: 0;
    animation: fadeUp 1.4s var(--ease-out) 1.7s forwards;
    cursor: none;
  }
  .hero-scroll-indicator span {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.58rem;
    letter-spacing: 0.42em;
    text-transform: uppercase;
    color: var(--stone);
  }
  .scroll-line {
    width: 0.5px;
    height: 56px;
    background: linear-gradient(to bottom, transparent, var(--stone) 30%, var(--stone));
    transform-origin: top;
    animation: scrollPulse 2.6s ease-in-out infinite;
  }
  @keyframes scrollPulse {
    0%, 100% { opacity: 0.25; transform: scaleY(0.55); }
    50% { opacity: 1; transform: scaleY(1); }
  }
  @keyframes fadeUp {
    from { opacity: 0; transform: translateY(20px); }
    to { opacity: 1; transform: translateY(0); }
  }

  /* ── STATEMENT BREAK ── */
  .statement {
    padding: 6.5rem 4rem 6rem
    max-width: 920px;
    margin: 0 auto;
    text-align: center;
  }
  .statement p {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-style: italic;
    font-size: clamp(1.6rem, 2.9vw, 2.5rem);
    line-height: 1.5;
    color: var(--dark);
    letter-spacing: 0.005em;
  }
  .statement .word {
    display: inline-block;
    opacity: 0;
    transform: translateY(18px);
    transition: opacity 0.9s var(--ease-out), transform 0.9s var(--ease-out);
  }
  .statement.visible .word { opacity: 1; transform: translateY(0); }
  .statement-source {
    display: block;
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.66rem;
    letter-spacing: 0.38em;
    text-transform: uppercase;
    color: var(--stone);
    margin-top: 3rem;
  }

  /* ── PHILOSOPHY ── */
  #philosophy {
    padding: 4.5rem 4rem 6.5rem
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8rem;
    max-width: 1200px;
    margin: 0 auto;
    align-items: start;
  }
  .section-label {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.64rem;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--stone);
    margin-bottom: 3.5rem;
    display: flex;
    align-items: center;
    gap: 1.2rem;
  }
  .section-label::before {
    content: '';
    display: inline-block;
    width: 32px;
    height: 0.5px;
    background: var(--stone);
    transform: scaleX(0);
    transform-origin: left center;
    transition: transform 1.4s var(--ease-out) 0.2s;
  }
  .reveal.visible .section-label::before,
  .section-label.in::before { transform: scaleX(1); }
  .phil-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(2.2rem, 3.5vw, 3.6rem);
    line-height: 1.2;
    color: var(--dark);
    margin-bottom: 2.5rem;
    letter-spacing: -0.01em;
  }
  .phil-headline em { font-style: italic; color: var(--stone); }
  .phil-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.92rem;
    line-height: 1.85;
    color: var(--mid);
    max-width: 440px;
  }
  .phil-body p + p { margin-top: 1.5rem; }
  .phil-right {
    padding-top: 5rem;
  }
  .phil-quote {
    border-left: 0.5px solid var(--sand);
    padding-left: 2.2rem;
    margin-bottom: 4rem;
  }
  .phil-quote p {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-style: italic;
    font-size: 1.25rem;
    line-height: 1.65;
    color: var(--mid);
  }
  .phil-stat-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    margin-top: 4rem;
  }
  .phil-stat h3 {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: 3.2rem;
    color: var(--dark);
    margin-bottom: 0.5rem;
    letter-spacing: -0.02em;
    line-height: 1;
    font-feature-settings: "lnum";
  }
  .phil-stat h3 .sym {
    font-size: 0.55em;
    color: var(--sand);
    vertical-align: 0.32em;
    margin-left: 0.05em;
  }
  .phil-stat p {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.72rem;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--stone);
    line-height: 1.6;
  }

  /* DIVIDER */
  .divider {
    width: 100%;
    height: 0.5px;
    background: var(--sand);
    opacity: 0.5;
    max-width: 1200px;
    margin: 0 auto;
  }

  /* ── PROCESS ── */
  #process {
    padding: 6.5rem 4rem
    max-width: 1200px;
    margin: 0 auto;
  }
  .process-header {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8rem;
    margin-bottom: 8rem;
    align-items: end;
  }
  .process-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(2.2rem, 3.5vw, 3.6rem);
    line-height: 1.2;
    color: var(--dark);
  }
  .process-headline em { font-style: italic; color: var(--stone); }
  .process-intro {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 1.85;
    color: var(--mid);
    padding-top: 1rem;
    max-width: 480px;
  }
  .process-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0;
    border-top: 0.5px solid rgba(138,117,96,0.3);
  }
  .process-step {
    padding: 3.5rem 2.5rem 3.5rem 0;
    border-right: 0.5px solid rgba(138,117,96,0.2);
    transition: background 0.4s ease;
  }
  .process-step:last-child { border-right: none; padding-right: 0; }
  .process-step:hover { background: rgba(200,184,154,0.06); }
  .step-number {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-style: italic;
    font-size: 0.95rem;
    letter-spacing: 0.05em;
    color: var(--sand);
    margin-bottom: 2.2rem;
    font-feature-settings: "lnum";
  }
  .step-title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-size: 1.5rem;
    color: var(--dark);
    margin-bottom: 1.3rem;
    line-height: 1.25;
    letter-spacing: -0.005em;
  }
  .step-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.8rem;
    line-height: 1.85;
    color: var(--stone);
  }

  /* ── INDUSTRIES ── */
  #industries {
    padding: 6.5rem 4rem
    background: var(--dark);
    position: relative;
  }
  #industries .section-label { color: var(--stone); }
  .ind-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(2.2rem, 3.5vw, 3.6rem);
    line-height: 1.2;
    color: var(--cream);
    margin-bottom: 6rem;
    max-width: 600px;
  }
  .ind-headline em { font-style: italic; color: var(--sand); }
  .ind-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    border-top: 0.5px solid rgba(200,184,154,0.2);
  }
  .ind-card {
    padding: 4rem 3rem 4rem 0;
    border-right: 0.5px solid rgba(200,184,154,0.12);
    transition: all 0.5s ease;
    position: relative;
    overflow: hidden;
  }
  .ind-card:nth-child(3n) { border-right: none; padding-right: 0; }
  .ind-card:nth-child(n+4) { border-top: 0.5px solid rgba(200,184,154,0.12); }
  .ind-note { max-width: 760px; margin: 5rem 0 0; padding: 2.6rem 0 0; border-top: 0.5px solid rgba(200,184,154,0.2); }
  .ind-note-label { display: block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.34em; text-transform: uppercase; color: var(--sand); margin-bottom: 1.3rem; }
  .ind-note p { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-style: italic; font-size: 1.18rem; line-height: 1.72; color: var(--cream); letter-spacing: 0.005em; }
  body:not(.page-dark) .ind-note-label { color: var(--stone); }
  body:not(.page-dark) .ind-note p { color: var(--mid); }
  @media (max-width: 768px) { .ind-note { margin-top: 3.4rem; padding-top: 2rem; } .ind-note p { font-size: 1.05rem; } }
  .ind-card::after {
    content: '';
    position: absolute;
    bottom: 0; left: 0; right: 3rem;
    height: 0.5px;
    background: var(--stone);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.5s ease;
  }
  .ind-card:hover::after { transform: scaleX(1); }
  .ind-icon {
    width: 32px; height: 32px;
    margin-bottom: 2.5rem;
    opacity: 0.5;
  }
  .ind-title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: 1.6rem;
    color: var(--cream);
    margin-bottom: 1.2rem;
    line-height: 1.2;
  }
  .ind-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.8rem;
    line-height: 1.9;
    color: var(--stone);
    margin-bottom: 2.5rem;
  }
  .ind-link {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--sand);
    text-decoration: none;
    border-bottom: 0.5px solid rgba(200,184,154,0.4);
    padding-bottom: 2px;
    transition: color 0.3s ease;
    cursor: none;
  }
  .ind-link:hover { color: var(--cream); }

  /* ── TECHNOLOGY ── */
  #technology {
    padding: 6.5rem 4rem
    max-width: 1200px;
    margin: 0 auto;
  }
  .tech-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10rem;
    align-items: center;
  }
  .tech-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(2rem, 3vw, 3.2rem);
    line-height: 1.2;
    color: var(--dark);
    margin-bottom: 2.5rem;
  }
  .tech-headline em { font-style: italic; color: var(--stone); }
  .tech-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 1.85;
    color: var(--mid);
    margin-bottom: 4rem;
    max-width: 460px;
  }
  .tech-features {
    display: flex;
    flex-direction: column;
    gap: 0;
  }
  .tech-feature {
    padding: 1.8rem 0;
    border-bottom: 0.5px solid rgba(138,117,96,0.25);
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 2rem;
    align-items: start;
  }
  .tech-feature:first-child { border-top: 0.5px solid rgba(138,117,96,0.25); }
  .tf-label {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.6rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--stone);
    white-space: nowrap;
    padding-top: 0.15rem;
  }
  .tf-value {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.82rem;
    line-height: 1.8;
    color: var(--dark);
  }
  .tech-right {
    aspect-ratio: 3/4;
    background: linear-gradient(165deg, #F4EFE3 0%, #E2D4B9 60%, #C8B89A 100%);
    position: relative;
    overflow: hidden;
  }
  .tech-right::before {
    content: '';
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 65% 50% at 38% 38%, rgba(255,252,245,0.55) 0%, transparent 65%);
    z-index: 1;
  }
  .tech-right::after {
    content: '';
    position: absolute; inset: 0;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
    opacity: 0.18;
    mix-blend-mode: overlay;
    z-index: 2;
  }
  .tech-visual {
    position: absolute; inset: 0;
    z-index: 3;
  }
  .tech-visual .dg-svg {
    position: absolute;
    top: 50%; left: 50%;
    transform: translate(-50%, -50%);
    width: 76%;
    height: auto;
    overflow: visible;
  }

  /* Polar grid, spokes, ticks */
  .dg-grid circle,
  .dg-spokes line,
  .dg-ticks line,
  .dg-cross line {
    fill: none;
    stroke: var(--ink-stroke);
    stroke-width: 0.35;
    vector-effect: non-scaling-stroke;
  }
  .dg-grid circle  { opacity: 0.55; }
  .dg-grid circle:last-child { opacity: 0.9; stroke-width: 0.6; }
  .dg-spokes line  { opacity: 0.32; stroke-dasharray: 1 1.2; }
  .dg-ticks line   { stroke: var(--ink-fill); stroke-width: 0.45; }
  .dg-cross line   { stroke: var(--ink-strong); stroke-width: 0.5; opacity: 0.65; }

  /* SVG text labels */
  .dg-rlabel text,
  .dg-alabel text {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    fill: var(--ink-faint);
    letter-spacing: 0.18em;
    font-feature-settings: "tnum","lnum";
  }
  .dg-rlabel text { font-size: 4.2px; }
  .dg-alabel text { font-size: 5px; letter-spacing: 0.22em; fill: var(--ink-fill); }

  /* Dispersion rings (the live, breathing element) */
  .dg-rings .ring {
    fill: none;
    stroke: var(--ink-fill);
    stroke-width: 0.4;
    transform-origin: center;
    transform-box: fill-box;
    animation: ringExpand 5.4s ease-out infinite;
    opacity: 0;
  }
  .dg-rings .ring:nth-child(2) { animation-delay: 0.9s; }
  .dg-rings .ring:nth-child(3) { animation-delay: 1.8s; }
  .dg-rings .ring:nth-child(4) { animation-delay: 2.7s; }
  .dg-rings .ring:nth-child(5) { animation-delay: 3.6s; }
  .dg-rings .ring:nth-child(6) { animation-delay: 4.5s; }
  @keyframes ringExpand {
    0%   { opacity: 0;   transform: scale(0.18); }
    18%  { opacity: 0.7; }
    100% { opacity: 0;   transform: scale(2.4);  }
  }

  /* Vector field arrows */
  .dg-vec line,
  .dg-vec path { stroke: var(--ink-fill); stroke-width: 0.45; fill: var(--ink-fill); vector-effect: non-scaling-stroke; }

  /* Aromatic molecule (benzene ring) */
  .dg-mol .hex {
    fill: none;
    stroke: var(--ink-strong);
    stroke-width: 0.85;
    vector-effect: non-scaling-stroke;
  }
  .dg-mol .bond {
    stroke: var(--ink-strong);
    stroke-width: 0.55;
    vector-effect: non-scaling-stroke;
  }
  .dg-mol .atom { fill: var(--ink-strong); }

  /* Particles */
  .dg-part circle { fill: var(--ink-fill); }

  /* ── HTML OVERLAYS ── */
  .dg-header {
    position: absolute;
    top: 1.6rem; left: 1.6rem;
    z-index: 4;
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.56rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: var(--ink-stroke);
    line-height: 1.6;
  }
  .dg-header b {
    display: block;
    font-weight: 300;
    color: var(--ink-strong);
    letter-spacing: 0.42em;
    margin-top: 0.3rem;
  }

  .dg-meta {
    position: absolute;
    top: 1.6rem; right: 1.6rem;
    z-index: 4;
    display: grid;
    grid-template-columns: max-content max-content;
    column-gap: 0.8rem;
    row-gap: 0.28rem;
    justify-content: end;
    font-family: 'Jost', sans-serif;
    font-feature-settings: "tnum","lnum";
  }
  .dg-meta-row { display: contents; }
  .dg-meta-row .k {
    grid-column: 1;
    justify-self: end;
    color: var(--ink-faint);
    text-transform: uppercase;
    letter-spacing: 0.18em;
    font-weight: 300;
    font-size: 0.52rem;
    line-height: 1.45;
  }
  .dg-meta-row .v {
    grid-column: 2;
    justify-self: start;
    color: var(--ink-strong);
    font-weight: 400;
    font-size: 0.6rem;
    letter-spacing: 0.02em;
    line-height: 1.45;
    font-variant-numeric: tabular-nums;
  }
  .dg-legend { grid-column: 1 / -1; justify-self: end; }

  .dg-plot {
    position: absolute;
    bottom: 1.6rem; left: 1.6rem;
    z-index: 4;
    width: 96px;
  }
  .dg-plot-title {
    font-family: 'Jost', sans-serif;
    font-size: 0.5rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink-stroke);
    margin-bottom: 0.4rem;
    font-weight: 300;
  }
  .dg-plot-title sup {
    font-feature-settings: "tnum","lnum";
    font-size: 0.85em;
    margin-left: 0.05em;
  }
  .dg-plot .plot-svg {
    display: block;
    width: 100%;
    height: 40px;
    overflow: visible;
  }
  .dg-plot .axis { stroke: var(--ink-stroke); stroke-width: 0.5; fill: none; vector-effect: non-scaling-stroke; }
  .dg-plot .tick { stroke: var(--ink-faint); stroke-width: 0.5; vector-effect: non-scaling-stroke; }
  .dg-plot .curve { stroke: var(--ink-strong); stroke-width: 1.1; fill: none; vector-effect: non-scaling-stroke; }
  .dg-plot .fill  { fill: var(--ink-fill); opacity: 0.18; }
  .dg-plot-axis {
    margin-top: 0.4rem;
    font-family: 'Jost', sans-serif;
    font-size: 0.48rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--ink-faint);
    font-feature-settings: "tnum","lnum";
    display: flex;
    justify-content: space-between;
  }

  .dg-scale {
    position: absolute;
    bottom: 1.6rem; right: 1.6rem;
    z-index: 4;
    text-align: right;
  }
  .dg-scale-bar {
    display: flex;
    height: 5px;
    margin-bottom: 0.35rem;
    margin-left: auto;
    width: 60px;
    border: 0.5px solid var(--ink-stroke);
  }
  .dg-scale-bar span {
    flex: 1;
    border-right: 0.5px solid var(--ink-stroke);
  }
  .dg-scale-bar span:last-child { border-right: none; }
  .dg-scale-bar span:nth-child(odd)  { background: var(--ink-fill); }
  .dg-scale-bar span:nth-child(even) { background: transparent; }
  .dg-scale-label {
    font-family: 'Jost', sans-serif;
    font-size: 0.48rem;
    letter-spacing: 0.28em;
    text-transform: uppercase;
    color: var(--ink-faint);
    font-feature-settings: "tnum","lnum";
    display: flex;
    justify-content: space-between;
    margin-left: auto;
    width: 60px;
  }
  .tech-caption {
    position: absolute;
    bottom: 1.8rem; left: 1.8rem;
    z-index: 4;
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.58rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: rgba(42,33,24,0.55);
  }
  .tech-caption-r {
    position: absolute;
    top: 1.8rem; right: 1.8rem;
    z-index: 4;
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 0.8rem;
    color: rgba(42,33,24,0.6);
    text-align: right;
    line-height: 1.4;
  }

  /* ── CLIENTS ── */
  #clients {
    padding: 6rem 4rem
    border-top: 0.5px solid rgba(138,117,96,0.2);
    border-bottom: 0.5px solid rgba(138,117,96,0.2);
    max-width: 1200px;
    margin: 0 auto;
  }
  .clients-header {
    display: grid;
    grid-template-columns: 1fr 2fr;
    gap: 6rem;
    margin-bottom: 6rem;
    align-items: end;
  }
  .clients-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(1.8rem, 2.8vw, 3rem);
    line-height: 1.2;
    color: var(--dark);
  }
  .clients-headline em { font-style: italic; color: var(--stone); }
  .clients-intro {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 1.85;
    color: var(--mid);
    max-width: 500px;
    padding-top: 0.5rem;
  }
  .clients-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    border-top: 0.5px solid rgba(138,117,96,0.2);
  }
  .client-item {
    padding: 3.5rem 2rem;
    border-right: 0.5px solid rgba(138,117,96,0.15);
    border-bottom: 0.5px solid rgba(138,117,96,0.15);
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    transition: background 0.4s ease;
    cursor: default;
  }
  .client-item:hover { background: rgba(200,184,154,0.08); }
  .client-item:nth-child(4n) { border-right: none; }
  .client-name {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-size: 1.3rem;
    color: var(--dark);
  }
  .client-sector {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.62rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--stone);
  }
  .client-detail {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.75rem;
    line-height: 1.8;
    color: var(--mid);
    margin-top: 0.5rem;
  }

  /* ── CONSULTATION ── */
  #consultation {
    padding: 8rem 4rem
    text-align: center;
    position: relative;
    overflow: hidden;
  }
  .consult-bg {
    position: absolute; inset: 0;
    background: radial-gradient(ellipse 70% 50% at 50% 50%, rgba(200,184,154,0.12) 0%, transparent 70%);
  }
  .consult-eyebrow {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.4em;
    text-transform: uppercase;
    color: var(--stone);
    margin-bottom: 3rem;
  }
  .consult-headline {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(2.8rem, 5vw, 5.5rem);
    line-height: 1.1;
    color: var(--dark);
    margin-bottom: 2.5rem;
    letter-spacing: -0.01em;
  }
  .consult-headline em { font-style: italic; color: var(--stone); }
  .consult-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.9rem;
    line-height: 1.85;
    color: var(--mid);
    max-width: 500px;
    margin: 0 auto 4rem;
  }
  .consult-cta {
    display: inline-block;
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.72rem;
    letter-spacing: 0.35em;
    text-transform: uppercase;
    color: var(--cream);
    background: var(--dark);
    padding: 1.3rem 3.5rem;
    text-decoration: none;
    transition: all 0.4s ease;
    cursor: none;
    position: relative;
    overflow: hidden;
  }
  .consult-cta::after {
    content: '';
    position: absolute; inset: 0;
    background: var(--stone);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform 0.4s ease;
    z-index: 0;
  }
  .consult-cta:hover::after { transform: scaleX(1); }
  .consult-cta span { position: relative; z-index: 1; }
  .consult-note {
    margin-top: 2rem;
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--stone);
  }

  /* ── FOOTER ── */
  footer {
    padding: 4rem;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    align-items: end;
    border-top: 0.5px solid rgba(138,117,96,0.25);
    gap: 2rem;
  }
  .footer-brand {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: 1.1rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--dark);
  }
  .footer-tagline {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.18em;
    color: var(--stone);
    margin-top: 0.5rem;
    font-style: italic;
  }
  .footer-links {
    display: flex;
    flex-direction: column;
    gap: 0.8rem;
    list-style: none;
    align-items: center;
  }
  .footer-links a {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--stone);
    text-decoration: none;
    transition: color 0.3s ease;
    cursor: none;
  }
  .footer-links a:hover { color: var(--dark); }
  .footer-right { text-align: right; }
  .footer-location {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.65rem;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--stone);
    margin-bottom: 0.5rem;
  }
  .footer-copy {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    font-size: 0.58rem;
    letter-spacing: 0.15em;
    color: var(--sand);
  }

  /* ── TABLET 768–1024px ── */
  @media (max-width: 1024px) {
    nav { padding: 1.8rem 2.5rem; }
    nav.scrolled { padding: 1.2rem 2.5rem; }
    .nav-links { gap: 2rem; }

    #philosophy { gap: 4rem; padding: 5rem 2.5rem 5.5rem }
    .phil-stat-grid { gap: 1.8rem; }

    .process-header { gap: 4rem; }
    .process-steps { grid-template-columns: repeat(2, 1fr); }
    .process-step { border-right: none; border-bottom: 0.5px solid rgba(138,117,96,0.2); padding: 2.5rem 0; }
    .process-step:last-child { border-bottom: none; }

    #industries { padding: 5rem 2.5rem }
    .ind-grid { grid-template-columns: repeat(2, 1fr); }
    .ind-card { border-right: none; border-bottom: 0.5px solid rgba(200,184,154,0.15); padding: 3rem 0; }
    .ind-card:last-child { border-bottom: none; }

    #technology { padding: 5rem 2.5rem }
    .tech-grid { gap: 5rem; }
    .tech-right { aspect-ratio: 4/3; }

    #clients { padding: 5rem 2.5rem }
    .clients-header { grid-template-columns: 1fr; gap: 2rem; margin-bottom: 4rem; }
    .clients-grid { grid-template-columns: repeat(2, 1fr); }
    .client-item:nth-child(2n) { border-right: none; }

    footer { padding: 3rem 2.5rem; gap: 2rem; }
  }

  /* ── MOBILE ≤ 768px ── */
  @media (max-width: 768px) {
    body { cursor: default; }
    .cursor-dot, .cursor-ring { display: none; }

    nav { padding: 1.5rem 1.5rem; }
    nav.scrolled { padding: 1.1rem 1.5rem; }
    .nav-links, .nav-cta { display: none; }
    .nav-hamburger { display: flex; }

    .mobile-menu { display: flex; }

    .hero-eyebrow { font-size: 0.58rem; letter-spacing: 0.28em; margin-bottom: 2rem; }
    .hero-headline { font-size: clamp(3.2rem, 14vw, 5.5rem); }
    .hero-sub { font-size: 0.68rem; letter-spacing: 0.2em; margin-top: 2rem; }
    .hero-scroll-indicator { bottom: 2.5rem; }

    .statement { padding: 5rem 1.5rem; }
    .statement p { font-size: clamp(1.3rem, 5vw, 1.8rem); }

    #philosophy {
      grid-template-columns: 1fr;
      gap: 0;
      padding: 5rem 1.5rem 4.5rem
    }
    .phil-right { padding-top: 3rem; }
    .phil-body { max-width: 100%; }
    .phil-stat-grid { grid-template-columns: repeat(2, 1fr); gap: 2rem; margin-top: 2.5rem; }
    .phil-stat h3 { font-size: 2.2rem; }

    .divider { margin: 0 1.5rem; }

    #process { padding: 5rem 1.5rem; }
    .process-header { grid-template-columns: 1fr; gap: 2rem; margin-bottom: 4rem; }
    .process-steps { grid-template-columns: 1fr; }
    .process-step { padding: 2.2rem 0; border-right: none; border-bottom: 0.5px solid rgba(138,117,96,0.2); }
    .process-step:last-child { border-bottom: none; }

    #industries { padding: 5rem 1.5rem; }
    .ind-grid { grid-template-columns: 1fr; }
    .ind-card { border-right: none; border-bottom: 0.5px solid rgba(200,184,154,0.15); padding: 2.8rem 0; }
    .ind-card:last-child { border-bottom: none; }
    .ind-headline { font-size: clamp(1.9rem, 7vw, 2.8rem); margin-bottom: 3.5rem; }

    #technology { padding: 5rem 1.5rem; }
    .tech-grid { grid-template-columns: 1fr; gap: 3rem; }
    .tech-right { display: none; }

    #clients { padding: 5rem 1.5rem; }
    .clients-header { grid-template-columns: 1fr; gap: 1.5rem; margin-bottom: 3rem; }
    .clients-grid { grid-template-columns: 1fr; }
    .client-item { padding: 2rem 0; border-right: none; }
    .client-item:nth-child(4n) { border-right: none; }

    #consultation { padding: 5.5rem 1.5rem }
    .consult-headline { font-size: clamp(2.2rem, 9vw, 3.5rem); }
    .consult-body { font-size: 0.82rem; }
    .consult-cta { padding: 1.2rem 2.5rem; font-size: 0.65rem; }

    footer {
      grid-template-columns: 1fr;
      padding: 3rem 1.5rem;
      gap: 2.5rem;
      text-align: center;
    }
    .footer-links { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 1rem 2rem; }
    .footer-right { text-align: center; }
  }

  /* ── SMALL MOBILE ≤ 390px ── */
  @media (max-width: 390px) {
    .hero-headline { font-size: clamp(2.8rem, 16vw, 4rem); }
    .phil-stat-grid { grid-template-columns: 1fr; }
    .process-headline, .tech-headline, .clients-headline { font-size: 2rem; }
  }
  /* ═══════════════════════════════════════════════════════════
     EXPRESSIVE TWEAKS — Mood, Voice, Atmosphere
     ═══════════════════════════════════════════════════════════ */

  /* ── MOOD: swap the var palette + the few hardcoded gradients ── */
  body[data-mood="noir"] {
    --cream:      #161310;
    --dark:       #E8E3D5;
    --mid:        #B5A892;
    --stone:      #9A8770;
    --sand:       #C8B89A;
    --light-sand: #0B0908;
    --hairline:        rgba(232,227,213,0.16);
    --hairline-strong: rgba(232,227,213,0.30);
    --ink-strong:  rgba(232,227,213,0.85);
    --ink-stroke:  rgba(232,227,213,0.55);
    --ink-fill:    rgba(232,227,213,0.7);
    --ink-faint:   rgba(232,227,213,0.42);
    --ink-fainter: rgba(232,227,213,0.28);
  }
  body[data-mood="noir"] .hero-bg {
    background: linear-gradient(160deg, #1F1A14 0%, #161310 40%, #0F0C09 100%);
  }
  body[data-mood="noir"] .hero-ambient {
    background: radial-gradient(ellipse 80% 60% at 50% 60%, rgba(200,184,154,0.12) 0%, transparent 70%);
  }
  body[data-mood="noir"] .tech-right {
    background: linear-gradient(165deg, #2A2118 0%, #1A1410 60%, #0F0C09 100%);
  }
  body[data-mood="noir"] .tech-right::before {
    background: radial-gradient(ellipse 65% 50% at 38% 38%, rgba(200,184,154,0.22) 0%, transparent 65%);
  }
  body[data-mood="noir"] .consult-cta { background: var(--sand); color: #161310; }

  body[data-mood="porcelain"] {
    --cream:      #EDEBE6;
    --dark:       #1B1B22;
    --mid:        #4F4F58;
    --stone:      #7C7C85;
    --sand:       #B5B0A6;
    --light-sand: #DEDBD3;
    --hairline:        rgba(27,27,34,0.13);
    --hairline-strong: rgba(27,27,34,0.24);
    --ink-strong:  rgba(27,27,34,0.78);
    --ink-stroke:  rgba(27,27,34,0.45);
    --ink-fill:    rgba(27,27,34,0.6);
    --ink-faint:   rgba(27,27,34,0.35);
    --ink-fainter: rgba(27,27,34,0.22);
  }
  body[data-mood="porcelain"] .hero-bg {
    background: linear-gradient(160deg, #E5E2DA 0%, #EDEBE6 40%, #D8D4CB 100%);
  }
  body[data-mood="porcelain"] .hero-ambient {
    background: radial-gradient(ellipse 80% 60% at 50% 60%, rgba(124,124,133,0.08) 0%, transparent 70%);
  }
  body[data-mood="porcelain"] .tech-right {
    background: linear-gradient(165deg, #E8E5DE 0%, #C9C5BC 60%, #B5B0A6 100%);
  }
  body[data-mood="porcelain"] .tech-right::before {
    background: radial-gradient(ellipse 65% 50% at 38% 38%, rgba(255,253,250,0.55) 0%, transparent 65%);
  }

  body[data-mood="oud"] {
    --cream:      #1F1812;
    --dark:       #E8DCC0;
    --mid:        #B5A07A;
    --stone:      #C9A961;
    --sand:       #D9B97A;
    --light-sand: #120D08;
    --hairline:        rgba(232,220,192,0.16);
    --hairline-strong: rgba(201,169,97,0.36);
    --ink-strong:  rgba(217,185,122,0.95);
    --ink-stroke:  rgba(217,185,122,0.55);
    --ink-fill:    rgba(217,185,122,0.75);
    --ink-faint:   rgba(217,185,122,0.42);
    --ink-fainter: rgba(217,185,122,0.28);
  }
  body[data-mood="oud"] .hero-bg {
    background: linear-gradient(160deg, #2D2014 0%, #1F1812 40%, #150E08 100%);
  }
  body[data-mood="oud"] .hero-ambient {
    background: radial-gradient(ellipse 80% 60% at 50% 60%, rgba(201,169,97,0.22) 0%, transparent 70%);
  }
  body[data-mood="oud"] .tech-right {
    background: linear-gradient(165deg, #3A2A1A 0%, #251A10 60%, #1A1108 100%);
  }
  body[data-mood="oud"] .tech-right::before {
    background: radial-gradient(ellipse 65% 50% at 38% 38%, rgba(217,185,122,0.30) 0%, transparent 65%);
  }
  body[data-mood="oud"] .consult-cta { background: var(--stone); color: #1F1812; }

  /* ── VOICE: typography personality ── */
  body[data-voice="couture"] .hero-eyebrow,
  body[data-voice="couture"] .hero-sub,
  body[data-voice="couture"] .section-label,
  body[data-voice="couture"] .tf-label,
  body[data-voice="couture"] .client-sector,
  body[data-voice="couture"] .footer-tagline,
  body[data-voice="couture"] .footer-links a,
  body[data-voice="couture"] .footer-location,
  body[data-voice="couture"] .footer-copy,
  body[data-voice="couture"] .consult-eyebrow,
  body[data-voice="couture"] .consult-note,
  body[data-voice="couture"] .statement-source,
  body[data-voice="couture"] .nav-links a,
  body[data-voice="couture"] .nav-cta,
  body[data-voice="couture"] .ind-link {
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-weight: 400;
    text-transform: none;
    letter-spacing: 0.04em;
    font-size: 0.95rem;
  }
  body[data-voice="couture"] .phil-body,
  body[data-voice="couture"] .tech-body,
  body[data-voice="couture"] .step-body,
  body[data-voice="couture"] .ind-body,
  body[data-voice="couture"] .clients-intro,
  body[data-voice="couture"] .process-intro,
  body[data-voice="couture"] .consult-body,
  body[data-voice="couture"] .client-detail,
  body[data-voice="couture"] .tf-value {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 400;
    font-size: 1.1rem;
    line-height: 1.6;
    letter-spacing: 0;
  }
  body[data-voice="couture"] .section-label::before { display: none; }

  body[data-voice="modern"] .hero-headline,
  body[data-voice="modern"] .phil-headline,
  body[data-voice="modern"] .ind-headline,
  body[data-voice="modern"] .process-headline,
  body[data-voice="modern"] .tech-headline,
  body[data-voice="modern"] .clients-headline,
  body[data-voice="modern"] .consult-headline,
  body[data-voice="modern"] .step-title,
  body[data-voice="modern"] .ind-title,
  body[data-voice="modern"] .client-name,
  body[data-voice="modern"] .nav-logo,
  body[data-voice="modern"] .footer-brand,
  body[data-voice="modern"] .statement p,
  body[data-voice="modern"] .phil-quote p,
  body[data-voice="modern"] .phil-stat h3 {
    font-family: 'Jost', sans-serif;
    font-weight: 200;
    letter-spacing: -0.025em;
    font-style: normal;
  }
  body[data-voice="modern"] .hero-headline em,
  body[data-voice="modern"] .phil-headline em,
  body[data-voice="modern"] .ind-headline em,
  body[data-voice="modern"] .process-headline em,
  body[data-voice="modern"] .tech-headline em,
  body[data-voice="modern"] .clients-headline em,
  body[data-voice="modern"] .consult-headline em,
  body[data-voice="modern"] .statement p em,
  body[data-voice="modern"] .phil-quote p em {
    font-style: normal;
    font-weight: 400;
    color: var(--stone);
    border-bottom: 0.5px solid currentColor;
    padding-bottom: 0.05em;
  }
  body[data-voice="modern"] .hero-headline { letter-spacing: -0.035em; }
  body[data-voice="modern"] .step-number { font-style: normal; font-family: 'Jost', sans-serif; letter-spacing: 0.3em; font-size: 0.7rem; }

  /* ── ATMOSPHERE: grain + motion personality ── */
  body[data-atmos="still"]::before { opacity: 0 !important; }
  body[data-atmos="still"] .reveal,
  body[data-atmos="still"] .stagger > *,
  body[data-atmos="still"] .statement .word,
  body[data-atmos="still"] .hero-headline .line > span {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
    animation: none !important;
  }
  body[data-atmos="still"] .section-label::before { transform: scaleX(1) !important; }
  body[data-atmos="still"] .scroll-line,
  body[data-atmos="still"] .dg-rings .ring { animation: none !important; }
  body[data-atmos="still"] .dg-rings .ring { opacity: 0.35; transform: none; }

  body[data-atmos="whisper"]::before {
    opacity: 0.6;
    animation: grainDrift 9s steps(6) infinite;
  }
  @keyframes grainDrift {
    0%   { transform: translate(0,0); }
    20%  { transform: translate(-2%, 1.5%); }
    40%  { transform: translate(2%, -1%); }
    60%  { transform: translate(-1%, 2%); }
    80%  { transform: translate(1.5%, -1.5%); }
    100% { transform: translate(0,0); }
  }
  body[data-atmos="whisper"] .hero-ambient {
    animation: ambientBreath 9s ease-in-out infinite;
  }
  @keyframes ambientBreath {
    0%, 100% { opacity: 0.75; }
    50%      { opacity: 1; }
  }
  body[data-atmos="whisper"] .scroll-line { animation-duration: 4s; }
  body[data-atmos="whisper"] .dg-rings .ring { animation-duration: 7s; }

  /* ── MEDIA SLOTS (images/video) ── */
  #atmosphere {
    position: relative;
    width: 100%;
    height: clamp(360px, 46vw, 640px);
    overflow: hidden;
  }
  #atmosphere .atmos-scrim {
    position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(20,15,10,0) 50%, rgba(20,15,10,0.4) 100%);
    pointer-events: none;
    z-index: 2;
  }
  #atmosphere .atmos-caption {
    position: absolute;
    bottom: 1.8rem; left: 4rem;
    z-index: 3;
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.62rem;
    letter-spacing: 0.32em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.85);
    pointer-events: none;
  }

  .ind-media {
    width: 100%;
    aspect-ratio: 4/3;
    margin-bottom: 2.2rem;
    border: 0.5px solid var(--hairline-strong);
    overflow: hidden;
  }

  .clients-media {
    width: 100%;
    aspect-ratio: 21/9;
    margin-bottom: 4rem;
    border: 0.5px solid var(--hairline-strong);
    overflow: hidden;
  }

  #consultation .consult-media { position: absolute; inset: 0; z-index: 0; }
  #consultation .consult-bg { z-index: 1; }
  #consultation .consult-eyebrow,
  #consultation .consult-headline,
  #consultation .consult-body,
  #consultation .consult-cta,
  #consultation .consult-note { position: relative; z-index: 2; }

  @media (max-width: 768px) {
    #atmosphere { height: clamp(280px, 70vw, 420px); }
    #atmosphere .atmos-caption { left: 1.5rem; bottom: 1.3rem; }
    .clients-media { aspect-ratio: 4/3; }
  }
  /* ── VISION / MISSION ── */
  #ethos {
    padding: 6rem 4rem
    max-width: 1200px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 0.9fr 1fr 1fr;
    gap: 5rem;
    align-items: start;
  }
  .ethos-media {
    aspect-ratio: 3/4;
    border: 0.5px solid var(--hairline-strong);
    overflow: hidden;
  }
  .ethos-col { position: relative; }
  .ethos-col + .ethos-col::before {
    content: '';
    position: absolute;
    left: -3.5rem; top: 0.4rem; bottom: 0.4rem;
    width: 0.5px;
    background: var(--hairline-strong);
  }
  .ethos-index {
    font-family: 'Cormorant Garamond', serif;
    font-style: italic;
    font-weight: 300;
    font-size: 0.95rem;
    color: var(--sand);
    margin-bottom: 1.6rem;
    font-feature-settings: "lnum";
  }
  .ethos-title {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 200;
    font-size: clamp(1.9rem, 2.8vw, 2.9rem);
    line-height: 1.15;
    letter-spacing: -0.01em;
    color: var(--dark);
    margin-bottom: 2rem;
  }
  .ethos-title em { font-style: italic; color: var(--stone); }
  .ethos-body {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.95rem;
    line-height: 1.85;
    color: var(--mid);
    max-width: 430px;
  }
  @media (max-width: 1024px) { #ethos { padding: 5rem 2.5rem gap: 3rem; } .ethos-col + .ethos-col::before { left: -1.5rem; } }
  @media (max-width: 768px) {
    #ethos { grid-template-columns: 1fr; gap: 3.5rem; padding: 5rem 1.5rem; }
    .ethos-media { aspect-ratio: 4/3; }
    .ethos-col + .ethos-col::before { left: 0; right: 0; top: -1.75rem; bottom: auto; width: auto; height: 0.5px; }
    .ethos-body { max-width: 100%; }
  }
  /* ── MEDIA SLOTS · VIDEO / ANIMATION ── */
  .mslot { position: relative; overflow: hidden; background: var(--light-sand); }
  .mslot video { display: block; width: 100%; height: 100%; object-fit: cover; }
  .mslot.is-empty { border: 0.5px dashed var(--hairline-strong); }
  .mslot-hint {
    position: absolute; inset: 0;
    display: none; flex-direction: column;
    align-items: center; justify-content: center;
    gap: 0.45rem; text-align: center; padding: 1rem;
    pointer-events: none; z-index: 3;
  }
  .mslot.is-empty .mslot-hint { display: flex; }
  .mslot-hint b {
    font-family: 'Jost', sans-serif; font-weight: 300;
    font-size: 0.6rem; letter-spacing: 0.32em; text-transform: uppercase;
    color: var(--stone);
  }
  .mslot-hint span {
    font-family: 'Jost', sans-serif; font-weight: 300;
    font-size: 0.55rem; letter-spacing: 0.16em; color: var(--stone); opacity: 0.7;
    font-feature-settings: "tnum","lnum";
  }
  /* Background-mode slots stay invisible when empty — never block the hero */
  .mslot--bg.is-empty { background: transparent; border: none; }
  .mslot--bg .mslot-hint {
    inset: auto auto 1.4rem 1.4rem;
    align-items: flex-start; text-align: left;
    padding: 0.55rem 0.85rem; gap: 0.25rem;
    border: 0.5px dashed var(--hairline-strong);
    background: color-mix(in oklab, var(--cream) 72%, transparent);
  }

  /* Hero — BACKGROUND film (ambient, text must lead) */
  .hero-film { position: absolute; inset: 0; z-index: 1; }
  .hero-film-scrim {
    position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, color-mix(in oklab, var(--cream) 62%, transparent) 0%, color-mix(in oklab, var(--cream) 38%, transparent) 45%, color-mix(in oklab, var(--cream) 70%, transparent) 100%);
  }

  /* Technology — ADJACENT film (mechanism deserves a framed, watchable space) */
  .tech-media { display: flex; flex-direction: column; gap: 1.4rem; }
  .tech-film { aspect-ratio: 16/9; border: 0.5px solid var(--hairline-strong); }

  /* Consultation — BACKGROUND film */
  #consultation .consult-media { position: absolute; inset: 0; z-index: 0; }

  @media (max-width: 768px) { .mslot--bg .mslot-hint { inset: auto auto 1rem 1rem; } }
  .partners-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 5rem 4rem;
  }
  .partner-tile { display: flex; flex-direction: column; }
  .partner-media {
    aspect-ratio: 4/3;
    border: 0.5px solid var(--hairline-strong);
    overflow: hidden;
    margin-bottom: 1.4rem;
  }
  .partner-caption {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 1.5rem;
  }
  .partner-name {
    font-family: 'Cormorant Garamond', serif;
    font-weight: 300;
    font-size: 1.35rem;
    color: var(--dark);
  }
  .partner-sector {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.6rem;
    letter-spacing: 0.3em;
    text-transform: uppercase;
    color: var(--stone);
    white-space: nowrap;
  }
  .partner-detail {
    font-family: 'Jost', sans-serif;
    font-weight: 300;
    font-size: 0.76rem;
    line-height: 1.8;
    color: var(--mid);
    margin-top: 0.6rem;
    max-width: 420px;
  }
  @media (max-width: 768px) {
    .partners-grid { grid-template-columns: 1fr; gap: 3.5rem; }
  }

  /* ── MULTI-PAGE ADDITIONS ── */
  .nav-links a[data-active] { color: var(--dark); }
  .nav-links a[data-active]::after { transform: scaleX(1); transform-origin: left center; }
  body.page-dark #mainNav { background: color-mix(in oklab, var(--cream) 92%, transparent); backdrop-filter: blur(12px); border-bottom: 0.5px solid var(--hairline); }
  #site-index { max-width: 1200px; margin: 0 auto; padding: 4.5rem 4rem 6.5rem }
  .index-list { display: flex; flex-direction: column; border-top: 0.5px solid var(--hairline-strong); }
  .index-row { display: grid; grid-template-columns: 3rem 1fr 1.4fr auto; gap: 2rem; align-items: baseline; padding: 2.4rem 0.5rem; border-bottom: 0.5px solid var(--hairline); text-decoration: none; cursor: none; transition: background 0.4s var(--ease); }
  .index-row:hover { background: rgba(200,184,154,0.08); }
  .ix-no { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; color: var(--sand); font-size: 0.95rem; font-feature-settings: "lnum"; }
  .ix-title { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: 2.1rem; color: var(--dark); letter-spacing: -0.01em; line-height: 1.1; }
  .ix-desc { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.8rem; line-height: 1.7; color: var(--stone); }
  .ix-arrow { font-family: 'Cormorant Garamond', serif; color: var(--stone); font-size: 1.3rem; transition: transform 0.4s var(--ease); }
  .index-row:hover .ix-arrow { transform: translateX(6px); }
  .page-next { max-width: 1200px; margin: 0 auto; padding: 5rem 4rem 5.5rem display: flex; justify-content: flex-end; }
  .page-next a { display: inline-flex; align-items: baseline; gap: 1.1rem; text-decoration: none; cursor: none; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--stone); border-bottom: 0.5px solid var(--hairline-strong); padding-bottom: 5px; transition: color 0.3s; }
  .page-next a:hover { color: var(--dark); }
  .page-next .nx-title { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; text-transform: none; letter-spacing: 0.02em; font-size: 1.15rem; color: var(--dark); }
  @media (max-width: 768px) {
    #site-index { padding: 4rem 1.5rem 4.5rem }
    .index-row { grid-template-columns: 2rem 1fr auto; gap: 1rem; padding: 1.8rem 0.25rem; }
    .ix-desc { display: none; }
    .ix-title { font-size: 1.5rem; }
    .page-next { padding: 4rem 1.5rem 5rem; }
  }

  /* ── PAGE TRANSITIONS + A11Y ── */
  @keyframes pageFade { from { opacity: 0; } to { opacity: 1; } }
  body { animation: pageFade 0.55s ease; }
  @media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation: none !important; transition: none !important; }
    .reveal, .stagger > *, .statement .word, .hero-headline .line > span { opacity: 1 !important; transform: none !important; }
    .hero-eyebrow, .hero-sub, .hero-scroll-indicator { opacity: 1 !important; }
    .section-label::before { transform: scaleX(1) !important; }
  }

  /* ── DIRECTOR PASS ── */
  .skip-link { position: fixed; top: -100px; left: 1rem; z-index: 10000; background: var(--dark); color: var(--cream); padding: 0.7rem 1.2rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.22em; text-transform: uppercase; text-decoration: none; transition: top 0.3s ease; }
  .skip-link:focus { top: 1rem; }
  .page-next { justify-content: space-between; flex-wrap: wrap; gap: 1.5rem 3rem; }
  .page-next a:only-child { margin-left: auto; }

  /* ── COLLECTION ── */
  #collection { padding: 7rem 4rem 4.5rem max-width: 1200px; margin: 0 auto; }
  .collection-header { display: grid; grid-template-columns: 1.2fr 1fr; gap: 6rem; margin-bottom: 6rem; align-items: end; }
  .collection-headline { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(2.2rem, 3.8vw, 3.8rem); line-height: 1.15; letter-spacing: -0.01em; color: var(--dark); }
  .collection-headline em { font-style: italic; color: var(--stone); }
  .collection-intro { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.9rem; line-height: 1.85; color: var(--mid); max-width: 440px; padding-bottom: 0.4rem; }
  .collection-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 2.6rem 1.6rem; }
  .col-card { display: flex; flex-direction: column; }
  .col-swatch { aspect-ratio: 3/4; overflow: hidden; border: 0.5px solid var(--hairline-strong); margin-bottom: 1.1rem; position: relative; }
  .col-swatch image-slot { position: absolute; inset: 0; }
  .col-swatch img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .col-name { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.3rem; color: var(--dark); letter-spacing: -0.005em; margin-bottom: 0.45rem; }
  .col-accord { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.56rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.85rem; }
  .col-desc { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.74rem; line-height: 1.8; color: var(--mid); }
  @media (max-width: 1280px) { .collection-grid { grid-template-columns: repeat(4, 1fr); } }
  @media (max-width: 1024px) { .collection-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 1024px) { #collection { padding: 6.5rem 2.5rem 5rem } .collection-header { gap: 3rem; } }
  @media (max-width: 768px) { #collection { padding: 5.5rem 1.5rem 4rem } .collection-header { grid-template-columns: 1fr; gap: 1.8rem; margin-bottom: 3.5rem; } .collection-intro { max-width: 100%; } .collection-grid { grid-template-columns: repeat(2, 1fr); gap: 2.2rem 1.2rem; } .col-name { font-size: 1.2rem; } }
  @media (max-width: 420px) { #collection { padding: 5rem 1.1rem 3.5rem } .collection-grid { gap: 1.8rem 1rem; } .col-name { font-size: 1.1rem; } .col-desc { font-size: 0.72rem; } }

  /* ── JOURNAL ── */
  #journal { padding: 7rem 4rem 4.5rem max-width: 1200px; margin: 0 auto; }
  .journal-list { display: flex; flex-direction: column; border-top: 0.5px solid var(--hairline-strong); }
  .journal-entry { display: grid; grid-template-columns: 10rem 1fr; gap: 3rem; padding: 3rem 0.5rem; border-bottom: 0.5px solid var(--hairline); }
  .je-date { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.6rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--sand); padding-top: 0.6rem; }
  .je-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.7rem; line-height: 1.25; letter-spacing: -0.005em; color: var(--dark); margin-bottom: 0.9rem; max-width: 640px; }
  .je-excerpt { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.82rem; line-height: 1.85; color: var(--mid); max-width: 560px; }
  @media (max-width: 768px) { #journal { padding: 5.5rem 1.5rem 4rem } .journal-entry { grid-template-columns: 1fr; gap: 0.8rem; padding: 2.2rem 0.25rem; } }

  /* ── FIG. 01 · BRAND PLATE ADDITIONS ── */
  .dg-header i { display: block; font-style: normal; font-family: 'Cormorant Garamond', serif; font-size: 0.74rem; letter-spacing: 0.02em; text-transform: none; color: var(--ink-faint); margin-top: 0.45rem; }
  .dg-header i::before { content: ''; display: block; width: 20px; height: 0.5px; background: var(--ink-fainter); margin-bottom: 0.45rem; }
  .dg-legend { margin-top: 0.8rem; padding-top: 0.6rem; border-top: 0.5px solid var(--ink-fainter); display: flex; flex-direction: column; gap: 0.3rem; }
  .dg-legend-row { display: flex; align-items: center; justify-content: flex-end; gap: 0.5rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.5rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--ink-faint); }
  .dg-legend-row svg { width: 18px; height: 4px; overflow: visible; flex-shrink: 0; }
  .dg-legend-row line { stroke: var(--ink-fill); stroke-width: 0.8; vector-effect: non-scaling-stroke; }
  .dg-legend-row line.dash { stroke-dasharray: 3 2; stroke: var(--ink-faint); }
  .dg-plan .wall { fill: none; stroke: var(--ink-faint); stroke-width: 0.5; stroke-dasharray: 4 2.5; vector-effect: non-scaling-stroke; }
  .dg-plan .swing, .dg-plan .leaf { fill: none; stroke: var(--ink-fainter); stroke-width: 0.4; vector-effect: non-scaling-stroke; }
  .dg-plan .dim line { stroke: var(--ink-fainter); stroke-width: 0.4; vector-effect: non-scaling-stroke; }
  .dg-plan .dim text { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 4.2px; letter-spacing: 0.16em; fill: var(--ink-faint); font-feature-settings: "tnum","lnum"; }

  /* ── PROCESS STEP ICONS ── */
  .step-number { display: flex; align-items: center; gap: 0.85rem; }
  .step-icon { width: 30px; height: 30px; flex-shrink: 0; color: var(--stone); stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; fill: none; opacity: 0.9; transition: opacity 0.45s var(--ease), color 0.45s var(--ease); }
  .step-icon circle { fill: none; }
  .process-step:hover .step-icon { opacity: 1; color: var(--dark); }

  /* ── INDUSTRY ICONS ── */
  .ind-icon { width: 40px; height: 40px; color: var(--cream); stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; fill: none; opacity: 0.7; transition: opacity 0.5s var(--ease), color 0.5s var(--ease); }
  .ind-card:hover .ind-icon { opacity: 1; color: var(--cream); }

  .ind-icon circle, .ind-icon path, .step-icon circle, .step-icon path { fill: none; vector-effect: none; }

  /* ── ICON ALIGNMENT — centred within each card ── */
  .ind-card { padding: 4rem 1.75rem !important; }
  .ind-card::after { left: 1.75rem !important; right: 1.75rem !important; }
  .process-step { padding: 3.5rem 1.75rem !important; }
  .ind-body, .step-body { max-width: 30ch; }
  .ind-card { text-align: center; }
  .ind-icon { display: block; margin-left: auto; margin-right: auto; }
  .ind-card .ind-title, .ind-card .ind-body { text-align: center; }
  .ind-card .ind-body { margin-left: auto; margin-right: auto; }
  .ind-card::after { right: 0; }
  .ind-media { margin-left: auto; margin-right: auto; }

  .process-step { text-align: center; }
  .step-number { display: block; text-align: left; }
  .step-number > span { display: block; text-align: left; }
  .step-number .step-icon { display: block; margin: 0.9rem auto 0; }
  .step-title, .step-body { text-align: center; }
  .step-body { margin-left: auto; margin-right: auto; }

  /* ── DARK PAGES — the work and the science ── */
  body.page-dark { background: var(--dark); }
  body.page-dark #technology { background: var(--dark); }
  body.page-dark #technology .section-label { color: var(--sand); }
  body.page-dark #technology .tech-headline { color: var(--cream); }
  body.page-dark #technology .tech-headline em { color: var(--sand); }
  body.page-dark #technology .tech-body { color: var(--sand); }
  body.page-dark #technology .tf-label { color: var(--sand); opacity: 0.75; }
  body.page-dark #technology .tf-value { color: var(--cream); }
  body.page-dark #technology .tech-feature { border-bottom-color: rgba(200,184,154,0.2); }
  body.page-dark #technology .tech-feature:first-child { border-top-color: rgba(200,184,154,0.2); }
  body.page-dark .page-next a { color: var(--sand); border-bottom-color: rgba(200,184,154,0.35); }
  body.page-dark .page-next a:hover { color: var(--cream); }
  body.page-dark .page-next .nx-title { color: var(--cream); }
  body.page-dark footer { border-top-color: rgba(200,184,154,0.22); }
  body.page-dark .footer-brand { color: var(--cream); }
  body.page-dark .footer-tagline, body.page-dark .footer-links a, body.page-dark .footer-location { color: var(--sand); }
  body.page-dark .footer-links a:hover { color: var(--cream); }
  body.page-dark .footer-copy { color: rgba(200,184,154,0.55); }
  body.page-dark #mainNav { background: transparent; }
  body.page-dark #mainNav.scrolled { background: color-mix(in oklab, var(--dark) 92%, transparent); border-bottom-color: rgba(200,184,154,0.18); }
  body.page-dark .nav-logo, body.page-dark .nav-links a[data-active] { color: var(--cream); }
  body.page-dark .nav-links a { color: var(--sand); }
  body.page-dark .nav-links a:hover { color: var(--cream); }
  body.page-dark .nav-links a::after { background: var(--sand); }
  body.page-dark .nav-hamburger span { background: var(--cream); }
  body.page-dark .cursor-dot { background: var(--cream); }
  body.page-dark .cursor-ring { border-color: var(--sand); }
  /* Fig. 01 plate reads as bone-cream ink on the dark page */
  /* Fig. 01 reads as a lit paper plate laid on the dark page */
  body.page-dark .tech-right {
    background: linear-gradient(165deg, #F4EDDF 0%, #E7DAC0 58%, #D2C1A0 100%);
    border: 0.5px solid rgba(200,184,154,0.35);
    box-shadow: 0 30px 70px -30px rgba(0,0,0,0.65);
    --ink-strong: rgba(35,27,19,0.9);
    --ink-stroke: rgba(35,27,19,0.6);
    --ink-fill: rgba(35,27,19,0.74);
    --ink-faint: rgba(35,27,19,0.46);
    --ink-fainter: rgba(35,27,19,0.3);
  }
  body.page-dark .tech-right::before { background: radial-gradient(ellipse 65% 50% at 38% 38%, rgba(255,252,246,0.6) 0%, transparent 65%); }
  body.page-dark .tech-film { border-color: rgba(200,184,154,0.25); }
  body.page-dark .mslot { background: rgba(200,184,154,0.06); }
  body.page-dark .mslot.is-empty { border-color: rgba(200,184,154,0.3); }
  body.page-dark .mslot-hint b { color: var(--cream); }
  body.page-dark .mslot-hint span { color: var(--sand); }
  body.page-dark .mslot--bg .mslot-hint { background: rgba(23,17,12,0.72); border-color: rgba(200,184,154,0.3); }
  body.page-dark .skip-link { background: var(--cream); color: var(--dark); }

  /* guard: ONLY #mainNav is the fixed top bar — every other <nav> resets */
  nav:not(#mainNav) {
    position: static !important; top: auto !important; left: auto !important; right: auto !important;
    z-index: auto !important; padding: 0 !important; background: none !important;
    backdrop-filter: none !important; border-bottom: none !important;
    align-items: stretch; justify-content: flex-start;
  }
  .index-list { display: flex; flex-direction: column; }
  .footer-nav { display: grid; }

  /* ── EXPLORE TRIGGER (replaces the link bar) ── */
  .nav-explore { display: inline-flex; flex-direction: column; align-items: flex-end; gap: 5px; background: none; border: none; padding: 4px 0; cursor: none; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.7rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--mid); transition: color 0.35s var(--ease); }
  .nav-explore:hover { color: var(--dark); }
  .nav-explore .ne-rule { display: block; width: 100%; height: 0.5px; background: currentColor; transform: scaleX(0.55); transform-origin: right center; transition: transform 0.5s var(--ease); }
  .nav-explore:hover .ne-rule { transform: scaleX(1); }
  .nav-explore[aria-expanded="true"] .ne-rule { transform: scaleX(1); }
  body.page-dark .nav-explore { color: var(--sand); }
  body.page-dark .nav-explore:hover { color: var(--cream); }

  /* Overlay: shown on ALL breakpoints now */
  .mobile-menu { display: flex; }
  .menu-close { position: absolute; top: 2.2rem; right: 4rem; width: 44px; height: 44px; background: none; border: none; cursor: none; padding: 0; z-index: 1001; }
  .mobile-menu.open { z-index: 1000; }
  body.menu-open .nav-hamburger { opacity: 0; pointer-events: none; }
  .menu-close::before, .menu-close::after { content: ''; position: absolute; left: 9px; top: 50%; width: 26px; height: 0.5px; background: var(--dark); }
  .menu-close::before { transform: rotate(45deg); }
  .menu-close::after { transform: rotate(-45deg); }
  .mobile-menu a { opacity: 0; transform: translateY(14px); transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out), color 0.3s ease; }
  .mobile-menu.open a { opacity: 1; transform: translateY(0); }
  body.page-dark .mobile-menu { background: var(--dark); }
  body.page-dark .mobile-menu a { color: var(--cream); }
  body.page-dark .mobile-menu a:hover { color: var(--sand); }
  body.page-dark .mobile-menu .mob-cta { color: var(--sand); border-bottom-color: var(--sand); }
  body.page-dark .menu-close::before, body.page-dark .menu-close::after { background: var(--cream); }

  /* Grouped menu: Studio / Work / More */
  .mobile-menu { gap: 0; overflow-y: auto; overscroll-behavior: contain; justify-content: flex-start; padding: 5.5rem 1.5rem 4rem; }
  @media (min-height: 720px) { .mobile-menu { justify-content: center; padding: 4rem 1.5rem; } }
  .menu-group { display: flex; flex-direction: column; align-items: center; gap: 0.9rem; width: 100%; }
  .menu-group + .menu-group { margin-top: 1.9rem; padding-top: 1.9rem; position: relative; }
  .menu-group + .menu-group::before { content: ''; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 56px; height: 0.5px; background: var(--hairline-strong); }
  .menu-group-title { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.55rem; letter-spacing: 0.42em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.5rem; }
  body.page-dark .menu-group-title { color: var(--sand); opacity: 0.75; }
  body.page-dark .menu-group + .menu-group::before { background: rgba(200,184,154,0.28); }
  .menu-group { opacity: 0; transform: translateY(14px); transition: opacity 0.6s var(--ease-out), transform 0.6s var(--ease-out); }
  .mobile-menu.open .menu-group { opacity: 1; transform: translateY(0); }
  .mobile-menu.open .menu-group:nth-child(2) { transition-delay: 60ms; }
  .mobile-menu.open .menu-group:nth-child(3) { transition-delay: 130ms; }
  .mobile-menu.open .menu-group:nth-child(4) { transition-delay: 200ms; }
  .menu-group a:nth-child(2) { transition-delay: 40ms; }
  .menu-group a:nth-child(3) { transition-delay: 80ms; }
  .menu-group a:nth-child(4) { transition-delay: 120ms; }
  .mobile-menu .mob-cta { margin-top: 2.4rem; flex-shrink: 0; }

  /* Footer link set reads as a site map, not a row */
  .footer-links { flex-direction: row !important; flex-wrap: wrap; justify-content: center; gap: 0.7rem 1.8rem; }

  @media (max-width: 768px) {
    .nav-explore { display: none; }
    .menu-close { top: 1.5rem; right: 1.5rem; }
  }
  @media (min-width: 769px) {
    .nav-hamburger { display: none !important; }
  }

  /* ── FOOTER · two-tier ── */
  footer { display: block !important; padding: 4.5rem 4rem 2.5rem !important border-top: 0.5px solid var(--hairline-strong); }
  .footer-masthead { display: flex; justify-content: space-between; align-items: baseline; gap: 3rem; padding-bottom: 2.6rem; margin-bottom: 2.6rem; border-bottom: 0.5px solid var(--hairline); }
  .footer-places { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); margin: 0; white-space: nowrap; }
  body.page-dark .footer-places { color: var(--sand); }
  body.page-dark .footer-masthead { border-bottom-color: rgba(200,184,154,0.18); }
  .footer-top { display: grid; grid-template-columns: auto 1fr; gap: 5rem; align-items: start; }
  .footer-identity { max-width: none; }
  .footer-brand { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.15rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--dark); }
  .footer-tagline { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.12em; line-height: 1.6; color: var(--stone); margin-top: 0.9rem; font-style: normal; white-space: nowrap; }
  .footer-nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 2.5rem; }
  .footer-col-title { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.55rem; letter-spacing: 0.34em; text-transform: uppercase; color: var(--sand); margin-bottom: 1.4rem; }
  .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.75rem; }
  .footer-col a { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.76rem; letter-spacing: 0.06em; color: var(--mid); text-decoration: none; cursor: none; transition: color 0.3s var(--ease); }
  .footer-col a:hover { color: var(--dark); }
  .footer-base { display: flex; justify-content: flex-end; align-items: baseline; gap: 2rem; margin-top: 3.4rem; padding-top: 1.6rem; border-top: 0.5px solid var(--hairline); }
  .footer-location { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); margin: 0; }
  .footer-copy { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.14em; color: var(--sand); margin: 0; }
  body.page-dark .footer-col a { color: var(--sand); }
  body.page-dark .footer-col a:hover { color: var(--cream); }
  body.page-dark .footer-col-title { color: var(--stone); }
  body.page-dark .footer-base { border-top-color: rgba(200,184,154,0.18); }
  @media (max-width: 1024px) { footer { padding: 5rem 2.5rem 2.5rem !important; } .footer-top { grid-template-columns: 1fr; gap: 3.5rem; } }
  @media (max-width: 720px) { .footer-masthead { flex-direction: column; gap: 1.2rem; padding-bottom: 2rem; margin-bottom: 2rem; } .footer-places { white-space: normal; } .footer-base { justify-content: flex-start; } }
  @media (max-width: 768px) {
    footer { padding: 4rem 1.5rem 2rem !important; text-align: left; }
    .footer-nav { grid-template-columns: 1fr 1fr; gap: 2.2rem; }
    .footer-base { flex-direction: column; gap: 0.8rem; margin-top: 3rem; }
  }

  /* ── JOURNAL ENTRY ── */
  #entry { max-width: 1200px; margin: 0 auto; padding: 6.5rem 4rem 2rem }
  .entry-head { max-width: 780px; }
  .entry-back { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.6rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stone); text-decoration: none; cursor: none; transition: color 0.3s var(--ease); }
  .entry-back:hover { color: var(--dark); }
  .entry-meta { display: flex; align-items: center; gap: 0.9rem; margin: 2.6rem 0 1.8rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); }
  .entry-meta .dot { width: 3px; height: 3px; border-radius: 50%; background: var(--sand); }
  .entry-title { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(2.2rem, 4.4vw, 4rem); line-height: 1.1; letter-spacing: -0.015em; color: var(--dark); }
  .entry-title em { font-style: italic; color: var(--stone); }
  .entry-standfirst { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-style: italic; font-size: clamp(1.15rem, 1.7vw, 1.5rem); line-height: 1.55; color: var(--mid); margin-top: 1.8rem; max-width: 640px; }
  .entry-media { margin: 4.5rem 0; aspect-ratio: 21/9; border: 0.5px solid var(--hairline-strong); overflow: hidden; position: relative; }
  .entry-media image-slot { position: absolute; inset: 0; }
  .entry-body { max-width: 660px; }
  .entry-body p { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.95rem; line-height: 1.95; color: var(--mid); margin-bottom: 1.5rem; }
  .entry-body p.lede { font-size: 1.05rem; line-height: 1.9; color: var(--dark); }
  .entry-body strong { font-weight: 400; color: var(--dark); }
  .entry-body h2 { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: clamp(1.5rem, 2.2vw, 2rem); line-height: 1.25; letter-spacing: -0.008em; color: var(--dark); margin: 4rem 0 1.6rem; }
  .entry-body h2::before { content: ''; display: block; width: 28px; height: 0.5px; background: var(--sand); margin-bottom: 1.4rem; }
  .entry-body blockquote { margin: 3.5rem 0; padding-left: 2.2rem; border-left: 0.5px solid var(--sand); }
  .entry-body blockquote p { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-style: italic; font-size: clamp(1.3rem, 2vw, 1.7rem); line-height: 1.5; color: var(--dark); margin: 0; }
  .entry-cta { margin-top: 4.5rem; padding-top: 2.2rem; border-top: 0.5px solid var(--hairline-strong); }
  .entry-cta p { font-family: 'Jost', sans-serif; font-size: 0.85rem; color: var(--mid); margin-bottom: 1.4rem; }
  .entry-cta a { display: inline-block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.66rem; letter-spacing: 0.32em; text-transform: uppercase; color: var(--cream); background: var(--dark); padding: 1.15rem 2.8rem; text-decoration: none; cursor: none; transition: background 0.4s var(--ease); }
  .entry-cta a:hover { background: var(--stone); }
  /* Journal index: real entries are links */
  a.journal-entry { text-decoration: none; cursor: none; transition: background 0.4s var(--ease); }
  a.journal-entry:hover { background: rgba(200,184,154,0.07); }
  a.journal-entry:hover .je-title { color: var(--stone); }
  .je-title { transition: color 0.35s var(--ease); }
  @media (max-width: 768px) {
    #entry { padding: 5.5rem 1.5rem 1rem }
    .entry-media { margin: 3rem 0; aspect-ratio: 4/3; }
  }

  /* ── DISCOVER (holding page) ── */
  #discover { max-width: 1200px; margin: 0 auto; padding: 8rem 4rem 7rem min-height: 60vh; }
  .discover-title { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(2.4rem, 5vw, 4.5rem); line-height: 1.1; letter-spacing: -0.015em; color: var(--dark); }
  .discover-title em { font-style: italic; color: var(--stone); }
  @media (max-width: 768px) { #discover { padding: 6rem 1.5rem 5rem } }

  /* ── PLATES · shared scientific figure shell ── */
  .plate { position: relative; margin: 6rem 0 0; padding: 0; aspect-ratio: 16/10;
    background: linear-gradient(168deg, #FCFAF4 0%, #F8F2E6 52%, #F0E9DA 100%);
    border: 0.5px solid rgba(138,117,96,0.3); overflow: hidden;
    box-shadow: 0 20px 44px -26px rgba(42,33,24,0.26);
    --ink-strong: rgba(35,27,19,0.9); --ink-stroke: rgba(35,27,19,0.6);
    --ink-fill: rgba(35,27,19,0.74); --ink-faint: rgba(35,27,19,0.46); --ink-fainter: rgba(35,27,19,0.3); }
  .plate::before { content: ''; position: absolute; inset: 0; z-index: 1;
    background: radial-gradient(ellipse 70% 60% at 38% 30%, rgba(255,255,252,0.5) 0%, transparent 68%); }
  .plate::after { content: ''; position: absolute; inset: 0; z-index: 2; opacity: 0.09; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='p'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.2' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23p)' opacity='0.5'/%3E%3C/svg%3E"); }
  .plate .dg-header, .plate .dg-meta { z-index: 4; }
  .plate-visual { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 3; padding: 4.5rem 2rem 3.5rem }
  .os-svg { width: 100%; max-width: 660px; height: auto; overflow: visible; }
  .plate-caption { position: absolute; bottom: 1.5rem; left: 1.6rem; z-index: 4;
    font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.54rem; letter-spacing: 0.24em;
    text-transform: uppercase; color: var(--ink-faint); }

  .dg-legend-row line.dot { stroke-dasharray: 1 2; stroke: var(--ink-faint); }
  @media (max-width: 768px) {
    .plate { aspect-ratio: 4/3; margin-top: 3.5rem; }
    .plate-visual { padding: 5rem 1rem 3rem }
    .plate .dg-meta { display: none; }
  }


  /* tagline holds one line on desktop, wraps only on small screens */
  @media (max-width: 900px) { .footer-tagline { white-space: normal; line-height: 1.9; } }


  /* ── HOMEPAGE PLACEHOLDER ── */
  .home-placeholder { margin: 3.5rem auto 0; max-width: 560px; min-height: 120px; display: flex; align-items: center; justify-content: center; border: 0.5px dashed var(--stone); background: rgba(200,184,154,0.06); font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.66rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stone); }
  @media (max-width: 768px) { .home-placeholder { margin-top: 2.5rem; min-height: 96px; } }

  /* ── FIG. 02 · OLFACTIVE STRUCTURE ── */
  .plate--tall { aspect-ratio: 5/4; }
  .plate--tall .plate-visual { padding: 4.5rem 2.5rem 2rem }
  .os-svg { width: 100%; max-width: 640px; height: auto; overflow: visible; color: #A9885C; }
  .os-grid line { stroke: var(--ink-fainter); stroke-width: 0.13; opacity: 0.65; }
  .os-axis line { stroke: var(--ink-stroke); stroke-width: 0.45; }
  .os-tick line { stroke: var(--ink-faint); stroke-width: 0.35; }
  .os-drop line { stroke: var(--ink-faint); stroke-width: 0.25; stroke-dasharray: 0.8 1.6; }
  .os-curve { fill: none; stroke: var(--ink-strong); stroke-linejoin: round; stroke-linecap: round; }
  .os-curve.c-top { stroke-width: 0.55; }
  .os-curve.c-heart { stroke-width: 0.55; stroke-dasharray: 2.2 1.4; }
  .os-curve.c-base { stroke-width: 0.85; }
  .os-fill { fill: url(#baseFade); stroke: none; }
  .os-peak circle { fill: none; stroke: var(--ink-strong); stroke-width: 0.4; }
  .os-annot text { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 4.2px; letter-spacing: 0.12em; fill: var(--ink-faint); font-feature-settings: "tnum","lnum"; }
  .os-annot .os-scale-note { font-size: 3.6px; letter-spacing: 0.26em; fill: var(--ink-fainter); }
  .os-bracket line { stroke: var(--ink-faint); stroke-width: 0.3; }
  .os-index .sw { stroke: var(--ink-strong); stroke-width: 0.7; }
  .os-index .sw-heart { stroke-dasharray: 2.2 1.4; }
  .os-index .sw-base { stroke-width: 1; }
  .os-index .ph { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 4px; letter-spacing: 0.2em; fill: var(--ink-strong); }
  .os-index .mat { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 5.4px; letter-spacing: 0.01em; fill: var(--ink-fill); }
  .os-rule { stroke: var(--ink-fainter); stroke-width: 0.3; }
  .os-foot { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 3.6px; letter-spacing: 0.24em; fill: var(--ink-faint); }
  /* ── FOOTER · single-row composition ── */
  footer { padding: 4.5rem 4rem 2.2rem !important }
  .footer-top { display: grid !important; grid-template-columns: minmax(260px, 1fr) minmax(0, 1.75fr); gap: 4rem 6rem; align-items: start; }
  .footer-identity { max-width: 24rem; }
  .footer-brand { font-size: 1.08rem; letter-spacing: 0.26em; }
  .footer-tagline { margin-top: 1rem; line-height: 1.75; max-width: none; white-space: nowrap; font-size: 0.54rem; letter-spacing: 0.1em; }
  .footer-nav { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.4rem; }
  .footer-col-title { margin-bottom: 1.5rem; }
  .footer-col ul { display: flex; flex-direction: column; gap: 0.85rem; list-style: none; margin: 0; padding: 0; }
  .footer-base { display: flex !important; justify-content: space-between; align-items: baseline; gap: 2rem; margin-top: 4.5rem; padding-top: 1.6rem; border-top: 0.5px solid var(--hairline); }
  .footer-places { font-family: 'Jost', sans-serif !important; font-style: normal !important; font-weight: 300; font-size: 0.6rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); margin: 0; }
  .footer-copy { font-family: 'Jost', sans-serif !important; font-style: normal !important; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.16em; text-transform: none; color: var(--stone); opacity: 0.75; margin: 0; }
  body.page-dark .footer-places, body.page-dark .footer-copy { color: var(--sand); }
  @media (max-width: 1024px) { .footer-top { grid-template-columns: 1fr; gap: 3.2rem; } .footer-identity { max-width: none; } }
  @media (max-width: 720px) {
    footer { padding: 4rem 1.5rem 2rem !important; }
    .footer-tagline { white-space: normal !important; font-size: 0.58rem !important; letter-spacing: 0.08em !important; line-height: 1.7 !important; margin-top: 0.8rem; max-width: 17rem; }
    .footer-top { gap: 2.6rem; }
    .footer-nav { grid-template-columns: 1fr 1fr; gap: 2.2rem 1.5rem; }
    .footer-col-title { margin-bottom: 1rem; font-size: 0.52rem; }
    .footer-col ul { gap: 0.7rem; }
    .footer-base { flex-direction: column; align-items: flex-start; gap: 0.6rem; margin-top: 2.4rem; padding-top: 1.3rem; }
    .footer-copy { font-size: 0.55rem; letter-spacing: 0.1em; }
  }
  /* ── MAIN MENU BAR (desktop) · Explore reserved for mobile ── */
  #mainNav { display: flex; align-items: center; gap: 2.5rem; }
  #mainNav .nav-logo { margin-right: auto; }
  .nav-links { display: flex !important; align-items: center; gap: 2rem; list-style: none; margin: 0; padding: 0; }
  .nav-links li { margin: 0; }
  .nav-links a { position: relative; display: inline-block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.72rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--mid); text-decoration: none; padding: 0.35rem 0; cursor: none; transition: color 0.35s var(--ease); white-space: nowrap; }
  .nav-links a::after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 0.5px; background: currentColor; transform: scaleX(0); transform-origin: right center; transition: transform 0.45s var(--ease); }
  .nav-links a:hover { color: var(--dark); }
  .nav-links a:hover::after { transform: scaleX(1); transform-origin: left center; }
  .nav-links a[aria-current="page"] { color: var(--dark); }
  .nav-links a[aria-current="page"]::after { transform: scaleX(1); background: var(--sand); }
  .nav-cta { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--dark); text-decoration: none; border: 0.5px solid var(--hairline-strong); padding: 0.7rem 1.5rem; cursor: none; white-space: nowrap; transition: background 0.4s var(--ease), color 0.4s var(--ease), border-color 0.4s var(--ease); }
  .nav-cta:hover { background: var(--dark); color: var(--cream); border-color: var(--dark); }
  .nav-explore { display: none !important; }
  body.page-dark .nav-links a { color: var(--sand); }
  body.page-dark .nav-links a:hover, body.page-dark .nav-links a[aria-current="page"] { color: var(--cream); }
  body.page-dark .nav-cta { color: var(--cream); border-color: rgba(200,184,154,0.4); }
  body.page-dark .nav-cta:hover { background: var(--cream); color: var(--dark); border-color: var(--cream); }
  @media (max-width: 1240px) { #mainNav { gap: 1.7rem; } .nav-links { gap: 1.35rem; } .nav-links a { font-size: 0.67rem; letter-spacing: 0.15em; } .nav-cta { padding: 0.6rem 1.15rem; font-size: 0.63rem; letter-spacing: 0.17em; } }
  @media (max-width: 1080px) { #mainNav { gap: 1.2rem; } .nav-links { gap: 1rem; } .nav-links a { font-size: 0.61rem; letter-spacing: 0.11em; } .nav-cta { padding: 0.52rem 0.9rem; font-size: 0.58rem; letter-spacing: 0.13em; } }
  @media (max-width: 940px) { #mainNav { gap: 0.9rem; } .nav-links { gap: 0.75rem; } .nav-links a { font-size: 0.56rem; letter-spacing: 0.07em; } .nav-cta { padding: 0.45rem 0.75rem; font-size: 0.54rem; letter-spacing: 0.1em; } .nav-logo { font-size: 15px !important; letter-spacing: 0.2em; } }
  /* Explore + hamburger take over only on mobile */
  @media (max-width: 820px) { .nav-links, .nav-cta { display: none !important; } .nav-explore { display: inline-flex !important; } }
  @media (max-width: 768px) { .nav-explore { display: none !important; } }
  /* ── HOMEPAGE PHILOSOPHY · image left, copy right ── */
  .home-phil { display: grid; grid-template-columns: 0.85fr 1fr; gap: 4.5rem; align-items: start; max-width: 1200px; margin: 0 auto; padding: 5rem 4rem }
  .home-phil-media { aspect-ratio: 1/1; position: relative; overflow: hidden; background: var(--light-sand); max-height: 420px; }
  .home-phil-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .home-phil-copy { max-width: 32rem; padding-top: 0.4rem; }
  .home-phil-copy .section-label { margin-bottom: 2rem; }
  .home-phil-quote { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-style: italic; font-size: clamp(1.5rem, 2.3vw, 2.15rem); line-height: 1.45; letter-spacing: 0.005em; color: var(--dark); margin: 0; }
  .home-phil-quote em { font-style: italic; color: var(--stone); }
  .home-phil-quote .word { display: inline-block; opacity: 0; transform: translateY(16px); transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out); }
  .home-phil.visible .home-phil-quote .word { opacity: 1; transform: translateY(0); }
  .home-phil-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.9rem; line-height: 1.85; color: var(--mid); margin: 2.2rem 0 0; }
  .home-phil-link { display: inline-block; margin-top: 2.4rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--dark); text-decoration: none; border-bottom: 0.5px solid var(--sand); padding-bottom: 4px; cursor: none; transition: color 0.35s var(--ease), border-color 0.35s var(--ease); }
  .home-phil-link:hover { color: var(--stone); border-color: var(--stone); }

  /* ── FIG. 01 · decluttered zoning ── */
  .tech-right { padding: 0; }
  .tech-right .dg-svg { width: 56% !important; top: 56% !important; }
  .tech-right .dg-header { top: 2rem !important; left: 2.2rem !important; max-width: 58%; }
  .tech-right .dg-header b { letter-spacing: 0.3em; font-size: 0.72rem; line-height: 1.5; }
  .dg-header i { display: block; margin-top: 0.75rem; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 0.8rem; letter-spacing: 0.01em; color: var(--ink-faint); text-transform: none; }
  .tech-right .dg-meta { top: 2rem !important; right: 2.2rem !important; row-gap: 0.34rem; }
  .tech-right .dg-scale { bottom: 2rem !important; right: 2.2rem !important; }
  .dg-rlabel text { font-size: 3.6px; }
  .dg-alabel text { font-size: 4.4px; }
  .dg-part circle { opacity: 0.55; }
  @media (max-width: 900px) { .tech-right .dg-svg { width: 66% !important; } .tech-right .dg-header { max-width: 70%; } }
  .tech-right .dg-header { max-width: 46% !important; }
  .tech-right .dg-header b { font-size: 0.68rem; letter-spacing: 0.26em; }
  .dg-foot { position: absolute; bottom: 2rem; left: 2.2rem; z-index: 4; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 0.82rem; letter-spacing: 0.01em; color: var(--ink-faint); }
  @media (max-width: 900px) { .tech-right .dg-header { max-width: 60% !important; } .tech-right .dg-foot { font-size: 0.72rem; } }
  /* Fig. 01 — final zoning: plot sits low-centre, text bands stay clear */
  .tech-right .dg-svg { width: 45% !important; top: 61% !important; }
  .tech-right .dg-header { max-width: 40% !important; top: 1.9rem !important; }
  .tech-right .dg-header b { font-size: 0.62rem !important; letter-spacing: 0.22em !important; }
  .tech-right .dg-meta { top: 1.9rem !important; }
  .tech-right .dg-foot { font-size: 0.74rem; bottom: 1.7rem; }
  .tech-right .dg-scale { bottom: 1.7rem !important; }
  @media (max-width: 900px) { .tech-right .dg-svg { width: 56% !important; } }
  /* Fig. 02 plate — header band clear of the plot */
  .plate--tall .dg-header { max-width: 62%; }
  .plate--tall .dg-header i { display: block; margin-top: 0.55rem; font-family: 'Cormorant Garamond', serif; font-style: italic; font-size: 0.78rem; letter-spacing: 0.01em; text-transform: none; color: var(--ink-faint); line-height: 1.5; }
  .plate--tall .plate-visual { padding: 5.5rem 2.5rem 2rem }
  @media (max-width: 900px) {
    .plate--tall { aspect-ratio: 4/5; }
    .plate--tall .dg-header { max-width: 78%; }
    .plate--tall .dg-header i { font-size: 0.7rem; }
    .plate--tall .plate-visual { padding: 6rem 1.2rem 1.5rem }
    .plate--tall .dg-meta { display: none; }
  }
  @media (max-width: 600px) {
    .plate--tall { aspect-ratio: 3/4; }
    .plate--tall .dg-header { max-width: 88%; }
    .plate--tall .plate-visual { padding: 5.5rem 1rem 1.2rem }
  }
  /* ── PROCESS STEP BACKGROUNDS ── */
  .process-step { position: relative; isolation: isolate; }
  .step-bg { position: absolute; top: 0; left: 0; right: 0; height: 200px; z-index: 0; overflow: hidden; }
  .step-bg image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .step-bg::after { content: ''; position: absolute; inset: 0; z-index: 2; background: color-mix(in oklab, var(--cream) 34%, transparent); pointer-events: none; transition: background 0.5s var(--ease); }
  .process-step:hover .step-bg::after { background: color-mix(in oklab, var(--cream) 18%, transparent); }
  .process-step > .step-number, .process-step > .step-title, .process-step > .step-body { position: relative; z-index: 1; }
  .process-step { padding-top: 0 !important; }
  .step-number { position: relative; z-index: 1; height: 200px; display: flex !important; align-items: center; justify-content: center; }
  .step-number > span { position: absolute; top: 1.4rem; left: 0; }
  .step-number .step-icon { margin: 0 !important; }
  .step-title { margin-top: 2rem; }
  .step-bg image-slot::part(empty) { justify-content: center; padding-bottom: 0; }
  body.page-dark .step-bg::after { background: color-mix(in oklab, var(--dark) 38%, transparent); }
  body.page-dark .process-step:hover .step-bg::after { background: color-mix(in oklab, var(--dark) 22%, transparent); }
  /* keep the empty-state hint out of the step copy */
  .step-bg image-slot { opacity: 0.9; }
  .step-bg image-slot[data-filled] { opacity: 1; }
  .step-bg image-slot::part(ring) { opacity: 0.22; }
  /* icon + numeral legibility over dropped photography */
  .step-number { z-index: 3 !important; }
  .step-bg image-slot[data-filled] ~ *, .process-step:has(.step-bg image-slot[data-filled]) .step-icon { color: var(--dark); }
  .process-step:has(image-slot[data-filled]) .step-icon { filter: drop-shadow(0 0 4px rgba(255,253,248,0.95)) drop-shadow(0 0 10px rgba(255,253,248,0.6)); opacity: 1; }
  .process-step:has(image-slot[data-filled]) .step-number > span { color: var(--dark); filter: drop-shadow(0 0 4px rgba(255,253,248,0.95)); }
  /* ── HOMEPAGE PHILOSOPHY · composition ── */
  .home-phil { grid-template-columns: 0.92fr 1fr; gap: 4rem; align-items: center; }
  .home-phil-media { max-height: none; aspect-ratio: 4/5; }
  .home-phil-copy { max-width: 30rem; padding-top: 0; }
  .home-phil-body { max-width: 32ch; }
  /* Tablet — hold the two columns, tighten the gap */
  @media (max-width: 1024px) { .home-phil { gap: 2.8rem; padding: 4.5rem 2.5rem } .home-phil-media { aspect-ratio: 1/1; } .home-phil-quote { font-size: 1.42rem; } }
  /* Stacked — image leads full width, copy sits beneath at a proper measure */
  @media (max-width: 768px) {
    .home-phil { grid-template-columns: 1fr; gap: 2.6rem; padding: 4.5rem 1.5rem; align-items: start; }
    .home-phil-media { aspect-ratio: 3/2; width: 100%; }
    .home-phil-copy { max-width: 34rem; }
    .home-phil-quote { font-size: 1.5rem; }
    .home-phil-body { max-width: 40ch; margin-top: 1.8rem; }
    .home-phil-link { margin-top: 2rem; }
  }
  /* ── PROCESS · image plates, not a fused strip ── */
  .process-step { padding-top: 2.1rem !important; }
  .step-bg { position: relative !important; top: auto !important; left: auto !important; right: auto !important;
    height: 190px; overflow: hidden; border: 0.5px solid var(--hairline); background: var(--light-sand); }
  .step-bg image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .step-number { margin-top: -190px !important; height: 190px !important; }
  .step-number > span { top: -1.75rem !important; }
  .step-title { margin-top: 1.9rem !important; }
  body.page-dark .step-bg { border-color: rgba(200,184,154,0.22); background: rgba(200,184,154,0.05); }
  @media (max-width: 768px) { .step-bg { height: 210px; } .step-number { margin-top: -210px !important; height: 210px !important; } }
  /* squarer plates — more presence for the imagery */
  .step-bg { height: 250px; }
  .step-number { margin-top: -250px !important; height: 250px !important; }
  @media (max-width: 768px) { .step-bg { height: 260px; } .step-number { margin-top: -260px !important; height: 260px !important; } }
  /* ── PROCESS · numeral + icon band ABOVE the plate ── */
  .process-step { display: flex; flex-direction: column; }
  .step-number { order: 1; position: relative; display: block !important;
    margin: 0 0 1.5rem !important; height: auto !important; min-height: 32px; }
  .step-number > span { position: absolute !important; top: 50% !important; left: 0 !important; transform: translateY(-50%); }
  .step-number .step-icon { display: block; margin: 0 auto !important; }
  .step-bg { order: 2; }
  .step-title { order: 3; margin-top: 1.9rem !important; }
  .step-body { order: 4; }
  /* icon no longer sits on imagery — drop the halo */
  .process-step:has(image-slot[data-filled]) .step-icon { filter: none; }
  .process-step:has(image-slot[data-filled]) .step-number > span { filter: none; }
  /* ── VIDEO SLOT · interaction states ── */
  .mslot { cursor: pointer; }
  .mslot.is-filled { cursor: default; }
  .mslot.is-over { outline: 2px solid var(--stone); outline-offset: -2px; }
  .mslot.is-over .mslot-hint { opacity: 1; }
  .mslot.is-filled .mslot-hint { display: none; }
  .mslot-ctl { position: absolute; top: 0.9rem; right: 0.9rem; z-index: 6; display: flex; gap: 0.35rem; opacity: 0; pointer-events: none; transition: opacity 0.3s var(--ease); }
  .mslot.is-filled:hover .mslot-ctl { opacity: 1; pointer-events: auto; }
  .mslot-ctl button { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.55rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--dark); background: rgba(252,250,244,0.92); border: 0.5px solid rgba(42,33,24,0.2); padding: 0.42rem 0.75rem; cursor: pointer; backdrop-filter: blur(6px); transition: background 0.25s, color 0.25s; }
  .mslot-ctl button:hover { background: var(--dark); color: var(--cream); border-color: var(--dark); }
  /* ── NAV SCRIM · guarantees link contrast over any hero frame ── */
  #hero { position: relative; }
  .nav-scrim { position: fixed; top: 0; left: 0; right: 0; height: 150px; z-index: 890; pointer-events: none;
    background: linear-gradient(to bottom, rgba(28,22,16,0.30) 0%, rgba(28,22,16,0.16) 45%, rgba(28,22,16,0) 100%);
    opacity: 0; transition: opacity 0.6s var(--ease); }
  body.at-hero .nav-scrim { opacity: 1; }
  body.at-hero .nav-logo, body.at-hero .nav-links a, body.at-hero .nav-cta { color: #FCFAF4; }
  body.at-hero .nav-links a::after { background: #FCFAF4; }
  body.at-hero .nav-links a[aria-current="page"]::after { background: var(--sand); }
  body.at-hero .nav-cta { border-color: rgba(252,250,244,0.55); }
  body.at-hero .nav-cta:hover { background: #FCFAF4; color: var(--dark); border-color: #FCFAF4; }
  body.at-hero .nav-hamburger span, body.at-hero .nav-explore { color: #FCFAF4; }
  body.at-hero .nav-hamburger span { background: #FCFAF4; }
  body.at-hero .hero-eyebrow, body.at-hero .hero-sub { color: rgba(252,250,244,0.9); }
  #mainNav.scrolled ~ .nav-scrim, body:not(.at-hero) .nav-scrim { opacity: 0; }
  /* ── STRONGER HERO LEGIBILITY OVER FILM ── */
  .nav-scrim { height: 230px !important;
    background: linear-gradient(to bottom, rgba(24,18,13,0.62) 0%, rgba(24,18,13,0.42) 38%, rgba(24,18,13,0.18) 70%, rgba(24,18,13,0) 100%) !important; }
  body.at-hero .nav-logo, body.at-hero .nav-links a, body.at-hero .nav-cta, body.at-hero .nav-explore {
    color: #FFFDF8 !important; text-shadow: 0 1px 12px rgba(20,14,9,0.75), 0 0 3px rgba(20,14,9,0.55); }
  body.at-hero .nav-cta { border-color: rgba(255,253,248,0.7) !important; background: rgba(20,14,9,0.18); }
  body.at-hero .nav-cta:hover { background: #FFFDF8; color: var(--dark) !important; text-shadow: none; }
  /* eyebrow + sub + headline over film */
  body.at-hero .hero-eyebrow { color: #FFFDF8 !important; text-shadow: 0 1px 14px rgba(20,14,9,0.8), 0 0 4px rgba(20,14,9,0.6); }
  body.at-hero .hero-eyebrow .dot { background: rgba(255,253,248,0.85); }
  body.at-hero .hero-sub { color: rgba(255,253,248,0.96) !important; text-shadow: 0 1px 14px rgba(20,14,9,0.8), 0 0 4px rgba(20,14,9,0.6); }
  body.at-hero .hero-headline { color: #FFFDF8; text-shadow: 0 2px 26px rgba(20,14,9,0.6), 0 0 8px rgba(20,14,9,0.35); }
  body.at-hero .hero-headline em { color: #EBD9BC; }
  body.at-hero .hero-scroll-indicator span { color: rgba(255,253,248,0.9); text-shadow: 0 1px 10px rgba(20,14,9,0.7); }
  body.at-hero .scroll-line { background: linear-gradient(to bottom, transparent, rgba(255,253,248,0.9) 30%, rgba(255,253,248,0.9)); }
  /* centre band behind the headline so mid-frame highlights can't wash it out */
  body.at-hero #hero::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: radial-gradient(ellipse 62% 48% at 50% 46%, rgba(20,14,9,0.42) 0%, rgba(20,14,9,0.16) 55%, rgba(20,14,9,0) 78%); }
  #hero .hero-content { z-index: 3 !important; }
  #hero .hero-scroll-indicator { z-index: 3; }
  /* bright footage needs a firmer hand */
  body.at-hero #hero::after { background: radial-gradient(ellipse 74% 58% at 50% 44%, rgba(18,13,8,0.60) 0%, rgba(18,13,8,0.34) 52%, rgba(18,13,8,0.10) 76%, rgba(18,13,8,0) 92%) !important; }
  body.at-hero .hero-eyebrow { color: #FFFDF8 !important; font-weight: 300; letter-spacing: 0.44em;
    text-shadow: 0 1px 3px rgba(14,10,6,0.95), 0 2px 18px rgba(14,10,6,0.85), 0 0 40px rgba(14,10,6,0.6) !important; }
  body.at-hero .hero-sub { text-shadow: 0 1px 3px rgba(14,10,6,0.95), 0 2px 18px rgba(14,10,6,0.85) !important; }
  body.at-hero .hero-headline { text-shadow: 0 2px 8px rgba(14,10,6,0.55), 0 4px 34px rgba(14,10,6,0.5) !important; }
  body.at-hero .nav-logo, body.at-hero .nav-links a, body.at-hero .nav-cta, body.at-hero .nav-explore {
    text-shadow: 0 1px 3px rgba(14,10,6,0.95), 0 2px 16px rgba(14,10,6,0.8) !important; }
  /* scrim lives INSIDE the hero, above the film but beneath the copy */
  .nav-scrim { position: absolute !important; top: 0; left: 0; right: 0; height: 300px !important; z-index: 2 !important;
    background: linear-gradient(to bottom, rgba(18,13,8,0.66) 0%, rgba(18,13,8,0.46) 34%, rgba(18,13,8,0.22) 64%, rgba(18,13,8,0) 100%) !important; }
  #hero .hero-content, #hero .hero-scroll-indicator { z-index: 4 !important; }
  body.at-hero #hero::after { z-index: 1 !important; }
  /* hold the eyebrow band and the scroll cue */
  .nav-scrim { background: linear-gradient(to bottom, rgba(18,13,8,0.70) 0%, rgba(18,13,8,0.56) 30%, rgba(18,13,8,0.44) 52%, rgba(18,13,8,0.20) 78%, rgba(18,13,8,0) 100%) !important; }
  body.at-hero .hero-eyebrow { font-weight: 400 !important; font-size: 0.71rem;
    text-shadow: 0 1px 2px rgba(12,8,5,1), 0 1px 10px rgba(12,8,5,0.9), 0 0 30px rgba(12,8,5,0.7) !important; }
  body.at-hero .hero-scroll-indicator span { color: #FFFDF8 !important; font-weight: 400;
    text-shadow: 0 1px 3px rgba(12,8,5,0.95), 0 2px 14px rgba(12,8,5,0.85) !important; }
  body.at-hero .scroll-line { box-shadow: 0 0 8px rgba(12,8,5,0.6); }
  /* headline keeps its original colour — no film override */
  body.at-hero .hero-headline { color: var(--dark) !important; text-shadow: none !important; }
  body.at-hero .hero-headline em { color: var(--stone) !important; }
  /* ── VISION / MISSION · three columns, taller plate, quieter type ── */
  #ethos { grid-template-columns: 0.78fr 1fr 1fr; gap: 3.6rem; align-items: start; }
  .ethos-media { aspect-ratio: 2/3; border: 0.5px solid var(--hairline-strong); overflow: hidden; position: relative; }
  .ethos-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .ethos-col + .ethos-col::before { display: block; left: -1.8rem; }
  .ethos-title { font-size: clamp(1.35rem, 1.9vw, 1.72rem) !important; line-height: 1.32 !important; }
  .ethos-body { font-size: 0.82rem !important; line-height: 1.85 !important; max-width: 34ch !important; }
  .ethos-index { font-size: 0.82rem; margin-bottom: 1.2rem; }
  #ethos .section-label { font-size: 0.58rem; margin-bottom: 2.2rem; }
  @media (max-width: 1024px) { #ethos { gap: 2.6rem; } .ethos-col + .ethos-col::before { left: -1.3rem; } }
  @media (max-width: 768px) {
    #ethos { grid-template-columns: 1fr; gap: 3rem; }
    .ethos-media { aspect-ratio: 3/2; }
    .ethos-col + .ethos-col::before { left: 0; right: 0; top: -1.5rem; bottom: auto; width: auto; height: 0.5px; }
    .ethos-body { max-width: 100% !important; }
  }
  #ethos .section-label { font-size: 0.82rem !important; letter-spacing: 0.3em !important; margin-bottom: 2.4rem !important; }
  /* image plate matches the height of the text columns */
  #ethos { align-items: stretch !important; }
  .ethos-media { aspect-ratio: auto !important; height: 100%; }
  @media (max-width: 768px) { #ethos { align-items: start !important; } .ethos-media { aspect-ratio: 3/2 !important; height: auto; } }
  /* ── TECHNOLOGY · share a top edge with the copy ── */
  .tech-grid { align-items: start !important; gap: 5rem !important; }
  .tech-media { display: flex; flex-direction: column; gap: 1.6rem; }
  .tech-media .tech-right { margin: 0; }
  /* Fig. 01 begins level with the body copy; film follows on the feature rows */
  .tech-media { padding-top: 17.5rem; }
  .tech-right { aspect-ratio: 3/2 !important; }
  @media (max-width: 768px) { .tech-media { padding-top: 0 !important; } }
  /* plate is now height-driven — scale the diagram to fit, not to width */
  .tech-media { padding-top: 0; }
  .tech-right { aspect-ratio: auto !important; }
  .tech-right .dg-svg { width: auto !important; height: 78% !important; top: 54% !important; }
  .tech-media .mslot, .tech-media .tech-film { aspect-ratio: auto !important; }
  .tech-media { gap: 24px !important; }
  @media (max-width: 768px) { .tech-right { aspect-ratio: 3/2 !important; } .tech-right .dg-svg { width: 56% !important; height: auto !important; } }
  /* ── SIGNATURES · the two ways to work ── */
  .tiers { display: grid; grid-template-columns: 1fr 1fr; gap: 2.6rem; margin-top: 2.6rem; padding-top: 2.2rem; border-top: 0.5px solid rgba(200,184,154,0.22); }
  .tier-label { display: block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--sand); margin-bottom: 0.9rem; }
  .tier p { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.78rem; line-height: 1.85; color: var(--stone); margin: 0; max-width: 38ch; }
  body:not(.page-dark) .tier-label { color: var(--stone); }
  body:not(.page-dark) .tier p { color: var(--mid); }
  body:not(.page-dark) .tiers { border-top-color: var(--hairline); }
  @media (max-width: 768px) { .tiers { grid-template-columns: 1fr; gap: 1.8rem; } }
  .tiers { grid-column: 1 / -1 !important; margin-top: 4rem !important; padding-top: 2.4rem !important; gap: 5rem !important; }
  .tier-label { white-space: nowrap; }
  .tier p { max-width: 34ch; }
  @media (max-width: 768px) { .tiers { gap: 1.8rem !important; margin-top: 2.6rem !important; } .tier-label { white-space: normal; } }
  .tiers { margin-top: 2.6rem !important; padding-top: 2rem !important; }
  /* ── JOURNAL · entry thumbnails ── */
  .journal-entry { grid-template-columns: 190px 110px 1fr !important; align-items: start; gap: 2.4rem !important; }
  .je-media { position: relative; aspect-ratio: 4/3; overflow: hidden; border: 0.5px solid var(--hairline); background: var(--light-sand); }
  .je-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .journal-entry:hover .je-media { border-color: var(--sand); }
  @media (max-width: 900px) {
    .journal-entry { grid-template-columns: 150px 1fr !important; gap: 1.6rem !important; align-items: start; }
    .je-media { aspect-ratio: 4/3; grid-row: span 2; }
    .je-date { grid-column: 2; }
  }
  @media (max-width: 560px) {
    .journal-entry { grid-template-columns: 110px 1fr !important; gap: 1.1rem !important; }
  }
  /* ── JOURNAL ARTICLE · lead image ── */
  .art-hero { position: relative; aspect-ratio: 16/9; overflow: hidden; border: 0.5px solid var(--hairline); background: var(--light-sand); margin: 3.2rem 0 3.6rem; }
  .art-hero image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  @media (max-width: 768px) { .art-hero { aspect-ratio: 3/2; margin: 2.2rem 0 2.6rem; } }
  /* ── SECTION LABELS · same position on every page ── */
  .process-header, .collection-header, .clients-header { align-items: start !important; }
  #philosophy .section-label, .process-header .section-label, .collection-header .section-label,
  .clients-header .section-label, #industries .section-label, #technology .section-label {
    margin-bottom: 2.6rem !important; }
  /* Signatures header sits at the same height as Philosophy's */
  /* tighten the space between header and grid on inner pages */
  .collection-header { margin-bottom: 3.2rem !important; }
  .tiers { margin-top: 2rem !important; padding-top: 1.6rem !important; }
  /* ── ONE HEADER POSITION ACROSS EVERY INNER PAGE ── */
  #philosophy, #process, #technology, #industries, #clients,
  #collection, #journal, #discover { padding-top: 6.5rem !important; }
  .process-header, .collection-header, .clients-header { margin-bottom: 3.6rem !important; }
  @media (max-width: 1024px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover { padding-top: 5.5rem !important; }
    .process-header, .collection-header, .clients-header { margin-bottom: 2.8rem !important; }
  }
  @media (max-width: 768px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover { padding-top: 4.5rem !important; }
  }
  /* Signatures intro drops to sit level with the headline's baseline */
  .collection-header { align-items: start !important; }
  .collection-intro { margin-top: 4.6rem !important; }
  @media (max-width: 768px) { .collection-intro { margin-top: 0 !important; } }
  /* ── SINGLE TOP-PADDING RULE FOR EVERY INNER PAGE ── */
  #philosophy, #process, #technology, #industries, #clients,
  #collection, #journal, #discover, #contact { padding-top: 6.5rem !important; }
  @media (max-width: 1024px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover, #contact { padding-top: 5.5rem !important; }
  }
  @media (max-width: 768px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover, #contact { padding-top: 4.5rem !important; }
  }
  /* ── ONE HEADLINE SCALE ACROSS EVERY PAGE ── */
  .collection-headline, .clients-headline, .process-headline,
  .tech-headline, .ind-headline {
    font-family: 'Cormorant Garamond', serif !important;
    font-weight: 200 !important;
    font-size: clamp(2.2rem, 3.5vw, 3.6rem) !important;
    line-height: 1.2 !important;
    letter-spacing: -0.01em !important;
  }
  /* intros share one measure and size */
  .collection-intro, .clients-intro, .process-intro {
    font-family: 'Jost', sans-serif !important;
    font-weight: 300 !important;
    font-size: 0.9rem !important;
    line-height: 1.85 !important;
    max-width: 460px !important;
  }
  /* card titles: signatures and clientele match */
  .col-name, .client-name { font-size: 1.45rem !important; font-weight: 300 !important; letter-spacing: -0.005em !important; }
  .col-accord, .client-sector { font-size: 0.6rem !important; letter-spacing: 0.3em !important; }
  .col-desc, .client-detail { font-size: 0.78rem !important; line-height: 1.85 !important; }
  @media (max-width: 390px) {
    .collection-headline, .clients-headline, .process-headline,
    .tech-headline, .ind-headline { font-size: 2rem !important; }
  }
  /* ── CONSULTATION · one primary action, one quiet second ── */
  .consult-actions { display: flex; align-items: center; justify-content: center; gap: 2.4rem; flex-wrap: wrap; margin-top: 1rem; }
  .consult-alt { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--stone); text-decoration: none; border-bottom: 0.5px solid var(--sand); padding-bottom: 4px; cursor: none; transition: color 0.35s var(--ease), border-color 0.35s var(--ease); }
  .consult-alt:hover { color: var(--dark); border-color: var(--stone); }
  #consultation .consult-cta { margin: 0; }
  @media (max-width: 560px) { .consult-actions { flex-direction: column; gap: 1.6rem; } }
  /* ── HERO CTA · sits over the film ── */
  .hero-cta { display: inline-block; margin-top: 2.8rem; font-family: 'Jost', sans-serif; font-weight: 300;
    font-size: 0.68rem; letter-spacing: 0.3em; text-transform: uppercase; text-decoration: none; cursor: none;
    color: var(--dark); border: 0.5px solid var(--hairline-strong); padding: 1rem 2.4rem; position: relative;
    overflow: hidden; transition: color 0.45s var(--ease), border-color 0.45s var(--ease);
    opacity: 0; animation: fadeUp 1.4s var(--ease-out) 1.5s forwards; }
  .hero-cta span { position: relative; z-index: 1; }
  .hero-cta::after { content: ''; position: absolute; inset: 0; background: var(--dark); transform: scaleX(0);
    transform-origin: left; transition: transform 0.5s var(--ease); z-index: 0; }
  .hero-cta:hover { color: var(--cream); border-color: var(--dark); }
  .hero-cta:hover::after { transform: scaleX(1); }
  /* over film: warm white with the same scrim treatment as the eyebrow */
  body.at-hero .hero-cta { color: #FFFDF8; border-color: rgba(255,253,248,0.6);
    background: rgba(20,14,9,0.16); backdrop-filter: blur(2px);
    text-shadow: 0 1px 3px rgba(12,8,5,0.9), 0 2px 14px rgba(12,8,5,0.7); }
  body.at-hero .hero-cta::after { background: #FFFDF8; }
  body.at-hero .hero-cta:hover { color: var(--dark); border-color: #FFFDF8; text-shadow: none; }
  @media (max-width: 768px) { .hero-cta { margin-top: 2.2rem; padding: 0.9rem 1.8rem; font-size: 0.62rem; letter-spacing: 0.24em; } }
  .hero-cta { white-space: nowrap; padding: 1rem 2.6rem; letter-spacing: 0.26em; }
  @media (max-width: 560px) { .hero-cta { letter-spacing: 0.18em; padding: 0.85rem 1.4rem; font-size: 0.58rem; } }
  /* ── ENQUIRE DROPDOWN ── */
  .nav-enq { position: relative; }
  .nav-enq > .nav-cta { background: transparent; font: inherit; font-family: 'Jost', sans-serif; font-weight: 300;
    font-size: 0.68rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--dark);
    border: 0.5px solid var(--hairline-strong); padding: 0.7rem 1.5rem; cursor: none; white-space: nowrap;
    transition: background 0.4s var(--ease), color 0.4s var(--ease), border-color 0.4s var(--ease); }
  .nav-enq > .nav-cta:hover, .nav-enq.open > .nav-cta { background: var(--dark); color: var(--cream); border-color: var(--dark); }
  .nav-enq-menu { position: absolute; top: calc(100% + 0.7rem); right: 0; min-width: 19rem; z-index: 950;
    background: color-mix(in oklab, var(--cream) 97%, transparent); backdrop-filter: blur(14px);
    border: 0.5px solid var(--hairline-strong); box-shadow: 0 22px 50px -24px rgba(42,33,24,0.3);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity 0.32s var(--ease), transform 0.32s var(--ease), visibility 0.32s; }
  .nav-enq.open .nav-enq-menu { opacity: 1; visibility: visible; transform: translateY(0); }
  .nav-enq-menu a { display: block; padding: 1.05rem 1.35rem; text-decoration: none; cursor: none;
    border-bottom: 0.5px solid var(--hairline); transition: background 0.3s var(--ease); }
  .nav-enq-menu a:last-child { border-bottom: none; }
  .nav-enq-menu a:hover { background: rgba(200,184,154,0.14); }
  .ne-t { display: block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem;
    letter-spacing: 0.2em; text-transform: uppercase; color: var(--dark); }
  .ne-s { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300;
    font-size: 0.82rem; color: var(--stone); margin-top: 0.35rem; }
  body.page-dark .nav-enq > .nav-cta { color: var(--cream); border-color: rgba(200,184,154,0.4); }
  body.page-dark .nav-enq > .nav-cta:hover, body.page-dark .nav-enq.open > .nav-cta { background: var(--cream); color: var(--dark); border-color: var(--cream); }
  body.at-hero .nav-enq > .nav-cta { color: #FFFDF8; border-color: rgba(255,253,248,0.7); background: rgba(20,14,9,0.18);
    text-shadow: 0 1px 3px rgba(12,8,5,0.95), 0 2px 16px rgba(12,8,5,0.8); }
  body.at-hero .nav-enq > .nav-cta:hover, body.at-hero .nav-enq.open > .nav-cta { background: #FFFDF8; color: var(--dark); text-shadow: none; }
  @media (max-width: 820px) { .nav-enq { display: none !important; } }
  .mobile-menu .mob-cta + .mob-cta { margin-top: 1rem; }
  /* quote now leads the block — link sits closer */
  .home-phil-link { margin-top: 2.6rem !important; }
  .nx-placeholder { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); opacity: 0.6; }
  body.page-dark .nx-placeholder { color: var(--sand); }
  /* ── ABOUT ── */
  #about { max-width: 1200px; margin: 0 auto; padding: 4.5rem 4rem 4.5rem }
  .about-lead { display: grid; grid-template-columns: 0.85fr 1fr; gap: 4rem; align-items: start; margin-bottom: 4.5rem; }
  .about-lead-media { position: relative; aspect-ratio: 4/5; overflow: hidden; border: 0.5px solid var(--hairline-strong); background: var(--light-sand); }
  .about-lead-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .about-lead-copy p { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.9rem; line-height: 1.9; color: var(--mid); max-width: 46ch; }
  .about-lead-copy p + p { margin-top: 1.4rem; }
  .about-facts { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4rem; padding: 2.4rem 0; border-top: 0.5px solid var(--hairline); border-bottom: 0.5px solid var(--hairline); margin-bottom: 5rem; }
  .af-k { display: block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.56rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.7rem; }
  .af-v { display: block; font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.02rem; line-height: 1.5; color: var(--dark); }
  .about-h2 { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(1.8rem, 2.6vw, 2.5rem); line-height: 1.2; color: var(--dark); margin-bottom: 3rem; }
  .people-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3rem; }
  .person-media { position: relative; aspect-ratio: 4/5; overflow: hidden; border: 0.5px solid var(--hairline-strong); background: var(--light-sand); margin-bottom: 1.3rem; }
  .person-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .person-name { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.35rem; color: var(--dark); margin-bottom: 0.4rem; }
  .person-role { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.58rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--stone); margin-bottom: 0.9rem; }
  .person-bio { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.78rem; line-height: 1.85; color: var(--mid); }
  @media (max-width: 900px) {
    #about { padding: 5.5rem 2.5rem 4rem; }
    .about-lead { grid-template-columns: 1fr; gap: 2.4rem; }
    .about-lead-media { aspect-ratio: 3/2; }
    .about-facts { grid-template-columns: 1fr 1fr; gap: 1.8rem; }
    .people-grid { grid-template-columns: 1fr; gap: 2.6rem; }
  }
  @media (max-width: 560px) { #about { padding: 4.5rem 1.5rem 3.5rem; } .about-facts { grid-template-columns: 1fr; } }

  /* ── SERVICES ── */
  #services { max-width: 1200px; margin: 0 auto; padding: 4.5rem 4rem 4.5rem }
  .svc-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 0.5px solid var(--hairline-strong); }
  .svc-card { padding: 3rem 2.2rem 3rem 0; border-right: 0.5px solid var(--hairline); transition: background 0.4s var(--ease); }
  .svc-card:nth-child(3n) { border-right: none; padding-right: 0; }
  .svc-card:nth-child(n+4) { border-top: 0.5px solid var(--hairline); }
  .svc-card:hover { background: rgba(200,184,154,0.07); }
  .svc-no { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 0.92rem; color: var(--sand); margin-bottom: 1.5rem; }
  .svc-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.42rem; line-height: 1.25; color: var(--dark); margin-bottom: 1.1rem; }
  .svc-desc { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.79rem; line-height: 1.85; color: var(--mid); margin-bottom: 1.5rem; }
  .svc-meta { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.56rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); }
  .svc-foot { margin-top: 4.5rem; padding-top: 2.4rem; border-top: 0.5px solid var(--hairline); display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
  .svc-foot p { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 1.05rem; color: var(--mid); margin: 0; }
  .svc-cta { display: inline-block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.66rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--cream); background: var(--dark); padding: 1rem 2.2rem; text-decoration: none; cursor: none; transition: background 0.4s var(--ease); }
  .svc-cta:hover { background: var(--stone); }
  @media (max-width: 900px) { #services { padding: 5.5rem 2.5rem 4rem; } .svc-grid { grid-template-columns: 1fr 1fr; } .svc-card:nth-child(3n) { border-right: 0.5px solid var(--hairline); padding-right: 2.2rem; } .svc-card:nth-child(2n) { border-right: none; padding-right: 0; } .svc-card:nth-child(n+3) { border-top: 0.5px solid var(--hairline); } }
  @media (max-width: 620px) { #services { padding: 4.5rem 1.5rem 3.5rem; } .svc-grid { grid-template-columns: 1fr; } .svc-card { border-right: none !important; padding: 2.4rem 0 !important; border-top: 0.5px solid var(--hairline); } .svc-foot { flex-direction: column; align-items: flex-start; } }
  /* ── ABOUT DROPDOWN ── */
  .nav-about { position: relative; }
  .nav-about > a::after { content: ''; }
  .nav-about.is-cur > a { color: var(--dark); }
  .nav-about.is-cur > a::after { transform: scaleX(1); background: var(--sand); }
  .nav-sub { position: absolute; top: calc(100% + 0.75rem); left: -1rem; min-width: 12.5rem; z-index: 950;
    background: color-mix(in oklab, var(--cream) 97%, transparent); backdrop-filter: blur(14px);
    border: 0.5px solid var(--hairline-strong); box-shadow: 0 20px 44px -24px rgba(42,33,24,0.28);
    opacity: 0; visibility: hidden; transform: translateY(-6px);
    transition: opacity 0.3s var(--ease), transform 0.3s var(--ease), visibility 0.3s; }
  .nav-about:hover .nav-sub, .nav-about:focus-within .nav-sub { opacity: 1; visibility: visible; transform: translateY(0); }
  .nav-sub a { display: block; padding: 0.85rem 1.2rem; text-decoration: none; cursor: none;
    font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; letter-spacing: 0.2em;
    text-transform: uppercase; color: var(--mid); border-bottom: 0.5px solid var(--hairline);
    transition: background 0.28s var(--ease), color 0.28s var(--ease); }
  .nav-sub a:last-child { border-bottom: none; }
  .nav-sub a:hover { background: rgba(200,184,154,0.16); color: var(--dark); }
  body.page-dark .nav-sub { background: color-mix(in oklab, var(--dark) 96%, transparent); border-color: rgba(200,184,154,0.3); }
  body.page-dark .nav-sub a { color: var(--sand); border-bottom-color: rgba(200,184,154,0.16); }
  body.page-dark .nav-sub a:hover { color: var(--cream); background: rgba(200,184,154,0.1); }
  body.at-hero .nav-sub { background: rgba(24,18,13,0.92); border-color: rgba(255,253,248,0.28); }
  body.at-hero .nav-sub a { color: #FFFDF8; border-bottom-color: rgba(255,253,248,0.16); text-shadow: none; }
  body.at-hero .nav-sub a:hover { background: rgba(255,253,248,0.12); }
  .svc-link { display: inline-block; margin-top: 1.1rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.6rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); text-decoration: none; border-bottom: 0.5px solid var(--sand); padding-bottom: 3px; cursor: none; transition: color 0.3s var(--ease); }
  .svc-link:hover { color: var(--dark); }
  /* Vision / Mission now sits inside About */
  #about #ethos { padding: 0 !important; margin: 0 0 5rem !important; max-width: none !important; }
  /* ── DENSITY PASS · tighten vertical rhythm site-wide ── */
  #philosophy, #process, #technology, #industries, #clients,
  #collection, #journal, #discover, #contact, #about, #services { padding-bottom: 4.5rem !important; }
  .process-header, .collection-header, .clients-header { margin-bottom: 2.8rem !important; }
  #philosophy { padding-bottom: 5rem !important; }
  #ethos { padding: 5.5rem 4rem !important; }
  #about #ethos { margin-bottom: 3.6rem !important; }
  .about-lead { margin-bottom: 3.2rem !important; }
  .about-facts { padding: 2rem 0 !important; margin-bottom: 3.4rem !important; }
  .about-h2 { margin-bottom: 2.2rem !important; }
  .process-steps .process-step { padding-top: 1.6rem !important; padding-bottom: 2.6rem !important; }
  .home-phil { padding: 5.5rem 4rem !important; }
  #site-index { padding: 4.5rem 4rem 4.5rem !important }
  .svc-card { padding-top: 2.4rem !important; padding-bottom: 2.4rem !important; }
  .svc-foot { margin-top: 3.2rem !important; padding-top: 2rem !important; }
  .ind-card { padding-top: 3rem !important; padding-bottom: 3rem !important; }
  .ind-note { margin-top: 3.4rem !important; padding-top: 2rem !important; }
  .journal-entry { padding: 2.2rem 0.5rem !important; }
  .tiers { margin-top: 1.8rem !important; padding-top: 1.6rem !important; }
  footer { padding-top: 4.5rem !important; }
  .footer-base { margin-top: 3rem !important; }
  .page-next { padding: 2.6rem 4rem !important; }
  @media (max-width: 900px) {
    #ethos { padding: 4rem 2.5rem !important; }
    .home-phil { padding: 4rem 1.5rem !important; }
    #site-index { padding: 3.5rem 1.5rem 4rem !important; }
  }
  /* "air." matches the wordmark and About label — dark, not stone */
  .hero-headline em, body.at-hero .hero-headline em { color: var(--dark) !important; }
  /* "air." reads warm white over the film, like the sub-line */
  body.at-hero .hero-headline em { color: #FFFDF8 !important;
    text-shadow: 0 1px 3px rgba(12,8,5,0.9), 0 2px 16px rgba(12,8,5,0.75) !important; }
  /* ── WHY SUENOS ── */
  .why-us { margin-bottom: 4rem; }
  .why-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; border-top: 0.5px solid var(--hairline-strong); }
  .why-item { padding: 2.4rem 2.2rem 2.4rem 0; border-right: 0.5px solid var(--hairline); }
  .why-item:nth-child(3n) { border-right: none; padding-right: 0; }
  .why-item:nth-child(n+4) { border-top: 0.5px solid var(--hairline); }
  .why-no { display: block; font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 0.9rem; color: var(--sand); margin-bottom: 1rem; }
  .why-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.28rem; line-height: 1.3; color: var(--dark); margin-bottom: 0.9rem; }
  .why-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.78rem; line-height: 1.85; color: var(--mid); }
  @media (max-width: 900px) { .why-grid { grid-template-columns: 1fr 1fr; } .why-item:nth-child(3n) { border-right: 0.5px solid var(--hairline); padding-right: 2.2rem; } .why-item:nth-child(2n) { border-right: none; padding-right: 0; } .why-item:nth-child(n+3) { border-top: 0.5px solid var(--hairline); } }
  @media (max-width: 620px) { .why-grid { grid-template-columns: 1fr; } .why-item { border-right: none !important; padding: 2rem 0 !important; border-top: 0.5px solid var(--hairline); } }
  #why { max-width: 1200px; margin: 0 auto; padding: 4.5rem 4rem 4.5rem }
  #why .why-us { margin-bottom: 0; }
  .why-foot { margin-top: 3.2rem; padding-top: 2rem; border-top: 0.5px solid var(--hairline); display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
  .why-foot p { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 1.05rem; color: var(--mid); margin: 0; }
  @media (max-width: 900px) { #why { padding: 5.5rem 2.5rem 4rem; } }
  @media (max-width: 620px) { #why { padding: 4.5rem 1.5rem 3.5rem; } .why-foot { flex-direction: column; align-items: flex-start; } }
  .why-lead { max-width: 62ch; margin-bottom: 3rem; }
  .why-lead p { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.88rem; line-height: 1.9; color: var(--mid); }
  .why-lead p + p { margin-top: 1.3rem; }
  .why-lede { font-family: 'Cormorant Garamond', serif !important; font-style: italic; font-weight: 300;
    font-size: 1.32rem !important; line-height: 1.5 !important; color: var(--dark) !important; margin-bottom: 1.6rem; }
  /* five-step process grid */
  .process-steps { grid-template-columns: repeat(5, 1fr) !important; }
  @media (max-width: 1100px) { .process-steps { grid-template-columns: repeat(3, 1fr) !important; } }
  @media (max-width: 780px) { .process-steps { grid-template-columns: repeat(2, 1fr) !important; } }
  @media (max-width: 560px) { .process-steps { grid-template-columns: 1fr !important; } }
  /* five-step grid: even tops, contained plates */
  .process-steps { align-items: start !important; column-gap: 2rem; }
  .process-step { padding-left: 0 !important; padding-right: 0 !important; border-right: none !important; }
  .step-bg { position: relative !important; height: auto !important; aspect-ratio: 4/5; width: 100%; inset: auto !important; }
  .step-bg::after { display: none; }
  .step-number { min-height: 0 !important; margin-bottom: 1.1rem !important; }
  .step-title { margin-top: 1.4rem !important; }
  .why-grid { grid-template-columns: repeat(5, 1fr) !important; }
  .why-icon { width: 30px; height: 30px; display: block; margin: 0 0 1.3rem; stroke: var(--stone); stroke-width: 1; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .why-item { padding-right: 1.8rem; }
  @media (max-width: 1100px) { .why-grid { grid-template-columns: repeat(3, 1fr) !important; } .why-item:nth-child(3n) { border-right: none !important; padding-right: 0 !important; } .why-item:nth-child(2n) { border-right: 0.5px solid var(--hairline); padding-right: 1.8rem; } .why-item:nth-child(n+4) { border-top: 0.5px solid var(--hairline); } }
  @media (max-width: 780px) { .why-grid { grid-template-columns: 1fr 1fr !important; } .why-item:nth-child(n) { border-right: 0.5px solid var(--hairline); padding-right: 1.6rem; } .why-item:nth-child(2n) { border-right: none !important; padding-right: 0 !important; } .why-item:nth-child(n+3) { border-top: 0.5px solid var(--hairline); } }
  @media (max-width: 560px) { .why-grid { grid-template-columns: 1fr !important; } .why-item { border-right: none !important; padding: 2rem 0 !important; border-top: 0.5px solid var(--hairline); } }
  /* number and icon share one line */
  .why-item { display: flex; flex-direction: column; }
  .why-no { display: inline-flex !important; align-items: center; gap: 0.9rem; margin-bottom: 1.3rem; }
  .why-icon { display: inline-block !important; margin: 0 !important; width: 26px; height: 26px; }
  /* process icons match the Why Us treatment: inline beside the numeral */
  .step-number { display: inline-flex !important; align-items: center !important; gap: 0.9rem !important;
    justify-content: flex-start !important; height: auto !important; min-height: 0 !important;
    margin: 0 0 1.3rem !important; position: relative !important; }
  .step-number > span { position: static !important; transform: none !important; }
  .step-icon { width: 26px !important; height: 26px !important; display: inline-block !important;
    margin: 0 !important; stroke: var(--stone); stroke-width: 1; fill: none;
    stroke-linecap: round; stroke-linejoin: round; }
  /* override the earlier .step-number .step-icon rules (higher specificity) */
  .process-step .step-number { display: inline-flex !important; align-items: center !important; gap: 0.9rem !important; height: auto !important; min-height: 0 !important; margin: 0 0 1.3rem !important; }
  .process-step .step-number > span { position: static !important; transform: none !important; top: auto !important; left: auto !important; }
  .process-step .step-number .step-icon { display: inline-block !important; margin: 0 !important; width: 26px !important; height: 26px !important; }
  /* dark pages: headline and intro must invert */
  body.page-dark .collection-headline,
  body.page-dark .clients-headline,
  body.page-dark .ind-headline,
  body.page-dark .about-h2,
  body.page-dark .why-title { color: var(--cream) !important; }
  body.page-dark .collection-headline em,
  body.page-dark .clients-headline em,
  body.page-dark .ind-headline em { color: var(--sand) !important; }
  body.page-dark .collection-intro,
  body.page-dark .clients-intro,
  body.page-dark .why-body,
  body.page-dark .tier p { color: rgba(234,228,216,0.72) !important; }
  body.page-dark .section-label { color: var(--sand) !important; }
  body.page-dark .section-label::before { background: var(--sand); }
  body.page-dark .tier-label { color: var(--sand) !important; }
  body.page-dark .col-name { color: var(--cream) !important; }
  body.page-dark .col-desc { color: rgba(234,228,216,0.7) !important; }
  body.page-dark .client-name { color: var(--cream) !important; }
  body.page-dark .client-detail { color: rgba(234,228,216,0.7) !important; }
  /* inner pages must clear the fixed nav */
  #philosophy, #process, #technology, #industries, #clients,
  #collection, #journal, #discover, #contact, #about, #services, #why { padding-top: 9.5rem !important; }
  @media (max-width: 1024px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover, #contact, #about, #services, #why { padding-top: 8.5rem !important; }
  }
  @media (max-width: 768px) {
    #philosophy, #process, #technology, #industries, #clients,
    #collection, #journal, #discover, #contact, #about, #services, #why { padding-top: 7rem !important; }
  }
  /* ── WHAT WE DO (homepage) ── */
  #what-we-do { max-width: 1200px; margin: 0 auto; padding: 5.5rem 4rem; display: grid; grid-template-columns: 0.85fr 2fr; gap: 4rem; align-items: start; }
  .wwd-headline { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(1.9rem, 2.8vw, 2.6rem); line-height: 1.2; letter-spacing: -0.01em; color: var(--dark); margin-bottom: 1.4rem; }
  .wwd-headline em { font-style: italic; color: var(--stone); }
  .wwd-intro { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.85rem; line-height: 1.85; color: var(--mid); max-width: 34ch; margin-bottom: 2rem; }
  .wwd-cta { display: inline-block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.26em; text-transform: uppercase; color: var(--dark); text-decoration: none; border: 0.5px solid var(--hairline-strong); padding: 0.85rem 1.8rem; cursor: none; transition: background 0.4s var(--ease), color 0.4s var(--ease), border-color 0.4s var(--ease); }
  .wwd-cta:hover { background: var(--dark); color: var(--cream); border-color: var(--dark); }
  .wwd-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; }
  .wwd-item { padding: 0 1.6rem; border-left: 0.5px solid var(--hairline); }
  .wwd-item:first-child { border-left: none; padding-left: 0; }
  .wwd-item:last-child { padding-right: 0; }
  .wwd-icon { width: 30px; height: 30px; display: block; margin-bottom: 1.6rem; stroke: var(--stone); stroke-width: 1; fill: none; stroke-linecap: round; stroke-linejoin: round; }
  .wwd-title { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.66rem; letter-spacing: 0.22em; text-transform: uppercase; color: var(--dark); line-height: 1.6; margin-bottom: 1.1rem; }
  .wwd-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.76rem; line-height: 1.85; color: var(--mid); }
  @media (max-width: 1024px) { #what-we-do { grid-template-columns: 1fr; gap: 3rem; padding: 4.5rem 2.5rem; } .wwd-intro { max-width: 46ch; } }
  @media (max-width: 780px) { .wwd-grid { grid-template-columns: 1fr 1fr; gap: 2.4rem 0; } .wwd-item:nth-child(odd) { border-left: none; padding-left: 0; } }
  @media (max-width: 520px) { #what-we-do { padding: 4rem 1.5rem; } .wwd-grid { grid-template-columns: 1fr; } .wwd-item { border-left: none; padding: 0 0 1.6rem; } }
  /* Services page: four-pillar band */
  .wwd-band { display: grid; grid-template-columns: 0.85fr 2fr; gap: 4rem; align-items: start; padding-bottom: 3.4rem; border-bottom: 0.5px solid var(--hairline); margin-bottom: 3rem; }
  .wwd-band .wwd-intro { margin-bottom: 0; }
  .svc-detail-label { margin-bottom: 1.8rem; }
  .svc-detail-label span { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.56rem; letter-spacing: 0.34em; text-transform: uppercase; color: var(--stone); display: inline-flex; align-items: center; gap: 1rem; }
  .svc-detail-label span::before { content: ''; width: 28px; height: 0.5px; background: var(--stone); display: inline-block; }
  @media (max-width: 1024px) { .wwd-band { grid-template-columns: 1fr; gap: 2.6rem; } }

  /* ══════════ HOMEPAGE — EDITORIAL STRUCTURE ══════════ */
  .hp-band { max-width: 1200px; margin: 0 auto; padding: 4.5rem 4rem }
  .band-dark { max-width: none; background: var(--dark); padding-left: 0; padding-right: 0; }
  .band-dark > * { max-width: 1200px; margin-left: auto; margin-right: auto; padding-left: 4rem; padding-right: 4rem; }

  /* numbered section label */
  .sec-label { display: flex; align-items: center; gap: 1.4rem; margin-bottom: 3rem; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.56rem; letter-spacing: 0.34em; text-transform: uppercase; }
  .sl-no { color: var(--sand); font-feature-settings: "tnum","lnum"; }
  .sl-t { color: var(--stone); display: inline-flex; align-items: center; gap: 1.1rem; }
  .sl-t::before { content: ''; width: 26px; height: 0.5px; background: var(--sand); display: inline-block; }
  .band-dark .sl-t { color: var(--sand); }
  .band-dark .sl-no { color: var(--sand); opacity: 0.75; }

  .hp-headline { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(2rem, 3.2vw, 3.1rem); line-height: 1.18; letter-spacing: -0.012em; color: var(--dark); }
  .hp-headline em { font-style: italic; color: var(--stone); }
  .band-dark .hp-headline { color: var(--cream); }
  .band-dark .hp-headline em { color: var(--sand); }
  .hp-intro { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.86rem; line-height: 1.9; color: var(--mid); max-width: 42ch; }
  .band-dark .hp-intro { color: var(--sand); }

  .hp-link { display: inline-flex; align-items: center; gap: 0.6rem; font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 400; font-size: 0.94rem; color: var(--stone); text-decoration: none; cursor: none; border-bottom: 0.5px solid var(--sand); padding-bottom: 3px; transition: color 0.35s var(--ease), border-color 0.35s var(--ease); }
  .hp-link::after { content: '\2197'; font-style: normal; font-size: 0.8em; }
  .hp-link:hover { color: var(--dark); border-color: var(--stone); }
  .band-dark .hp-link { color: var(--sand); border-color: rgba(200,184,154,0.4); }
  .band-dark .hp-link:hover { color: var(--cream); border-color: var(--cream); }

  /* quote band */
  .quote-band { background: var(--light-sand); text-align: center; padding: 5.5rem 4rem; }
  .qb-mark { display: block; font-family: 'Cormorant Garamond', serif; font-size: 2.6rem; line-height: 0.6; color: var(--sand); }
  .qb-mark--end { margin-top: 1.8rem; }
  .qb-text { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: clamp(1.5rem, 2.6vw, 2.2rem); line-height: 1.45; color: var(--dark); max-width: 20ch; margin: 1.6rem auto 0; }
  .qb-text em { font-style: italic; color: var(--stone); }
  .quote-band .word { display: inline-block; opacity: 0; transform: translateY(16px); transition: opacity 0.85s var(--ease-out), transform 0.85s var(--ease-out); }
  .quote-band.visible .word { opacity: 1; transform: translateY(0); }

  /* 01 philosophy split */
  .hp-split { display: grid; grid-template-columns: 1.15fr 1fr; gap: 5rem; align-items: start; }
  .hp-aside p { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.84rem; line-height: 1.95; color: var(--mid); max-width: 40ch; }
  .hp-aside p + p { margin-top: 1.2rem; }
  .hp-aside .hp-link { margin-top: 2rem; }

  /* 02 offer */
  .offer-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.6rem; }
  .offer-card { background: #FBF8F1; border: 0.5px solid var(--hairline); display: flex; flex-direction: column; transition: border-color 0.4s var(--ease); }
  .offer-card:hover { border-color: var(--sand); }
  .offer-media { position: relative; aspect-ratio: 4/3; overflow: hidden; background: var(--light-sand); }
  .offer-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .offer-copy { padding: 1.7rem 1.6rem 1.9rem; display: flex; flex-direction: column; align-items: flex-start; gap: 0.85rem; }
  .offer-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.28rem; color: var(--dark); }
  .offer-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.75rem; line-height: 1.85; color: var(--mid); }
  .offer-copy .hp-link { font-size: 0.86rem; margin-top: 0.3rem; }

  /* 03 signatures */
  .sig-head { display: grid; grid-template-columns: 1.15fr 1fr; gap: 5rem; align-items: start; margin-bottom: 3rem; }
  .sig-grid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; }
  .sig-card { border: 0.5px solid rgba(200,184,154,0.22); padding: 1rem 1rem 1.4rem; display: flex; flex-direction: column; align-items: flex-start; transition: border-color 0.4s var(--ease); }
  .sig-card:hover { border-color: rgba(200,184,154,0.5); }
  .sig-media { position: relative; aspect-ratio: 1/1; width: 100%; overflow: hidden; background: rgba(200,184,154,0.08); margin-bottom: 1.2rem; }
  .sig-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .sig-name { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.18rem; color: var(--cream); margin-bottom: 0.9rem; }
  .sig-notes { width: 100%; margin-bottom: 1.1rem; }
  .sig-notes > div { display: grid; grid-template-columns: 3.4rem 1fr; gap: 0.6rem; padding: 0.4rem 0; border-top: 0.5px solid rgba(200,184,154,0.14); }
  .sig-notes dt { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.5rem; letter-spacing: 0.24em; text-transform: uppercase; color: var(--stone); }
  .sig-notes dd { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.04em; color: var(--sand); margin: 0; }
  .sig-card .hp-link { font-size: 0.84rem; }

  /* 04 spaces */
  .spaces-layout { display: grid; grid-template-columns: 0.62fr 2.2fr; gap: 3.4rem; align-items: start; }
  .spaces-aside .hp-headline { font-size: clamp(1.7rem, 2.4vw, 2.3rem); }
  .spaces-note { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.74rem; line-height: 1.9; color: var(--sand); margin-top: 1.8rem; }
  .spaces-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.2rem; }
  .space-card { display: flex; flex-direction: column; align-items: flex-start; }
  .space-media { position: relative; aspect-ratio: 3/4; width: 100%; overflow: hidden; background: rgba(200,184,154,0.08); border: 0.5px solid rgba(200,184,154,0.18); margin-bottom: 1.1rem; }
  .space-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .space-title { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: 1.12rem; color: var(--cream); margin-bottom: 0.7rem; line-height: 1.3; }
  .space-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.7rem; line-height: 1.85; color: var(--sand); margin-bottom: 1rem; }
  .space-card .hp-link { font-size: 0.84rem; }

  /* why band */
  #hp-why { text-align: center; border-top: 0.5px solid var(--hairline); }
  .why-band-headline { font-family: 'Cormorant Garamond', serif; font-weight: 200; font-size: clamp(1.7rem, 2.7vw, 2.5rem); line-height: 1.25; color: var(--dark); }
  .why-band-headline em { font-style: italic; color: var(--stone); }
  .why-band-sub { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.76rem; letter-spacing: 0.06em; color: var(--stone); margin: 1.1rem auto 3.6rem; max-width: 52ch; }
  .why-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 2rem; }
  .wr-item { display: flex; flex-direction: column; align-items: center; }
  .wr-icon { width: 30px; height: 30px; stroke: var(--stone); stroke-width: 0.75; fill: none; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 1.3rem; }
  .wr-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 0.96rem; color: var(--dark); margin-bottom: 0.7rem; line-height: 1.3; }
  .wr-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; line-height: 1.8; color: var(--mid); }

  /* 05 clientele */
  #hp-clients { border-top: 0.5px solid var(--hairline); }
  .cl-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.4rem; margin-bottom: 2.4rem; }
  .cl-tile { border: 0.5px solid var(--hairline); padding: 2rem 1.5rem; text-align: center; display: flex; flex-direction: column; align-items: center; transition: border-color 0.4s var(--ease); }
  .cl-tile:hover { border-color: var(--sand); }
  .cl-mark { position: relative; width: 100%; height: 46px; margin-bottom: 1.2rem; }
  .cl-mark image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .cl-sector { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 0.86rem; color: var(--stone); margin-bottom: 0.9rem; }
  .cl-detail { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; line-height: 1.85; color: var(--mid); }

  /* 06 conversation */
  #hp-conversation { padding-top: 0; padding-bottom: 0; }
  .conv-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 0; align-items: stretch; padding: 0 !important; max-width: none !important; }
  .conv-copy { padding: 4.5rem 4rem 4.5rem max(4rem, calc((100vw - 1200px) / 2 + 4rem)) display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
  .conv-copy .sec-label { margin-bottom: 2.2rem; }
  .conv-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.82rem; line-height: 1.9; color: var(--sand); max-width: 34ch; margin: 1.6rem 0 2.6rem; }
  .conv-cta { display: inline-block; font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.64rem; letter-spacing: 0.28em; text-transform: uppercase; color: var(--cream); text-decoration: none; cursor: none; border: 0.5px solid rgba(200,184,154,0.55); padding: 1.05rem 2.4rem; position: relative; overflow: hidden; transition: color 0.45s var(--ease), border-color 0.45s var(--ease); }
  .conv-cta span { position: relative; z-index: 1; }
  .conv-cta::after { content: ''; position: absolute; inset: 0; background: var(--cream); transform: scaleX(0); transform-origin: left; transition: transform 0.5s var(--ease); }
  .conv-cta:hover { color: var(--dark); border-color: var(--cream); }
  .conv-cta:hover::after { transform: scaleX(1); }
  .conv-media { position: relative; min-height: 26rem; background: rgba(200,184,154,0.08); }
  .conv-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }

  @media (max-width: 1100px) {
    .sig-grid, .spaces-grid, .cl-grid { grid-template-columns: repeat(2, 1fr); }
    .why-row { grid-template-columns: repeat(3, 1fr); gap: 2.4rem 1.6rem; }
    .spaces-layout { grid-template-columns: 1fr; gap: 2.4rem; }
  }
  @media (max-width: 900px) {
    .hp-band { padding: 5rem 2.5rem; }
    .band-dark > * { padding-left: 2.5rem; padding-right: 2.5rem; }
    .hp-split, .sig-head { grid-template-columns: 1fr; gap: 2rem; }
    .offer-grid { grid-template-columns: 1fr; gap: 1.2rem; }
    .conv-layout { grid-template-columns: 1fr; }
    .conv-copy { padding: 4.5rem 2.5rem; }
    .conv-media { min-height: 18rem; }
    .quote-band { padding: 4rem 2rem; }
  }
  @media (max-width: 620px) {
    .hp-band { padding: 4rem 1.5rem; }
    .band-dark > * { padding-left: 1.5rem; padding-right: 1.5rem; }
    .sig-grid, .spaces-grid, .cl-grid { grid-template-columns: 1fr; }
    .why-row { grid-template-columns: 1fr 1fr; }
    .conv-copy { padding: 3.5rem 1.5rem; }
  }

  /* ══════════ TYPE SYSTEM — TWO FAMILIES ONLY ══════════
     Cormorant Garamond (serif) 200–400: headlines, wordmark, scent names,
     pull-quotes, italic accents.
     Jost (sans) 200–400: body, labels, nav, buttons, all-caps metadata. */
  body, input, textarea, select, button, .mslot-hint, .dg-meta, .dg-header {
    font-family: 'Jost', sans-serif;
  }
  h1, h2, h3, h4, h5, h6,
  .nav-logo, .footer-brand,
  .hero-headline, .hp-headline, .qb-text,
  .collection-headline, .clients-headline, .process-headline,
  .tech-headline, .ind-headline, .consult-headline, .why-band-headline,
  .about-h2, .wwd-headline,
  .col-name, .client-name, .partner-name, .sig-name, .space-title,
  .offer-title, .svc-title, .why-title, .wr-title, .step-title,
  .person-name, .je-title, .art-title,
  .statement p, .phil-quote p, .home-phil-quote,
  .hp-link, .cl-sector, .svc-foot p, .why-lede, .ind-note p,
  .af-v, .step-number, .svc-no, .why-no, .dg-foot, .tech-caption-r {
    font-family: 'Cormorant Garamond', serif;
  }
  /* weights held inside 200–400 */
  h1, h2, h3, h4, h5, h6 { font-weight: 200; }
  .offer-title, .sig-name, .space-title, .svc-title, .why-title,
  .col-name, .client-name, .partner-name, .step-title, .person-name,
  .wr-title, .about-h2 { font-weight: 300; }
  .hp-link, .cl-sector, .why-lede, .svc-foot p { font-weight: 400; }
  strong, b { font-weight: 400; }
  /* scroll cue: centre without transform, since fadeUp animates transform
     and was overwriting translateX(-50%) */
  .hero-scroll-indicator { left: 0 !important; right: 0 !important; margin-inline: auto; width: fit-content; }
  @keyframes fadeUpCue { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: translateY(0); } }
  .hero-scroll-indicator { animation-name: fadeUpCue !important; }

  /* ── INDUSTRIES WE SERVE · image tiles ── */
  .ind-tiles { display: grid; grid-template-columns: repeat(6, 1fr); gap: 0.7rem; }
  .ind-tile { position: relative; display: block; aspect-ratio: 3/4; overflow: hidden; text-decoration: none; cursor: none; background: var(--dark); }
  .it-media { position: absolute; inset: 0; }
  .it-media image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }
  .ind-tile::after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(to bottom, rgba(24,18,13,0.42) 0%, rgba(24,18,13,0.28) 45%, rgba(24,18,13,0.78) 100%); transition: background 0.5s var(--ease); }
  .ind-tile:hover::after { background: linear-gradient(to bottom, rgba(24,18,13,0.3) 0%, rgba(24,18,13,0.2) 45%, rgba(24,18,13,0.72) 100%); }
  .it-face { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1.6rem; padding: 1.2rem 0.9rem 1.6rem; text-align: center; }
  .it-icon { width: 34px; height: 34px; stroke: var(--sand); stroke-width: 0.7; fill: none; stroke-linecap: round; stroke-linejoin: round; transition: stroke 0.4s var(--ease), transform 0.5s var(--ease); }
  .ind-tile:hover .it-icon { stroke: var(--cream); transform: translateY(-3px); }
  .it-label { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.6rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cream); line-height: 1.6; margin-top: auto; }

  /* ── WHY · dark band, aside + columns ── */
  #hp-why { text-align: left; border-top: none; }
  .why-layout { display: grid; grid-template-columns: 0.85fr 2.6fr; gap: 3.4rem; align-items: start; }
  .why-aside .sec-label { margin-bottom: 1.6rem; }
  .why-aside .hp-headline { font-size: clamp(1.7rem, 2.4vw, 2.3rem); }
  .why-aside-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.76rem; line-height: 1.95; color: var(--sand); margin: 1.6rem 0 1.8rem; max-width: 32ch; }
  .why-cols { display: grid; grid-template-columns: repeat(5, 1fr); gap: 0; }
  .wc-item { padding: 0 1.5rem; border-left: 0.5px solid rgba(200,184,154,0.18); text-align: center; display: flex; flex-direction: column; align-items: center; }
  .wc-item:first-child { border-left: none; padding-left: 0; }
  .wc-item:last-child { padding-right: 0; }
  .wc-icon { width: 32px; height: 32px; stroke: var(--sand); stroke-width: 0.7; fill: none; stroke-linecap: round; stroke-linejoin: round; margin-bottom: 1.4rem; }
  .wc-title { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.62rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--cream); line-height: 1.7; margin-bottom: 0.9rem; }
  .wc-body { font-family: 'Jost', sans-serif; font-weight: 300; font-size: 0.68rem; line-height: 1.85; color: var(--sand); }

  /* ── TRUSTED BY ── */
  #hp-trusted { border-top: 0.5px solid var(--hairline); }
  .trust-row { display: grid; grid-template-columns: repeat(6, 1fr); gap: 2.4rem; align-items: center; margin-bottom: 2.6rem; }
  .trust-cell { position: relative; height: 54px; opacity: 0.72; transition: opacity 0.4s var(--ease); }
  .trust-cell:hover { opacity: 1; }
  .trust-cell image-slot { position: absolute; inset: 0; width: 100%; height: 100%; }

  @media (max-width: 1100px) {
    .ind-tiles { grid-template-columns: repeat(3, 1fr); }
    .why-layout { grid-template-columns: 1fr; gap: 2.6rem; }
    .why-cols { grid-template-columns: repeat(3, 1fr); gap: 2.4rem 0; }
    .wc-item:nth-child(3n+1) { border-left: none; padding-left: 0; }
    .trust-row { grid-template-columns: repeat(3, 1fr); gap: 2rem; }
  }
  @media (max-width: 620px) {
    .ind-tiles { grid-template-columns: repeat(2, 1fr); gap: 0.5rem; }
    .it-icon { width: 28px; height: 28px; }
    .it-label { font-size: 0.54rem; letter-spacing: 0.16em; }
    .why-cols { grid-template-columns: 1fr 1fr; }
    .wc-item { border-left: none; padding: 0 0.6rem; }
    .trust-row { grid-template-columns: 1fr 1fr; }
  }
  /* scroll cue sits clear of the CTA panel */
  .hero-scroll-indicator { bottom: 2.2rem !important; gap: 0.7rem !important; }
  .scroll-line { height: 34px !important; }
  #hero .hero-content { padding-bottom: 6.5rem; }
  @media (max-width: 768px) { .scroll-line { height: 26px !important; } #hero .hero-content { padding-bottom: 5rem; } }
  /* cue joins the hero flow so it can never overlap the panel */
  #hero { justify-content: flex-start !important; padding-top: 22vh; }
  #hero .hero-content { padding-bottom: 0 !important; }
  .hero-scroll-indicator { position: static !important; margin: auto auto 2.2rem !important;
    left: auto !important; right: auto !important; bottom: auto !important; }
  @media (max-width: 768px) { #hero { padding-top: 20vh; } }
  .hero-scroll-indicator { margin-top: 3.2rem !important; }
  /* tagline wraps beneath the wordmark instead of running past it */
  .footer-identity { width: fit-content; }
  .footer-brand { display: block; white-space: nowrap; }
  .footer-tagline { white-space: normal !important; max-width: 100% !important; width: 0; min-width: 100%; }
  /* tagline: one line, sized to sit under the wordmark */
  .footer-identity { width: fit-content; }
  .footer-tagline { white-space: nowrap !important; width: auto !important; min-width: 0 !important;
    max-width: none !important; font-size: 0.5rem !important; letter-spacing: 0.055em !important; }
  @media (max-width: 720px) { .footer-tagline { font-size: 0.46rem !important; letter-spacing: 0.03em !important; } }

/* Live deploy: hide unfilled media-slot placeholder chrome (edit-tool hints). */
.mslot-hint { display: none !important; }

  /* ── Homepage: philosophy↔offer separation + brand slogan band (client notes round 1) ── */
  #hp-offer { border-top: 0.5px solid var(--hairline); }
  .hp-slogan { text-align: center; }
  .hp-slogan-text { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: clamp(1.8rem, 3.4vw, 3rem); line-height: 1.25; letter-spacing: -0.01em; color: var(--dark); max-width: 24ch; margin: 0 auto; }
  .hp-slogan-text em { font-style: italic; color: var(--stone); }

  /* ── Clientele: compact smaller tiles, no detail paragraphs (client notes round 1) ── */
  #clients .partners-grid { grid-template-columns: repeat(4, 1fr); gap: 2.6rem 2rem; }
  #clients .partner-media { aspect-ratio: 3/2; margin-bottom: 0.9rem; }
  #clients .partner-caption { flex-direction: column; align-items: flex-start; gap: 0.25rem; }
  #clients .partner-name { font-size: 1.1rem; }
  #clients .partner-sector { white-space: normal; }
  #clients .partner-detail { display: none; }
  @media (max-width: 1024px) { #clients .partners-grid { grid-template-columns: repeat(3, 1fr); } }
  @media (max-width: 680px)  { #clients .partners-grid { grid-template-columns: 1fr 1fr; gap: 2rem 1.4rem; } }

  /* ── Industries: cleaner — smaller media + smaller, clamped body text (client notes) ── */
  #industries .ind-media { aspect-ratio: 16/10; margin-bottom: 1.4rem; }
  #industries .ind-title { font-size: 1.3rem; margin-bottom: 0.7rem; }
  #industries .ind-body { font-size: 0.72rem; line-height: 1.75; margin-bottom: 1.4rem; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

  /* ── About: tighten empty space after facts (people section removed) ── */
  #about .about-facts { margin-bottom: 3rem; }
  /* ── Philosophy: detail image in the left column (replaces the removed facing paragraph) ── */
  .phil-media { margin-top: 2.2rem; aspect-ratio: 4/3; overflow: hidden; border: 0.5px solid var(--hairline-strong); }

  /* ── Technology: diffuser machine photo replaces the diagram/video (client notes) ── */
  .tech-photo { aspect-ratio: 4/5; overflow: hidden; border: 0.5px solid var(--hairline-strong); background: var(--dark); }

  /* ── Journal article: rhythmic cadence lines (client article "The Future of Scent") ── */
  .entry-body .entry-cadence { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 300; font-size: 1.4rem; line-height: 1.5; letter-spacing: 0.01em; color: var(--stone); margin: 1.8rem 0; }