/* ============================================================
   NOON v13 — Japanese cowboy × Aztec shaman.
   Charcoal ground, smoky desert backdrop, polished psychedelic
   sacred geometry over a faint Sonoran landscape vision.
   ============================================================ */

:root {
  /* charcoal ground */
  --bg:        #1A1815;
  --bg-2:      #161410;
  --bg-deep:   #0F0D0A;

  /* paper accents (light highlights only) */
  --paper:     #F2EBD9;
  --paper-2:   #DCD4BD;
  --paper-3:   #A8A08B;
  --paper-4:   #6B6657;

  /* trio + two earth-shaman tones */
  --ember:     #E97E2D; /* tuned to match logo orange */
  --ember-2:   #B14E1C;
  --sun:       #F2B85A;
  --brass:     #B89968; /* tuned to match logo PBC tagline gold */
  --brass-2:   #8C6F2F;
  --moss:      #6F8559;
  --moss-2:    #4A5C3C;
  --turq:      #5C7C82; /* tuned to match logo ring teal */
  --turq-2:    #4F7378; /* deeper teal of "Ecological Infrastructure" */
  --blood:     #A33B2A;

  --rule:      rgba(184,153,104,0.22);
  --rule-2:    rgba(184,153,104,0.34);
  --rule-3:    rgba(184,153,104,0.14);

  --serif:  'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:   'Inter', system-ui, sans-serif;
  --mono:   'JetBrains Mono', ui-monospace, monospace;

  --gutter: clamp(28px, 5vw, 96px);
  --max:    1480px;

  --ease:   cubic-bezier(0.22, 0.61, 0.36, 1);
}

* { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; }
body {
  background: var(--bg);
  color: var(--paper);
  font-family: var(--sans);
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
}
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
::selection { background: var(--ember); color: var(--bg); }

/* ============================================================
   GROUND TEXTURE — raked gravel + film grain (page-wide)
   ============================================================ */
body::before {
  /* parchment fibers — horizontal long grain like a true papyrus / hemp scroll */
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image:
    /* warm vignette only — the graph-paper "parchment fibers" removed (read as an MS-DOS grid);
       the marmorino mineral skin now carries all the surface texture. */
    radial-gradient(ellipse 120% 80% at 50% 50%,
      transparent 0%,
      transparent 55%,
      rgba(0,0,0,0.18) 100%);
  opacity: 0.85;
}
body::after {
  /* paper fibre noise — turbulence at two frequencies for depth */
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' seed='7'/><feColorMatrix values='0 0 0 0 0.92  0 0 0 0 0.89  0 0 0 0 0.82  0 0 0 0.10 0'/></filter><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='0.04' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 0.96  0 0 0 0 0.92  0 0 0 0 0.83  0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23m)'/><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
  mix-blend-mode: overlay; opacity: 0.7;
}
/* keep content above textures */
.nav, header, section, footer, .tweaks, .ticker { position: relative; z-index: 1; }

/* ============================================================
   TICKER — polyglot rail under nav (NYSE-style, words not stocks)
   ============================================================ */
/* nav is now ~36px scribble — ticker can sit at top, but keep room */
/* nav stack ~36px tall on the left; ticker rail begins after the brand mark */
.hero { scroll-margin-top: 88px; }
.ticker {
  /* Hidden on the noon.bio homepage — the ceremonial identity reads
     stronger without the live-telemetry rail competing for attention.
     The motif belongs to the future Noon Bio app surface, not the
     install-conversion site. */
  display: none;
}
.ticker__label {
  flex-shrink: 0;
  padding: 0 14px;
  height: 100%;
  display: flex; align-items: center; gap: 8px;
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--brass);
  border-right: 1px solid var(--rule);
  z-index: 2; position: relative;
}
.ticker__label .dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--ember);
  box-shadow: 0 0 8px var(--ember);
  animation: tk-pulse 2s ease-in-out infinite;
}
@keyframes tk-pulse { 50% { opacity: 0.35; } }
.ticker__rail {
  flex: 1; overflow: hidden; position: relative;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
          mask-image: linear-gradient(90deg, transparent, #000 4%, #000 96%, transparent);
}
.ticker__track {
  display: flex; gap: 38px;
  white-space: nowrap;
  animation: tk-scroll 220s linear infinite;
  width: max-content;
  padding-left: 38px;
}
@keyframes tk-scroll { to { transform: translateX(-50%); } }
.ticker__item {
  display: inline-flex; align-items: baseline; gap: 9px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--paper-2);
}
.ticker__item .lang  { color: var(--paper-4); font-size: 9px; letter-spacing: 0.2em; }
.ticker__item .term  { color: var(--paper); font-weight: 500; }
.ticker__item .gloss {
  color: var(--paper-3); font-family: var(--serif);
  font-size: 12px; letter-spacing: 0; text-transform: none; font-style: italic;
}
.ticker__item .delta { font-family: var(--mono); font-size: 9px; letter-spacing: 0.12em; }
.ticker__item .delta.up   { color: var(--moss); }
.ticker__item .delta.down { color: var(--blood); }
.ticker__item .sep   { color: var(--paper-4); opacity: 0.5; }

/* ============================================================
   NAV — v15.2: brand-mark + lowercase wordmark + subtitle stack.
   Still in the top-left corner, still subtle, but now anchored
   in the official identity rather than a pen-scribble.
   ============================================================ */
.nav {
  /* Aligned to the same centering basis as the hero content below
     (body content width, scrollbar excluded) so the brand sits on
     the exact same vertical axis as the H1, lead, and form. */
  position: absolute; top: 36px; left: 0; right: 0; z-index: 50;
  display: flex; align-items: center; justify-content: center;
  pointer-events: none;
}
.nav > * { pointer-events: auto; }
.nav__brand {
  /* Canonical Noon mark — ring + dot, wordmark, brass rule,
     RESOURCE INTELLIGENCE caps, Water Land & Culture italic, brass rule.
     Matches /assets/noon-mark.svg and the brand sheet. */
  display: inline-flex; flex-direction: column; align-items: center;
  gap: 10px;
  text-decoration: none;
  opacity: 0.98;
  transition: opacity 180ms;
  text-align: center;
}
.nav__brand:hover { opacity: 1; }
.nav__glyph {
  width: 58px; height: 58px;
  display: block;
  overflow: visible;
  margin-bottom: 10px;
}
.nav__mark {
  width: 72px; height: 72px;
  flex-shrink: 0;
  display: block;
  overflow: visible;
  align-self: center;
}
.nav__word {
  font-family: var(--serif); font-weight: 500;
  font-size: 38px; letter-spacing: -0.014em;
  color: var(--paper);
  line-height: 1;
  margin-top: -2px;
}
.nav__rule {
  display: block;
  width: 52px; height: 1px;
  background: var(--brass);
  opacity: 0.70;
  margin: 2px 0;
}
.nav__tagline {
  font-family: var(--mono); font-weight: 500;
  font-size: 11px; letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--paper-2);
  line-height: 1;
}
.nav__tagline i { font-style: italic; }
.nav__sub {
  font-family: var(--serif); font-weight: 400; font-style: italic;
  font-size: 16px; letter-spacing: 0.005em;
  color: var(--paper-2);
  line-height: 1;
}
.nav__sub i { font-style: italic; }
/* Legacy class kept hidden in case any cached HTML still ships it */
.nav__pbc { display: none; }
@media (max-width: 720px) {
  .nav { top: 28px; }
  .nav__glyph { width: 48px; height: 48px; }
  .nav__word { font-size: 28px; }
  .nav__rule { width: 40px; }
  .nav__tagline { font-size: 10px; letter-spacing: 0.24em; }
  .nav__sub { font-size: 13px; }
}
.nav__sub {
  display: flex; flex-direction: column; gap: 1px;
  margin-left: 4px; padding-left: 11px;
  border-left: 1px solid var(--rule-2);
  line-height: 1.2;
}
.nav__sub-cat {
  font-family: var(--serif); font-weight: 400;
  font-size: 11px; letter-spacing: 0.02em;
  color: var(--turq-2);
  font-style: italic;
}
.nav__sub-pbc {
  font-family: var(--mono); font-weight: 500;
  font-size: 8px; letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--brass);
  opacity: 0.85;
}

/* old nav fragments are gone */
.nav__links, .nav__cta, .nav__glyphs { display: none; }

/* ============================================================
   HERO — toroidal energy field centered, type orbits it
   ============================================================ */
/* ============================================================
   HERO — v15.5: SPLIT LAYOUT
   Copy lives on the left half, torus lives on the right half.
   Each gets its own breathing room — no more stacking.
   On narrow viewports, copy stacks above the torus.
   ============================================================ */
.hero {
  /* Cinematic band (2026-07 Dorian): was a full-screen 100vh cathedral with
     240px of top padding. Now a letterboxed strip — capped height, tighter
     padding — so the work below shows sooner and the video reads like film.
     min-height is a floor, so the funnel content (form + dashboard) still fits
     and the section grows if a viewport needs it. */
  min-height: clamp(420px, 55vh, 580px);
  padding: 120px var(--gutter) 26px;   /* tight foot: the instrument band ends where the work begins */
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}
@media (max-width: 960px) {
  .hero { padding: 158px var(--gutter) 72px; min-height: auto; justify-content: center; }
}
@media (max-width: 720px) {
  .hero { padding: 138px var(--gutter) 60px; }
}

/* HERO BACKDROP — the concrete lotus, heavily duotoned into the page palette
   so it reads as atmosphere, not stock imagery. */
.hero__backdrop {
  position: fixed; inset: 0; z-index: 0; pointer-events: none;   /* persistent underlay: the ceremony dissolves onto it */
  overflow: hidden;
  background: var(--bg-deep);
}
.hero__backdrop .bg-photo,
.hero__backdrop video.bg-photo {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: 50% 50%;   /* formwork flight: pedestal holds frame-center through the descent */
  /* Inline blurred placeholder (LQIP, ~0.5KB base64) so the hero shows a soft
     lotus from the first paint instead of an empty black void while the video
     buffers on a cold/slow connection. The poster (preloaded) then the video
     paint over it. The filter below darkens this to match. */
  background: #0F0F0E url("data:image/jpeg;base64,/9j//gAQTGF2YzYyLjI4LjEwMQD/2wBDAAgUFBcUFxsbGxsbGyAeICEhISAgICAhISEkJCQqKiokJCQhISQkKCgqKi4vLisrKisvLzIyMjw8OTlGRkhWVmf/xABwAAADAQEBAAAAAAAAAAAAAAAFBgMHBAEBAAMBAAAAAAAAAAAAAAAAAAIBAwAQAAECAwYEBAcBAQAAAAAAAAECEQMAMSEEURITsYFxkSJhQaE0BTMUcoJjMkLhEQEBAQAAAAAAAAAAAAAAAAAAARH/wAARCAAWACgDASIAAhEAAxEA/9oADAMBAAIRAxEAPwBPupX9RkNC582xl4CELWrJAsJJzLKggl6JYOedJUxBzMoqEJ1BBJJ7Qf8AXHpOmDMEKyLCSAyVG3wsFHaZDpfvupoL1IQcs4QSWwLMDvKQiGiIkqYMGB5mk6xDUthnUVK81YzmQu0SKpbM5WqlD3eFjYS6AO0gJnpjw9ZfLvcmHfaRRL2cbJKaH6R1/wCTLDCrvCEUqhKtCzvvPSYyrpDSjJDUElntew4WeVlZpc/cDmJ4b9T8zOWG47/EISCAIUNP9JBLq4tTGSyIIu8NDAU9KDpI25e1VzG0sUX5aPtG8sISSEsS/DBg+8+a0LCJ1EziU4HZMhZFn//Z") center/cover no-repeat;
  /* Backdrop lotus is alive but holds back — the brass-burning cutout text
     is the dramatic moment. Backdrop sits at a confident reading darkness
     while petals and water stay readable. */
  filter: contrast(1.04) brightness(0.72) saturate(0.92);
  opacity: 0.92;
  /* Static zoom (rasterized once) + translate-only drift = GPU-composited and
     smooth. The old scale-varying ken-burns re-rastered the filtered video
     every frame — that's what made playback stutter. */
  transform: scale(1.0) translateZ(0);
  backface-visibility: hidden;
  animation: lotus-drift 44s ease-in-out infinite alternate;
  transform-origin: 52% 48%;
  will-change: transform;
}
@media (prefers-reduced-motion: reduce) {
  .hero__backdrop video.bg-photo,
  .hero__backdrop .bg-photo { animation: none; }
  .hero__backdrop::after { display: none; }
}
@keyframes lotus-drift {
  0%   { transform: scale(1.0) translate3d(-0.8%, 0.5%, 0); }
  100% { transform: scale(1.0) translate3d(0.8%, -0.6%, 0); }
}
@keyframes backdrop-drift {
  from { transform: scale(1.02) translate(-0.6%, 0); }
  to   { transform: scale(1.06) translate(0.6%, -0.4%); }
}
.hero__backdrop::before {
  /* Lift over the lotus — the petals stay readable in the upper-center.
     Most of the darkening sits at the bottom band so the live-conditions
     strip + h1 row hold against the type. Center is luminous. */
  content: ''; position: absolute; inset: 0; z-index: 1;
  background:
    radial-gradient(ellipse 75% 60% at 50% 42%, rgba(15,15,14,0.0) 0%, rgba(15,15,14,0.25) 75%, rgba(15,15,14,0.55) 100%),
    linear-gradient(180deg,
      rgba(15,15,14,0.20) 0%,
      rgba(15,15,14,0.05) 35%,
      rgba(15,15,14,0.55) 80%,
      var(--bg-deep) 100%);
}
.hero__backdrop::after {
  /* cedar haze — soft turbulence wash */
  content: ''; position: absolute; inset: 0; z-index: 2;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='1200' height='800'><filter id='s'><feTurbulence type='fractalNoise' baseFrequency='0.012' numOctaves='2' seed='4'/><feColorMatrix values='0 0 0 0 0.85  0 0 0 0 0.75  0 0 0 0 0.55  0 0 0 0.10 0'/></filter><rect width='100%25' height='100%25' filter='url(%23s)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.32;
  /* static — no drift; an animated screen-blend over a playing video forces a
     full-screen re-composite every frame. The video's own motion is enough. */
}
@keyframes smoke-drift {
  from { transform: translate(-1.2%, 0) scale(1.0); }
  to   { transform: translate(1.2%, -0.4%) scale(1.025); }
}

/* warm LED firefly motes — quail-light hint */
.hero__leds { position: absolute; inset: 0; z-index: 1; pointer-events: none; }
.hero__leds span {
  position: absolute; width: 4px; height: 4px; border-radius: 50%;
  background: radial-gradient(circle, #F2B85A 0%, rgba(242,184,90,0.4) 50%, transparent 100%);
  box-shadow: 0 0 8px rgba(242,184,90,0.45), 0 0 14px rgba(224,116,53,0.22);
  opacity: 0.85;
  animation: led-pulse 4.5s ease-in-out infinite;
}
@keyframes led-pulse {
  0%, 100% { opacity: 0.4; transform: scale(0.85); }
  50%      { opacity: 1.0; transform: scale(1.15); }
}

/* sacred geometry watermark removed in v15 — let the torus breathe */
.hero__sacred { display: none; }

/* Torus relocated to thesis section as the central visual companion
   to Dorian's quote. Sits to the right of the text, low z-index so the
   quote reads as the subject and the diagram as the evidence behind it. */
.thesis__torus {
  position: absolute;
  top: 50%; right: -6%;
  transform: translateY(-50%);
  width: clamp(380px, 42vw, 620px);
  height: clamp(380px, 42vw, 620px);
  z-index: 0;
  pointer-events: none;
  opacity: 0.9;
}
@media (max-width: 900px) {
  .thesis__torus {
    position: relative;
    top: auto; right: auto;
    transform: none;
    width: min(86vw, 460px);
    height: min(86vw, 460px);
    margin: 48px auto 0;
    opacity: 1;
  }
}

/* THE MEASURE — the living mark as the hero's centered instrument (2026-07
   Dorian), sitting in the flex flow between the address form and the live
   dashboard. The ::before radial WELL warms + darkens the lotus video locally
   so the arcs read cleanly; z-index 1 within the z-6 .hero__inner keeps it
   behind nothing that matters (it is pointer-events:none throughout).
   NOTE: the old .hero__horizon 'water lake' band is NOT in the current markup;
   its CSS below is dormant until that composition is deliberately reinstated. */
.lm2 .hero__mark{ margin: 26px auto 0; width: clamp(280px, 32vw, 384px); }   /* the featured instrument, centered in the measure */
/* SANCTUM HERO — the mark is the screen; the person is the center */
/* v11 BREATHABLE: subtraction inside the mark, stillness behind it, rhythm around it */
.hero--sanctum .hm-ticks{display:none;}                          /* the bezel was noise at this scale */
.hero--sanctum .hm-halo[r="56"]{display:none;}                   /* one halo is a whisper; two are furniture */
.hero--sanctum .hm-ping{animation-duration:7s;}                  /* sonar breathes, doesn't blink */
.hero--sanctum .hero__leds{display:none;}                        /* stillness */
.hero--sanctum .hero__scroll{display:none;}
.hero--sanctum .hero__backdrop video.bg-photo{filter:contrast(1.03) brightness(0.55) saturate(0.85);}
.hero--sanctum .hero__mark::before{inset:-110%;background:radial-gradient(circle at 50% 50%, rgba(10,9,8,0.88) 0%, rgba(10,9,8,0.5) 44%, transparent 72%);filter:blur(18px);}
.hero--sanctum .hero__mark::after{opacity:.22;}
.hero--sanctum .hm-you span{font-size:clamp(10px,2.4vmin,13px);letter-spacing:.3em;color:var(--paper-2,#DCD4BD);}
.hm-you::after{content:'';position:absolute;inset:16%;border:1px solid rgba(216,115,77,0);border-radius:50%;transition:border-color .35s;}
.hm-you:hover::after,.hm-you:focus-visible::after{border-color:rgba(216,115,77,.4);}
.hero--sanctum .hm-readout{bottom:-6%;}
.hero--sanctum .hm-legend{gap:8px 26px;margin-top:34px;opacity:.85;}
.hero--sanctum .hm-key{font-size:9.5px;color:var(--paper-4,#6B6657);}
.hero--sanctum .hm-key:hover,.hero--sanctum .hm-key.is-on,.hero--sanctum .hm-key.is-amb{color:var(--paper,#F2EBD9);}
.hero--sanctum .hero__h1{font-size:clamp(19px,2.1vw,26px);color:var(--paper-2,#DCD4BD);}
.hero--sanctum .hero__mark{width:min(52vh,460px);}
.hero--sanctum .hero__addr{max-width:520px;}
.hero--sanctum .hero__addr-box{padding:10px 10px 10px 18px;}
.hero--sanctum .hero__addr-submit{font-size:14.5px;padding:0 20px;}
.hero--sanctum .hero__addr-foot{opacity:.8;}
.hero--sanctum{min-height:100vh;}
.hero--sanctum .hero__column{align-items:center;max-width:none;margin:0 auto;}
.hero--sanctum .hero__h1{font-size:clamp(24px,2.8vw,34px);text-align:center;margin:0 auto;}
.hero--sanctum .hero__inner{gap:clamp(12px,2vh,22px)!important;text-align:center;}
.hero--sanctum .hero__mark{width:min(58vh,520px);max-width:88vw;margin:6px auto 0;}
.hero--sanctum .hero__addr{max-width:600px;width:100%;margin:12px auto 0;align-self:center!important;}
.hm-you{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:24%;aspect-ratio:1;border-radius:50%;pointer-events:auto;display:flex;align-items:center;justify-content:center;text-decoration:none;}
.hm-you span{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:clamp(8.5px,2vmin,11px);font-weight:500;letter-spacing:.26em;text-transform:uppercase;color:var(--brass,#B89968);transform:translateY(2.7em);transition:color .25s;}
.hm-you:hover span,.hm-you:focus-visible span{color:var(--paper,#F2EBD9);}
.hm-you:focus-visible{outline:2px solid var(--ember,#E97E2D);outline-offset:4px;}
.hm-sound{position:absolute;right:clamp(16px,3vw,40px);bottom:clamp(14px,3vh,28px);z-index:7;display:none;align-items:center;gap:8px;background:rgba(10,10,9,.55);border:1px solid rgba(184,153,104,.28);border-radius:99px;padding:8px 15px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-3,#A8A08B);cursor:pointer;}
.hm-sound.is-avail{display:inline-flex;}
.hm-sound.is-on{color:var(--paper,#F2EBD9);border-color:rgba(216,115,77,.5);}
.lm2 .hm-legend{ margin-top: 48px; }   /* clearance scales with the featured mark (readout hangs -8% below it) */
.hero__mark{
  align-self: center;
  position: relative;
  width: clamp(228px, 26vw, 308px); aspect-ratio: 1;
  margin-top: -6px;
  z-index: 1; pointer-events: none;
  opacity: 0; animation: hm-rise 1.4s cubic-bezier(0.4,0,0.15,1) 0.3s forwards;
}
.hero__mark::before{
  content: ''; position: absolute; inset: -66%; z-index: -1; border-radius: 50%;
  background:
    radial-gradient(circle at 50% 48%, rgba(216,115,80,0.20) 0%, rgba(196,110,58,0.06) 34%, transparent 62%),
    radial-gradient(circle at 50% 50%, rgba(24,17,11,0.42) 0%, rgba(24,17,11,0.16) 46%, transparent 74%);
  filter: blur(12px);
  opacity: calc(0.45 + 0.55 * var(--hm-glow, 0.3));
}
.hero__mark::after{
  /* oil tooth: static canvas grain over the instrument - patina, not gloss */
  content: ''; position: absolute; inset: -6%; border-radius: 50%; pointer-events: none; z-index: 2;
  background-image:
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='t'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' seed='11'/><feColorMatrix values='0 0 0 0 0.55  0 0 0 0 0.44  0 0 0 0 0.30  0 0 0 0.6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='c'><feTurbulence type='fractalNoise' baseFrequency='0.035' numOctaves='3' seed='4'/><feColorMatrix values='0 0 0 0 0.52  0 0 0 0 0.48  0 0 0 0 0.40  0 0 0 0.4 0'/></filter><rect width='100%25' height='100%25' filter='url(%23c)'/></svg>");
  mix-blend-mode: overlay; opacity: 0.34;
  -webkit-mask-image: radial-gradient(circle, #000 58%, transparent 80%);
          mask-image: radial-gradient(circle, #000 58%, transparent 80%);
}
.hero__mark svg{
  width: 100%; height: 100%; display: block; overflow: visible;
  /* NO filter at all: even a static drop-shadow re-rasters at 60Hz while the
     heartbeat r-animation runs. Separation comes from the well ::before. */
  transition: transform .18s ease;
}
.hm-base{ fill: none; stroke: rgba(233,214,180,0.09); stroke-width: 12; }
.hm-arc{ fill: none; stroke-width: 3; stroke-linecap: round; }   /* engraved hairlines, not paint */   /* NO per-arc filter/transition: per-frame dasharray+opacity writes must stay raster-free */
.hm-thresh{ fill: none; stroke: rgba(233,214,180,0.18); stroke-width: 1; }
/* instrument bezel: 1px dashes on a wide stroke = radial hairline ticks */
.hm-ticks{ fill: none; stroke: rgba(233,214,180,0.13); stroke-width: 7; stroke-dasharray: 1 9.47; }
.hm-tip{ opacity: 0; }   /* needle tips: driven per-frame, plain fills, no filters */
.hm-heartring{ fill: none; stroke: #EE7B53; stroke-width: 1.4; opacity: 0.85; }
.hm-sonar{ opacity: var(--hm-son, 0.4); }
.hm-ping{ fill: none; stroke: #B98A6F; stroke-width: 1.2; transform-box: view-box; transform-origin: 150px 150px; animation: hm-sonar 5.2s ease-out infinite; }
.hm-halo{ fill: none; stroke: #D87350; }
.hm-heart{ fill: #D8734D; animation: hm-beat 3.8s ease-in-out infinite; }   /* matte fresco terracotta - the bloom circle carries the warmth */
.hm-readout{ position: absolute; left: 50%; transform: translateX(-50%); bottom: -8%; width: max-content; max-width: 92vw; text-align: center; pointer-events: none; }
.hm-stage{ font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 12px; font-weight: 500; letter-spacing: 0.17em; text-transform: uppercase; color: var(--paper-2, #DCD4BD); opacity: 0.92; transition: color .5s ease, opacity .13s ease; }
/* THE FIVE SYSTEMS legend — the meter's intel layer. Quiet mono chips; the color
   dot is the key. Hover/tap surges that arc and the readout speaks its line. */
.hm-legend{ align-self: center; display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; margin-top: 16px; z-index: 2; position: relative; }
.hm-key{ display: inline-flex; align-items: center; gap: 8px; padding: 6px 11px; border: 1px solid transparent; border-radius: 99px; background: transparent; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 10px; font-weight: 500; letter-spacing: 0.14em; text-transform: uppercase; color: var(--paper-3, #A8A08B); cursor: pointer; transition: border-color .25s, color .25s, background .25s; }
.hm-key__dot{ width: 8px; height: 8px; border-radius: 50%; background: var(--kc); flex: 0 0 auto; }   /* matte pigment dot - lime doesn't glow */
.hm-key:hover, .hm-key.is-on{ border-color: var(--kc); color: var(--paper, #F2EBD9); background: rgba(10,10,9,0.55); }
.hm-key.is-amb{ border-color: var(--kc); color: var(--paper, #F2EBD9); }   /* lights as its system introduces itself */
.hm-key:focus-visible{ outline: 2px solid var(--kc); outline-offset: 2px; }
@media (max-width: 560px){ .hm-legend{ gap: 5px 7px; } .hm-key{ padding: 6px 10px; font-size: 9px; letter-spacing: 0.12em; } }
@media (max-width: 430px){ .hm-legend{ max-width: 300px; } }   /* balanced 3+2 wrap, no orphan */
@media (max-height: 840px){ .hero__mark{ width: clamp(196px, 25vh, 264px); } }   /* presence wins on laptops; relief stays partial */   /* fold relief: the funnel's dashboard stays reachable */
.hm-sr{ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
@keyframes hm-beat{ 0%,100%{ r: 4.5px; } 50%{ r: 5.8px; } }
@keyframes hm-sonar{ 0%{ r: 16px; opacity: 0.6; } 72%{ opacity: 0; } 100%{ r: 76px; opacity: 0; } }
@keyframes hm-rise{ from{ opacity: 0; transform: translateY(12px) scale(0.94); } to{ opacity: 1; transform: none; } }
/* AFTERGLOW — the hero->work seam blend. Sits AFTER .hero in the flow because
   .hero{overflow:hidden} kills any glow that tries to escape it. Straddles the
   boundary from outside: half reaches up over the hero's last pixels, half
   washes down onto the section label below. */
.hero-afterglow{ position: relative; height: 0; z-index: 0; pointer-events: none; }   /* UNDER the header (z1): its dark upper half was veiling the legend + readout */
.hero-afterglow::before{
  /* Not a blob. Full-bleed warmth pooling DOWN from the hero — a soft ember
     bloom anchored at the top of the band sinking into warm-dark ground.
     Alphas stay whisper-low: more and orange-on-near-black turns to mud. */
  content: ''; position: absolute; left: 0; right: 0; top: -150px; height: 380px;
  /* The step was luminance: hero bottom is near-black, section is warm leather.
     Lightening both sides kept the delta. Instead the hero's darkness POOLS
     down over the leather like a shadow and releases — invisible on the dark
     side, easing the section up to meet it — with the ember bloom on top. */
  background:
    radial-gradient(120% 70% at 50% 12%, rgba(238,123,83,0.09) 0%, rgba(233,126,45,0.035) 45%, transparent 70%),
    linear-gradient(180deg,
      rgba(15,15,14,0.72) 0%,
      rgba(15,15,14,0.70) 42%,
      rgba(15,15,14,0.38) 62%,
      rgba(15,15,14,0) 90%);
}
.hero-afterglow::after{
  /* fine ember grain over the blend — kills the banding that makes dark
     gradients read cheap; same turbulence idiom as the rest of the site */
  content: ''; position: absolute; left: 0; right: 0; top: -150px; height: 380px;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' seed='8'/><feColorMatrix values='0 0 0 0 0.93  0 0 0 0 0.63  0 0 0 0 0.38  0 0 0 0.55 0'/></filter><rect width='100%25' height='100%25' filter='url(%23g)'/></svg>");
  mix-blend-mode: screen; opacity: 0.045;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 35%, #000 62%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 35%, #000 62%, transparent 100%);
}
@media (prefers-reduced-motion: reduce){
  .hm-heart{ animation: none; } .hm-ping{ animation: none; opacity: 0; }
  .hm-arms{ animation: none !important; } .well .hero__mark::after{ display: none !important; }
  .hero__mark{ animation: none; opacity: 1; }
}

/* HORIZON BAND — v15.2: a soft teal/blue water lake at the bottom of
   the hero so the torus reads as a sun setting over an ecology, not a
   floating object. Reflects the bead/companion as a faint shimmer. */
.hero__horizon {
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 38vh; min-height: 280px;
  z-index: 2; pointer-events: none;
  /* layered: deep water gradient + reflection wash + atmospheric haze */
  background:
    /* sun reflection on water (vertical streak under torus) */
    radial-gradient(ellipse 18% 70% at 50% 0%,
      rgba(233,126,45,0.32) 0%,
      rgba(233,126,45,0.18) 25%,
      rgba(233,126,45,0.06) 55%,
      transparent 80%),
    /* horizon haze line */
    linear-gradient(180deg,
      rgba(92,124,130,0.0) 0%,
      rgba(92,124,130,0.18) 6%,
      rgba(79,115,120,0.42) 14%,
      rgba(48,72,80,0.72) 38%,
      rgba(24,42,50,0.88) 70%,
      rgba(15,26,32,0.95) 100%);
}
.hero__horizon::before {
  /* water ripples — horizontal hairlines that get denser toward the bottom */
  content: ''; position: absolute; inset: 0;
  background-image: repeating-linear-gradient(0deg,
    rgba(180,210,215,0.045) 0px,
    rgba(180,210,215,0.045) 1px,
    transparent 1px,
    transparent 4px);
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 30%, #000 100%);
  opacity: 0.7;
  /* slow drift like a breeze on the lake */
  animation: water-drift 32s linear infinite;
}
@keyframes water-drift {
  to { background-position: 0 -8px; }
}
.hero__horizon::after {
  /* turbulence-based water shimmer */
  content: ''; position: absolute; inset: 0;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='800' height='400'><filter id='w'><feTurbulence type='fractalNoise' baseFrequency='0.012 0.04' numOctaves='2' seed='5'/><feColorMatrix values='0 0 0 0 0.36  0 0 0 0 0.49  0 0 0 0 0.51  0 0 0 0.35 0'/></filter><rect width='100%25' height='100%25' filter='url(%23w)'/></svg>");
  mix-blend-mode: screen;
  opacity: 0.55;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 40%, #000 100%);
          mask-image: linear-gradient(180deg, transparent 0%, #000 40%, #000 100%);
}

/* faint shore reeds silhouette — cattails / grasses at the very bottom */
.hero__reeds {
  position: absolute; left: 0; right: 0; bottom: 0;
  height: 90px; z-index: 3; pointer-events: none;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 90' preserveAspectRatio='none'><g stroke='%23090f12' stroke-width='1' fill='none' stroke-linecap='round'><path d='M40 90 L42 30'/><path d='M48 90 L46 38'/><path d='M58 90 L60 22'/><path d='M68 90 L66 32'/><path d='M120 90 L122 28'/><path d='M128 90 L126 36'/><path d='M138 90 L140 18'/><path d='M148 90 L146 30'/><path d='M210 90 L212 32'/><path d='M218 90 L216 24'/><path d='M226 90 L228 38'/><path d='M310 90 L312 22'/><path d='M318 90 L316 30'/><path d='M408 90 L410 28'/><path d='M416 90 L414 36'/><path d='M424 90 L426 20'/><path d='M510 90 L512 32'/><path d='M518 90 L516 24'/><path d='M610 90 L612 26'/><path d='M618 90 L616 34'/><path d='M626 90 L628 18'/><path d='M716 90 L718 30'/><path d='M724 90 L722 22'/><path d='M810 90 L812 28'/><path d='M818 90 L816 36'/><path d='M826 90 L828 20'/><path d='M918 90 L920 32'/><path d='M1010 90 L1012 26'/><path d='M1018 90 L1016 34'/><path d='M1110 90 L1112 22'/><path d='M1118 90 L1116 30'/></g><g fill='%23090f12'><ellipse cx='42' cy='28' rx='1.6' ry='4'/><ellipse cx='60' cy='20' rx='1.6' ry='4'/><ellipse cx='140' cy='16' rx='1.8' ry='5'/><ellipse cx='312' cy='20' rx='1.6' ry='4.2'/><ellipse cx='426' cy='18' rx='1.6' ry='4'/><ellipse cx='628' cy='16' rx='1.6' ry='4.5'/><ellipse cx='828' cy='18' rx='1.6' ry='4.2'/><ellipse cx='1112' cy='20' rx='1.6' ry='4'/></g></svg>");
  background-size: 100% 100%; background-repeat: no-repeat;
  opacity: 0.85;
}

/* radial vignette to ground the type — v15.2: lighter at bottom now
   that the horizon band carries the bottom edge */
.hero::after {
  content: ''; position: absolute; inset: 0; z-index: 4; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 50% 44%, transparent 0%, rgba(26,26,26,0.4) 70%, rgba(26,26,26,0.7) 100%),
    linear-gradient(180deg, rgba(26,26,26,0.5) 0%, transparent 18%, transparent 60%);
}

.hero__inner {
  /* Editorial composition — left-anchored manifesto. Bands breathe enough
     to read as distinct zones but connect as one composition. Title →
     who/where → action → live data, with measured rhythm not yawning gaps. */
  position: relative; z-index: 6;
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  text-align: left;
  display: flex; flex-direction: column; align-items: stretch;
  gap: clamp(40px, 6vh, 72px);
}
.hero__column {
  display: flex; flex-direction: column; align-items: flex-start;
  max-width: 56ch;
  margin-left: clamp(0px, 2.5vw, 36px);
}
.hero__cta-row {
  display: flex; flex-direction: row; align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: clamp(20px, 4vw, 64px);
  flex-wrap: wrap;
  padding: 0 clamp(0px, 2.5vw, 36px);
}
.hero__cta-row .hero__cta-primary { margin-right: auto; }
.hero__cta-row .hero__cta-secondary { margin-left: auto; }
@media (max-width: 720px) {
  .hero__inner { text-align: center; align-items: center; gap: clamp(40px, 7vh, 72px); }
  .hero__column { max-width: 100%; align-items: center; margin-left: 0; }
  .hero__cta-row { justify-content: center; flex-direction: column; gap: 22px; padding: 0; }
  .hero__cta-row .hero__cta-primary,
  .hero__cta-row .hero__cta-secondary { margin: 0; }
}

.hero__eyebrow {
  font-family: var(--mono);
  font-size: 11px; letter-spacing: 0.32em;
  text-transform: uppercase; color: var(--brass);
  display: inline-flex; align-items: center; gap: 18px;
  text-wrap: balance;
}
.hero__eyebrow::before, .hero__eyebrow::after {
  content: ''; display: inline-block;
  width: 44px; height: 1px; background: var(--brass); opacity: 0.7;
  flex-shrink: 0;
}
/* eyebrow flanked by thin brass rules on both sides — matches the
   invoice-page ceremonial tagline treatment for the premium read. */

/* HERO H1 — Be Here Now register: three words, big, declarative, periodic.
   Left-anchored within the manifesto column so the composition has an axis.
   Measured breath below — enough to let the punch land, not so much that
   it loses connection to the whisper. */
.hero__h1 {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(64px, 11vw, 168px);
  line-height: 0.94; letter-spacing: -0.034em;
  color: var(--paper); text-wrap: balance;
  max-width: 14ch;
  margin: 0 0 clamp(24px, 3.5vh, 44px);
}

/* ============================================================
   v19 — SERVICE-CLEAR HERO BLOCK
   The brutally clear "what does this company do" answer that
   fires before the poetic lotus cutout. Kicker chip + h1 + sub.
   High contrast. Paper-bright. Mobile-first sizing.
   ============================================================ */
.hero__kick-chip {
  display: inline-flex; align-items: center; gap: 14px;
  margin-bottom: 22px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass);
}
.hero__kick-chip__rule {
  display: inline-block;
  width: 36px; height: 1px;
  background: var(--brass);
  opacity: 0.70;
}
/* PHILOSOPHICAL LINE — italic manifesto line sitting under the lotus h1.
   The bridge between the poetic h1 ("Read your resource.") and the clear
   service sentence below. Paper-bright, italic, large. */
.hero__lede-philo {
  font-family: var(--serif); font-weight: 400; font-style: italic;
  font-size: clamp(22px, 2.5vw, 32px);
  line-height: 1.25; letter-spacing: -0.012em;
  color: var(--paper);
  text-wrap: balance;
  max-width: 28ch;
  margin: 0 0 clamp(18px, 2.5vh, 28px);
}
.hero__lede-philo em {
  font-style: italic; color: var(--ember); font-weight: 400;
}

/* SERVICE-CLEAR LINE — the brutal clarity sentence. Tells a cold visitor
   in 3 seconds what Noon actually does. Paper-2, upright, scannable. */
.hero__lede-service {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(16px, 1.45vw, 20px);
  line-height: 1.6; letter-spacing: -0.003em;
  color: var(--paper-2);
  max-width: 56ch;
  margin: 0 0 clamp(28px, 4vh, 44px);
  text-wrap: pretty;
}
.hero__lede-service strong {
  font-weight: 500; color: var(--paper); font-style: normal;
}
.hero__lede-service em {
  font-style: italic; color: var(--paper);
}

/* CUT-OUT TYPE — the lotus video plays bright INSIDE the letterforms.
   The dark backdrop video continues to play in the rest of the hero.
   Type and medium become the same thing. */
.hero__h1--cutout {
  position: relative;
  display: block;
  width: 100%;
  max-width: clamp(480px, 74vw, 960px);
  aspect-ratio: 1240 / 560;
  overflow: visible;
  background: transparent;
  font-size: 0;
  letter-spacing: 0;
  color: transparent;
  text-wrap: initial;
  /* Brass halo — the visible text-shaped masked-video projects an outward
     golden glow into the surrounding lotus. The letters RADIATE. */
  filter: drop-shadow(0 0 34px rgba(232, 158, 64, 0.42))
          drop-shadow(0 0 12px rgba(184, 153, 104, 0.58));
}
@keyframes brass-shimmer {
  0%, 100% {
    filter: brightness(1.88) saturate(2.05) contrast(1.26) sepia(0.55) hue-rotate(-18deg);
  }
  50% {
    filter: brightness(2.15) saturate(2.25) contrast(1.34) sepia(0.68) hue-rotate(-23deg);
  }
}
.hero__h1-vid {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: 50% 50%;
  /* Molten brass — pushed hard. The lotus inside the letters reads as
     burning gold, not "warmer lotus." Shimmer animation cycles the filter
     so brass catches different angles of light over time, like real
     metal under shifting sunlight. */
  animation: brass-shimmer 9s ease-in-out infinite;
  pointer-events: none;
  z-index: 0;
  /* Clip to text shape via inline SVG mask. Where the text is, video shows.
     Everywhere else, transparent — the backdrop lotus is what you see.
     viewBox widened to 1240 so full text fits without clipping at right. */
  -webkit-mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1240 560'><text x='0' y='240' font-family='Fraunces, Georgia, serif' font-weight='500' font-size='280' letter-spacing='-9' fill='white'>Read your</text><text x='0' y='520' font-family='Fraunces, Georgia, serif' font-weight='500' font-size='280' letter-spacing='-9' fill='white'>resource.</text></svg>");
          mask-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1240 560'><text x='0' y='240' font-family='Fraunces, Georgia, serif' font-weight='500' font-size='280' letter-spacing='-9' fill='white'>Read your</text><text x='0' y='520' font-family='Fraunces, Georgia, serif' font-weight='500' font-size='280' letter-spacing='-9' fill='white'>resource.</text></svg>");
  -webkit-mask-size: 100% 100%;
          mask-size: 100% 100%;
  -webkit-mask-repeat: no-repeat;
          mask-repeat: no-repeat;
  -webkit-mask-position: center center;
          mask-position: center center;
}
.hero__h1-cut {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
  z-index: 1;
}
@media (prefers-reduced-motion: reduce) {
  .hero__h1-vid {
    animation: none;
    filter: brightness(1.88) saturate(2.05) contrast(1.26) sepia(0.55) hue-rotate(-18deg);
  }
}
.hero__h1 em {
  font-style: italic; font-weight: 400;
  color: #E97E2D;
  white-space: nowrap;
}
.hero__h1 em .ch { color: #E97E2D; }
.hero__lead {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(17px, 1.4vw, 21px); line-height: 1.55;
  color: var(--paper-2); max-width: 56ch; text-wrap: pretty;
  margin: 0 auto;
}
/* Whisper variant — sub-lines under the punch, journal-masthead register.
   Each line carries its own role: manifesto (the verb triplet, italic emphasis)
   and tagline (the descriptive descent, upright reading register).
   Both anchored to the same left edge by a brass hairline rule. */
.hero__lead--whisper {
  font-family: var(--serif); font-weight: 400;
  line-height: 1.5; letter-spacing: 0.005em;
  color: var(--paper-2);
  max-width: 52ch;
  margin: 0;
  display: flex; align-items: center; gap: 18px;
}
.hero__lead--whisper::before {
  content: ''; display: inline-block;
  width: 36px; height: 1px;
  background: var(--brass); opacity: 0.55;
  flex: 0 0 36px;
}
/* Manifesto — italic, brighter, slightly larger. Carries the three verbs. */
.hero__lead--manifesto {
  font-style: italic;
  font-size: clamp(18px, 1.45vw, 23px);
  color: var(--paper);
  letter-spacing: 0.005em;
  margin-bottom: 10px;
}
/* Tagline — upright, dimmer, descriptive. Sits below the manifesto. */
.hero__lead--tagline {
  font-style: normal;
  font-size: clamp(15px, 1.15vw, 18px);
  color: var(--paper-3);
  letter-spacing: 0.01em;
}
.hero__lead--tagline::before { opacity: 0.32; }

/* SIGNATURE — anchors the hero tagline with a brass ornament
   so the line doesn't float in dead space between the h1 and the CTA row.
   Diamond + flanking hairlines = inscription mark, not floating prose. */
.hero__signature {
  margin: 14px auto 0;
  max-width: 620px;
  display: flex; flex-direction: column;
  align-items: center;
  gap: 14px;
}
.hero__signature__mark {
  display: flex; align-items: center; gap: 14px;
}
.hero__signature__rule {
  display: inline-block;
  width: 56px; height: 1px;
  background: var(--brass); opacity: 0.55;
}
.hero__signature__diamond {
  display: inline-block;
  width: 5px; height: 5px;
  background: var(--brass);
  transform: rotate(45deg);
  opacity: 0.75;
}
.hero__signature__line {
  font-family: var(--serif);
  font-weight: 400;
  font-style: italic;
  font-size: clamp(16px, 1.25vw, 20px);
  line-height: 1.6;
  letter-spacing: 0.005em;
  color: var(--paper-2);
  text-align: center;
  max-width: 58ch;
  margin: 0;
}
.hero__signature__line .pin {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 0.62em;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--brass);
  vertical-align: 0.18em;
  margin-right: 10px;
  padding-right: 12px;
  border-right: 1px solid rgba(184,153,104,0.34);
}
.hero__signature__line em {
  font-style: italic;
  color: var(--paper);
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 1px;
}
@media (max-width: 720px) {
  .hero__signature__rule { width: 44px; }
  .hero__signature__line .pin { display: block; margin: 0 0 8px; padding: 0 0 8px; border-right: 0; border-bottom: 1px solid rgba(184,153,104,0.34); }
}
@media (max-width: 720px) {
  .hero__lead--whisper { justify-content: center; max-width: 100%; }
  .hero__lead--whisper::before { display: none; }
}
.hero__lead em {
  font-style: italic; color: var(--paper);
  border-bottom: 1px solid var(--rule-2);
  padding-bottom: 1px;
}
.hero__lead .moss { color: var(--moss); font-style: italic; }

/* ============================================================
   v18.2: LIVE STRIP — current SA conditions as the subhead.
   Four tiles: temp, RH, J-17 well level, wind. Skeleton until
   the public APIs (NWS + USGS) resolve. The fluff line that
   used to sit here read like marketing; this reads like a
   working dashboard, which is what Noon is.
   ============================================================ */
/* ============================================================
   v20 — HERO ADDRESS INPUT
   Sasaki/Atreides-inscribed: brass crosshair brackets + Fraunces
   italic input + ember submit button. Sits between the hero CTAs
   and the dashboard. When focused, glows ember. On submit, routes
   to /assess/ with the address pre-filled.
   When Google Places is loaded, autocomplete + dashboard morph fire.
   ============================================================ */
.hero__addr {
  max-width: 760px;
  margin: clamp(20px, 3vh, 32px) auto 0;
  display: flex; flex-direction: column;
  gap: 10px;
}
.hero__addr-box {
  position: relative;
  display: grid;
  /* FOUR flow children (icon / input / pin / submit). The old 3-track template
     shoved the submit into an implicit column that overflowed the pill on
     phones — no tappable "Read my land" on mobile. minmax(0,1fr) lets the
     input shrink below its ~180px intrinsic width so everything fits inside. */
  grid-template-columns: auto minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 14px 14px 22px;
  background: rgba(15,15,14,0.74);
  border: 1px solid rgba(184,153,104,0.52);
  transition: border-color 280ms ease, background 280ms ease;
  backdrop-filter: blur(6px);
  -webkit-backdrop-filter: blur(6px);
}
/* Brass corner brackets at all 4 corners */
.hero__addr-box::before,
.hero__addr-box::after {
  content: '';
  position: absolute;
  width: 12px; height: 12px;
  pointer-events: none;
  background:
    linear-gradient(to right,  var(--brass,#B89968), var(--brass,#B89968)) left top / 12px 1px no-repeat,
    linear-gradient(to bottom, var(--brass,#B89968), var(--brass,#B89968)) left top / 1px 12px no-repeat;
  opacity: 0.85;
}
.hero__addr-box::before { top: 0; left: 0; }
.hero__addr-box::after  { top: 0; right: 0; transform: scaleX(-1); }
.hero__addr-box .corner-bl,
.hero__addr-box .corner-br {
  position: absolute;
  width: 12px; height: 12px;
  pointer-events: none;
  background:
    linear-gradient(to right,  var(--brass,#B89968), var(--brass,#B89968)) left bottom / 12px 1px no-repeat,
    linear-gradient(to bottom, var(--brass,#B89968), var(--brass,#B89968)) left bottom / 1px 12px no-repeat;
  opacity: 0.85;
}
.hero__addr-box .corner-bl { bottom: 0; left: 0; }
.hero__addr-box .corner-br { bottom: 0; right: 0;
  background:
    linear-gradient(to right,  var(--brass,#B89968), var(--brass,#B89968)) right bottom / 12px 1px no-repeat,
    linear-gradient(to bottom, var(--brass,#B89968), var(--brass,#B89968)) right bottom / 1px 12px no-repeat;
}

.hero__addr-box:focus-within {
  border-color: var(--ember, #E97E2D);
  background: rgba(232, 126, 45, 0.04);
}
.hero__addr-box:focus-within::before,
.hero__addr-box:focus-within::after,
.hero__addr-box:focus-within .corner-bl,
.hero__addr-box:focus-within .corner-br {
  filter: none;
}
/* Pulsating border — draws the eye to the address bar so it doesn't need extra copy.
   Stops once engaged; respects reduced-motion. */
@keyframes heroAddrPulse {
  0%, 100% { border-color: rgba(184,153,104,0.34); box-shadow: 0 0 0 0 rgba(232,126,45,0); }
  50%      { border-color: rgba(232,126,45,0.62); }
}
@media (prefers-reduced-motion: no-preference) {
  .hero__addr-box { animation: heroAddrPulse 3.4s ease-in-out infinite; }
}
.hero__addr-box:focus-within { animation: none; }
.hero__addr-icon {
  width: 26px; height: 26px;
  color: var(--brass, #B89968);
  flex-shrink: 0;
  transition: color 240ms ease, transform 800ms cubic-bezier(0.22,1,0.36,1);
}
.hero__addr-box:focus-within .hero__addr-icon {
  color: var(--ember, #E97E2D);
  transform: rotate(60deg);
}
.hero__addr-input {
  appearance: none; -webkit-appearance: none;
  background: transparent;
  border: 0;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(16px, 1.4vw, 19px);   /* 16px floor: below it iOS zooms the whole ceremony */
  line-height: 1.4;
  color: var(--paper, #F2EBD9);
  letter-spacing: -0.005em;
  outline: none;
  min-width: 0;   /* grid item: shrink inside the track, never push the submit out */
  padding: 6px 0;
  caret-color: var(--ember, #E97E2D);
}
.hero__addr-input::placeholder {
  color: rgba(232, 235, 217, 0.62);
  font-style: italic;
}
.hero__addr-submit {
  appearance: none; -webkit-appearance: none;
  background: var(--ember, #E97E2D);
  border: 0;
  cursor: pointer;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: 15.5px;
  color: #1a1106;
  align-self: stretch;
  position: relative; z-index: 1;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  white-space: nowrap;
  padding: 0 26px;
  margin: -14px -14px -14px 0;
  border-radius: 0 999px 999px 0;
  transition: background 240ms ease, box-shadow 240ms ease;
  flex-shrink: 0;
}
.hero__addr-submit:hover { background: #F49350; }   /* --ember-2 is dark rust — hover must LIFT */
.hero__addr-submit .rule {
  display: none;
  width: 18px; height: 1px;
  background: var(--brass, #B89968);
  opacity: 0.65;
  transition: width 240ms ease, background 240ms ease;
}
.hero__addr-submit:hover .rule { width: 24px; background: var(--ember, #E97E2D); }
.hero__addr-submit .arr {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 0.9em;
  color: #1a1106;
  transition: transform 240ms ease;
}
.hero__addr-submit:hover .arr { transform: translateX(3px); }
@media (max-width: 560px) {
  .hero__addr-submit .lbl { display: none; }
}

.hero__addr-foot {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between;
  gap: 10px 24px;
  padding: 0 4px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--paper-3, #A8A08B);
}
.hero__addr-foot em {
  color: var(--brass, #B89968);
  font-style: normal;
}
.hero__addr-foot__recency {
  display: inline-flex; align-items: center; gap: 8px;
}
.hero__addr-foot__recency::before {
  content: '';
  display: inline-block;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--moss, #6F8559);
  box-shadow: 0 0 5px var(--moss, #6F8559);
}

/* MORPH STATE — when address selected, the dashboard shifts visual emphasis */
.hero__dashboard.is-parcel-mode .hero__dash-head {
  background: linear-gradient(to right, rgba(232,126,45,0.10), rgba(232,126,45,0.02) 80%);
}
.hero__dashboard.is-parcel-mode .hero__dash-head__lbl {
  color: var(--ember, #E97E2D);
}
.hero__dashboard.is-parcel-mode .hero__dash-head__lbl .dot {
  background: var(--ember, #E97E2D);
  box-shadow: 0 0 10px rgba(232,126,45,0.85);
}
.hero__dashboard.is-parcel-mode .live-tile {
  transition: background 600ms ease;
}
.hero__dashboard.is-morphing .live-tile {
  opacity: 0.4;
  transition: opacity 220ms ease;
}

/* ============================================================
   v20.2 — INTERACTIVE READING CARD
   The bioswale-field-note-style proof artifact that takes over
   the dashboard when an address is entered. Editorial register,
   click-to-build interaction, in-place form submit.
   ============================================================ */
.hero__dashboard.is-reading-mode {
  background: transparent;
  border-color: rgba(184,153,104,0.34);
}
.hero__reading {
  padding: clamp(20px, 3vh, 32px) clamp(22px, 4vw, 36px) clamp(28px, 4vh, 40px);
  display: flex; flex-direction: column;
  gap: clamp(20px, 3vh, 28px);
  background:
    radial-gradient(ellipse 80% 50% at 50% 0%, rgba(232,126,45,0.05) 0%, transparent 65%),
    rgba(15,15,14,0.62);
  animation: hr-rise 480ms cubic-bezier(0.22,1,0.36,1) both;
}
@keyframes hr-rise { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: translateY(0); } }
.hero__reading__head {
  display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between;
  gap: 10px 20px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(184,153,104,0.22);
}
.hero__reading__loc {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-style: italic;
  font-size: clamp(15px, 1.4vw, 19px);
  line-height: 1.15;
  color: var(--paper, #F2EBD9);
  display: inline-flex; align-items: center; gap: 10px;
  letter-spacing: -0.010em;
}
.hero__reading__loc .dot {
  display: inline-block; width: 7px; height: 7px; border-radius: 50%;
  background: var(--ember, #E97E2D);
  box-shadow: 0 0 8px rgba(232,126,45,0.75);
  animation: hr-dot 2.4s ease-in-out infinite;
}
@keyframes hr-dot { 0%,100% { opacity: 0.85; } 50% { opacity: 1.0; box-shadow: 0 0 12px rgba(232,126,45,0.95); } }
.hero__reading__type {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--brass, #B89968);
}

/* PROOF artifact (active story container) */
.hero__reading__proof {
  margin: 0;
  padding: 22px 26px;
  background: rgba(184,153,104,0.04);
  border: 1px solid rgba(184,153,104,0.22);
  border-left: 3px solid var(--brass, #B89968);
  transition: background 280ms ease, border-color 280ms ease;
}
.hero__reading__proof.is-swapped {
  background: rgba(232,126,45,0.06);
  border-left-color: var(--ember, #E97E2D);
}
.hero__reading__proof-lbl {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass, #B89968);
  margin-bottom: 16px;
}

/* v20.3 — STORY BLOCK
   The editorial card: glyph + lede + photo + observation + proposal. */
.hero__reading__story-row {
  display: grid;
  grid-template-columns: 56px 1fr;
  gap: 18px;
  align-items: start;
  margin-bottom: 14px;
}
.hero__reading__glyph {
  width: 56px; height: 56px;
  flex-shrink: 0;
  animation: hr-rise 360ms cubic-bezier(0.22,1,0.36,1) both;
}
.hero__reading__glyph svg { width: 100%; height: 100%; display: block; }
.hero__reading__copy { min-width: 0; }
.hero__reading__lede {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: clamp(17px, 1.7vw, 22px);
  line-height: 1.3;
  letter-spacing: -0.014em;
  color: var(--paper, #F2EBD9);
  text-wrap: pretty;
  margin-bottom: 8px;
}
.hero__reading__site {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--brass, #B89968);
}
.hero__reading__img-wrap {
  margin: 16px 0 18px;
  aspect-ratio: 16 / 9;
  background: var(--bg-2, #161616);
  border: 1px solid rgba(184,153,104,0.22);
  overflow: hidden;
  position: relative;
}
.hero__reading__img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
  filter: contrast(1.06) saturate(0.78) sepia(0.20) brightness(0.96) hue-rotate(-6deg);
  animation: hr-rise 460ms cubic-bezier(0.22,1,0.36,1) both;
}
.hero__reading__obs {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 15.5px;
  line-height: 1.7;
  color: var(--paper-2, #DCD4BD);
  margin: 0 0 18px;
  text-wrap: pretty;
}
.hero__reading__proposal-h {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass, #B89968);
  margin-bottom: 10px;
}
.hero__reading__proposal {
  list-style: none; margin: 0 0 14px; padding: 0;
  display: flex; flex-direction: column; gap: 8px;
}
.hero__reading__proposal li {
  font-family: 'Fraunces', Georgia, serif;
  font-size: 15px; line-height: 1.55;
  color: var(--paper, #F2EBD9);
  display: flex; align-items: flex-start; gap: 12px;
}
.hero__reading__proposal li .rule {
  display: inline-block;
  width: 14px; height: 1px;
  background: var(--ember, #E97E2D);
  margin-top: 11px;
  flex-shrink: 0;
}
.hero__reading__cite {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--paper-3, #A8A08B);
  padding-top: 10px;
  border-top: 1px solid rgba(184,153,104,0.22);
}
.hero__reading__cap {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 13.5px; line-height: 1.55;
  color: var(--paper-3, #A8A08B);
  margin-top: 14px;
  padding-left: 14px;
  border-left: 1px solid rgba(184,153,104,0.34);
  max-width: 60ch;
}
.hero__reading__cap em { color: var(--ember, #E97E2D); font-style: normal; font-weight: 500; }
.hero__reading__cap .src {
  display: block;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal; font-size: 9px;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--brass, #B89968);
  margin-top: 6px;
}

/* PARCEL DATA STRIP */
.hero__reading__data {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 0;
  border-top: 1px solid rgba(184,153,104,0.22);
  border-bottom: 1px solid rgba(184,153,104,0.22);
}
@media (max-width: 820px) { .hero__reading__data { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .hero__reading__data { grid-template-columns: repeat(2, 1fr); } }
.hero__reading__data .d {
  padding: 10px 14px;
  border-right: 1px solid rgba(184,153,104,0.14);
  display: flex; flex-direction: column; gap: 4px;
}
.hero__reading__data .d:last-child { border-right: 0; }
.hero__reading__data .lbl {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--paper-3, #A8A08B);
}
.hero__reading__data .val {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 14px; line-height: 1.2;
  color: var(--paper, #F2EBD9);
  letter-spacing: -0.005em;
}

/* BUILD prompt + chips */
.hero__reading__build-h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(18px, 1.8vw, 24px);
  line-height: 1.18;
  color: var(--paper, #F2EBD9);
  letter-spacing: -0.014em;
  margin-bottom: 6px;
  text-wrap: balance;
}
.hero__reading__build-h em { font-style: italic; color: var(--ember, #E97E2D); font-weight: 400; }
.hero__reading__build-sub {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 13.5px; line-height: 1.5;
  color: var(--paper-2, #DCD4BD);
  margin-bottom: 18px;
}
.hero__reading__build-sub em { color: var(--paper, #F2EBD9); }
.hero__reading__chips {
  display: flex; flex-wrap: wrap; gap: 8px;
  transition: outline 240ms ease;
}
.rc-chip {
  appearance: none; -webkit-appearance: none;
  background: rgba(184,153,104,0.04);
  border: 1px solid rgba(184,153,104,0.34);
  color: var(--paper-2, #DCD4BD);
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 14px; line-height: 1.2;
  padding: 8px 14px;
  cursor: pointer;
  border-radius: 0;
  transition: border-color 220ms ease, color 220ms ease, background 220ms ease, transform 220ms ease;
}
.rc-chip:hover { border-color: var(--brass, #B89968); color: var(--paper, #F2EBD9); }
.rc-chip.is-on {
  border-color: var(--ember, #E97E2D);
  background: rgba(232,126,45,0.10);
  color: var(--paper, #F2EBD9);
  box-shadow: inset 0 0 0 1px rgba(232,126,45,0.40);
}
.rc-chip.is-on::before { content: '✓ '; color: var(--ember, #E97E2D); font-style: normal; font-weight: 500; margin-right: 4px; }

/* SPEC running list */
.hero__reading__spec {
  padding: 16px 20px;
  background: rgba(232,126,45,0.04);
  border-left: 2px solid var(--ember, #E97E2D);
  animation: hr-rise 360ms cubic-bezier(0.22,1,0.36,1) both;
}
.hero__reading__spec-lbl {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--ember, #E97E2D);
  margin-bottom: 10px;
}
.hero__reading__spec-list {
  list-style: none; margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 4px;
}
.hero__reading__spec-list li {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 15px; line-height: 1.45;
  color: var(--paper, #F2EBD9);
  display: flex; align-items: center; gap: 12px;
}
.hero__reading__spec-list li .rule {
  display: inline-block; width: 14px; height: 1px;
  background: var(--ember, #E97E2D);
  opacity: 0.65;
  flex-shrink: 0;
}

/* FORM */
.hero__reading__form {
  display: flex; flex-direction: column; gap: 12px;
  padding-top: 8px;
}
.hero__reading__fields {
  display: grid; grid-template-columns: 1fr 1fr; gap: 10px;
}
@media (max-width: 540px) { .hero__reading__fields { grid-template-columns: 1fr; } }
.hero__reading__input {
  appearance: none; -webkit-appearance: none;
  background: rgba(15,15,14,0.55);
  border: 1px solid rgba(184,153,104,0.34);
  color: var(--paper, #F2EBD9);
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 15px;
  padding: 12px 16px;
  outline: none;
  border-radius: 0;
  transition: border-color 200ms ease, background 200ms ease;
}
.hero__reading__input:focus { border-color: var(--ember, #E97E2D); background: rgba(232,126,45,0.04); }
.hero__reading__input::placeholder { color: var(--paper-4, #6B6657); }
.hero__reading__submit {
  appearance: none; -webkit-appearance: none;
  background: transparent;
  border: 1px solid rgba(184,153,104,0.34);
  color: var(--paper-3, #A8A08B);
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 500;
  font-size: 16px;
  padding: 14px 22px;
  cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  gap: 14px;
  transition: background 220ms ease, color 220ms ease, border-color 220ms ease, gap 220ms ease;
  border-radius: 0;
}
.hero__reading__submit .rule {
  display: inline-block; width: 18px; height: 1px;
  background: currentColor;
  opacity: 0.55;
}
.hero__reading__submit .arr {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 0.85em;
  color: currentColor;
}
.hero__reading__submit.is-ready {
  background: var(--ember, #E97E2D);
  border-color: var(--ember, #E97E2D);
  color: var(--bg-deep, #0F0F0E);
}
.hero__reading__submit.is-ready:hover { background: #F49350; gap: 18px; }
.hero__reading__small {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--paper-3, #A8A08B);
  text-align: center;
}
.hero__reading__small em { color: var(--brass, #B89968); font-style: normal; }

/* CLOSE button */
.hero__reading__close {
  appearance: none; -webkit-appearance: none;
  background: transparent;
  border: 0;
  color: var(--paper-3, #A8A08B);
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  cursor: pointer;
  padding: 6px 4px;
  display: inline-flex; align-items: center; gap: 10px;
  align-self: flex-start;
  transition: color 200ms ease, gap 200ms ease;
}
.hero__reading__close:hover { color: var(--paper, #F2EBD9); gap: 14px; }
.hero__reading__close .rule {
  display: inline-block; width: 16px; height: 1px;
  background: var(--brass, #B89968);
  opacity: 0.55;
}

/* v19.2 — DASHBOARD WRAPPER
   Wraps the live-strip + new header bar + new CTA tile into one panel. */
.hero__dashboard {
  max-width: 880px;
  margin: 28px auto 0;
  border: 1px solid rgba(184,153,104,0.22);
  background: rgba(15,15,14,0.45);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  overflow: hidden;
}
.hero__dash-head {
  display: flex; align-items: center; gap: 16px;
  padding: 12px 18px 10px;
  border-bottom: 1px solid rgba(184,153,104,0.22);
  background: linear-gradient(to right, rgba(232,126,45,0.05), transparent 80%);
}
.hero__dash-head__lbl {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass, #B89968);
  flex-shrink: 0;
  padding-right: 14px;
  border-right: 1px solid rgba(184,153,104,0.22);
}
.hero__dash-head__lbl .dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--ember, #E97E2D);
  box-shadow: 0 0 6px rgba(232,126,45,0.55);
  animation: dash-pulse 3s ease-in-out infinite;
}
@keyframes dash-pulse {
  0%, 100% { opacity: 0.85; box-shadow: 0 0 6px rgba(232,126,45,0.55); }
  50%      { opacity: 1.0;  box-shadow: 0 0 10px rgba(232,126,45,0.75); }
}
.hero__dash-head__syn {
  flex: 1; min-width: 0;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: clamp(13px, 1.2vw, 16px);
  line-height: 1.4;
  color: var(--paper-2, #DCD4BD);
  margin: 0;
  text-wrap: pretty;
}
.hero__dash-head__syn em {
  font-style: italic;
  color: var(--paper, #F2EBD9);
  font-weight: 500;
}
@media (max-width: 700px) {
  .hero__dash-head { flex-direction: column; align-items: flex-start; gap: 6px; }
  .hero__dash-head__lbl { padding-right: 0; border-right: 0; }
}

.hero__live {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0;
}
@media (max-width: 700px) {
  .hero__live { grid-template-columns: repeat(2, 1fr); }
}

/* CTA TILE — the 8th cell. Ember-tinted, reads as a deliberate "your turn." */
.live-tile--cta {
  position: relative;
  display: flex; flex-direction: column;
  gap: 6px;
  padding: 18px 20px 16px;
  background: linear-gradient(135deg, rgba(232,126,45,0.10), rgba(232,126,45,0.04));
  text-decoration: none;
  color: var(--paper, #F2EBD9);
  transition: background 280ms ease;
}
.live-tile--cta:hover { background: linear-gradient(135deg, rgba(232,126,45,0.18), rgba(232,126,45,0.08)); }
.live-tile--cta .live-tile__label { color: var(--ember, #E97E2D); }
.live-tile__cta-h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(18px, 1.8vw, 22px);
  line-height: 1.15;
  letter-spacing: -0.014em;
  color: var(--paper, #F2EBD9);
  margin: 2px 0 4px;
}
.live-tile__cta-h em {
  font-style: italic; color: var(--ember, #E97E2D); font-weight: 400;
}
.live-tile__cta-sub {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 12.5px;
  line-height: 1.4;
  color: var(--paper-2, #DCD4BD);
  margin-bottom: auto;
}
.live-tile__cta-arr {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--paper, #F2EBD9);
  margin-top: 10px;
  transition: gap 240ms ease;
}
.live-tile--cta:hover .live-tile__cta-arr { gap: 12px; }
.live-tile__cta-arr .rule {
  display: inline-block;
  width: 16px; height: 1px;
  background: var(--ember, #E97E2D);
  transition: width 240ms ease;
}
.live-tile--cta:hover .live-tile__cta-arr .rule { width: 22px; }
.live-tile__cta-arr .arr {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 12px;
  color: var(--ember, #E97E2D);
}
.live-tile {
  padding: 18px 20px 16px;
  text-align: left;
  border-right: 1px solid rgba(184,153,104,0.14);
  position: relative;
  overflow: hidden;
}
.live-tile:last-child { border-right: 0; }
@media (max-width: 700px) {
  .live-tile:nth-child(2) { border-right: 0; }
  .live-tile:nth-child(1), .live-tile:nth-child(2) {
    border-bottom: 1px solid rgba(184,153,104,0.14);
  }
}
.live-tile__label {
  font-family: var(--mono);
  font-size: 9px; font-weight: 500;
  letter-spacing: 0.26em;
  text-transform: uppercase;
  color: var(--paper-3);
  margin-bottom: 10px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.live-tile__val {
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-weight: 500;
  font-size: clamp(38px, 4.4vw, 54px);
  line-height: 0.95;
  letter-spacing: -0.022em;
  color: var(--paper);
  margin-bottom: 8px;
  font-variant-numeric: tabular-nums;
  display: flex; align-items: baseline; gap: 2px;
}
.live-tile__val.is-up    { color: var(--ember); }
.live-tile__val.is-down  { color: var(--turq);  }
/* Unit superscript anchored to the number — reads as a real instrument */
.live-tile__val .live-sm {
  font-family: var(--mono); font-weight: 500;
  font-size: 0.32em; letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--brass);
  padding-left: 5px; transform: translateY(-0.55em);
  display: inline-block;
}
.live-tile__skel {
  color: rgba(236,228,210,0.22);
  letter-spacing: 0.18em;
}
.live-tile__unit {
  font-family: var(--mono);
  font-size: 9px; font-weight: 500;
  letter-spacing: 0.20em;
  text-transform: uppercase;
  color: var(--paper-4);
  line-height: 1.2;
}
/* Interpretive context line — italic Fraunces, the "reading" of the raw
   metric above. Reads as editorial annotation on a scientific instrument. */
.live-tile__ctx {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 11.5px;
  line-height: 1.35;
  color: var(--paper-2);
  margin-top: 4px;
  letter-spacing: 0.002em;
  text-wrap: pretty;
}
.live-tile__ctx em {
  font-style: normal;
  color: var(--brass);
  font-family: var(--mono);
  font-size: 9px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  padding-right: 6px;
}
/* Text-style value — for plant + water tiles where the answer is words,
   not a number. Reads as a short editorial answer. */
.live-tile__val--text {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-style: italic;
  font-size: clamp(15px, 1.5vw, 19px);
  line-height: 1.25;
  letter-spacing: -0.008em;
  color: var(--paper);
  display: block;
  font-variant-numeric: normal;
  max-width: 22ch;
  text-wrap: balance;
}
.live-tile__val--text em {
  font-style: normal;
  color: var(--ember);
}
/* Sun arc — mini SVG arc inside the Sun tile.
   Shows sunrise→noon→sunset path with the current sun as an ember dot. */
.live-tile__val--arc {
  display: flex;
  align-items: flex-end;
  gap: 12px;
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(28px, 3.4vw, 40px);
  line-height: 0.95;
  letter-spacing: -0.022em;
  color: var(--paper);
  font-variant-numeric: tabular-nums;
  margin-bottom: 6px;
}
.live-sun-arc {
  width: 96px; height: 48px;
  flex-shrink: 0;
  overflow: visible;
}
.live-sun-arc__path {
  fill: none;
  stroke: var(--brass);
  stroke-width: 1.2;
  opacity: 0.50;
  stroke-dasharray: 2 3;
}
.live-sun-arc__rise,
.live-sun-arc__set {
  fill: var(--brass);
  opacity: 0.65;
}
.live-sun-arc__dot {
  fill: var(--ember);
  filter: drop-shadow(0 0 6px rgba(232,126,45,0.55));
  transition: cx 800ms ease, cy 800ms ease;
}
.live-sun-arc__dot.is-down {
  fill: var(--paper-4);
  filter: none;
  opacity: 0.5;
}
.live-tile__val--arc .live-tile__elnum {
  display: inline-flex;
  align-items: baseline;
  gap: 2px;
}
/* Multi-line list value — used by EDIBLES tile (plant / forage / harvest) */
.live-tile__list { list-style: none; margin: 0 0 6px; padding: 0; display: flex; flex-direction: column; gap: 5px; }
.live-tile__list li {
  display: grid;
  grid-template-columns: 58px 1fr;
  align-items: baseline; gap: 10px;
}
.live-tile__list .k {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--brass);
}
.live-tile__list .v {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 14.5px; line-height: 1.2;
  color: var(--paper);
  letter-spacing: -0.004em;
}
.live-tile__list .v .em { font-style: normal; color: var(--ember); }
/* Inline UV-A · UV-B chip — sits next to the sun arc */
.live-sun-health {
  display: inline-flex; align-items: baseline; gap: 8px;
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(20px, 2.4vw, 28px);
  line-height: 0.95; letter-spacing: -0.018em;
  color: var(--paper);
}
.live-sun-health .lbl {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-weight: 500;
  font-size: 9.5px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--brass);
  align-self: center;
}
.live-sun-health .sep {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 0.55em; color: var(--brass);
  opacity: 0.55;
}
/* SYNTHESIS LINE — the editorial pull-through from the 4 tiles to the
   property-reading CTA. Italic Fraunces observation on the left, brass-
   hairline CTA on the right. Reads as a research conclusion + invitation. */
.hero__live-synth {
  max-width: 880px;
  margin: 18px auto 0;
  padding: 14px 4px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 28px;
  flex-wrap: wrap;
}
.hero__live-synth__obs {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(13px, 1.1vw, 16px);
  line-height: 1.55;
  color: var(--paper-2);
  flex: 1 1 360px;
  max-width: 62ch;
  text-wrap: pretty;
  margin: 0;
}
.hero__live-synth__obs .syn-lbl {
  display: inline-block;
  font-family: var(--mono);
  font-style: normal;
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--brass);
  margin-right: 12px;
}
.hero__live-synth__obs .syn-text { color: var(--paper-2); }
.hero__live-synth__obs .syn-text em {
  font-style: italic;
  color: var(--paper);
}
.hero__live-synth__cta {
  display: inline-flex;
  align-items: center;
  gap: 14px;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: clamp(14px, 1.2vw, 18px);
  color: var(--paper);
  text-decoration: none;
  transition: gap 240ms ease, color 240ms ease;
  white-space: nowrap;
}
.hero__live-synth__cta .cta-rule {
  display: inline-block;
  width: 32px; height: 1px;
  background: var(--brass);
  opacity: 0.6;
  transition: width 240ms ease, opacity 240ms ease;
}
.hero__live-synth__cta:hover { color: var(--ember); gap: 18px; }
.hero__live-synth__cta:hover .cta-rule { width: 44px; opacity: 0.9; }
.hero__live-synth__cta .cta-arr {
  font-family: var(--mono);
  font-style: normal;
  font-size: 0.72em;
  color: var(--brass);
}
@media (max-width: 700px) {
  .hero__live-synth { flex-direction: column; align-items: flex-start; gap: 12px; }
}

/* Pulse-glow underline on the live strip — signals "this is live data" */
.hero__live::after {
  content: '';
  position: absolute;
  left: 0; right: 0; bottom: -1px;
  height: 1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(232,126,45,0.0) 10%,
    rgba(232,126,45,0.55) 50%,
    rgba(232,126,45,0.0) 90%,
    transparent 100%);
  transform-origin: center;
  animation: livePulse 4.2s ease-in-out infinite;
  pointer-events: none;
}
.hero__live {
  position: relative;
}
@keyframes livePulse {
  0%, 100% { opacity: 0.18; }
  50%      { opacity: 1.0;  }
}
@media (prefers-reduced-motion: reduce) {
  .hero__live::after { animation: none; opacity: 0.55; }
}

/* ============================================================
   v18.1: WATER FOUNTAIN — a teal column rises from below the
   torus and bleeds into the mint life-core. Makes the diagram
   literal: water (cool, bottom) → life (mint, center) → energy
   (warm, top). Sits behind the WebGL canvas; canvas is transparent.
   ============================================================ */
.hero__fountain {
  position: absolute;
  bottom: -6%; left: 50%;
  width: clamp(40px, 7vw, 90px);
  height: 78%;
  transform: translateX(-50%);
  z-index: 0;
  pointer-events: none;
  background: linear-gradient(180deg,
    rgba(159, 227, 180, 0.65) 0%,    /* mint at top — into core */
    rgba(127, 217, 160, 0.50) 22%,
    rgba(91, 168, 168, 0.55) 55%,    /* teal mid */
    rgba(79, 115, 120, 0.40) 80%,
    rgba(48, 72, 80, 0.0) 100%);     /* fade at bottom */
  filter: blur(10px);
  -webkit-mask-image: radial-gradient(ellipse 60% 100% at 50% 50%, #000 30%, rgba(0,0,0,0.7) 70%, transparent 100%);
          mask-image: radial-gradient(ellipse 60% 100% at 50% 50%, #000 30%, rgba(0,0,0,0.7) 70%, transparent 100%);
  animation: water-breath 5.5s ease-in-out infinite;
}
@keyframes water-breath {
  0%, 100% { opacity: 0.55; transform: translateX(-50%) scaleY(1); }
  50%      { opacity: 0.95; transform: translateX(-50%) scaleY(1.06); }
}
/* rising droplets — two phased dots that travel up the fountain */
.hero__fountain::before, .hero__fountain::after {
  content: ''; position: absolute;
  left: 50%; width: 6px; height: 6px; border-radius: 50%;
  background: radial-gradient(circle, #9FE3B4 0%, rgba(127,217,160,0.45) 55%, transparent 100%);
  box-shadow: 0 0 14px rgba(159, 227, 180, 0.75), 0 0 28px rgba(91, 168, 168, 0.4);
  animation: water-rise 3.6s ease-out infinite;
}
.hero__fountain::after { animation-delay: 1.8s; width: 4px; height: 4px; }
@keyframes water-rise {
  0%   { bottom: 5%;  opacity: 0;   transform: translate(-50%, 0); }
  15%  { opacity: 1; }
  85%  { opacity: 1; }
  100% { bottom: 92%; opacity: 0;   transform: translate(-50%, 0); }
}
@media (prefers-reduced-motion: reduce) {
  .hero__fountain, .hero__fountain::before, .hero__fountain::after { animation: none; }
}
.hero__ctas {
  display: flex; gap: 16px; flex-wrap: wrap; align-items: center;
}
.hero__cta {
  display: inline-flex; align-items: center; gap: 14px;
  padding: 18px 32px;
  font-family: var(--mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  border-radius: 999px;
  transition: gap 180ms var(--ease), background 180ms, color 180ms, border-color 180ms;
  border: 1px solid transparent;
}
.hero__cta--primary {
  background: var(--paper); color: var(--bg);
}
.hero__cta--primary:hover {
  gap: 22px; background: var(--ember); color: var(--paper);
}
.hero__cta--ghost {
  background: transparent; color: var(--paper);
  border-color: var(--rule-2);
}
.hero__cta--ghost:hover {
  gap: 22px; border-color: var(--paper); background: rgba(236,228,210,0.04);
}
.hero__cta svg { width: 14px; height: 14px; }

/* ============================================================
   HERO ECO-FORM — the tool IS the hero. Address → live readout.
   Sits as the primary CTA between lead and the secondary site-review link.
   ============================================================ */
.hero__ecoform {
  width: 100%; max-width: 560px;
  display: flex; flex-direction: column; gap: 10px;
  background: rgba(15,15,14,0.55);
  border: 1px solid var(--rule-2);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  padding: 18px 18px 14px;
}
.hero__ecorow {
  display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 8px;
}
@media (max-width: 540px) {
  .hero__ecorow { grid-template-columns: 1fr 1fr; }
  .hero__ecorow .hero__ecofield:nth-child(3) { grid-column: 1 / -1; }
}
.hero__ecofield {
  display: flex; flex-direction: column; gap: 6px;
  background: rgba(26,26,26,0.55);
  border: 1px solid var(--rule);
  padding: 12px 16px;
}
.hero__ecofield--addr { padding: 16px 20px; }
.hero__ecofield label {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
}
.hero__ecofield--addr label { font-size: 10px; letter-spacing: 0.26em; color: var(--brass); }
.hero__ecofield input {
  background: transparent; border: 0; outline: none;
  color: var(--paper); font-family: var(--serif); font-size: 17px;
  padding: 0; margin: 0; width: 100%;
}
.hero__ecofield--addr input { font-size: clamp(18px, 2vw, 22px); }
.hero__ecofield input::placeholder { color: var(--paper-4); font-style: italic; }
.hero__ecosubmit {
  margin-top: 4px;
  background: var(--paper); color: var(--bg);
  font-family: var(--mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  border: 0; cursor: pointer;
  padding: 16px 22px;
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  transition: gap 180ms var(--ease), background 180ms, color 180ms;
}
.hero__ecosubmit:hover:not(:disabled) { gap: 20px; background: var(--ember); color: var(--paper); }
.hero__ecosubmit:disabled { background: var(--paper-3); color: var(--bg); cursor: wait; }
.hero__ecosubmit svg { width: 14px; height: 14px; }
.hero__ecostatus {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  display: flex; align-items: center; gap: 10px;
  padding: 6px 4px 0;
  min-height: 18px;
}
.hero__ecostatus .dot {
  width: 5px; height: 5px; border-radius: 50%; background: var(--ember);
  box-shadow: 0 0 8px var(--ember); animation: tk-pulse 1.4s ease-in-out infinite;
}
.hero__ecostatus.err { color: var(--blood); }
.hero__ecostatus.err .dot { background: var(--blood); box-shadow: 0 0 8px var(--blood); animation: none; }

.hero__secondary {
  display: inline-flex; align-items: center; gap: 10px;
  margin-top: 8px;
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--paper-3); border-bottom: 1px solid var(--rule-2);
  padding-bottom: 2px; align-self: center;
  transition: color 180ms, border-color 180ms;
}
.hero__secondary:hover { color: var(--ember); border-color: var(--ember); }

.hero__competencies {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em;
  text-transform: uppercase; color: var(--paper-3);
  line-height: 1.7;
  width: 100%; max-width: 100%;
}
.hero__competencies .sep { color: var(--brass); opacity: 0.6; padding: 0 2px; }

.hero__stats {
  list-style: none; margin: 8px 0 0 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  gap: 0;
  width: 100%; max-width: 100%;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 720px) {
  .hero__stats { grid-template-columns: 1fr 1fr; }
}
.hero__stat {
  padding: 18px 18px 16px 0;
  border-left: 1px solid var(--rule);
  padding-left: 18px;
  display: flex; flex-direction: column; gap: 6px;
}
.hero__stat:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 720px) {
  .hero__stat:nth-child(odd) { border-left: 0; padding-left: 0; }
  .hero__stat:nth-child(n+3) { border-top: 1px solid var(--rule); padding-top: 16px; }
}
.hero__stat-num {
  font-family: var(--mono); font-weight: 500;
  font-size: clamp(26px, 2.8vw, 34px); line-height: 1;
  color: var(--paper); letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}
.hero__stat-lbl {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-3);
  line-height: 1.3;
}

.hero__availability {
  display: inline-flex; align-items: center; gap: 14px;
  flex-wrap: wrap;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-3);
  margin-top: 2px;
}
.hero__availability .dot {
  width: 7px; height: 7px; border-radius: 50%;
  background: var(--moss);
  box-shadow: 0 0 10px var(--moss);
  animation: status-pulse 1.8s ease-in-out infinite;
}
.hero__availability .ok { color: var(--moss); font-weight: 500; }
.hero__availability .sep { color: var(--paper-4); }
.hero__availability strong { color: var(--paper); font-weight: 500; }

/* hero meta — corners */
.hero__meta {
  position: absolute; z-index: 5; pointer-events: none;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-3);
}
.hero__meta--tl { top: 48px; left: var(--gutter); line-height: 1.6; }
.hero__meta--tr { top: 48px; right: var(--gutter); text-align: right; line-height: 1.6; }
.hero__meta--bl { bottom: 36px; left: var(--gutter); }
.hero__meta--br { bottom: 36px; right: var(--gutter); text-align: right; }
/* v18.4: TL meta visible alongside centered brand stack — corner stamps
   like the invoice page (NOON SYSTEMS · PBC left, coords right). */
@media (min-width: 961px) {
  .hero__meta--bl { left: var(--gutter); bottom: 28px; }
}
.hero__meta strong { color: var(--paper); font-weight: 500; }
.hero__meta .ja {
  font-family: var(--serif); font-weight: 500; letter-spacing: 0.05em;
  font-size: 14px; color: var(--brass); text-transform: none;
  display: block; margin-top: 4px;
}
.hero__meta .glyph {
  display: inline-block;
  width: 14px; height: 14px;
  vertical-align: -2px;
  margin-right: 6px;
  opacity: 0.85;
}

/* shared status-pulse keyframes (used by hero availability badge,
   scene metadata "Operating" indicator) */
@keyframes status-pulse {
  0%, 100% { opacity: 1; transform: scale(1); }
  50%      { opacity: 0.55; transform: scale(0.86); }
}

/* ============================================================
   WHY NOON — six practical reasons in a 3x2 grid.
   ============================================================ */
.why {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: var(--bg-2);
  border-bottom: 1px solid var(--rule);
}
.why__inner { max-width: var(--max); margin: 0 auto; }
.why__head { max-width: 760px; margin-bottom: 56px; }
.why__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.why__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.why__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
  text-wrap: balance;
}
.why__h em { font-style: italic; color: var(--ember); font-weight: 500; }
.why__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--rule);
}
@media (max-width: 900px) { .why__list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .why__list { grid-template-columns: 1fr; } }
.why__cell {
  padding: 32px clamp(18px, 2vw, 32px);
  border-left: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.why__cell:nth-child(3n+1) { border-left: 0; }
@media (max-width: 900px) {
  .why__cell { border-left: 1px solid var(--rule); }
  .why__cell:nth-child(3n+1) { border-left: 1px solid var(--rule); }
  .why__cell:nth-child(2n+1) { border-left: 0; }
}
@media (max-width: 560px) {
  .why__cell { border-left: 0 !important; }
}
.why__num {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 18px;
}
.why__t {
  font-family: var(--serif); font-weight: 500; font-size: 21px;
  line-height: 1.25; color: var(--paper); letter-spacing: -0.01em;
  margin-bottom: 10px; max-width: 28ch;
}
.why__d {
  font-family: var(--serif); font-size: 15px; line-height: 1.55;
  color: var(--paper-2); max-width: 34ch;
}

/* ============================================================
   ZONES — (deprecated, retained for any leftover references) Native
   script as the visual hook; Romanized below; country at bottom.
   Then a Survival Capabilities trio (water · energy · food) so
   the value proposition is literal, not aspirational.
   ============================================================ */
.zones {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: linear-gradient(180deg, var(--bg) 0%, var(--bg-2) 100%);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.zones__inner { max-width: var(--max); margin: 0 auto; }
.zones__head { max-width: 760px; margin-bottom: 48px; }
.zones__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.zones__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.zones__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
  text-wrap: balance;
}
.zones__h em { font-style: italic; color: var(--turq-2); font-weight: 500; }

.zones__list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 1100px) { .zones__list { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px)  { .zones__list { grid-template-columns: 1fr 1fr; } }
.zones__cell {
  padding: 32px clamp(14px, 1.6vw, 26px);
  display: flex; flex-direction: column; gap: 6px;
  border-left: 1px solid var(--rule);
  text-align: left;
}
.zones__cell:first-child { border-left: 0; }
@media (max-width: 1100px) {
  .zones__cell { border-left: 1px solid var(--rule); }
  .zones__cell:nth-child(3n+1) { border-left: 0; }
}
@media (max-width: 560px) {
  .zones__cell:nth-child(odd) { border-left: 0; }
  .zones__cell:nth-child(even) { border-left: 1px solid var(--rule); }
}
.zones__native {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(22px, 2.6vw, 34px); line-height: 1;
  color: var(--paper); letter-spacing: -0.015em;
}
.zones__lat {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-top: 8px;
}
.zones__sub {
  font-family: var(--serif); font-style: italic; font-size: 13px;
  color: var(--paper-3);
}
.zones__cell--sixth {
  background: rgba(92,124,130,0.10);
}
.zones__cell--sixth .zones__native { color: var(--turq); }
.zones__cell--sixth .zones__lat { color: var(--turq-2); }
.zones__cell--sixth .zones__sub em { color: var(--paper); font-style: italic; }
.zones__cell--sixth a { color: inherit; text-decoration: none; display: contents; }

.zones__trail {
  margin-top: 48px;
}
.zones__trail-kicker {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-4);
  margin-bottom: 22px;
}
.zones__trail-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 720px) {
  .zones__trail-grid { grid-template-columns: 1fr; }
}
.zones__trail-cell {
  padding: 28px clamp(18px, 2vw, 36px);
  display: flex; flex-direction: column; gap: 10px;
  border-left: 1px solid var(--rule);
}
.zones__trail-cell:first-child { border-left: 0; }
@media (max-width: 720px) {
  .zones__trail-cell { border-left: 0; border-top: 1px solid var(--rule); }
  .zones__trail-cell:first-child { border-top: 0; }
}
.zones__trail-cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--brass);
}
.zones__trail-h {
  font-family: var(--serif); font-weight: 500; font-size: clamp(22px, 2vw, 28px);
  line-height: 1.1; color: var(--paper); letter-spacing: -0.01em;
}
.zones__trail-h em { font-style: italic; color: var(--ember); font-weight: 500; }
.zones__trail-sub {
  font-family: var(--serif); font-size: 14px; line-height: 1.5;
  color: var(--paper-2); max-width: 36ch;
}

/* ============================================================
   MATERIALS & PALETTE — six atmospheric material studies.
   Stock photography (Unsplash) — used as aesthetic/material
   reference, NOT as project documentation.
   ============================================================ */
.mats {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: var(--bg);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.mats__inner { max-width: var(--max); margin: 0 auto; }
.mats__head { max-width: 760px; margin-bottom: 56px; }
.mats__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.mats__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.mats__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
  text-wrap: balance;
}
.mats__h em { font-style: italic; color: var(--ember); font-weight: 500; }
.mats__grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}
@media (max-width: 900px) { .mats__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .mats__grid { grid-template-columns: 1fr; } }
.mats__cell {
  margin: 0; padding: 0;
  display: flex; flex-direction: column; gap: 16px;
}
.mats__cell img {
  width: 100%; aspect-ratio: 4 / 3;
  object-fit: cover; display: block;
  filter: contrast(1.04) brightness(0.78) saturate(0.85);
  transition: transform 700ms var(--ease), filter 400ms;
}
.mats__cell:hover img {
  filter: contrast(1.06) brightness(0.86) saturate(0.92);
  transform: scale(1.015);
}
.mats__cell figcaption {
  display: flex; flex-direction: column; gap: 6px;
  padding: 0 4px;
}
.mats__name {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
}
.mats__d {
  font-family: var(--serif); font-size: 14px; line-height: 1.5;
  color: var(--paper-2); max-width: 36ch;
}

/* ============================================================
   PROCESS — four numbered steps, institutional feel.
   ============================================================ */
.proc {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: var(--bg);
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.proc__inner { max-width: var(--max); margin: 0 auto; }
.proc__head { max-width: 760px; margin-bottom: 56px; }
.proc__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.proc__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.proc__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
  text-wrap: balance;
}
.proc__h em { font-style: italic; color: var(--ember); font-weight: 500; }
.proc__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--rule);
}
@media (max-width: 1100px) { .proc__list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px)  { .proc__list { grid-template-columns: 1fr; } }
.proc__step {
  padding: 36px clamp(18px, 2vw, 30px);
  border-left: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  display: flex; flex-direction: column; gap: 14px;
}
.proc__step:nth-child(4n+1) { border-left: 0; }
@media (max-width: 1100px) {
  .proc__step:nth-child(4n+1) { border-left: 1px solid var(--rule); }
  .proc__step:nth-child(2n+1) { border-left: 0; }
}
@media (max-width: 560px) { .proc__step { border-left: 0 !important; } }
.proc__num {
  font-family: var(--mono); font-weight: 500;
  font-size: clamp(36px, 3.4vw, 52px); line-height: 1;
  color: var(--brass); letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}
.proc__t {
  font-family: var(--serif); font-weight: 500;
  font-size: 22px; line-height: 1.2;
  color: var(--paper); letter-spacing: -0.01em;
}
.proc__d {
  font-family: var(--serif); font-size: 15px; line-height: 1.6;
  color: var(--paper-2); max-width: 36ch;
}

/* ============================================================
   SERVICES — eight categories, simple grid, premium aesthetic.
   ============================================================ */
.svcs {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: var(--bg);
  border-bottom: 1px solid var(--rule);
}
.svcs__inner { max-width: var(--max); margin: 0 auto; }
.svcs__head { max-width: 760px; margin-bottom: 56px; }
.svcs__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.svcs__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.svcs__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
  text-wrap: balance;
}
.svcs__h em { font-style: italic; color: var(--ember); font-weight: 500; }
.svcs__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(4, 1fr);
  border-top: 1px solid var(--rule);
}
@media (max-width: 1100px) { .svcs__list { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px)  { .svcs__list { grid-template-columns: 1fr; } }
.svcs__cell {
  padding: 28px clamp(16px, 1.8vw, 28px);
  border-left: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  display: flex; flex-direction: column; gap: 10px;
}
.svcs__cell:nth-child(4n+1) { border-left: 0; }
@media (max-width: 1100px) {
  .svcs__cell:nth-child(4n+1) { border-left: 1px solid var(--rule); }
  .svcs__cell:nth-child(2n+1) { border-left: 0; }
}
@media (max-width: 560px) { .svcs__cell { border-left: 0 !important; } }
.svcs__no {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-4);
}
.svcs__name {
  font-family: var(--serif); font-weight: 500;
  font-size: 19px; line-height: 1.2;
  color: var(--paper); letter-spacing: -0.005em;
}
.svcs__d {
  font-family: var(--serif); font-size: 14px; line-height: 1.55;
  color: var(--paper-2); max-width: 30ch;
}
.svcs__foot {
  margin-top: 28px;
  display: flex; gap: 28px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-4);
}
.svcs__foot a {
  color: var(--paper); border-bottom: 1px solid var(--rule-2);
  padding-bottom: 2px;
  transition: color 200ms, border-color 200ms;
}
.svcs__foot a:hover { color: var(--ember); border-color: var(--ember); }

/* ============================================================
   TIERS — (deprecated, kept for legacy refs only) ============
   ============================================================ */
.tiers {
  padding: clamp(100px, 14vh, 160px) var(--gutter);
  background: var(--bg-2);
  border-bottom: 1px solid var(--rule);
}
.tiers__inner { max-width: var(--max); margin: 0 auto; }
.tiers__head { max-width: 760px; margin-bottom: 48px; }
.tiers__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 22px;
  display: flex; align-items: center; gap: 14px;
}
.tiers__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.tiers__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(28px, 3.4vw, 48px); line-height: 1.06;
  letter-spacing: -0.02em; color: var(--paper);
}
.tiers__h em { font-style: italic; color: var(--ember); font-weight: 500; }
.tiers__lede {
  font-family: var(--serif); font-size: 17px; line-height: 1.6;
  color: var(--paper-2); max-width: 60ch; margin-top: 14px;
}

.tiers__grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 1100px) { .tiers__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px)  { .tiers__grid { grid-template-columns: 1fr; } }
.tiers__card {
  padding: 36px clamp(18px, 1.8vw, 30px);
  display: flex; flex-direction: column; gap: 16px;
  border-left: 1px solid var(--rule);
  position: relative;
}
.tiers__card:first-child { border-left: 0; }
@media (max-width: 1100px) {
  .tiers__card { border-left: 1px solid var(--rule); }
  .tiers__card:nth-child(2n+1) { border-left: 0; }
  .tiers__card:nth-child(n+3) { border-top: 1px solid var(--rule); }
}
@media (max-width: 600px) {
  .tiers__card { border-left: 0; }
  .tiers__card:nth-child(n+2) { border-top: 1px solid var(--rule); }
}
.tiers__tier-cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
}
.tiers__tier-name {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(22px, 2vw, 28px); line-height: 1.1;
  color: var(--paper); letter-spacing: -0.01em;
}
.tiers__tier-name em { font-style: italic; color: var(--ember); }
.tiers__price {
  font-family: var(--mono); font-weight: 500;
  font-size: clamp(30px, 3.2vw, 46px); line-height: 0.98;
  color: var(--paper); letter-spacing: -0.01em;
  font-variant-numeric: tabular-nums;
}
.tiers__price-pre {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
  display: block; margin-bottom: 4px;
}
.tiers__lead {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-3);
}
.tiers__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 8px;
  font-family: var(--serif); font-size: 14px; line-height: 1.45;
  color: var(--paper-2);
  flex: 1;
}
.tiers__list li {
  padding-left: 18px; position: relative;
}
.tiers__list li::before {
  content: '·'; position: absolute; left: 6px; top: 0;
  color: var(--brass); font-weight: bold;
}
.tiers__list li em { font-style: italic; color: var(--paper); }
.tiers__connect {
  display: inline-flex; align-items: center; gap: 10px;
  margin-top: auto;
  padding: 12px 18px;
  background: transparent; color: var(--paper);
  border: 1px solid var(--rule-2);
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  transition: gap 180ms, background 180ms, color 180ms, border-color 180ms;
  width: fit-content;
}
.tiers__connect:hover { gap: 16px; background: var(--paper); color: var(--bg); border-color: var(--paper); }
.tiers__connect svg { width: 12px; height: 12px; }
.tiers__card--pbc {
  background: rgba(92,124,130,0.10);
}
.tiers__card--pbc .tiers__price { color: var(--turq); }
.tiers__card--pbc .tiers__tier-name em { color: var(--turq-2); }

/* Tier 2 highlighted as "most chosen" — borrowed from Stripe / Brex */
.tiers__card--featured {
  background: rgba(233,126,45,0.06);
  position: relative;
}
.tiers__card--featured::before {
  content: 'Most chosen';
  position: absolute; top: -1px; left: -1px;
  padding: 6px 14px;
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--bg);
  background: var(--ember);
  font-weight: 500;
}
.tiers__card--featured .tiers__price { color: var(--ember); }

/* Checklist styling on tier lists — bullets become ✓ ticks */
.tiers__list li.tiers__list-tick::before {
  content: '✓'; color: var(--moss); font-weight: 500;
  font-size: 11px;
}
.tiers__list li.tiers__list-tick { padding-left: 22px; }

.tiers__foot {
  margin-top: 28px;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
  display: flex; gap: 28px; flex-wrap: wrap;
}
.tiers__foot a { color: var(--paper-3); border-bottom: 1px solid var(--rule-2); padding-bottom: 2px; transition: color 180ms; }
.tiers__foot a:hover { color: var(--ember); border-color: var(--ember); }

/* ============================================================
   PROOF — four numbers across, brass rules, raked
   ============================================================ */
.proof {
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
  padding: 64px var(--gutter);
  background: var(--bg-2);
}
.proof__inner {
  max-width: var(--max); margin: 0 auto;
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0;
}
.proof__cell {
  padding: 0 clamp(18px, 3vw, 40px);
  display: flex; flex-direction: column; gap: 14px;
  border-left: 1px solid var(--rule);
}
.proof__cell:first-child { border-left: 0; padding-left: 0; }
.proof__num {
  font-family: var(--mono); font-weight: 500;
  font-size: clamp(48px, 5.6vw, 92px);
  line-height: 0.95; letter-spacing: -0.02em;
  color: var(--paper);
  display: flex; align-items: baseline; gap: 6px;
  font-variant-numeric: tabular-nums;
}
.proof__num .unit {
  font-family: var(--mono); font-size: 0.34em; font-weight: 400;
  color: var(--brass); letter-spacing: 0.12em; text-transform: uppercase;
}
.proof__lbl {
  font-size: 14px; line-height: 1.5; color: var(--paper-2); max-width: 28ch;
}
.proof__cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-4);
}

/* ============================================================
   THESIS — large mincho, ma (negative space), single ensō
   ============================================================ */
.thesis {
  padding: clamp(140px, 22vh, 220px) var(--gutter);
  background: var(--bg);
  position: relative; overflow: hidden;
}
.thesis__enso {
  position: absolute; top: 50%; right: -120px;
  transform: translateY(-50%);
  width: 520px; height: 520px;
  opacity: 0.65; pointer-events: none;
}
.thesis__inner { max-width: 1080px; margin: 0 auto; position: relative; z-index: 1; }
.thesis__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 48px; display: flex; align-items: center; gap: 14px;
}
.thesis__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.thesis__line {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(32px, 4.4vw, 62px);
  line-height: 1.18; letter-spacing: -0.018em;
  color: var(--paper); text-wrap: balance;
  max-width: 22ch;
}
.thesis__line em {
  font-style: normal; font-weight: 500; color: var(--ember);
}
.thesis__line .moss { color: var(--moss); font-style: italic; font-weight: 400; }
.thesis__body {
  margin-top: 36px;
  font-family: var(--serif); font-size: 17px; line-height: 1.65;
  color: var(--paper-2); max-width: 60ch; text-wrap: pretty;
}
.thesis__sig {
  margin-top: 64px;
  display: flex; gap: 48px; align-items: baseline; flex-wrap: wrap;
  font-family: var(--mono); font-size: 11px;
  letter-spacing: 0.18em; color: var(--paper-3); text-transform: uppercase;
}
.thesis__sig strong { font-weight: 500; color: var(--paper); }

/* ============================================================
   SCENES — stock photo + faint schematic overlay + rotating lidar
   ============================================================ */
.scene {
  padding: clamp(80px, 11vh, 140px) 0 clamp(80px, 11vh, 140px);
  background: var(--bg);
  position: relative;
  overflow: hidden;
}
.scene--alt { background: var(--bg-2); }

/* SpaceX-style stacked layout: full-bleed cinematic media on top, copy below.
   Plate breaks out of any inner gutter; copy stays in a centered column. */
.scene__inner {
  max-width: none; margin: 0;
  display: block;
  position: relative;
}
.scene--reverse .scene__inner { direction: ltr; }

/* the photo / video plate — full-bleed, cinematic 21:9 on desktop,
   stepping to 16:9 on tablet, then 4:5 on phone for portrait clips */
.scene__plate {
  position: relative;
  width: 100%;
  aspect-ratio: 21 / 9;
  background: var(--bg-deep);
  overflow: hidden;
  margin: 0 0 clamp(40px, 6vh, 72px) 0;
}
@media (max-width: 1100px) { .scene__plate { aspect-ratio: 16 / 9; } }
@media (max-width: 720px)  { .scene__plate { aspect-ratio: 4 / 5; } }

.scene__plate img,
.scene__plate video {
  width: 100%; height: 100%;
  object-fit: cover;
  object-position: center center;
  filter: grayscale(0.10) contrast(1.06) saturate(0.90) brightness(0.92);
  transition: transform 1.4s var(--ease);
  display: block;
}
.scene:hover .scene__plate img,
.scene:hover .scene__plate video { transform: scale(1.02); }
/* photo overlays: vignette + duotone */
.scene__plate::before {
  content: ''; position: absolute; inset: 0; z-index: 2;
  background:
    linear-gradient(180deg, rgba(26,26,26,0.0) 30%, rgba(26,26,26,0.55) 100%),
    linear-gradient(180deg, rgba(217,105,46,0.10) 0%, rgba(0,0,0,0) 50%);
}
/* schematic SVG overlay — hidden on cinematic plates (was authored for
   the old 4:5 portrait plate and distorts at 21:9). Kept in the DOM so
   the data is still authored, just not rendered until reauthored. */
.scene__schema {
  display: none;
}
.scene__schema svg { width: 100%; height: 100%; display: block; }
/* corner ticks + caption */
.scene__plate-cap {
  position: absolute; left: 16px; bottom: 16px; right: 16px; z-index: 4;
  display: flex; justify-content: space-between; align-items: end;
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: rgba(236,228,210,0.7);
  pointer-events: none;
}
.scene__plate-cap strong { color: var(--paper); font-weight: 500; }
.scene__corners {
  position: absolute; inset: 12px; z-index: 4; pointer-events: none;
}
.scene__corners::before, .scene__corners::after,
.scene__corners > span::before, .scene__corners > span::after {
  content: ''; position: absolute; width: 14px; height: 14px;
  border-color: rgba(236,228,210,0.55);
  border-style: solid; border-width: 0;
}
.scene__corners::before { top: 0; left: 0; border-top-width: 1px; border-left-width: 1px; }
.scene__corners::after  { top: 0; right: 0; border-top-width: 1px; border-right-width: 1px; }
.scene__corners > span::before { content: ''; bottom: 0; left: 0; border-bottom-width: 1px; border-left-width: 1px; }
.scene__corners > span::after  { content: ''; bottom: 0; right: 0; border-bottom-width: 1px; border-right-width: 1px; }

/* copy column — centered below the cinematic plate, capped reading width */
.scene__copy {
  max-width: 760px;
  margin: 0 auto;
  padding: 0 var(--gutter);
}
/* Scene kicker — matches the TOC running-header register.
   "§ 01 ────── PROJECT · ALAMO HEIGHTS, TEXAS" */
.scene__kick {
  display: inline-flex; align-items: center; gap: 14px;
  margin-bottom: 22px;
  flex-wrap: wrap;
}
.scene__kick-roman {
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 15px; letter-spacing: 0.02em;
  color: var(--brass);
  font-variant-numeric: oldstyle-nums;
}
.scene__kick-rule {
  display: inline-block; width: 42px; height: 1px;
  background: var(--brass); opacity: 0.55;
}
.scene__kick-label {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--paper-3);
}
.scene__kick-loc {
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--paper-2);
}

/* Scene title — was buried in .scene__num as a 32px line.
   Now an italic Fraunces phrase that earns its own row. */
.scene__title {
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-weight: 400; font-style: italic;
  font-size: clamp(24px, 2.4vw, 32px); line-height: 1.1;
  letter-spacing: -0.012em;
  color: var(--paper-2);
  margin-bottom: 22px;
}

/* Byline — replaces the chip row. A single italic-serif meta line
   with hairline brass rules above/below + a live status dot if applicable. */
.scene__byline {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: 0 10px; row-gap: 4px;
  margin: 0 0 32px;
  padding: 12px 0 13px;
  border-top: 1px solid rgba(184,153,104,0.22);
  border-bottom: 1px solid rgba(184,153,104,0.22);
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-size: 14.5px; line-height: 1.5;
  color: var(--paper-3);
  font-variant-numeric: oldstyle-nums tabular-nums;
}
.scene__byline-item {
  display: inline-flex; align-items: center; gap: 6px;
}
.scene__byline-item + .scene__byline-item::before {
  content: '·'; color: var(--paper-4); opacity: 0.55;
  margin: 0 6px 0 0;
}
.scene__byline-item em {
  font-style: italic; color: var(--paper); font-weight: 500;
}
.scene__byline-item.status {
  color: var(--moss); font-style: italic;
}
.scene__byline-item.status::before {
  /* override the dot separator with a glowing status pip */
  content: ''; width: 6px; height: 6px; border-radius: 50%;
  background: var(--moss); box-shadow: 0 0 8px var(--moss);
  animation: status-pulse 1.6s ease-in-out infinite;
  margin: 0 8px 0 0; opacity: 1;
}
@media (prefers-reduced-motion: reduce) {
  .scene__byline-item.status::before { animation: none; }
}
.scene__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(38px, 4.8vw, 76px);
  line-height: 1.0; letter-spacing: -0.025em;
  color: var(--paper); text-wrap: balance;
  margin-bottom: 28px;
}
.scene__h em {
  font-style: normal; font-weight: 500; color: var(--ember);
}
.scene__h .moss { color: var(--moss); font-style: italic; font-weight: 400; }
.scene__p {
  font-family: var(--serif); font-weight: 400;
  font-size: 18px; line-height: 1.65; color: var(--paper-2);
  max-width: 50ch; text-wrap: pretty;
  margin-bottom: 32px;
}
.scene__list {
  list-style: none;
  border-top: 1px solid var(--rule);
}
.scene__list li {
  padding: 18px 0;
  border-bottom: 1px solid var(--rule);
  display: grid; grid-template-columns: 90px 1fr; gap: 28px; align-items: baseline;
}
.scene__list .k {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
}
.scene__list .v {
  font-family: var(--serif); font-weight: 500; font-size: 19px;
  line-height: 1.4; color: var(--paper); letter-spacing: -0.005em;
}
.scene__list .v em { font-style: italic; color: var(--ember); font-weight: 500; }

/* lidar mounted on the plate, top-right corner — held INSIDE the plate
   since plates are now full-bleed (would overflow the viewport otherwise) */
.scene__lidar {
  position: absolute;
  top: 24px; right: 24px;
  width: 180px; height: 180px;
  z-index: 5; pointer-events: none;
}
.scene--reverse .scene__lidar { left: 24px; right: auto; }

/* ============================================================
   CTA
   ============================================================ */
.cta {
  background: linear-gradient(180deg,
    var(--bg-deep) 0%,
    #14242a 38%,
    #0c1c22 74%,
    #07151a 100%);
  padding: clamp(140px, 22vh, 240px) var(--gutter);
  border-top: 1px solid var(--rule);
  position: relative; overflow: hidden;
}
.cta::before {
  /* a soft teal lift from below — the "blue zone" rising into the page */
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 80% 60% at 50% 110%, rgba(92,124,130,0.22) 0%, transparent 70%);
  z-index: 0;
}
.cta__inner { z-index: 1; }
.cta__sacred {
  position: absolute; top: 50%; left: 50%;
  width: 900px; height: 900px;
  transform: translate(-50%, -50%);
  opacity: 0.05;
  pointer-events: none;
  animation: sacred-spin 320s linear infinite;
}
.cta__inner {
  max-width: 1100px; margin: 0 auto;
  display: flex; flex-direction: column; align-items: flex-start; gap: 56px;
  position: relative; z-index: 1;
}
.cta__line {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(44px, 5.4vw, 96px);
  line-height: 1.02; letter-spacing: -0.025em;
  color: var(--paper); text-wrap: balance; max-width: 18ch;
}
.cta__line em {
  font-style: normal; font-weight: 500;
  background: linear-gradient(180deg, var(--ember) 0%, var(--brass) 100%);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent;
}
.cta__body {
  font-family: var(--serif); font-size: 18px; line-height: 1.6;
  color: var(--paper-2); max-width: 56ch; text-wrap: pretty;
}
.cta__row { display: flex; gap: 36px; align-items: center; flex-wrap: wrap; }
.cta__primary {
  padding: 20px 40px;
  background: var(--paper); color: var(--bg);
  font-family: var(--mono); font-size: 12px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  border-radius: 999px;
  display: inline-flex; align-items: center; gap: 14px;
  transition: gap 180ms var(--ease), background 180ms;
}
.cta__primary:hover { gap: 22px; background: var(--ember); color: var(--paper); }
.cta__primary svg { width: 14px; height: 14px; }
.cta__ghost {
  font-family: var(--mono); font-size: 12px; font-weight: 500;
  color: var(--paper); letter-spacing: 0.2em; text-transform: uppercase;
  border-bottom: 1px solid var(--paper); padding-bottom: 3px;
  transition: color 180ms, border-color 180ms;
}
.cta__ghost:hover { color: var(--ember); border-color: var(--ember); }

/* ============================================================
   FOOTER — clean 4-column grid, structured NAP + practice list,
   SEO/AI-friendly. Matches page palette (no separate teal slab).
   ============================================================ */
.foot {
  background: var(--bg-deep);
  border-top: 1px solid var(--rule);
  padding: clamp(72px, 9vh, 120px) var(--gutter) 36px;
  color: var(--paper-2);
}
.foot__inner {
  max-width: 1280px; margin: 0 auto;
  display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr;
  gap: clamp(40px, 5vw, 72px);
  align-items: start;
}
@media (max-width: 960px) {
  .foot__inner { grid-template-columns: 1fr 1fr; gap: 48px; }
  .foot__col--identity { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .foot__inner { grid-template-columns: 1fr; gap: 36px; }
}

/* ---- Identity column ---- */
.foot__col { display: flex; flex-direction: column; gap: 14px; }
.foot__brand {
  display: inline-flex; align-items: center; gap: 12px;
  text-decoration: none;
  font-family: var(--serif); font-weight: 500;
  font-size: 28px; letter-spacing: -0.012em;
  color: var(--paper);
  line-height: 1;
}
.foot__glyph { width: 26px; height: 26px; overflow: visible; flex-shrink: 0; }
.foot__tagline {
  font-family: var(--mono); font-weight: 500;
  font-size: 10px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--paper-2);
  line-height: 1;
  margin: 0;
}
.foot__sub {
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: 15px; color: var(--paper-3);
  line-height: 1.3;
  margin: 0;
}
.foot__sub em { font-style: italic; }
.foot__desc {
  font-family: var(--serif); font-size: 14px; line-height: 1.6;
  color: var(--paper-3); max-width: 38ch;
  margin: 8px 0 0;
}

/* ---- Column headers + lists ---- */
.foot__h {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.24em;
  text-transform: uppercase; color: var(--brass); font-weight: 500;
  margin: 0 0 6px;
}
.foot__list {
  list-style: none; padding: 0; margin: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.foot__list li, .foot__list a {
  font-family: var(--serif); font-size: 14px; line-height: 1.4;
  color: var(--paper-2); text-decoration: none;
  transition: color 180ms;
}
.foot__list a:hover { color: var(--ember); }

/* ---- Address block (Schema-friendly) ---- */
.foot__address {
  display: flex; flex-direction: column; gap: 4px;
  font-family: var(--serif); font-size: 14px; line-height: 1.5;
  color: var(--paper-2); font-style: normal;
}
.foot__address-line--name { color: var(--paper); }

/* ---- Contact links ---- */
.foot__link {
  font-family: var(--serif); font-size: 14px; line-height: 1.4;
  color: var(--paper-2); text-decoration: none;
  border-bottom: 1px solid var(--rule);
  padding-bottom: 2px;
  transition: color 180ms, border-color 180ms;
  align-self: flex-start;
}
.foot__link:hover { color: var(--ember); border-color: var(--ember); }
.foot__cta {
  margin-top: 10px;
  display: inline-flex; align-items: center; gap: 10px;
  padding: 12px 22px;
  background: var(--paper); color: var(--bg);
  font-family: var(--mono); font-size: 10px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  border-radius: 999px;
  transition: gap 180ms var(--ease), background 180ms, color 180ms;
  align-self: flex-start;
}
.foot__cta:hover { gap: 14px; background: var(--ember); color: var(--paper); }
.foot__cta svg { width: 12px; height: 12px; }
.foot__bottom {
  max-width: 1280px; margin: 56px auto 0;
  padding-top: 24px; border-top: 1px solid var(--rule);
  display: flex; justify-content: space-between; align-items: center; gap: 24px; flex-wrap: wrap;
  font-family: var(--mono); font-size: 10px; color: var(--paper-4); letter-spacing: 0.18em;
  text-transform: uppercase;
}
.foot__bottom .ja {
  font-family: var(--serif); font-weight: 500; font-size: 14px;
  color: var(--brass); letter-spacing: 0.08em; text-transform: none;
}

/* ============================================================
   SCROLL REVEAL — keyframe animations (transitions get stuck
   pending in some iframe contexts; @keyframes are reliable).
   ============================================================ */
@keyframes reveal-up {
  from { opacity: 0; transform: translateY(28px); }
  to   { opacity: 1; transform: none; }
}
@keyframes sand-in {
  from {
    opacity: 0;
    transform: translate3d(60px, 4px, 0) skewX(-22deg) scale(0.92);
    filter: blur(8px);
  }
  to {
    opacity: 1;
    transform: none;
    filter: blur(0);
  }
}
.reveal { opacity: 0; transform: translateY(28px); }
.reveal.in { animation: reveal-up 600ms var(--ease) forwards; }

/* sand-blow reveal — wraps each char in a span and animates them in like
   wind unveiling letters carved in sand. Applied via JS to .reveal--sand */
.reveal--sand {
  display: inline-block;
  opacity: 1; transform: none;
  animation: none !important;
}
.reveal--sand .ch {
  display: inline-block;
  opacity: 0;
  transform: translate3d(60px, 4px, 0) skewX(-22deg) scale(0.92);
  filter: blur(8px);
  will-change: opacity, transform, filter;
}
.reveal--sand .ch.sp { width: 0.32em; }
.reveal--sand.in .ch {
  /* per-char animation-delay is set inline by JS */
  animation: sand-in 1000ms cubic-bezier(.2,.7,.2,1) forwards;
}

/* dust haze that brushes across as letters appear */
.sand-haze {
  position: absolute; inset: -20% -10%;
  pointer-events: none; z-index: 4;
  opacity: 0;
  background:
    radial-gradient(ellipse at 20% 50%, rgba(217,138,68,0.22), transparent 55%),
    radial-gradient(ellipse at 80% 50%, rgba(200,160,74,0.16), transparent 55%);
  filter: blur(40px);
  mix-blend-mode: screen;
  transition: opacity 1600ms ease;
}
.in > .sand-haze { opacity: 1; animation: sand-sweep 2.4s ease both; }
@keyframes sand-sweep {
  0%   { transform: translateX(-30%); opacity: 0; }
  30%  { opacity: 0.9; }
  100% { transform: translateX(30%); opacity: 0; }
}

/* ============================================================
   SLIM FOOTER — replaces the four-column dump
   ============================================================ */
.foot--slim{
  background:var(--bg-deep);
  border-top:1px solid var(--rule);
  padding:48px var(--gutter) 28px;
  position:relative; z-index:1;
}
.foot__top{
  max-width:1180px; margin:0 auto;
  display:flex; align-items:center; justify-content:space-between;
  gap:32px; flex-wrap:wrap;
  padding-bottom:28px; border-bottom:1px solid var(--rule);
}
.foot--slim .foot__brand{
  display:inline-flex; align-items:center; gap:11px;
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-size:22px; font-weight:500; letter-spacing:-0.012em;
  color:var(--paper); text-decoration:none;
}
.foot--slim .foot__brand svg{width:22px; height:22px; overflow:visible;}
.foot__nav{
  display:flex; gap:28px; flex-wrap:wrap;
  font-family:var(--sans); font-size:12px; letter-spacing:0.06em;
}
.foot__nav a{color:var(--paper-3); transition:color 180ms;}
.foot__nav a:hover{color:var(--ember);}
.foot--slim .foot__bottom{
  max-width:1180px; margin:0 auto;
  padding-top:24px; border-top:0;
  display:flex; justify-content:space-between; align-items:center;
  gap:16px; flex-wrap:wrap;
  font-family:var(--sans); font-size:11px; letter-spacing:0.04em;
  color:var(--paper-4); text-transform:none;
}
.foot__addr{
  font-style:normal;
  display:inline-flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.foot__addr .dot{color:var(--paper-4); opacity:0.5;}
.foot__pbc{color:var(--paper-4);}

/* ============================================================
   HERO SCROLL CUE
   ============================================================ */
.hero__scroll{display:none !important;
  margin-top:26px;
  font-family:var(--serif-display, var(--serif));
  font-size:20px; color:var(--brass); opacity:0.55;
  animation:scroll-bob 2.6s ease-in-out infinite;
}
@keyframes scroll-bob{
  0%,100%{transform:translateY(0);opacity:0.45;}
  50%{transform:translateY(8px);opacity:0.85;}
}

/* ============================================================
   PILLARS — the four rooms, table of contents
   ============================================================ */
.pillars{
  padding:clamp(96px,12vh,160px) var(--gutter) clamp(96px,12vh,160px);
  background:var(--bg);
  border-top:1px solid var(--rule);
  position:relative;
  z-index:1;
}
.pillars__inner{max-width:1180px;margin:0 auto;}
/* Kicker — a real running header, not a Wordpress label.
   "§ I·IV — The Rooms of Noon" reads like a publication's section mark. */
.pillars__kicker{
  display:inline-flex; align-items:center; gap:14px;
  margin-bottom:28px;
}
.pillars__roman{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-style:italic; font-weight:500;
  font-size:15px; letter-spacing:0.02em;
  color:var(--brass);
  font-variant-numeric:oldstyle-nums;
}
.pillars__rule{
  display:inline-block; width:42px; height:1px;
  background:var(--brass); opacity:0.55;
}
.pillars__label{
  font-family:var(--mono); font-size:11px; font-weight:500;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--paper-3);
}
.pillars__h{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-weight:500;
  font-size:clamp(40px,5vw,68px); line-height:1.04; letter-spacing:-0.022em;
  color:var(--paper); margin-bottom:64px; max-width:22ch;
  text-wrap:balance;
}
.pillars__h em{
  font-style:italic; font-weight:400;
  color:var(--brass);
  display:block; font-size:0.62em; line-height:1.2;
  letter-spacing:-0.014em; margin-top:18px; max-width:30ch;
}
.pillars__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid var(--rule);
  border-left:1px solid var(--rule);
  position:relative;
  /* Pulse-glow on the grid lines themselves — the brass rule
     breathes between rest-state (0.10) and ember-warm (0.32),
     so the TOC reads as alive instead of dead grid. */
  animation: tocLinePulse 5.4s ease-in-out infinite;
}
@media (max-width:1100px){.pillars__grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:640px){.pillars__grid{grid-template-columns:1fr;}}
.pillar{
  display:flex; flex-direction:column;
  padding:36px 30px 32px;
  background:transparent;
  border-right:1px solid var(--rule);
  border-bottom:1px solid var(--rule);
  text-decoration:none;
  transition:background 240ms var(--ease);
  position:relative;
  animation: tocLinePulse 5.4s ease-in-out infinite;
}
.pillar:hover{
  background:rgba(201,168,104,0.04);
  animation-play-state: paused;
  border-color: rgba(232,126,45,0.55);
}
/* Travelling glow — a soft ember band sweeps across the top edge
   of the TOC, then loops. Reads as a pulse of attention along the
   grid lines without screaming for it. */
.pillars__grid::before {
  content:'';
  position:absolute;
  top:-1px; left:0; right:0; height:1px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(232,126,45,0) 8%,
    rgba(232,126,45,0.70) 50%,
    rgba(232,126,45,0) 92%,
    transparent 100%);
  background-size: 40% 100%;
  background-repeat: no-repeat;
  animation: tocGlowTravel 7s linear infinite;
  pointer-events:none;
}
@keyframes tocLinePulse {
  0%, 100% { border-color: rgba(236,228,210,0.10); }
  50%      { border-color: rgba(232,126,45,0.28);  }
}
@keyframes tocGlowTravel {
  0%   { background-position: -40% 0; opacity: 0.0; }
  10%  { opacity: 1.0; }
  90%  { opacity: 1.0; }
  100% { background-position: 140% 0; opacity: 0.0; }
}
@media (prefers-reduced-motion: reduce) {
  .pillars__grid,
  .pillar { animation: none; }
  .pillars__grid::before { animation: none; opacity: 0.0; }
}
.pillar__num{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-style:italic; font-weight:500;
  font-size:18px; color:var(--brass); margin-bottom:24px;
}
.pillar__h{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-weight:500;
  font-size:30px; line-height:1.12; letter-spacing:-0.018em;
  color:var(--paper); margin-bottom:14px;
}
.pillar__p{
  font-family:var(--serif); font-size:16px; line-height:1.65;
  color:var(--paper-2); margin-bottom:24px;
}
/* Pillar interior lines — serif italic with hairline brass rules.
   Same family as the heading; no sans-serif mid-card register break. */
.pillar__lines{
  display:flex; flex-direction:column;
  margin:0 0 32px;
  border-top:1px solid rgba(184,153,104,0.14);
}
.pillar__line{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-weight:400; font-style:normal;
  font-size:15px; line-height:1.6; letter-spacing:0;
  color:var(--paper-2);
  padding:11px 0;
  border-bottom:1px solid rgba(184,153,104,0.14);
  text-wrap:pretty;
}
.pillar__line em{
  font-style:italic; color:var(--paper); font-weight:500;
}
.pillar__cta{
  margin-top:auto;
  font-family:var(--sans); font-size:11px; font-weight:500;
  letter-spacing:0.22em; text-transform:uppercase; color:var(--brass);
  transition:color 180ms,gap 180ms;
}
.pillar:hover .pillar__cta{color:var(--ember);}

/* ============================================================
   THE STUDIO — site-read form (relocated from hero)
   ============================================================ */
.studio{
  padding:clamp(96px,12vh,160px) var(--gutter);
  background:var(--bg-2);
  border-top:1px solid var(--rule);
  position:relative; z-index:1;
}
.studio__inner{max-width:880px;margin:0 auto;text-align:center;}
.studio__kicker{
  font-family:var(--sans); font-size:12px; font-weight:500;
  letter-spacing:0.24em; text-transform:uppercase;
  color:var(--brass); margin-bottom:28px;
}
.studio__h{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-weight:500;
  font-size:clamp(36px,4.6vw,60px); line-height:1.06; letter-spacing:-0.022em;
  color:var(--paper); margin-bottom:24px;
  text-wrap:balance; max-width:22ch; margin-left:auto; margin-right:auto;
}
.studio__h em{font-style:italic; color:var(--ember); font-weight:400;}
.studio__p{
  font-family:var(--serif); font-size:19px; line-height:1.7;
  color:var(--paper-2); max-width:38rem; margin:0 auto 48px;
}
.studio__form{
  max-width:560px; margin:0 auto;
  display:flex; flex-direction:column; gap:10px;
  background:rgba(15,15,14,0.55);
  border:1px solid var(--rule-2);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  padding:20px 20px 16px;
  text-align:left;
}
.studio__field{
  display:flex; flex-direction:column; gap:6px;
  background:rgba(26,26,26,0.55);
  border:1px solid var(--rule); padding:14px 18px;
}
.studio__field label{
  font-family:var(--sans); font-size:10px; letter-spacing:0.26em;
  text-transform:uppercase; color:var(--brass); font-weight:500;
}
.studio__field input{
  background:transparent; border:0; outline:none; padding:0;
  color:var(--paper); font-family:'Fraunces',var(--serif),Georgia,serif;
  font-size:clamp(18px,2vw,22px); font-style:italic;
}
.studio__field input::placeholder{color:var(--paper-4); font-style:italic;}
.studio__submit{
  margin-top:4px;
  background:var(--paper); color:var(--bg);
  font-family:var(--sans); font-size:11px; font-weight:500;
  letter-spacing:0.22em; text-transform:uppercase;
  border:0; cursor:pointer; padding:16px 22px;
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  transition:gap 180ms var(--ease), background 180ms, color 180ms;
}
.studio__submit:hover:not(:disabled){gap:20px; background:var(--ember); color:var(--paper);}
.studio__submit:disabled{background:var(--paper-3); color:var(--bg); cursor:wait;}
.studio__submit svg{width:14px; height:14px;}
.studio__status{
  font-family:var(--sans); font-size:10px; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--brass);
  display:flex; align-items:center; gap:10px; padding:6px 4px 0; min-height:18px;
}
.studio__status .dot{
  width:5px; height:5px; border-radius:50%; background:var(--ember);
  box-shadow:0 0 8px var(--ember);
}
.studio__status.err{color:var(--blood,#A33B2A);}
.studio__stats{
  list-style:none; padding:0; margin:48px auto 0;
  max-width:780px;
  display:grid; grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid var(--rule); border-bottom:1px solid var(--rule);
}
@media (max-width:720px){.studio__stats{grid-template-columns:1fr 1fr;}}
.studio__stat{
  padding:20px 18px;
  border-left:1px solid var(--rule);
  display:flex; flex-direction:column; gap:6px; text-align:left;
}
.studio__stat:first-child{border-left:0;}
.studio__stat-num{
  font-family:'Fraunces',var(--serif),Georgia,serif;
  font-weight:500; font-size:32px; line-height:1; letter-spacing:-0.014em;
  color:var(--paper); font-variant-numeric:tabular-nums;
}
.studio__stat-lbl{
  font-family:var(--sans); font-size:10px; letter-spacing:0.22em;
  text-transform:uppercase; color:var(--paper-3);
}
.studio__secondary{
  display:inline-block; margin-top:36px;
  font-family:var(--sans); font-size:11px; font-weight:500;
  letter-spacing:0.22em; text-transform:uppercase;
  color:var(--paper-3); border-bottom:1px solid var(--rule-2); padding-bottom:2px;
  transition:color 180ms, border-color 180ms;
}
.studio__secondary:hover{color:var(--ember); border-color:var(--ember);}

/* ============================================================
   ECO PROFILE — address-driven SES + Biome readout.
   Powered by the noon-profile orchestrator (CORS-open).
   ============================================================ */
.eco {
  /* Hidden entirely until a readout renders. The form lives in the hero;
     this section just hosts the result. */
  display: none;
  padding: 0; background: var(--bg-deep);
  position: relative; overflow: hidden;
  border-top: 0;
}
.eco:has(.eco__readout:not([hidden])) {
  display: block;
  padding: clamp(110px, 15vh, 180px) var(--gutter);
}
.eco__inner { max-width: var(--max); margin: 0 auto; }
.eco__head { max-width: 720px; margin-bottom: 56px; }
.eco__kicker {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  margin-bottom: 24px; display: flex; align-items: center; gap: 14px;
}
.eco__kicker::before { content: ''; width: 32px; height: 1px; background: var(--brass); }
.eco__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(36px, 4.4vw, 64px);
  line-height: 1.04; letter-spacing: -0.022em;
  color: var(--paper); margin-bottom: 20px; text-wrap: balance;
}
.eco__h em { font-style: italic; color: #E97E2D; font-weight: 500; }
.eco__lede {
  font-family: var(--serif); font-size: 18px; line-height: 1.6;
  color: var(--paper-2); max-width: 60ch; text-wrap: pretty;
}
.eco__lede em { font-style: italic; color: var(--paper); }

.eco__form {
  display: grid; grid-template-columns: 2fr 1fr 1fr 1fr auto;
  gap: 0;
  background: var(--bg-2);
  border: 1px solid var(--rule-2);
  margin-bottom: 32px;
}
@media (max-width: 900px) {
  .eco__form { grid-template-columns: 1fr 1fr; }
  .eco__form .eco__field:first-child { grid-column: 1 / -1; }
  .eco__form .eco__submit { grid-column: 1 / -1; }
}
.eco__field {
  display: flex; flex-direction: column; gap: 6px;
  padding: 18px 22px;
  border-right: 1px solid var(--rule);
}
.eco__field:last-of-type { border-right: 0; }
.eco__field label {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
}
.eco__field input {
  background: transparent; border: 0; outline: none;
  color: var(--paper); font-family: var(--serif); font-size: 17px;
  padding: 0; margin: 0; width: 100%;
}
.eco__field input::placeholder { color: var(--paper-4); font-style: italic; }
.eco__submit {
  background: var(--paper); color: var(--bg);
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase;
  padding: 0 40px; border: 0; cursor: pointer;
  display: inline-flex; align-items: center; gap: 12px;
  transition: gap 180ms var(--ease), background 180ms, color 180ms;
}
.eco__submit:hover:not(:disabled) { gap: 18px; background: var(--ember); color: var(--paper); }
.eco__submit:disabled { background: var(--paper-3); cursor: wait; }
.eco__submit svg { width: 14px; height: 14px; }

.eco__status {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
  display: flex; align-items: center; gap: 12px;
  min-height: 22px; margin-bottom: 24px;
}
.eco__status .dot {
  width: 6px; height: 6px; border-radius: 50%; background: var(--ember);
  box-shadow: 0 0 8px var(--ember); animation: tk-pulse 1.4s ease-in-out infinite;
}
.eco__status.err { color: var(--blood); }
.eco__status.err .dot { background: var(--blood); box-shadow: 0 0 8px var(--blood); animation: none; }

.eco__readout {
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 0;
  border-top: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 900px) {
  .eco__readout { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 540px) {
  .eco__readout { grid-template-columns: 1fr; }
}
.eco__cell {
  padding: 28px clamp(18px, 2.5vw, 36px);
  display: flex; flex-direction: column; gap: 10px;
  border-left: 1px solid var(--rule);
  border-bottom: 1px solid var(--rule);
}
.eco__cell:nth-child(3n+1) { border-left: 0; }
.eco__cell-cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
}
.eco__cell-num {
  font-family: var(--mono); font-weight: 500;
  font-size: clamp(34px, 3.6vw, 56px);
  line-height: 0.98; letter-spacing: -0.01em;
  color: var(--paper);
  display: flex; align-items: baseline; gap: 6px;
  flex-wrap: wrap;
  font-variant-numeric: tabular-nums;
}
.eco__cell-num .unit {
  font-family: var(--mono); font-size: 0.38em; font-weight: 400;
  color: var(--brass); letter-spacing: 0.12em; text-transform: uppercase;
}
.eco__cell-sub {
  font-family: var(--serif); font-size: 14px; line-height: 1.45;
  color: var(--paper-2); max-width: 34ch;
}
.eco__cell-sub em { font-style: italic; color: var(--ember); }
.eco__cell-cite {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
  margin-top: 6px;
}
.eco__cell-ref {
  font-family: var(--serif); font-size: 0.45em; font-weight: 400;
  color: var(--brass); margin-left: 4px;
  vertical-align: 0.7em;
  font-variant-numeric: normal;
}


/* secondary spec sheet — technical detail, demoted below health ROI */
.eco__spec {
  grid-column: 1 / -1;
  padding: 36px clamp(18px, 2.5vw, 36px) 28px;
  border-top: 1px solid var(--rule);
  background: rgba(15,15,14,0.35);
}
.eco__spec-head {
  display: flex; justify-content: space-between; align-items: baseline;
  gap: 16px; flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--rule-2);
}
.eco__spec-title {
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.26em;
  text-transform: uppercase; color: var(--paper);
  font-weight: 500;
}
.eco__spec-meta {
  font-family: var(--mono); font-size: 9px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
}
.eco__spec-list {
  display: grid; gap: 10px;
}
.eco__spec-row {
  display: grid; grid-template-columns: 220px 180px 1fr; gap: 24px;
  align-items: baseline;
  padding: 8px 0;
  border-bottom: 1px solid var(--rule);
}
@media (max-width: 720px) {
  .eco__spec-row { grid-template-columns: 1fr; gap: 4px; padding: 12px 0; }
}
.eco__spec-lbl {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.2em;
  text-transform: uppercase; color: var(--paper-3);
}
.eco__spec-val {
  font-family: var(--mono); font-weight: 500; font-size: 17px;
  color: var(--paper); letter-spacing: -0.005em;
  font-variant-numeric: tabular-nums;
}
.eco__spec-sub {
  font-family: var(--serif); font-size: 14px; color: var(--paper-3);
  line-height: 1.45;
}

.eco__diag {
  margin-top: 48px;
  display: grid; gap: 0;
}
.eco__diag-item {
  padding: 24px 0;
  border-bottom: 1px solid var(--rule);
  display: grid; grid-template-columns: 120px 1fr; gap: 28px; align-items: baseline;
}
@media (max-width: 720px) {
  .eco__diag-item { grid-template-columns: 1fr; gap: 8px; }
}
.eco__diag-cat {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
}
.eco__diag-body { display: flex; flex-direction: column; gap: 8px; }
.eco__diag-title {
  font-family: var(--serif); font-weight: 500; font-size: 19px;
  line-height: 1.35; color: var(--paper); letter-spacing: -0.005em;
}
.eco__diag-expl {
  font-family: var(--serif); font-size: 15px; line-height: 1.55;
  color: var(--paper-3); max-width: 80ch;
}

.eco__cta {
  margin-top: 56px;
  display: flex; gap: 28px; align-items: center; flex-wrap: wrap;
}
.eco__cta-primary {
  padding: 16px 32px;
  background: var(--paper); color: var(--bg);
  font-family: var(--mono); font-size: 11px; font-weight: 500;
  letter-spacing: 0.2em; text-transform: uppercase;
  border-radius: 999px;
  display: inline-flex; align-items: center; gap: 12px;
  transition: gap 180ms var(--ease), background 180ms;
}
.eco__cta-primary:hover { gap: 20px; background: var(--ember); color: var(--paper); }
.eco__cta-primary svg { width: 13px; height: 13px; }
.eco__cta-note {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-4);
  max-width: 36ch;
}

/* eco empty-state — placeholder readout grid before any submission */
.eco__empty { display: block; }
.eco__empty.hidden { display: none; }
.eco__empty-grid {
  display: grid; grid-template-columns: repeat(3, 1fr);
  border-top: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
}
@media (max-width: 900px) { .eco__empty-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 540px) { .eco__empty-grid { grid-template-columns: 1fr; } }
.eco__empty-cell {
  padding: 28px clamp(18px, 2.5vw, 36px);
  display: flex; flex-direction: column; gap: 10px;
  border-left: 1px solid var(--rule); border-bottom: 1px solid var(--rule);
  opacity: 0.55;
}
.eco__empty-cell:nth-child(3n+1) { border-left: 0; }
.eco__empty-cap {
  font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
}
.eco__empty-num {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(38px, 4vw, 62px); line-height: 0.98;
  color: var(--paper-3);
  display: flex; align-items: baseline; gap: 6px;
}
.eco__empty-num .unit {
  font-family: var(--serif); font-size: 0.42em; font-weight: 400;
  color: var(--paper-4); font-style: italic;
}
.eco__empty-sub {
  font-family: var(--serif); font-size: 14px; line-height: 1.45;
  color: var(--paper-4);
}
.eco__empty-prompt {
  margin-top: 32px;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--brass);
}
.eco__empty-prompt a {
  color: var(--paper); border-bottom: 1px solid var(--rule-2);
  padding-bottom: 1px;
  transition: color 180ms, border-color 180ms;
}
.eco__empty-prompt a:hover { color: var(--ember); border-color: var(--ember); }

/* draw-on for SVG paths inside .draw, when revealed */
.draw { stroke-dasharray: 1500; stroke-dashoffset: 1500; transition: stroke-dashoffset 2400ms var(--ease) 200ms; }
.in .draw { stroke-dashoffset: 0; }

/* ============================================================
   TWEAKS
   ============================================================ */
.tweaks {
  /* dev-only panel — hidden on production. Activated via postMessage
     `__activate_edit_mode` from an editor harness. Never shown to visitors. */
  display: none;
  position: fixed; right: 24px; bottom: 24px; z-index: 80;
  width: 280px; background: var(--bg-2);
  border: 1px solid var(--rule-2); padding: 24px;
  transform: translateY(16px); opacity: 0; pointer-events: none;
  transition: transform 320ms, opacity 320ms;
}
.tweaks.open { display: block; transform: none; opacity: 1; pointer-events: auto; }
.tweaks h6 {
  display: flex; justify-content: space-between; align-items: center;
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.18em;
  text-transform: uppercase; color: var(--paper-3); margin-bottom: 20px; font-weight: 500;
}
.tweaks h6 button { font-size: 18px; background: none; border: 0; cursor: pointer; color: var(--paper); }
.tweaks .grp { margin-bottom: 18px; }
.tweaks .grp label { font-family: var(--mono); font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase; color: var(--paper-3); display: block; margin-bottom: 8px; }
.tweaks .opts { display: flex; gap: 4px; }
.tweaks .opts button {
  flex: 1; padding: 10px 6px; background: transparent; border: 1px solid var(--rule);
  font-family: var(--mono); font-size: 11px; letter-spacing: 0.04em;
  text-transform: uppercase; color: var(--paper-2); cursor: pointer; transition: all 180ms;
}
.tweaks .opts button.active { background: var(--paper); color: var(--bg); border-color: var(--paper); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 900px) {
  .nav__links { display: none; }
  .hero__meta--tl, .hero__meta--tr { display: none; }
  .proof__inner { grid-template-columns: 1fr; gap: 32px 0; }
  .proof__cell { border-left: 0; border-top: 1px solid var(--rule); padding: 24px 0 0; }
  .proof__cell:first-child { border-top: 0; padding-top: 0; }
  .scene__inner { grid-template-columns: 1fr; }
  .scene--reverse .scene__inner { direction: ltr; }
  .scene__lidar { display: none; }
  .foot__inner { grid-template-columns: 1fr 1fr; }
  .foot__brand { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) {
  .reveal { opacity: 1; transform: none; animation: none; }
  .reveal--sand .ch { opacity: 1; transform: none; filter: none; animation: none; }
  .draw { stroke-dasharray: none; stroke-dashoffset: 0; transition: none; }
  .hero__sacred, .cta__sacred { animation: none; }
}

/* Italic discipline: scene narrative paragraphs upright; em-on-phrases italic only */
  .scene__p { font-style: normal !important; }
  .scene__p em { font-style: italic; font-weight: 500; color: var(--paper); }
  /* Pillar heading subline ("Built around what the land here provides") is a single
     short ornamental phrase — italic stays. */

/* ===================== v9 HERO — homepage-scoped redesign =====================
   Header dissolves over the full-bleed lotus; the maximalist water-lake / reeds /
   fireflies quiet down so the lotus + the type carry it; one clean cinematic scrim;
   mobile-first. Loads after _nav.css and the base hero CSS, so it wins by order. */

/* 1 — header dissolves over the lotus, solidifies on scroll */
body.has-nb-nav.has-nb-util{padding-top:0}
.nb-util,.nb-nav{background:transparent!important;border-bottom:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;transition:background .3s ease,-webkit-backdrop-filter .3s ease,backdrop-filter .3s ease}
.nb-nav.nb-nav--solid{background:rgba(11,16,12,.94)!important;-webkit-backdrop-filter:blur(10px) saturate(1.1)!important;backdrop-filter:blur(10px) saturate(1.1)!important;border-bottom:1px solid rgba(184,153,104,0.14)!important}

/* 2 — full-bleed hero; content clears the overlaid header */
.hero{padding:130px var(--gutter) 8vh}

/* 3 — quiet the maximalism (restraint is the 9) */
.hero__reeds{display:none}
.hero__horizon{height:38vh;background:linear-gradient(180deg,transparent 0%,rgba(9,14,11,.28) 52%,rgba(7,12,9,.92) 100%)}
.hero__horizon::before,.hero__horizon::after{display:none}
.hero__leds{opacity:.4}
.hero__backdrop::after{opacity:.13}

/* 4 — left-weighted scrim: dark under the type/search, clearing toward the right so the lotus land-art reads instead of drowning (2026-07 legibility pass) */
.hero::after{background:
  linear-gradient(90deg,rgba(7,12,9,.88) 0%,rgba(7,12,9,.56) 40%,rgba(7,12,9,.14) 66%,transparent 84%),
  linear-gradient(180deg,rgba(7,12,9,.5) 0%,transparent 13%,transparent 60%,rgba(7,12,9,.5) 100%),
  radial-gradient(ellipse 95% 75% at 40% 46%,transparent 0%,rgba(7,12,9,.15) 92%)}

/* 5 — SLEEK + ONE BAR: restrained headline, a single distilled nav, no fussy address pulse */
/* shorter band (2026-07 Dorian) so the WORK gallery peeks into the fold — Tesla/Patagonia scroll cue */
.hero{padding:120px var(--gutter) 6vh}
.hero__h1{font-size:clamp(40px,5.9vw,94px);max-width:18ch;margin-bottom:clamp(16px,2.2vh,28px)}
.hero__lede-service{font-size:clamp(14px,1.05vw,16.5px);max-width:40ch}
.hero__addr{width:min(760px,100%);max-width:760px}
/* one support line under the search: drop the redundant subline, keep the live readout */
.hero__addr-foot{display:none!important}
/* collapse the two-bar header into one: drop the util strip, the nav IS the bar */
.nb-util{display:none!important}
.nb-nav{top:0!important;justify-content:flex-start!important;gap:clamp(16px,3vw,40px)}
.nb-nav__menu{margin-left:auto!important}
.nb-nav__link{opacity:.78;transition:opacity .2s ease}
.nb-nav__link:hover{opacity:1}
/* still the "breathing bullseye" signature on the brand mark — it read as a random spinning red thing in the corner */
.nb-nav__mark,.nb-nav__mark circle{animation:none!important;transform:none!important}
.nb-nav__signin{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(232,126,45,.55);background:rgba(232,126,45,.12);border-radius:999px;padding:6px 14px 6px 11px;color:#F2EBD9!important;font-weight:600;font-size:12px;text-decoration:none;white-space:nowrap}
.nb-nav__signin:hover{background:rgba(232,126,45,.2)}
.nb-nav__es{color:#A8A08B!important;font-size:11px;letter-spacing:.14em;text-decoration:none}
.nb-nav__es:hover{color:#F2EBD9!important}
/* ── FUTURISTIC ADDRESS INSTRUMENT — glass HUD, travelling rim-beam, scan sweep, lock-on focus ── */
.hero__addr-box .corner-bl,.hero__addr-box .corner-br{display:none!important}
/* "drop a pin" geolocation button */
.hero__addr-box{grid-template-columns:auto 1fr auto auto!important;}
.hero__addr-pin{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border:0;background:none;color:var(--brass,#B89968);cursor:pointer;padding:0;border-radius:50%;transition:color .2s ease,background .2s ease;position:relative;z-index:2;}
.hero__addr-pin svg{width:18px;height:18px;display:block;}
.hero__addr-pin:hover{color:var(--ember,#E97E2D);background:rgba(232,126,45,.10);}
.hero__addr-pin.is-locating{color:var(--ember,#E97E2D);animation:addrPinSpin .9s linear infinite;}
@keyframes addrPinSpin{to{transform:rotate(360deg);}}
.hero__addr-box{
  position:relative!important; overflow:hidden; isolation:isolate;
  border:1px solid rgba(184,153,104,0.34)!important; border-radius:999px!important;
  padding:14px 30px!important;
  background:transparent!important;
  /* Glass/blur moved to ::before. A backdrop-filter on THIS (the clip) element was
     defeating border-radius clipping of the scan sweep — its square corners poked
     past the rounded pill ends. Explicitly none here (the base rule sets blur(6px))
     so the box is a clean rounded clip container and we don't double-blur. */
  -webkit-backdrop-filter:none!important; backdrop-filter:none!important;
  box-shadow:0 10px 44px rgba(0,0,0,.42);
  transition:border-color .3s ease, box-shadow .3s ease;
}
/* GLASS LAYER — frosted backdrop lives here (not on the box) so the box can cleanly
   clip the scan sweep to the pill. (Old conic rim-beam removed — it bunched in the corner.) */
.hero__addr-box::before{
  content:''!important; display:block!important; position:absolute; inset:0; z-index:0;
  border-radius:inherit; pointer-events:none;
  background:rgba(12,13,11,.42);
  -webkit-backdrop-filter:blur(8px) saturate(1.15); backdrop-filter:blur(8px) saturate(1.15);
}
/* a scan sweeping across the field — "reading your ground" */
.hero__addr-box::after{
  content:''!important; display:block!important; position:absolute; top:-25%; bottom:-25%; left:-50%; width:44%; z-index:1;
  pointer-events:none; transform:skewX(-14deg);
  /* sensor sweep, not a gloss shine: soft trailing wake (left) building to a crisp
     bright leading edge (right, the direction of travel), then a quick falloff. */
  background:linear-gradient(90deg, transparent 0%, rgba(232,126,45,.05) 34%, rgba(232,126,45,.12) 74%, rgba(232,126,45,.28) 96%, transparent 100%);
}
.hero__addr-icon,.hero__addr-input,.hero__addr-submit{position:relative; z-index:2}
.hero__addr-box:focus-within{
  border-color:rgba(232,126,45,.55)!important;
  box-shadow:0 12px 52px rgba(0,0,0,.5), 0 0 0 1px rgba(232,126,45,.30);   /* matte: depth + hairline, no halo, no gloss inset */
}
@property --ang{syntax:'<angle>'; initial-value:0deg; inherits:false}
@keyframes addrBeam{to{--ang:360deg}}
@keyframes addrScan{0%{left:-50%;opacity:0}10%{opacity:.9}45%{opacity:.9}60%{left:120%;opacity:0}100%{left:120%;opacity:0}}
/* breathing glow — the bar pulses light like it's powered on */
@keyframes addrGlow{0%,100%{box-shadow:0 10px 44px rgba(0,0,0,.42)}50%{box-shadow:0 10px 46px rgba(0,0,0,.44)}}
/* seed-mark indexes a clean 60° tick — seamless thanks to its 6-fold symmetry */
@keyframes addrTick{0%,68%{transform:rotate(0)}88%,100%{transform:rotate(60deg)}}
@media (prefers-reduced-motion: no-preference){
  .hero__addr-box{animation:addrGlow 2.8s ease-in-out infinite}
  .hero__addr-box::after{animation:addrScan 6.5s ease-in-out infinite}
  .hero__addr-icon{animation:addrTick 3.4s cubic-bezier(.7,0,.2,1) infinite}
  .hero__addr-box:focus-within{animation:none!important}
  .hero__addr-box:focus-within::after{animation-duration:2.8s}
  .hero__addr-box:focus-within .hero__addr-icon{animation-play-state:paused}
}
/* ── LOCK-ON — the instrument earns its effects: it acquires while you type,
   then fires a "lock acquired" beat on submit. Idle → focus(still) → typing
   (acquiring: mark spins, scan quickens+brightens, glow tightens) → lock. ── */
@keyframes addrSpin{to{transform:rotate(360deg)}}
@keyframes addrLockGlow{
  0%,100%{box-shadow:0 12px 50px rgba(0,0,0,.5), 0 0 0 1px rgba(232,126,45,.50)}
  50%    {box-shadow:0 12px 54px rgba(0,0,0,.5), 0 0 0 1px rgba(246,206,138,.70)}
}
@keyframes addrLockPulse{
  0%  {box-shadow:0 12px 52px rgba(0,0,0,.5), 0 0 0 1px rgba(246,206,138,.85)}
  55% {box-shadow:0 12px 52px rgba(0,0,0,.5), 0 0 0 2px rgba(246,206,138,.95)}
  100%{box-shadow:0 12px 52px rgba(0,0,0,.5), 0 0 0 1px rgba(232,126,45,.32)}
}
.hero__addr-box.is-reading{ border-color:rgba(232,126,45,.62)!important; }
.hero__addr-box.is-reading::after{
  background:linear-gradient(90deg, transparent 0%, rgba(232,126,45,.08) 30%, rgba(232,126,45,.18) 70%, rgba(232,126,45,.40) 96%, transparent 100%)!important;
}
.hero__addr-box.is-locked{ border-color:#F6CE8A!important; }
@media (prefers-reduced-motion: no-preference){
  .hero__addr-box.is-reading{ animation:addrLockGlow 1.5s ease-in-out infinite!important; }
  .hero__addr-box.is-reading::after{ animation-duration:1.9s!important; animation-timing-function:cubic-bezier(.45,0,.2,1)!important; }
  .hero__addr-box.is-reading .hero__addr-icon{ animation:addrSpin 1.15s linear infinite!important; animation-play-state:running!important; }
  .hero__addr-box.is-locked{ animation:addrLockPulse .5s ease-out!important; }
  .hero__addr-box.is-locked .hero__addr-icon{ animation:addrSpin .5s cubic-bezier(.2,.7,.2,1)!important; }
}

/* ── 5b — JOBS PASS: collapse the hero into ONE left gesture ──
   headline → promise → instrument → live readout, read as a single breath on
   one axis. Kicker dropped (one mono voice fewer, tighter top). Search + live
   un-centered so the thing that DELIVERS the promise sits right under it — no
   marooned center box, no void. */
.hero__kick-chip{display:none!important}
.hero__inner{gap:clamp(20px,3vh,34px)!important}
.hero__lede-service{margin-bottom:0!important}
/* flush with the base mobile breakpoint (<=720 centers the stack), so there is
   no dead band where the search re-centers on narrow tablets */
@media(min-width:721px){
  .hero__addr{
    align-self:flex-start!important;
    margin:0 auto 0 clamp(0px,2.5vw,36px)!important;
  }
  .hero__dashboard{
    align-self:flex-start!important;
    margin:0 auto 0 clamp(0px,2.5vw,36px)!important;
    max-width:520px;
  }
}

/* 6 — mobile: legible type, clean stack, tappable, Sign-in stays visible */
@media(max-width:760px){
  .hero{padding:96px 22px 12vh}
  .hero__h1{font-size:clamp(40px,9.5vw,66px)}
  .hero__h1 em{white-space:normal}
  .hero__horizon{height:28vh}
  .nb-nav__signin{margin-left:auto!important;font-size:11px;padding:5px 12px 5px 9px}
}

/* 7 — AIRIER (SpaceX-leaning): cut the repetitive "30-chip Noon Bridge" reading section
   and the dense eco/geo tile grid; keep only the slim live line so the hero breathes */
.rd-teaser{display:none!important}
.hero__live{display:none!important}
.hero__siteread{display:none!important}
.hero__dashboard{background:none!important;border:none!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;max-width:640px;margin-top:6px}
/* tight, single-line live readout — no panel, no paragraph */
.hero__dash-head{padding:6px 0 0!important;border:none!important;background:none!important;gap:12px;opacity:.92}
/* synth = a precise mono instrument readout (tabular figures), not weather prose */
.hero__dash-head__syn{font-family:'JetBrains Mono',ui-monospace,monospace!important;font-style:normal!important;font-size:11.5px!important;line-height:1.4!important;letter-spacing:.012em;color:var(--paper-2,#DCD4BD)!important;font-variant-numeric:tabular-nums;}
.hero__dash-head__syn em{font-style:normal;color:var(--ember,#E97E2D);font-weight:600;letter-spacing:.05em;}
.hero__dash-head__syn .dh-x{opacity:.4;}
.hero__dash-head__syn .dh-tr{font-style:normal;font-size:1.3em;font-weight:700;line-height:1;vertical-align:-.06em;margin:0 1px 0 2px;}
.hero__dash-head__syn .dh-tr--dn{color:var(--ember,#E97E2D);}
.hero__dash-head__syn .dh-tr--up{color:#8FAE6E;}
/* Keep the readout within the search-pill width so it aligns with the column above.
   Stack it as a label header over one clean data line (instrument-panel look) — the
   richer data line no longer wraps mid-sentence with an orphaned "Stage II". */
.hero__dashboard{max-width:500px!important;}
.hero__dash-head{flex-direction:column!important;align-items:flex-start!important;gap:5px!important;flex-wrap:nowrap!important;}
.hero__dash-head__lbl{border-right:0!important;padding-right:0!important;}

.hero__siteread{display:flex;align-items:center;justify-content:space-between;gap:12px 22px;flex-wrap:wrap;margin-top:14px;padding:13px 22px;background:linear-gradient(135deg,#E97E2D,#C2641F);color:#1c0f05;border-radius:7px;text-decoration:none;transition:filter .2s ease;}
        .hero__siteread:hover{filter:brightness(1.07);}
        .hero__siteread:focus-visible{outline:2px solid #F2EBD9;outline-offset:3px;}
        .hero__siteread__l{font-family:'Fraunces',Georgia,serif;font-size:clamp(15px,1.5vw,19px);display:inline-flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
        .hero__siteread__l strong{font-weight:600;font-style:italic;}
        .hero__siteread__sub{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:0.14em;text-transform:uppercase;opacity:0.82;}
        .hero__siteread__arr{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;font-weight:600;display:inline-flex;align-items:center;gap:8px;white-space:nowrap;}

/* ============================================================
   OFFER LADDER STRIP — compact, premium, homepage tokens.
   Scoped under .ladder; reuses :root color/type vars from line 333.
   ============================================================ */

/* H1 width override — placed HERE (top of ladder <style>) on purpose:
   source order after index.html:4154 (18ch) and :4280, so it wins the
   cascade. Do NOT move it near line 837 — there it is a silent no-op. */
.hero__h1 { max-width: 24ch; } /* widened for the H1 (was 18ch live, :4154) */

.ladder {
  background: var(--bg);
  border-top: 1px solid var(--rule);
  padding: clamp(56px, 8vh, 96px) var(--gutter) clamp(48px, 7vh, 84px);
  position: relative;
  overflow: hidden;
}
.ladder__inner { max-width: 1212px; margin: 0 auto; }   /* lands on the works grid's left rail */
.ladder__head { max-width: 720px; margin: 0 0 clamp(36px, 5vh, 56px); }
.ladder__eyebrow {
  display: inline-block; margin-bottom: 16px;
  font-family: var(--mono);
  font-size: 10.5px; font-weight: 500;
  letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--brass);
}
.ladder__h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(30px, 4vw, 52px);
  line-height: 1.02; letter-spacing: -0.024em;
  color: var(--paper); margin: 0 0 14px; text-wrap: balance;
}
.ladder__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.ladder__sub {
  font-family: var(--serif); font-weight: 400;
  font-size: clamp(16px, 1.35vw, 19px); line-height: 1.55;
  color: var(--paper-2); max-width: 56ch; margin: 0; text-wrap: pretty;
}

/* RUNGS — one row of 3 on desktop, stacks on mobile. */
.ladder__rungs {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: repeat(3, 1fr);
  gap: 1px; background: var(--rule);
  border: 1px solid var(--rule); border-radius: 2px;
  overflow: hidden;
}
.ladder__rung {
  background: var(--bg-2);
  padding: clamp(24px, 2.4vw, 34px) clamp(22px, 2vw, 30px);
  display: flex; flex-direction: column;
}
.ladder__rung--hero {
  background: linear-gradient(180deg, rgba(233,126,45,0.045), rgba(233,126,45,0.015));
  box-shadow: inset 0 0 0 1px rgba(184,153,104,0.35);
}
.ladder__tag {
  font-family: var(--mono);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--brass); margin-bottom: 14px;
}
.ladder__rung--hero .ladder__tag { color: var(--ember); }
.ladder__rung-h {
  font-family: var(--serif); font-weight: 500;
  font-size: clamp(22px, 2.2vw, 30px);
  line-height: 1.05; letter-spacing: -0.02em;
  color: var(--paper); margin: 0 0 10px;
}
.ladder__rung-body {
  font-family: var(--serif); font-weight: 400;
  font-size: 15px; line-height: 1.55;
  color: var(--paper-2); margin: 0;
}

/* FOOT — single dominant CTA + trust line beside it. */
.ladder__foot {
  display: flex; flex-wrap: wrap; align-items: center;
  gap: clamp(18px, 2.4vw, 36px);
  margin-top: clamp(32px, 4.5vh, 48px);
}
.ladder__cta {
  flex-shrink: 0;
  display: inline-flex; align-items: center; gap: 12px;
  min-height: 52px; padding: 0 30px;
  background: var(--ember); color: var(--bg-deep);
  font-family: var(--mono);
  font-size: 12px; font-weight: 600;
  letter-spacing: 0.16em; text-transform: uppercase;
  text-decoration: none; border-radius: 2px;
  transition: background 220ms var(--ease), gap 220ms var(--ease);
}
.ladder__cta:hover { background: var(--sun); gap: 16px; }
.ladder__trust {
  flex: 1; min-width: 260px;
  font-family: var(--serif); font-style: italic; font-weight: 400;
  font-size: 14px; line-height: 1.5;
  color: var(--paper-3); margin: 0; text-wrap: pretty;
}

@media (max-width: 860px) {
  .ladder__rungs { grid-template-columns: 1fr; }
  .ladder__foot { flex-direction: column; align-items: flex-start; }
  .ladder__cta { width: 100%; justify-content: center; }
}

/* Uniform THUMBNAIL grid — auto-fills; wraps to new rows as more projects are added. */
  .wk2h{--ember:#EE7B53;--ember-2:#F49350;--brass:#B89968;--rule:rgba(184,153,104,0.22);--paper:#F2EBD9;--paper-2:#DCD4BD;--paper-3:#A8A08B;max-width:1340px;margin:0 auto;padding:clamp(22px,3.2vh,42px) clamp(18px,4.5vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(10px,1.1vw,15px)}
  .wk2h__fig{position:relative;overflow:hidden;background:#1a1410;display:block;color:inherit;aspect-ratio:4/3;border-radius:7px}
  .wk2h__fig img,.wk2h__fig video{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1) brightness(0.95);transition:transform 900ms cubic-bezier(.2,.7,.2,1),filter 600ms ease}
  .wk2h__fig:hover img,.wk2h__fig:hover video{transform:scale(1.06);filter:saturate(1.05) brightness(1)}
  .wk2h__num{position:absolute;top:11px;left:13px;z-index:2;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:0.16em;color:rgba(242,235,217,0.7);text-shadow:0 1px 8px rgba(0,0,0,0.6)}
  .wk2h__status{position:absolute;top:10px;right:11px;z-index:2;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;font-weight:500;letter-spacing:0.12em;text-transform:uppercase;padding:4px 7px;background:rgba(12,11,10,0.62);color:var(--paper-2);border:1px solid var(--rule);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:3px}
  .wk2h__status--soon{background:rgba(12,11,10,0.62);color:var(--paper-2);border:1px solid var(--rule);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}
  .wk2h__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(24px,4vw,38px) 14px 12px;background:linear-gradient(to top,rgba(9,8,7,0.94),rgba(9,8,7,0.5) 48%,transparent)}
  .wk2h__kind{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.15em;text-transform:uppercase;color:#CDB68A;text-shadow:0 1px 8px rgba(0,0,0,0.6)}
  .wk2h--feat>.wk2h__fig:first-child .wk2h__kind{font-size:11.5px;letter-spacing:0.2em}
  .wk2h__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(16px,1.35vw,20px);line-height:1.06;letter-spacing:-0.01em;color:var(--paper);margin:4px 0 0;text-wrap:balance}
  .wk2h__desc,.wk2h__read{display:none}
  a.wk2h__fig::after{content:'';position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--ember);z-index:3;transition:width 500ms cubic-bezier(.2,.7,.2,1)}
  a.wk2h__fig:hover::after{width:100%}
  .wk2h__fig:focus-visible{outline:2px solid var(--ember,#EE7B53);outline-offset:3px}
  @media(max-width:560px){.wk2h{grid-template-columns:1fr;gap:10px}.wk2h__h{font-size:20px}.wk2h__cap{padding:clamp(30px,11vw,46px) 16px 15px}}
  /* Featured band — first project spans full width as a cinematic lead, the rest sit 2-up beneath, so the gallery doesn't read as one uniform grid (2026-07 rhythm pass) */
  @media(min-width:561px){
    .wk2h--feat{grid-template-columns:1fr 1fr}
    .wk2h--feat>.wk2h__fig:first-child{grid-column:1/-1;aspect-ratio:16/9}
    .wk2h--feat>.wk2h__fig:first-child .wk2h__h{font-size:clamp(24px,2.6vw,36px)}
    .wk2h--feat>.wk2h__fig:first-child .wk2h__cap{padding:clamp(36px,5vw,60px) 20px 20px}
  }
  /* Public Benefit band — the civic / pro-bono angle, set apart from the artistry */
  .pb-band{border-top:1px solid rgba(184,153,104,0.18);background:rgba(184,153,104,0.03)}
  .pb-band__head{max-width:1340px;margin:0 auto;padding:clamp(34px,5vh,64px) clamp(18px,4.5vw,64px) 0}
  .pb-band__eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:#B89968}
  .pb-band__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(24px,3vw,38px);color:#F2EBD9;line-height:1.05;margin:11px 0 0;letter-spacing:-0.015em}
  .pb-band__lede{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(14px,1.1vw,17px);color:#DCD4BD;margin:12px 0 0;max-width:60ch;line-height:1.5}
  .pb-band .wk2h{padding-top:clamp(16px,3vh,28px)}
  /* Dégagé Design band — the designer's own hand: private Hill Country commissions, set apart from Noon's work. One tasteful attribution block (founder-name stays low-key). */
  .dd-band{border-top:1px solid rgba(238,123,83,0.18);background:linear-gradient(180deg,rgba(238,123,83,0.055),rgba(238,123,83,0.01))}
  .dd-band__head{max-width:1340px;margin:0 auto;padding:clamp(34px,5vh,64px) clamp(18px,4.5vw,64px) 0}
  .dd-band__eyebrow{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:#EE7B53}
  .dd-band__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(24px,3vw,38px);color:#F2EBD9;line-height:1.05;margin:11px 0 0;letter-spacing:-0.015em}
  .dd-band__lede{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(14px,1.1vw,17px);color:#DCD4BD;margin:12px 0 0;max-width:60ch;line-height:1.5}
  .dd-band .wk2h{padding-top:clamp(16px,3vh,28px);padding-bottom:0}
  .dd-band .wk2h__fig{margin:0}
  .dd-band__cta{max-width:1340px;margin:0 auto;padding:clamp(18px,2.4vh,26px) clamp(18px,4.5vw,64px) clamp(30px,4.5vh,56px)}
  .dd-band__cta a{display:inline-flex;align-items:center;gap:9px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#F2EBD9;text-decoration:none;padding:12px 20px;border:1px solid rgba(238,123,83,0.5);background:rgba(238,123,83,0.08);transition:background 240ms ease,border-color 240ms ease}
  .dd-band__cta a:hover{background:rgba(238,123,83,0.16);border-color:#EE7B53}
  .dd-band__cta a .arr{color:#EE7B53;transition:transform 240ms ease}
  .dd-band__cta a:hover .arr{transform:translateX(4px)}
  /* Thesis band — full padding on desktop, trimmed on mobile so the first project is reachable sooner */
  .thesis-band{padding:clamp(96px,24vh,220px) clamp(20px,5vw,64px)}
  @media(max-width:560px){.thesis-band{padding:clamp(30px,5vh,60px) clamp(20px,5vw,40px)}}

.bz {
  background: var(--bg);
  /* Top padding tightened — there is no longer an h2 / kicker filling it.
     The 4 cards arrive sooner; the divider closes with measured space below. */
  padding: clamp(80px, 11vh, 140px) clamp(28px, 5vw, 96px) clamp(60px, 8vh, 100px);
  border-top: 1px solid rgba(184,153,104,0.22);
  border-bottom: 0;
  position: relative;
  overflow: hidden;
}
/* Thick brass divider — sits under the 4 cards, separates the
   service ladder from the framework section below. The compositional
   thick-line the eye registers as "section break". */
.bz__divider {
  position: relative; z-index: 2;
  max-width: 1180px;
  margin: clamp(48px, 7vh, 84px) auto 0;
  height: 2px;
  background: linear-gradient(90deg,
    transparent 0%,
    rgba(184,153,104,0.85) 14%,
    rgba(184,153,104,0.85) 86%,
    transparent 100%);
}
.bz::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 25% 30%, rgba(184,153,104,0.025) 0%, transparent 55%),
    radial-gradient(circle at 75% 70%, rgba(232,126,45,0.020) 0%, transparent 60%);
  pointer-events: none;
}
.bz__inner { max-width: 1240px; margin: 0 auto; position: relative; }
.bz__head { text-align: center; max-width: 760px; margin: 0 auto clamp(64px, 10vh, 110px); }
.bz__kicker {
  display: inline-flex; align-items: center; gap: 18px;
  margin: 0 auto 28px;
  max-width: 760px;
}
.bz__kicker-rule {
  flex: 1; height: 1px; min-width: 30px;
  background: linear-gradient(90deg, transparent, rgba(184,153,104,0.55), transparent);
  opacity: 0.85;
}
.bz__kicker span:not(.bz__kicker-rule) {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10.5px; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--paper-3);
  white-space: nowrap;
}
.bz__h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(40px, 5.6vw, 76px);
  line-height: 1.0;
  letter-spacing: -0.026em;
  color: var(--paper);
  margin-bottom: 26px;
  text-wrap: balance;
}
.bz__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.bz__intro {
  font-family: 'Fraunces', Georgia, serif;
  font-style: normal; font-weight: 400;
  font-size: clamp(17px, 1.4vw, 21px);
  line-height: 1.6;
  color: var(--paper-2);
  max-width: 52ch; margin: 0 auto;
  text-wrap: pretty;
}
.bz__intro em { font-style: italic; color: var(--paper); }
.bz__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
  position: relative;
}
.bz__grid::after {
  content: '';
  position: absolute; top: -1px; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
  opacity: 0.32;
}
@media (max-width: 980px) { .bz__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .bz__grid { grid-template-columns: 1fr; } }
.bz__card {
  padding: 56px 32px 48px;
  border-right: 1px solid rgba(184,153,104,0.22);
  background: transparent;
  text-decoration: none;
  color: inherit;
  display: flex; flex-direction: column;
  transition: background 280ms ease;
}
.bz__card:last-child { border-right: 0; }
@media (max-width: 980px) {
  .bz__card:nth-child(2) { border-right: 0; }
  .bz__card:nth-child(1), .bz__card:nth-child(2) { border-bottom: 1px solid rgba(184,153,104,0.22); }
}
@media (max-width: 540px) {
  .bz__card { border-right: 0; border-bottom: 1px solid rgba(184,153,104,0.22); }
  .bz__card:last-child { border-bottom: 0; }
}
.bz__card:hover { background: rgba(184,153,104,0.025); }

.bz__card-num {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 18px;
  color: var(--brass);
  margin-bottom: 20px;
  letter-spacing: 0.01em;
  font-variant-numeric: oldstyle-nums;
}
.bz__card-h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(34px, 3.6vw, 52px);
  line-height: 1.0;
  letter-spacing: -0.022em;
  color: var(--paper);
  margin-bottom: 14px;
}
.bz__card-sub {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 400;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.45;
  color: var(--ember);
  margin-bottom: 22px;
}
.bz__card-body {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 400;
  font-size: 15.5px; line-height: 1.6;
  color: var(--paper-2);
  margin-bottom: 20px;
}
/* The honest KO line — concrete numbers, defensible claims. Not hype. */
.bz__card-punch {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-weight: 400;
  font-size: 14px;
  line-height: 1.55;
  color: var(--brass);
  margin-bottom: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(184,153,104,0.22);
}
.bz__card-punch strong {
  font-weight: 500;
  color: var(--ember);
  font-style: normal;
  font-family: 'Fraunces', Georgia, serif;
}
.bz__card-cta {
  margin-top: auto;
  display: inline-flex; align-items: center; gap: 8px;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--paper-3);
  transition: color 220ms ease, gap 220ms ease;
}
.bz__card:hover .bz__card-cta { color: var(--ember); gap: 12px; }

.triage{
  background:var(--bg-deep,#0F0F0E);
  padding:clamp(64px,9vh,112px) clamp(28px,5vw,96px) clamp(40px,6vh,72px);
  scroll-margin-top:24px;
}
.triage__inner{max-width:1180px;margin:0 auto;}
.triage__head{text-align:center;margin-bottom:clamp(32px,4.5vh,56px);}
.triage__kicker{display:inline-flex;align-items:center;gap:14px;margin-bottom:16px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass,#B89968);}
.triage__kicker-rule{display:inline-block;width:36px;height:1px;background:var(--brass,#B89968);opacity:0.6;}
.triage__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(32px,4.4vw,56px);line-height:1.02;letter-spacing:-0.022em;color:var(--paper,#F2EBD9);text-wrap:balance;max-width:22ch;margin:0 auto 14px;}
.triage__h em{font-style:italic;color:var(--ember,#E97E2D);font-weight:400;}
.triage__sub{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(16px,1.4vw,21px);line-height:1.5;color:var(--paper-2,#DCD4BD);max-width:54ch;margin:0 auto;}
.triage__sub em{font-style:italic;color:var(--paper,#F2EBD9);}

/* TILE GRID */
.triage__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px;
  margin-bottom:clamp(24px,3.5vh,40px);
}
@media (max-width:980px){.triage__grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:520px){.triage__grid{grid-template-columns:1fr;}}

.triage-tile{
  display:flex;flex-direction:column;
  text-align:left;
  background:rgba(184,153,104,0.04);
  border:1px solid rgba(184,153,104,0.22);
  padding:22px 22px 18px;
  cursor:pointer;
  transition:border-color 220ms ease,background 220ms ease,transform 220ms ease;
  font-family:inherit;color:inherit;
  appearance:none;-webkit-appearance:none;
  text-align:left;
}
.triage-tile:hover{
  border-color:rgba(232,126,45,0.55);
  background:rgba(232,126,45,0.04);
  transform:translateY(-2px);
}
.triage-tile.is-active{
  border-color:var(--ember,#E97E2D);
  background:rgba(232,126,45,0.10);
  box-shadow:0 0 0 1px rgba(232,126,45,0.30);
}
.triage-tile__icon{
  width:32px;height:32px;
  color:var(--brass,#B89968);
  margin-bottom:14px;
  transition:color 220ms ease;
}
.triage-tile:hover .triage-tile__icon,
.triage-tile.is-active .triage-tile__icon{color:var(--ember,#E97E2D);}
.triage-tile__h{
  font-family:'Fraunces',Georgia,serif;
  font-weight:500;font-size:18px;line-height:1.15;
  color:var(--paper,#F2EBD9);
  letter-spacing:-0.012em;
  margin-bottom:6px;
  text-wrap:balance;
}
.triage-tile__h em{font-style:italic;color:var(--ember,#E97E2D);font-weight:400;}
.triage-tile__sub{
  font-family:'Fraunces',Georgia,serif;
  font-style:italic;font-size:13.5px;line-height:1.5;
  color:var(--paper-2,#DCD4BD);
  margin-bottom:14px;
  flex:1;
}
.triage-tile__cta{
  align-self:flex-start;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;font-weight:500;
  letter-spacing:0.24em;text-transform:uppercase;
  color:var(--brass,#B89968);
  padding-top:10px;
  border-top:1px solid rgba(184,153,104,0.22);
  width:100%;
  display:flex;align-items:center;justify-content:space-between;gap:8px;
}
.triage-tile__cta .arr{font-size:1.1em;}
.triage-tile.is-active .triage-tile__cta{color:var(--ember,#E97E2D);border-top-color:rgba(232,126,45,0.45);}

/* The "full reading" tile — slightly emphasized as the "deep path" */
.triage-tile--full{
  background:rgba(232,126,45,0.04);
  border-color:rgba(232,126,45,0.35);
}
.triage-tile--full .triage-tile__icon{color:var(--ember,#E97E2D);}
.triage-tile--full .triage-tile__cta{color:var(--ember,#E97E2D);border-top-color:rgba(232,126,45,0.30);}

/* INLINE FORM PANEL — slides into view when a tile is selected */
.triage__form-wrap{
  max-height:0;
  overflow:hidden;
  transition:max-height 360ms cubic-bezier(0.22,1,0.36,1),opacity 280ms ease;
  opacity:0;
}
.triage__form-wrap.is-open{
  max-height:1400px;
  opacity:1;
}
.triage__form{
  background:rgba(15,15,14,0.88);
  border:1px solid var(--rule-2,rgba(184,153,104,0.34));
  padding:clamp(28px,4vw,44px);
  margin-bottom:clamp(20px,3vh,32px);
}
.triage__form-head{
  display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:18px;
  padding-bottom:18px;margin-bottom:22px;
  border-bottom:1px solid var(--rule,rgba(184,153,104,0.22));
}
.triage__form-h{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10.5px;font-weight:500;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--brass,#B89968);
}
.triage__form-h strong{
  display:block;
  font-family:'Fraunces',Georgia,serif;
  font-style:italic;font-weight:500;
  font-size:22px;letter-spacing:-0.014em;
  color:var(--paper,#F2EBD9);
  text-transform:none;
  margin-top:6px;
}
.triage__close{
  appearance:none;-webkit-appearance:none;
  background:transparent;border:0;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;font-weight:500;letter-spacing:0.24em;text-transform:uppercase;
  color:var(--paper-3,#A8A08B);
  cursor:pointer;
  padding:6px 10px;
  border-bottom:1px solid transparent;
  transition:color 200ms ease,border-color 200ms ease;
}
.triage__close:hover{color:var(--paper,#F2EBD9);border-bottom-color:var(--brass,#B89968);}

.triage__fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
@media (max-width:640px){.triage__fields{grid-template-columns:1fr;}}
.triage__field{display:flex;flex-direction:column;gap:6px;}
.triage__field--full{grid-column:1 / -1;}
.triage__field label{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;font-weight:500;
  letter-spacing:0.24em;text-transform:uppercase;
  color:var(--paper-3,#A8A08B);
}
.triage__field input,
.triage__field textarea{
  appearance:none;-webkit-appearance:none;
  background:var(--bg-2,#161616);
  border:1px solid rgba(184,153,104,0.34);
  color:var(--paper,#F2EBD9);
  font-family:'Fraunces',Georgia,serif;
  font-size:16px;
  padding:14px 16px;
  border-radius:2px;
  transition:border-color 200ms ease,box-shadow 200ms ease;
  width:100%;
}
.triage__field textarea{font-size:15.5px;line-height:1.5;resize:vertical;min-height:80px;}
.triage__field input:focus,
.triage__field textarea:focus{
  outline:none;
  border-color:var(--ember,#E97E2D);
  box-shadow:0 0 0 1px rgba(232,126,45,0.30);
}
.triage__field input::placeholder,
.triage__field textarea::placeholder{color:var(--paper-4,#6B6657);font-style:italic;}

.triage__submit-row{
  display:flex;flex-wrap:wrap;align-items:center;gap:18px 24px;
  margin-top:24px;
}
.triage__submit{
  appearance:none;-webkit-appearance:none;
  background:var(--ember,#E97E2D);
  border:0;
  font-family:'Fraunces',Georgia,serif;
  font-style:italic;font-weight:500;
  font-size:17px;
  color:var(--bg-deep,#0F0F0E);
  padding:14px 28px;
  cursor:pointer;
  display:inline-flex;align-items:center;gap:12px;
  border-radius:2px;
  transition:background 200ms ease,gap 200ms ease;
}
.triage__submit:hover{background:#F49350;gap:16px;}
.triage__submit .arr{font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal;font-size:0.85em;}
.triage__promise{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;font-weight:500;
  letter-spacing:0.22em;text-transform:uppercase;
  color:var(--paper-3,#A8A08B);
}
.triage__promise em{color:var(--brass,#B89968);font-style:normal;}

.triage__success{
  display:none;
  padding:18px 22px;
  margin-top:16px;
  background:rgba(111,133,89,0.08);
  border-left:2px solid var(--moss,#6F8559);
  font-family:'Fraunces',Georgia,serif;
  font-size:16px;line-height:1.55;
  color:var(--paper-2,#DCD4BD);
}
.triage__success.is-visible{display:block;}
.triage__success em{font-style:italic;color:var(--paper,#F2EBD9);}

/* "OR" SEPARATOR LEADING TO ESTIMATOR */
.triage__deep{
  text-align:center;
  margin-top:clamp(20px,3vh,32px);
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9.5px;font-weight:500;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--paper-3,#A8A08B);
}
.triage__deep a{
  display:inline-flex;align-items:center;gap:10px;
  color:var(--paper-2,#DCD4BD);
  border-bottom:1px solid rgba(184,153,104,0.34);
  padding-bottom:2px;
  margin-left:10px;
  text-transform:none;letter-spacing:0.02em;font-size:14px;
  font-family:'Fraunces',Georgia,serif;font-style:italic;
  transition:color 200ms ease,gap 200ms ease,border-color 200ms ease;
}
.triage__deep a:hover{color:var(--ember,#E97E2D);gap:14px;border-bottom-color:var(--ember,#E97E2D);}

@property --rdt-ang{syntax:'<angle>';initial-value:0deg;inherits:false;}
.rd-teaser{padding:clamp(48px,6vh,84px) clamp(24px,5vw,80px);display:flex;justify-content:center;background:var(--bg-deep,#0F0F0E);}
.rd-teaser__card{position:relative;display:block;max-width:760px;width:100%;text-align:center;padding:clamp(32px,5vw,52px) clamp(28px,5vw,56px);border-radius:12px;background:rgba(184,153,104,.045);transition:transform .3s cubic-bezier(.2,.7,.2,1);}
.rd-teaser__card:hover{transform:translateY(-3px);}
.rd-teaser__card::before{content:'';position:absolute;inset:-1px;border-radius:13px;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--rdt-ang),rgba(184,153,104,0) 0deg,rgba(184,153,104,0) 205deg,var(--brass,#B89968) 262deg,var(--ember,#E97E2D) 306deg,var(--ember-2,#F49350) 330deg,rgba(184,153,104,0) 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:rdtRevolve 14s linear infinite;}
.rd-teaser__card::after{content:'';position:absolute;inset:-5px;border-radius:16px;z-index:-1;pointer-events:none;background:radial-gradient(60% 130% at 50% 50%,rgba(232,126,45,.16),transparent 70%);filter:blur(7px);animation:rdtGlow 7s ease-in-out infinite;}
@keyframes rdtRevolve{to{--rdt-ang:360deg;}}
@keyframes rdtGlow{0%,100%{opacity:.28;}50%{opacity:.7;}}
.rd-teaser__kick{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--brass,#B89968);display:block;margin-bottom:18px;}
.rd-teaser__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(28px,4vw,46px);line-height:1.05;letter-spacing:-.02em;color:var(--paper,#F2EBD9);margin-bottom:16px;text-wrap:balance;}
.rd-teaser__h em{font-style:italic;color:var(--ember,#E97E2D);font-weight:400;}
.rd-teaser__sub{font-family:'Fraunces',Georgia,serif;font-size:clamp(15px,1.4vw,18px);line-height:1.55;color:var(--paper-2,#DCD4BD);max-width:52ch;margin:0 auto 24px;text-wrap:pretty;}
.rd-teaser__sub em{font-style:italic;color:var(--paper,#F2EBD9);}
.rd-teaser__go{display:inline-flex;align-items:center;gap:12px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;color:var(--ember,#E97E2D);transition:gap .25s;}
.rd-teaser__card:hover .rd-teaser__go{gap:18px;}
.rd-teaser__go .arr{font-style:normal;}
@media(prefers-reduced-motion:reduce){.rd-teaser__card::before,.rd-teaser__card::after{animation:none;}}

.spx {
  position: relative;
  /* Top padding tightened — without the h2 title above the columns, this section
     should arrive more directly after the bz divider. The 3 columns themselves
     carry the section header weight. */
  padding: clamp(72px, 10vh, 130px) clamp(28px, 5vw, 96px);
  background: var(--bg);
  border-top: 0;
  overflow: hidden;
}
/* Subtle paper-fiber texture overlay — atmospheric, not loud */
.spx::before {
  content: '';
  position: absolute; inset: 0;
  background-image:
    radial-gradient(circle at 20% 30%, rgba(184,153,104,0.025) 0%, transparent 50%),
    radial-gradient(circle at 80% 70%, rgba(232,126,45,0.020) 0%, transparent 55%);
  pointer-events: none;
}
.spx__inner {
  position: relative;
  max-width: 1240px;
  margin: 0 auto;
}

/* TAGLINE — small mono caps, brass hairlines */
.spx__tagline {
  display: flex; align-items: center; justify-content: center;
  gap: 18px;
  margin: 0 auto 56px;
  max-width: 720px;
}
.spx__tagline-rule {
  flex: 1; height: 1px;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
  opacity: 0.45;
}
.spx__tagline-text {
  font-family: var(--mono);
  font-size: 10.5px; font-weight: 500;
  letter-spacing: 0.26em; text-transform: uppercase;
  color: var(--paper-3);
  white-space: nowrap;
}

/* SECTION TITLE */
.spx__title {
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-weight: 500;
  font-size: clamp(40px, 6.2vw, 96px);
  line-height: 0.98;
  letter-spacing: -0.028em;
  color: var(--paper);
  text-align: center;
  margin: 0 auto 32px;
  max-width: 16ch;
  text-wrap: balance;
}
.spx__title .pt { color: var(--paper); }
.spx__title .sep {
  font-style: italic; color: var(--brass);
  font-weight: 400;
  padding: 0 0.12em;
  opacity: 0.7;
}

/* INTRO */
.spx__intro {
  font-family: 'Fraunces', var(--serif), Georgia, serif;
  font-style: italic; font-weight: 400;
  font-size: clamp(18px, 1.6vw, 24px);
  line-height: 1.5;
  letter-spacing: -0.006em;
  color: var(--paper-2);
  text-align: center;
  max-width: 36ch;
  margin: 0 auto clamp(64px, 10vh, 110px);
  text-wrap: pretty;
}

/* THREE PILLAR COLUMNS — no card backgrounds, hairline dividers only */
.spx__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  position: relative;
}
.spx__grid::after {
  /* a single hairline rule above the columns for grounding */
  content: '';
  position: absolute; top: -1px; left: 0; right: 0;
  height: 1px;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
  opacity: 0.32;
}
@media (max-width: 880px) {
  .spx__grid { grid-template-columns: 1fr; }
}
.spx__pillar {
  padding: 56px 36px 48px;
  border-right: 1px solid rgba(184,153,104,0.22);
  position: relative;
  /* Soft reveal — opacity + slight rise */
  opacity: 0;
  transform: translateY(14px);
  transition: opacity 1100ms cubic-bezier(0.22,0.61,0.36,1),
              transform 1100ms cubic-bezier(0.22,0.61,0.36,1);
}
.spx__pillar.is-revealed {
  opacity: 1;
  transform: translateY(0);
}
.spx__pillar:nth-child(2) { transition-delay: 180ms; }
.spx__pillar:nth-child(3) { transition-delay: 360ms; }
.spx__pillar:last-child { border-right: 0; }
@media (max-width: 880px) {
  .spx__pillar { border-right: 0; border-bottom: 1px solid rgba(184,153,104,0.22); padding: 56px 0; }
  .spx__pillar:last-child { border-bottom: 0; }
}

/* Roman numeral + motif row */
.spx__head {
  display: flex; align-items: flex-end; justify-content: space-between;
  margin-bottom: 28px;
  border-bottom: 1px solid rgba(184,153,104,0.14);
  padding-bottom: 18px;
}
.spx__num {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 22px;
  letter-spacing: 0.01em;
  color: var(--brass);
  font-variant-numeric: oldstyle-nums;
}
.spx__motif {
  width: 38px; height: 38px;
  color: var(--brass);
  opacity: 0.55;
}
.spx__motif svg { width: 100%; height: 100%; display: block; }

/* Pillar name */
.spx__h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(34px, 3.6vw, 54px);
  line-height: 1.0;
  letter-spacing: -0.022em;
  color: var(--paper);
  margin-bottom: 12px;
}

/* Italic subtitle */
.spx__sub {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 400;
  font-size: clamp(15px, 1.2vw, 18px);
  line-height: 1.45;
  color: var(--ember);
  margin-bottom: 24px;
  letter-spacing: -0.004em;
}

/* Body copy — upright Fraunces, comfortable */
.spx__body {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 400;
  font-size: 15.5px;
  line-height: 1.65;
  color: var(--paper-2);
  margin-bottom: 28px;
  text-wrap: pretty;
}

/* Quiet link to the pillar's full page */
.spx__cta {
  display: inline-flex; align-items: center; gap: 8px;
  font-family: var(--mono);
  font-size: 10px; font-weight: 500;
  letter-spacing: 0.24em; text-transform: uppercase;
  color: var(--paper-3);
  text-decoration: none;
  transition: color 220ms ease, gap 220ms ease;
}
.spx__cta::after {
  content: '→';
  display: inline-block;
  transition: transform 220ms ease;
}
.spx__cta:hover { color: var(--ember); gap: 12px; }
.spx__cta:hover::after { transform: translateX(2px); }

/* Fast value-prop bullets — each pillar becomes a quick scan
   that demonstrates HOW Noon keeps prices low + expertise honest. */
.spx__bullets {
  list-style: none;
  margin: 0 0 24px;
  padding: 0;
  display: flex; flex-direction: column; gap: 10px;
}
.spx__bullets li {
  display: flex; align-items: baseline; gap: 10px;
  font-family: 'Fraunces', Georgia, serif;
  font-size: 15.5px; line-height: 1.45;
  color: var(--paper);
}
.spx__bullets li .b-dot {
  flex-shrink: 0; font-style: normal;
  color: var(--ember); font-weight: 500;
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 14px;
}
.spx__bullets li em {
  font-style: italic; color: var(--paper-2);
}
.spx__bullets li strong {
  font-weight: 500; color: var(--ember); font-style: normal;
}

@media (prefers-reduced-motion: reduce) {
  .spx__pillar { opacity: 1; transform: none; transition: none; }
}

.lscat { background: var(--bg-deep); padding: clamp(80px, 12vh, 140px) clamp(28px, 5vw, 96px); border-top: 1px solid rgba(184,153,104,0.22); border-bottom: 1px solid rgba(184,153,104,0.22); }
.lscat__inner { max-width: 1180px; margin: 0 auto; }
.lscat__head { text-align: center; max-width: 720px; margin: 0 auto clamp(40px, 6vh, 64px); }
.lscat__kick { display: inline-flex; align-items: center; gap: 16px; margin-bottom: 22px; font-family: 'Inter', sans-serif; font-size: 10.5px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--brass); }
.lscat__kick-rule { display: inline-block; width: 36px; height: 1px; background: var(--brass); opacity: 0.55; }
.lscat__h { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(34px, 4.6vw, 60px); line-height: 1.0; letter-spacing: -0.022em; color: var(--paper); margin-bottom: 18px; text-wrap: balance; }
.lscat__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.lscat__intro { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 400; font-size: clamp(16px, 1.35vw, 19px); line-height: 1.6; color: var(--paper-2); max-width: 54ch; margin: 0 auto; }

.lscat__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  background: rgba(184,153,104,0.22);
  border: 1px solid rgba(184,153,104,0.22);
}
@media (max-width: 960px) { .lscat__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .lscat__grid { grid-template-columns: 1fr; } }

.lscat__card {
  background: var(--bg-deep);
  padding: 26px 22px 24px;
  display: flex; flex-direction: column; gap: 10px;
  min-height: 200px;
  color: inherit;
  transition: background 280ms ease;
}
.lscat__card:hover { background: rgba(184,153,104,0.06); }
.lscat__card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.lscat__card-no {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 14px; color: var(--brass);
  font-variant-numeric: oldstyle-nums;
}
.lscat__card-icon { width: 26px; height: 26px; color: var(--brass); transition: color 280ms ease, transform 280ms ease; }
.lscat__card:hover .lscat__card-icon { color: var(--ember); transform: rotate(8deg); }
.lscat__card-h {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: clamp(22px, 2.2vw, 28px);
  line-height: 1.05;
  letter-spacing: -0.016em;
  color: var(--paper);
}
.lscat__card-h em { font-style: italic; color: var(--ember); font-weight: 400; }
.lscat__card-desc {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: 14.5px;
  line-height: 1.5;
  color: var(--paper-2);
}
.lscat__card-egs {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 9.5px; font-weight: 500;
  letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--paper-3);
  margin-top: auto;
  padding-top: 14px;
  line-height: 1.5;
}
.lscat__card-egs::before {
  content: '';
  display: block;
  width: 24px; height: 1px;
  background: var(--brass);
  opacity: 0.40;
  margin-bottom: 10px;
}

.lscat__cta { text-align: center; margin-top: clamp(36px, 5vh, 56px); padding-top: clamp(28px, 4vh, 44px); border-top: 1px solid var(--rule); }
.lscat__cta-text {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: clamp(16px, 1.3vw, 19px);
  color: var(--paper-2);
  max-width: 54ch;
  margin: 0 auto 22px;
  line-height: 1.55;
}
.lscat__cta-text em { font-style: italic; color: var(--paper); }
.lscat__cta-btn {
  display: inline-flex; align-items: center; gap: 14px;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic;
  font-size: clamp(18px, 1.6vw, 22px);
  color: var(--paper);
  transition: gap 240ms ease, color 240ms ease;
}
.lscat__cta-btn::before {
  content: ''; display: inline-block;
  width: 44px; height: 1px;
  background: var(--brass); opacity: 0.55;
  transition: width 240ms ease, opacity 240ms ease;
}
.lscat__cta-btn:hover { gap: 20px; color: var(--ember); }
.lscat__cta-btn:hover::before { width: 60px; opacity: 0.85; }
.lscat__cta-btn .arr {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 0.7em;
  color: var(--brass);
}
.lscat__cta-btn:hover .arr { color: var(--ember); }

.hp-thesis{max-width:1280px;margin:0 auto;padding:clamp(64px,9vh,124px) clamp(20px,5vw,56px);border-top:1px solid rgba(184,153,104,0.16);}
    .hp-thesis__inner{max-width:780px;}
    .hp-thesis__eyebrow{display:flex;align-items:center;gap:14px;margin-bottom:24px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:600;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);}
    .hp-thesis__eyebrow .r{height:1px;width:34px;background:var(--brass);opacity:.5;flex:0 0 auto;}
    .hp-thesis__eyebrow .r--grow{flex:1;}
    .hp-thesis__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(32px,4.5vw,62px);line-height:1.03;letter-spacing:-0.023em;color:var(--paper);margin:0 0 26px;text-wrap:balance;}
    .hp-thesis__h em{font-style:italic;color:var(--ember);font-weight:400;}
    .hp-thesis__lede{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(19px,1.7vw,26px);line-height:1.48;color:var(--paper);margin:0 0 18px;text-wrap:pretty;max-width:30ch;}
    .hp-thesis__body{font-family:'Fraunces',Georgia,serif;font-size:clamp(16px,1.3vw,19px);line-height:1.66;color:var(--paper-2);max-width:60ch;margin:0 0 30px;text-wrap:pretty;}
    .hp-thesis__body em{font-style:italic;color:var(--paper);}
    .hp-thesis__body a{color:var(--ember);border-bottom:1px solid rgba(232,126,45,.4);transition:color .2s ease;}
    .hp-thesis__body a:hover{color:var(--ember-2,#F49350);}
    .hp-thesis__cta{display:inline-flex;align-items:center;gap:11px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11.5px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;color:var(--paper);transition:gap .24s ease,color .24s ease;}
    .hp-thesis__cta:hover{color:var(--ember);gap:15px;}
    .hp-thesis__cta .arr{color:var(--ember);font-family:ui-monospace,monospace;}

.lm2{position:relative;max-width:1120px;margin:0 auto;padding:clamp(56px,9vh,120px) clamp(20px,5vw,72px);border-top:1px solid rgba(184,153,104,0.18);}
    .lm2__eyebrow{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:18px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass,#B89968);}
    .lm2__eyebrow .r{display:inline-block;width:42px;height:1px;background:var(--brass,#B89968);opacity:0.55;}
    .lm2__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(38px,6vw,76px);line-height:1.02;letter-spacing:-0.03em;color:var(--paper,#F2EBD9);text-align:center;max-width:15ch;margin:0 auto 16px;text-wrap:balance;}
    .lm2__h em{font-style:italic;color:inherit;font-weight:400;}
    .lm2__lede{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(17px,1.7vw,22px);line-height:1.5;color:var(--paper-2,#DCD4BD);text-align:center;max-width:52ch;margin:0 auto clamp(28px,5vh,48px);text-wrap:pretty;}
    .lm2__lede em{color:inherit;font-style:italic;}
    .lm2__mark{position:relative;width:360px;max-width:80vw;aspect-ratio:1;margin:0 auto;}
    .lm2__mark::after{content:'';position:absolute;inset:-6%;border-radius:50%;pointer-events:none;z-index:2;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='t'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' seed='11'/><feColorMatrix values='0 0 0 0 0.55  0 0 0 0 0.44  0 0 0 0 0.30  0 0 0 0.6 0'/></filter><rect width='100%25' height='100%25' filter='url(%23t)'/></svg>"),url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='300' height='300'><filter id='c'><feTurbulence type='fractalNoise' baseFrequency='0.035' numOctaves='3' seed='4'/><feColorMatrix values='0 0 0 0 0.52  0 0 0 0 0.48  0 0 0 0 0.40  0 0 0 0.4 0'/></filter><rect width='100%25' height='100%25' filter='url(%23c)'/></svg>");mix-blend-mode:overlay;opacity:0.34;-webkit-mask-image:radial-gradient(circle,#000 58%,transparent 80%);mask-image:radial-gradient(circle,#000 58%,transparent 80%);}
    .lm2__mark svg{width:100%;height:100%;display:block;position:relative;z-index:1;overflow:visible;}
    .lm2__glow{position:absolute;inset:20%;border-radius:50%;background:radial-gradient(circle,rgba(200,122,88,0.16),rgba(200,122,88,0.04) 52%,transparent 72%);filter:blur(22px);z-index:0;}   /* stain, not glow */
    .lm2__base{fill:none;stroke:rgba(184,153,104,0.13);stroke-width:14;}
    .lm2__arc{fill:none;stroke-width:10;stroke-linecap:round;}
    .lm2__thresh{fill:none;stroke:rgba(184,153,104,0.20);stroke-width:1;}
    .lm2__ticks{fill:none;stroke:rgba(233,214,180,0.13);stroke-width:7;stroke-dasharray:1 9.47;}
    .lm2__tip{opacity:0.85;}
    .lm2__heartring{fill:none;stroke:#EE7B53;stroke-width:1.4;opacity:0.85;}
    .lm2__halo{fill:none;stroke:#EE7B53;}
    .lm2__heart{fill:#D8734D;animation:lm2beat 3.4s ease-in-out infinite;}
    @keyframes lm2beat{0%,100%{r:8px;}50%{r:10.5px;}}
    /* the life is kindled at the center once the land is whole */
    .lm2__life{transform-box:view-box;transform-origin:150px 150px;}
    /* scroll choreography — enhancement only; without JS the finished mark simply shows */
    .lm2__mark--anim .lm2__arc{stroke-dashoffset:505;}   /* real-unit spiral arms (Safari-safe) */
    .lm2__mark--anim .lm2__life{opacity:0;transform:scale(0.35);}
    .lm2__mark--anim .lm2__tips{opacity:0;}
    .lm2__mark--anim.is-in .lm2__arc{stroke-dashoffset:0;transition:stroke-dashoffset 1.15s cubic-bezier(0.4,0,0.15,1);}
    /* arcs are circles 1-5 inside the rough-filter <g> (v7) - delays rebased */
    .lm2__mark--anim.is-in .lm2__arc:nth-of-type(2){transition-delay:0.16s;}
    .lm2__mark--anim.is-in .lm2__arc:nth-of-type(3){transition-delay:0.32s;}
    .lm2__mark--anim.is-in .lm2__arc:nth-of-type(4){transition-delay:0.48s;}
    .lm2__mark--anim.is-in .lm2__arc:nth-of-type(5){transition-delay:0.64s;}
    .lm2__mark--anim.is-in .lm2__life{opacity:1;transform:scale(1);transition:opacity 0.9s ease,transform 1.2s cubic-bezier(0.34,1.36,0.5,1);transition-delay:1s;}
    .lm2__mark--anim.is-in .lm2__tips{opacity:1;transition:opacity 0.5s ease;transition-delay:1.15s;}
    @media(prefers-reduced-motion:reduce){.lm2__heart{animation:none;}.lm2__mark--anim .lm2__arc{stroke-dashoffset:0;}.lm2__mark--anim .lm2__life{opacity:1;transform:none;}.lm2__mark--anim .lm2__tips{opacity:1;}}
    .lm2__legend{max-width:840px;margin:clamp(30px,5vh,50px) auto 0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3.4vw,48px);}
    @media(max-width:680px){.lm2__legend{grid-template-columns:1fr;gap:22px;}}
    .lm2__leg{display:flex;gap:13px;align-items:flex-start;}
    .lm2__leg-dot{width:13px;height:13px;border-radius:50%;flex:0 0 auto;margin-top:6px;}
    .lm2__leg-dot--land{background:conic-gradient(#6C98A0,#B08054,#C6A96E,#8CA077,#B27E68,#6C98A0);}
    .lm2__leg-dot--life{background:#EE7B53;box-shadow:0 0 10px rgba(238,123,83,0.75);}
    .lm2__leg p{font-size:15px;line-height:1.55;color:var(--paper-3,#A8A08B);margin:0;}
    .lm2__leg b{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:18px;color:var(--paper,#F2EBD9);}
    .lm2__leg em{font-style:italic;color:var(--paper-2,#DCD4BD);}
    .lm2__leg-note{display:block;margin-top:5px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:var(--paper-4,#6B6657);}
    .lm2__foot{text-align:center;max-width:48ch;margin:clamp(32px,5vh,50px) auto 0;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(18px,2vw,26px);line-height:1.4;color:var(--paper,#F2EBD9);text-wrap:balance;}
    .lm2__foot em{font-style:italic;color:var(--ember,#E97E2D);}
    .lm2__ctawrap{text-align:center;}
    .lm2__cta{display:inline-flex;align-items:center;gap:12px;margin-top:24px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:12px;font-weight:600;letter-spacing:0.14em;text-transform:uppercase;color:#0F0F0E;background:var(--ember,#E97E2D);padding:15px 30px;border-radius:3px;text-decoration:none;transition:background .2s,gap .2s;}
    .lm2__cta:hover{background:#F2B85A;gap:18px;}

.hp-work{max-width:1300px;margin:0 auto;padding:clamp(64px,8vh,96px) clamp(20px,5vw,72px) clamp(56px,7vh,88px);}
    .hp-work__kicker{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:14px;}
    .hp-work__kicker-rule{display:inline-block;width:42px;height:1px;background:var(--brass);opacity:0.55;}
    .hp-work__kicker-label{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);}
    .hp-work__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(34px,4.7vw,62px);line-height:1.12;letter-spacing:-0.024em;color:var(--paper);text-align:center;max-width:20ch;margin:0 auto 16px;text-wrap:balance;padding-bottom:0.06em;}
    .hp-work__h em{font-style:italic;color:var(--ember);font-weight:400;}
    .hp-work__sub{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(17px,1.4vw,22px);line-height:1.5;color:var(--paper-2);text-align:center;max-width:52ch;margin:0 auto clamp(40px,5.5vh,64px);}
    .hp-work__grid{display:grid;grid-template-columns:repeat(12,1fr);gap:12px;counter-reset:nwork;}
    .hp-work__fig{counter-increment:nwork;box-shadow:inset 0 0 0 1px rgba(184,153,104,0.18);}
    .hp-work__fig::before{content:counter(nwork,decimal-leading-zero);position:absolute;top:0;left:0;z-index:3;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:.2em;color:var(--paper);padding:7px 12px;border-right:1px solid rgba(184,153,104,0.42);border-bottom:1px solid rgba(184,153,104,0.42);background:rgba(12,11,10,0.42);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);}
    .hp-work__fig{position:relative;margin:0;overflow:hidden;background:#0c0b0a;transform:translateZ(0);}
    .hp-work__fig img{display:block;width:100%;height:100%;object-fit:cover;transition:transform 1100ms cubic-bezier(.2,.7,.2,1);transform:translateZ(0);backface-visibility:hidden;will-change:transform;}
    .hp-work__fig:hover img{transform:translateZ(0) scale(1.055);}
    .hp-work__cap{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:clamp(36px,4vw,56px) clamp(16px,2.4vw,28px) clamp(15px,1.9vw,22px);background:linear-gradient(to top,rgba(12,11,10,0.92),rgba(12,11,10,0.26) 60%,transparent);}
    .hp-work__cap-k{display:block;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:500;letter-spacing:.2em;text-transform:uppercase;color:var(--brass);margin-bottom:7px;}
    .hp-work__cap-l{display:block;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(15px,1.2vw,21px);line-height:1.28;color:var(--paper);}
    .hp-work__fig--feature{grid-column:span 12;aspect-ratio:3.8/1;}
    .hp-work__fig--w8{grid-column:span 8;aspect-ratio:2/1;}
    .hp-work__fig--w4{grid-column:span 4;aspect-ratio:1/1;}
    @media (max-width:820px){
      .hp-work__grid{grid-template-columns:1fr;gap:10px;}
      .hp-work__fig--feature{grid-column:span 1;aspect-ratio:16/10;}
      .hp-work__fig--w8{grid-column:span 1;aspect-ratio:16/10;}
      .hp-work__fig--w4{grid-column:span 1;aspect-ratio:4/3;}
    }
    .hp-work__more{display:flex;justify-content:center;margin-top:clamp(30px,4vh,52px);}
    .hp-work__more a{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:var(--paper-2);border-bottom:1px solid rgba(184,153,104,0.34);padding-bottom:6px;transition:color .25s ease,border-color .25s ease;}
    .hp-work__more a:hover{color:var(--ember);border-color:var(--ember);}

.hp-dir { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:clamp(18px,3.4vw,40px); max-width:1280px; margin:0 auto; padding:clamp(30px,5vh,48px) clamp(28px,5vw,96px); border-top:1px solid rgba(184,153,104,0.22); background:var(--bg-deep); }
.hp-dir__link { font-family:'JetBrains Mono',ui-monospace,monospace; font-size:12px; font-weight:500; letter-spacing:0.2em; text-transform:uppercase; color:var(--paper-2); text-decoration:none; transition:color 220ms ease; }
.hp-dir__link:hover { color:var(--ember); }
.hp-dir__link--cta { color:var(--brass); }
.hp-dir__link--cta:hover { color:var(--ember); }

.ls-home { background: var(--bg-deep); padding: clamp(96px, 14vh, 160px) clamp(28px, 5vw, 96px); border-top: 1px solid rgba(184,153,104,0.22); position: relative; overflow: hidden; }
.ls-home__inner { max-width: 1280px; margin: 0 auto; position: relative; z-index: 2; }
/* Decorative botanical tap-root drawing — runs as a spine down the
   center of the section behind the tiers. Hidden on narrow screens. */
.ls-spine {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: clamp(260px, 28vw, 380px); height: 100%;
  pointer-events: none; z-index: 1;
  opacity: 0.35;
  mix-blend-mode: screen;
}
.ls-spine svg { width: 100%; height: 100%; display: block; }
.ls-spine .stroke { fill: none; stroke: var(--brass); stroke-linecap: round; stroke-linejoin: round; }
.ls-spine .leaf { fill: var(--ember); }
.ls-spine .root-hair { stroke: var(--brass); fill: none; stroke-linecap: round; opacity: 0.85; }
@media (max-width: 760px) {
  .ls-spine { opacity: 0.18; width: 200px; }
}
/* Cells need their own background to remain readable over the spine */
.ls-home__cell { background: rgba(15,15,14,0.55); backdrop-filter: blur(2px); }
.ls-home__cell:hover { background: rgba(184,153,104,0.08); }
/* Sacred-geometry SVG glyph beside each cell number.
   Inherits brass via currentColor; subtle ember-glow on cell hover. */
.ls-cell-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
.ls-home__glyph {
  width: 26px; height: 26px;
  color: var(--brass);
  opacity: 0.85;
  transition: color 280ms ease, opacity 280ms ease, transform 280ms ease;
}
.ls-home__cell:hover .ls-home__glyph {
  color: var(--ember);
  opacity: 1;
  transform: rotate(8deg);
}
.ls-home__head { text-align: center; max-width: 720px; margin: 0 auto clamp(56px, 8vh, 88px); }
.ls-home__kicker { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 22px; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: var(--paper-3); }
.ls-home__kicker-rule { display: inline-block; width: 30px; height: 1px; background: var(--brass); opacity: 0.55; }
.ls-home__h { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(40px, 5.4vw, 72px); line-height: 1.02; letter-spacing: -0.024em; color: var(--paper); margin-bottom: 22px; text-wrap: balance; }
.ls-home__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.ls-home__intro { font-family: 'Fraunces', Georgia, serif; font-weight: 400; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.6; color: var(--paper-2); max-width: 60ch; margin: 0 auto; text-wrap: pretty; }
/* TAP-ROOT HIERARCHY — three descending tiers.
   Reads top→down: Soul (broad crown), Vitality (trunk),
   Foundation (deepest, narrowest — the tap root). The taper
   carries the metaphor: as you go deeper into the property,
   the essentials concentrate into a single root system that
   the visible cultural canopy depends on. */
.ls-tier { margin-top: clamp(48px, 7vh, 80px); margin-left: auto; margin-right: auto; transition: max-width 400ms ease; }
.ls-tier:first-of-type { margin-top: 0; }
/* Progressive tap-root taper — the visible crown sits widest,
   the foundational root deepest and narrowest. */
.ls-tier--soul       { max-width: 100%; }
.ls-tier--vitality   { max-width: 86%; }
.ls-tier--foundation { max-width: 72%; }
@media (max-width: 960px) {
  .ls-tier--vitality, .ls-tier--foundation { max-width: 100%; }
}
.ls-tier__head { display: flex; align-items: baseline; gap: 18px; margin-bottom: 22px; flex-wrap: wrap; padding-left: clamp(0px, 2vw, 12px); }
.ls-tier__roman { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 500; font-size: 17px; color: var(--brass); font-variant-numeric: oldstyle-nums; }
.ls-tier__label { font-family: 'Inter', sans-serif; font-size: 11px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: var(--paper-2); }
.ls-tier__sub { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 400; font-size: 15px; line-height: 1.55; color: var(--paper-3); margin-left: auto; max-width: 38ch; text-align: right; }
@media (max-width: 760px) { .ls-tier__sub { margin-left: 0; text-align: left; max-width: 100%; } }
.ls-tier__grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border-top: 1px solid rgba(184,153,104,0.22); border-left: 1px solid rgba(184,153,104,0.22); }
@media (max-width: 960px) { .ls-tier__grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .ls-tier__grid { grid-template-columns: 1fr; } }
.ls-home__cell { padding: 32px 26px 30px; border-right: 1px solid rgba(184,153,104,0.22); border-bottom: 1px solid rgba(184,153,104,0.22); background: transparent; transition: background 220ms ease; }
.ls-home__cell:hover { background: rgba(184,153,104,0.04); }
.ls-home__num { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 500; font-size: 13px; color: var(--brass); margin-bottom: 14px; font-variant-numeric: oldstyle-nums; }
.ls-home__cell-h { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(22px, 2.6vw, 32px); line-height: 1.05; color: var(--paper); margin-bottom: 10px; letter-spacing: -0.014em; }
.ls-home__cell-tag { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 400; font-size: 14.5px; line-height: 1.5; color: var(--paper-3); }
/* "Roots into" connector — brass downward stroke. Pulls the eye
   deeper into the page, into the literal ground. */
.ls-tier-builds { display: flex; align-items: center; justify-content: center; gap: 14px; padding: clamp(24px, 4vh, 40px) 0 0; font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; color: var(--paper-4); }
.ls-tier-builds__rule { display: inline-block; width: 64px; height: 1px; background: linear-gradient(90deg, transparent, rgba(184,153,104,0.55), transparent); }
.ls-tier-builds__arr { font-family: 'JetBrains Mono', ui-monospace, monospace; color: var(--brass); font-size: 14px; }
/* Tier color cue: Soul reads airy/italic at top, Foundation reads
   grounded/saturated at the bottom — the deepest content holds. */
.ls-tier--soul .ls-home__cell-h { font-style: italic; }
.ls-tier--foundation .ls-home__cell-tag { color: var(--paper-2); }
.ls-tier--foundation .ls-home__cell-h { font-weight: 500; }
.ls-home__more { text-align: center; margin-top: clamp(40px, 6vh, 64px); }
.ls-home__more a { font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 11px; font-weight: 500; letter-spacing: 0.24em; text-transform: uppercase; color: var(--paper-3); display: inline-flex; gap: 10px; align-items: center; transition: color 220ms ease, gap 220ms ease; }
.ls-home__more a:hover { color: var(--ember); gap: 14px; }

/* WHY NOON — single editorial block */
.why { background: var(--bg); padding: clamp(96px, 14vh, 160px) clamp(28px, 5vw, 96px); border-top: 1px solid rgba(184,153,104,0.22); }
.why__inner { max-width: 880px; margin: 0 auto; text-align: center; }
.why__kicker { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 22px; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; letter-spacing: 0.26em; text-transform: uppercase; color: var(--paper-3); }
.why__kicker-rule { display: inline-block; width: 30px; height: 1px; background: var(--brass); opacity: 0.55; }
.why__h { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(36px, 5vw, 64px); line-height: 1.0; letter-spacing: -0.022em; color: var(--paper); margin-bottom: 32px; text-wrap: balance; }
.why__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.why__body { font-family: 'Fraunces', Georgia, serif; font-weight: 400; font-size: clamp(17px, 1.4vw, 21px); line-height: 1.7; color: var(--paper-2); max-width: 62ch; margin: 0 auto; text-wrap: pretty; }

/* FINAL CTA */
.final-cta { background: var(--bg-deep); padding: clamp(72px, 10vh, 112px) clamp(28px, 5vw, 96px); text-align: center; border-top: 1px solid rgba(184,153,104,0.22); }
.final-cta__kicker { display: inline-flex; align-items: center; gap: 14px; margin-bottom: 22px; font-family: 'JetBrains Mono', ui-monospace, monospace; font-size: 10.5px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--brass); }
.final-cta__kicker-rule { display: inline-block; width: 30px; height: 1px; background: var(--brass); opacity: 0.55; }
.final-cta__h { font-family: 'Fraunces', Georgia, serif; font-weight: 500; font-size: clamp(40px, 5.6vw, 76px); line-height: 1.0; letter-spacing: -0.024em; color: var(--paper); margin-bottom: 36px; max-width: 22ch; margin-left: auto; margin-right: auto; text-wrap: balance; }
.final-cta__h em { font-style: italic; color: var(--ember); font-weight: 400; }
.final-cta__btn { display: inline-flex; align-items: center; gap: 18px; font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 400; font-size: clamp(20px, 2.2vw, 28px); color: var(--paper); text-decoration: none; transition: gap 280ms cubic-bezier(0.22,0.61,0.36,1), color 280ms ease; padding: 18px 0; }
.final-cta__btn::before { content: ''; display: inline-block; width: 56px; height: 1px; background: var(--brass); opacity: 0.55; transition: background 280ms ease, opacity 280ms ease; }
.final-cta__btn::after { content: '\2192'; font-family: 'JetBrains Mono', ui-monospace, monospace; font-style: normal; font-size: 0.7em; color: var(--brass); transition: color 280ms ease; }
.final-cta__btn:hover { gap: 26px; color: var(--ember); }
.final-cta__btn:hover::before { background: var(--ember); opacity: 1; }
.final-cta__btn:hover::after { color: var(--ember); }

.entry { background: var(--bg-deep); padding: clamp(56px, 8vh, 90px) clamp(28px, 5vw, 96px); border-top: 1px solid rgba(184,153,104,0.22); border-bottom: 1px solid rgba(184,153,104,0.22); }
.entry__inner { max-width: 1080px; margin: 0 auto; }
.entry__head { text-align: center; margin-bottom: clamp(28px, 4vh, 44px); display: flex; align-items: center; justify-content: center; gap: 22px; flex-wrap: wrap; }
.entry__kick { display: inline-flex; align-items: center; gap: 14px; font-family: 'Inter', sans-serif; font-size: 10px; font-weight: 500; letter-spacing: 0.28em; text-transform: uppercase; color: var(--brass); }
.entry__kick-rule { display: inline-block; width: 28px; height: 1px; background: var(--brass); opacity: 0.55; }
.entry__h { font-family: 'Fraunces', Georgia, serif; font-style: italic; font-weight: 500; font-size: clamp(20px, 2.0vw, 26px); line-height: 1.1; letter-spacing: -0.012em; color: var(--paper); margin: 0; text-wrap: balance; }
.entry__h em { font-style: italic; color: var(--ember); font-weight: 400; }
/* Lede removed — the kicker + h2 + list speak for themselves now. */

/* The list — compressed editorial directory, 2-col on desktop. */
.entry__list {
  list-style: none; margin: 0; padding: 0;
  display: grid; grid-template-columns: 1fr 1fr;
  gap: 0;
  border-top: 1px solid rgba(184,153,104,0.22);
  border-left: 1px solid rgba(184,153,104,0.22);
}
@media (max-width: 720px) { .entry__list { grid-template-columns: 1fr; } }
.entry__row { border-bottom: 1px solid rgba(184,153,104,0.22); border-right: 1px solid rgba(184,153,104,0.22); }
.entry__link {
  display: grid;
  grid-template-columns: 32px 1fr auto;
  align-items: baseline;
  gap: 14px;
  padding: 14px 18px;
  color: inherit;
  text-decoration: none;
  transition: background 240ms ease;
}
.entry__link:hover { background: rgba(184,153,104,0.045); }
.entry__no {
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 500;
  font-size: 13px; color: var(--brass);
  font-variant-numeric: oldstyle-nums;
}
.entry__archetype {
  font-family: 'Fraunces', Georgia, serif;
  font-weight: 500;
  font-size: 15.5px;
  line-height: 1.2;
  letter-spacing: -0.008em;
  color: var(--paper);
}
.entry__archetype .em {
  font-style: italic;
  color: var(--paper-3);
  font-weight: 400;
  font-size: 13.5px;
  display: inline;
  margin-left: 4px;
}
.entry__link:hover .entry__archetype .em { color: var(--ember); }
.entry__action { display: none; }
.entry__arrow {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-size: 12px;
  color: var(--brass);
  transition: transform 240ms cubic-bezier(0.22,0.61,0.36,1), color 240ms ease;
}
.entry__link:hover .entry__arrow { transform: translateX(4px); color: var(--ember); }

.hp-tools{max-width:1180px;margin:0 auto;padding:clamp(64px,8vh,92px) var(--gutter);border-top:1px solid var(--rule);}
.hp-tools__inner{display:grid;grid-template-columns:1fr auto;gap:24px 40px;align-items:center;}
@media (max-width:780px){.hp-tools__inner{grid-template-columns:1fr;text-align:center;}}
.hp-tools__kicker{display:inline-flex;align-items:center;gap:14px;margin-bottom:12px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);}
.hp-tools__kicker-rule{display:inline-block;width:30px;height:1px;background:var(--brass);opacity:0.55;}
.hp-tools__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(20px,2.2vw,28px);line-height:1.25;letter-spacing:-0.012em;color:var(--paper);max-width:48ch;text-wrap:balance;}
.hp-tools__h em{font-style:italic;color:var(--paper);font-weight:400;}
.hp-tools__cta{display:inline-flex;align-items:center;gap:12px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:16.5px;color:var(--paper);border-bottom:1px solid var(--brass);padding-bottom:5px;transition:gap 220ms ease,color 220ms ease;white-space:nowrap;}
.hp-tools__cta:hover{gap:16px;color:var(--ember);}
.hp-tools__cta .arr{font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal;font-size:0.78em;color:var(--brass);}

.hp-testi{max-width:1200px;margin:0 auto;padding:clamp(64px,9vh,120px) clamp(24px,5vw,80px) clamp(20px,3vh,40px);}
.hp-testi__kicker{display:flex;align-items:center;justify-content:center;gap:14px;margin-bottom:14px;}
.hp-testi__kicker-rule{display:inline-block;width:42px;height:1px;background:var(--brass);opacity:0.55;}
.hp-testi__kicker-label{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);}
.hp-testi__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(32px,4.2vw,52px);line-height:1.02;letter-spacing:-0.022em;color:var(--paper);text-align:center;max-width:24ch;margin:0 auto 14px;text-wrap:balance;}
.hp-testi__h em{font-style:italic;color:var(--ember);font-weight:400;}
.hp-testi__sub{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(17px,1.4vw,22px);line-height:1.5;color:var(--paper-2);text-align:center;max-width:50ch;margin:0 auto clamp(36px,5vh,56px);}
.hp-testi__sub em{font-style:italic;color:var(--paper);}
.hp-testi__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media (max-width:980px){.hp-testi__grid{grid-template-columns:1fr;gap:20px;}}
.hp-testi__card{padding:32px 30px;background:rgba(184,153,104,0.04);border:1px solid var(--rule);display:flex;flex-direction:column;gap:20px;transition:background 240ms ease,border-color 240ms ease;}
.hp-testi__card:hover{background:rgba(184,153,104,0.06);border-color:rgba(184,153,104,0.34);}
.hp-testi__mark{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-size:48px;line-height:0.6;color:var(--brass);opacity:0.5;height:24px;}
.hp-testi__q{font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400;font-size:18px;line-height:1.5;color:var(--paper);text-wrap:pretty;}
.hp-testi__q em{font-style:italic;color:var(--ember);font-weight:400;}
.hp-testi__attrib{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:16px;border-top:1px solid var(--rule);}
.hp-testi__portrait{width:42px;height:42px;border-radius:50%;background:linear-gradient(135deg, rgba(184,153,104,0.22), rgba(232,126,45,0.10));border:1px solid var(--rule-2);flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--brass);font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-size:16px;}
.hp-testi__name{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:14.5px;color:var(--paper);line-height:1.2;}
.hp-testi__role{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:var(--paper-3);margin-top:4px;}
.hp-testi__placeholder-banner{margin-top:clamp(20px,3vh,32px);padding:10px 16px;text-align:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:0.22em;text-transform:uppercase;color:var(--paper-4);}
.hp-testi__placeholder-banner em{color:var(--brass);font-style:normal;}

/* FOUNDER PANEL */
.hp-founder{max-width:980px;margin:0 auto;padding:clamp(48px,6vh,72px) clamp(24px,5vw,80px);}
.hp-founder__inner{
  display:grid;grid-template-columns:160px 1fr;gap:clamp(28px,4vw,56px);align-items:center;
  padding:36px 40px;border:1px solid var(--rule);background:rgba(184,153,104,0.03);
}
@media (max-width:680px){.hp-founder__inner{grid-template-columns:1fr;text-align:center;padding:32px 28px;}}
.hp-founder__portrait{
  width:160px;height:160px;border-radius:50%;
  background:linear-gradient(135deg, rgba(184,153,104,0.22), rgba(232,126,45,0.10));
  border:1px solid var(--rule-2);
  display:flex;align-items:center;justify-content:center;
  font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-size:48px;color:var(--brass);
  overflow:hidden;
  margin:0 auto;
  position:relative;
}
.hp-founder__portrait img{
  width:100%;height:100%;object-fit:cover;display:block;
  /* Warm the cyan/orange split-tone toward the Noon brass palette
     without losing the photo's character */
  filter:saturate(0.78) contrast(1.06) sepia(0.16) hue-rotate(-8deg);
}
.hp-founder__kicker{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);margin-bottom:8px;}
.hp-founder__name{font-family:'Fraunces',Georgia,serif;font-weight:500;font-style:italic;font-size:clamp(24px,2.6vw,32px);line-height:1.1;color:var(--paper);margin-bottom:14px;}
.hp-founder__bio{font-family:'Fraunces',Georgia,serif;font-size:16px;line-height:1.6;color:var(--paper-2);margin-bottom:18px;text-wrap:pretty;max-width:52ch;}
.hp-founder__bio em{font-style:italic;color:var(--paper);}
.hp-founder__links{display:flex;flex-wrap:wrap;gap:18px;align-items:center;}
.hp-founder__link{display:inline-flex;align-items:center;gap:10px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;font-weight:500;letter-spacing:0.24em;text-transform:uppercase;color:var(--paper-2);border-bottom:1px solid rgba(184,153,104,0.34);padding-bottom:4px;transition:color 200ms ease,gap 200ms ease,border-color 200ms ease;}
.hp-founder__link:hover{color:var(--ember);gap:14px;border-bottom-color:var(--ember);}
.hp-founder__link .arr{font-size:0.9em;color:var(--brass);}

.hp-stats{
  max-width:1180px;margin:0 auto;
  padding:clamp(28px,3.5vh,44px) clamp(24px,5vw,80px);
  border-top:1px solid rgba(184,153,104,0.14);
}
.hp-stats__row{
  display:grid;
  grid-template-columns:repeat(6,1fr);
  gap:0;
  border-top:1px solid rgba(184,153,104,0.22);
  border-bottom:1px solid rgba(184,153,104,0.22);
}
@media (max-width:980px){.hp-stats__row{grid-template-columns:repeat(3,1fr);}}
@media (max-width:520px){.hp-stats__row{grid-template-columns:repeat(2,1fr);}}
.hp-stats__cell{
  padding:18px 16px;
  display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;
  border-right:1px solid rgba(184,153,104,0.14);
  gap:4px;
}
.hp-stats__cell:last-child{border-right:0;}
@media (max-width:980px){
  .hp-stats__cell:nth-child(3n){border-right:0;}
  .hp-stats__cell{border-bottom:1px solid rgba(184,153,104,0.14);}
  .hp-stats__cell:nth-last-child(-n+3){border-bottom:0;}
}
@media (max-width:520px){
  .hp-stats__cell:nth-child(3n){border-right:1px solid rgba(184,153,104,0.14);}
  .hp-stats__cell:nth-child(2n){border-right:0;}
}
.hp-stats__n{
  font-family:'Fraunces',Georgia,serif;
  font-style:italic;font-weight:500;
  font-size:clamp(22px,2.4vw,32px);
  line-height:1; letter-spacing:-0.014em;
  color:var(--ember);
  font-variant-numeric:oldstyle-nums;
}
.hp-stats__lbl{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9px;font-weight:500;
  letter-spacing:0.24em;text-transform:uppercase;
  color:var(--paper-3);
  line-height:1.3;
}

.hp-recog{
  max-width:1180px;margin:0 auto;
  padding:clamp(40px,5vh,72px) clamp(24px,5vw,80px);
  border-top:1px solid rgba(184,153,104,0.14);
  border-bottom:1px solid rgba(184,153,104,0.14);
}
.hp-recog__head{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:18px 28px;
  margin-bottom:clamp(20px,3vh,32px);
}
.hp-recog__kick{
  display:inline-flex;align-items:center;gap:14px;
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:10.5px;font-weight:500;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--brass);
}
.hp-recog__kick-rule{display:inline-block;width:36px;height:1px;background:var(--brass);opacity:0.55;}
.hp-recog__title{
  font-family:'Fraunces',Georgia,serif;
  font-style:italic;font-weight:500;
  font-size:clamp(18px,1.8vw,24px);
  line-height:1.15;
  color:var(--paper);
  letter-spacing:-0.012em;
}
.hp-recog__title em{color:var(--ember);font-style:italic;font-weight:400;}
.hp-recog__more{
  font-family:'Fraunces',Georgia,serif;font-style:italic;
  font-size:14.5px;
  color:var(--paper-2);
  border-bottom:1px solid rgba(184,153,104,0.34);
  padding-bottom:3px;
  display:inline-flex;align-items:center;gap:10px;
  transition:color 220ms ease,gap 220ms ease,border-color 220ms ease;
}
.hp-recog__more:hover{color:var(--ember);gap:14px;border-bottom-color:var(--ember);}
.hp-recog__more .arr{font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal;font-size:0.85em;color:var(--brass);}

.hp-recog__grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border-top:1px solid rgba(184,153,104,0.14);
  border-left:1px solid rgba(184,153,104,0.14);
}
@media (max-width:880px){.hp-recog__grid{grid-template-columns:repeat(2,1fr);}}
@media (max-width:480px){.hp-recog__grid{grid-template-columns:1fr;}}
.hp-recog__cell{
  padding:22px 22px;
  border-right:1px solid rgba(184,153,104,0.14);
  border-bottom:1px solid rgba(184,153,104,0.14);
  display:flex;flex-direction:column;justify-content:space-between;
  gap:14px;
  min-height:120px;
  background:transparent;
  transition:background 240ms ease;
}
.hp-recog__cell:hover{background:rgba(184,153,104,0.04);}
.hp-recog__pub{
  font-family:'Fraunces',Georgia,serif;
  font-weight:500;
  font-style:italic;
  font-size:17px;
  line-height:1.2;
  color:var(--paper);
  letter-spacing:-0.010em;
}
.hp-recog__pub em{font-style:italic;color:var(--ember);font-weight:400;}
.hp-recog__cell--placeholder .hp-recog__pub{color:var(--paper-3);font-weight:400;}
.hp-recog__status{
  font-family:'JetBrains Mono',ui-monospace,monospace;
  font-size:9px;font-weight:500;
  letter-spacing:0.26em;text-transform:uppercase;
  color:var(--paper-4);
  display:inline-flex;align-items:center;gap:8px;
}
.hp-recog__status::before{
  content:'';
  display:inline-block;
  width:4px;height:4px;border-radius:50%;
  background:var(--brass);
  opacity:0.55;
}
.hp-recog__cell--placeholder .hp-recog__status::before{background:var(--paper-4);opacity:0.6;}
.hp-recog__cell--landed .hp-recog__status{color:var(--brass);}
.hp-recog__cell--landed .hp-recog__status::before{background:var(--ember);opacity:1;box-shadow:0 0 6px rgba(232,126,45,0.55);}

.post-framework {
  background: var(--bg);
  padding: clamp(48px, 7vh, 96px) clamp(28px, 5vw, 96px);
  text-align: center;
  border-top: 1px solid rgba(184,153,104,0.22);
  border-bottom: 1px solid rgba(184,153,104,0.22);
}
.post-framework__inner { max-width: 1080px; margin: 0 auto; }
.post-framework__cta {
  display: inline-flex; align-items: center; gap: 18px;
  text-decoration: none;
  font-family: 'Fraunces', Georgia, serif;
  font-style: italic; font-weight: 400;
  font-size: clamp(20px, 2.4vw, 30px);
  line-height: 1;
  color: var(--paper);
  padding: 18px 32px;
  transition: gap 280ms cubic-bezier(0.22,0.61,0.36,1), color 280ms ease;
}
.post-framework__cta:hover { gap: 26px; color: var(--ember); }
.post-framework__cta-rule {
  display: inline-block; width: 56px; height: 1px;
  background: var(--brass); opacity: 0.55;
}
.post-framework__cta:hover .post-framework__cta-rule {
  background: var(--ember); opacity: 1;
}
.post-framework__cta-arrow {
  font-family: 'JetBrains Mono', ui-monospace, monospace;
  font-style: normal;
  font-size: 0.7em;
  color: var(--brass);
  transition: transform 280ms ease, color 280ms ease;
}
.post-framework__cta:hover .post-framework__cta-arrow {
  color: var(--ember);
  transform: translateX(4px);
}

.hp-news{position:relative;padding:clamp(56px,8vh,96px) clamp(24px,5vw,80px);border-top:1px solid rgba(184,153,104,0.22);border-bottom:1px solid rgba(184,153,104,0.22);background:radial-gradient(ellipse 70% 50% at 50% 0%, rgba(232,126,45,0.06) 0%, transparent 70%), rgba(11,11,10,0.96);overflow:hidden;}
.hp-news::before,.hp-news::after{content:'';position:absolute;top:50%;transform:translateY(-50%);width:18px;height:18px;background:linear-gradient(to right,var(--brass,#B89968),var(--brass,#B89968)) left top/18px 1px no-repeat,linear-gradient(to bottom,var(--brass,#B89968),var(--brass,#B89968)) left top/1px 18px no-repeat;opacity:0.55;}
.hp-news::before{left:clamp(20px,4vw,56px);}
.hp-news::after{right:clamp(20px,4vw,56px);transform:translateY(-50%) scaleX(-1);}
.hp-news__inner{max-width:760px;margin:0 auto;text-align:center;position:relative;}
.hp-news__kicker{display:inline-flex;align-items:center;gap:14px;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10.5px;font-weight:500;letter-spacing:0.28em;text-transform:uppercase;color:var(--brass);margin-bottom:14px;}
.hp-news__kicker-rule{display:inline-block;width:36px;height:1px;background:var(--brass);opacity:0.6;}
.hp-news__h{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(32px,4.4vw,56px);line-height:1.02;letter-spacing:-0.022em;color:var(--paper);text-wrap:balance;margin:0 auto 14px;max-width:18ch;}
.hp-news__h em{font-style:italic;color:var(--paper);font-weight:400;}
.hp-news__sub{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(16px,1.4vw,19px);line-height:1.55;color:var(--paper-2);max-width:56ch;margin:0 auto clamp(28px,4vh,40px);}
.hp-news__sub em{color:var(--paper);font-style:italic;}
.hp-news__form{display:flex;flex-wrap:wrap;align-items:stretch;gap:0;max-width:560px;margin:0 auto;border:1px solid rgba(184,153,104,0.34);background:rgba(184,153,104,0.04);transition:border-color 220ms ease,background 220ms ease;}
.hp-news__form:focus-within{border-color:var(--ember);background:rgba(232,126,45,0.05);}
.hp-news__email{appearance:none;-webkit-appearance:none;background:transparent;border:0;flex:1;min-width:200px;padding:16px 20px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:16px;color:var(--paper);outline:none;}
.hp-news__email::placeholder{color:var(--paper-4);}
.hp-news__btn{appearance:none;-webkit-appearance:none;background:transparent;border:0;border-left:1px solid rgba(184,153,104,0.34);padding:16px 24px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:500;font-size:16px;color:var(--paper);cursor:pointer;display:inline-flex;align-items:center;gap:12px;transition:background 200ms ease,color 200ms ease,gap 200ms ease;}
.hp-news__btn:hover{background:var(--ember);color:var(--bg-deep);gap:16px;}
.hp-news__btn .arr{font-family:'JetBrains Mono',ui-monospace,monospace;font-style:normal;font-size:0.85em;}
.hp-news__promise{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:0.24em;text-transform:uppercase;color:var(--paper-3);margin-top:16px;}
.hp-news__promise em{color:var(--brass);font-style:normal;}
.hp-news__success{display:none;max-width:560px;margin:18px auto 0;padding:14px 22px;border-left:2px solid var(--moss,#6F8559);background:rgba(111,133,89,0.08);font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:15.5px;color:var(--paper-2);line-height:1.55;text-align:left;}
.hp-news__success.is-visible{display:block;}
.hp-news__success em{color:var(--paper);font-style:italic;}
@media (max-width:640px){.hp-news::before,.hp-news::after{display:none;} .hp-news__form{flex-direction:column;} .hp-news__btn{border-left:0;border-top:1px solid rgba(184,153,104,0.34);justify-content:center;}}

.nb-callbar{display:none;}
@media (max-width:760px){
  .nb-callbar{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:120;gap:1px;
    background:rgba(15,15,14,0.97);border-top:1px solid rgba(184,153,104,0.34);
    -webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
    box-shadow:0 -6px 22px rgba(0,0,0,0.35);padding-bottom:env(safe-area-inset-bottom);}
  .nb-callbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;
    padding:15px 12px;font-family:'JetBrains Mono',ui-monospace,monospace;
    font-size:12px;font-weight:600;letter-spacing:0.05em;text-transform:uppercase;text-decoration:none;}
  .nb-callbar__call{color:#F2EBD9;background:transparent;}
  .nb-callbar__call svg{width:18px;height:18px;fill:currentColor;}
  .nb-callbar__cta{color:#1a1106;background:var(--ember,#E97E2D);}
  .nb-callbar__cta .arr{font-family:ui-monospace,monospace;}
  body{padding-bottom:calc(84px + env(safe-area-inset-bottom));}
}
@media print{.nb-callbar{display:none !important;}}

#hp-read{display:none;max-width:1100px;margin:0 auto;padding:clamp(6px,2vh,22px) var(--gutter,clamp(24px,5vw,80px)) clamp(48px,7vh,88px);}
#hp-read.is-open{display:block;}
.hpr-status{text-align:center;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-3,#A8A08B);padding:14px 0 22px;}
.hpr-head{text-align:center;margin-bottom:20px;}
.hpr-addr{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(22px,2.6vw,38px);line-height:1.05;letter-spacing:-0.02em;color:var(--paper,#F2EBD9);text-transform:uppercase;}
.hpr-coords{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.16em;color:var(--paper-3,#A8A08B);margin-top:8px;}
.hpr-map{position:relative;border:1px solid var(--rule,rgba(184,153,104,0.22));overflow:hidden;background:#0c0b0a;margin:0 0 16px;opacity:0;transform:translateY(12px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1);}
.hpr-map.is-in{opacity:1;transform:none;}
.hpr-map__c{width:100%;aspect-ratio:16/8.2;min-height:230px;}
.hpr-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1px;background:var(--rule,rgba(184,153,104,0.22));border:1px solid var(--rule,rgba(184,153,104,0.22));}
.hpr-card{background:var(--bg-deep,#0F0F0E);padding:20px 22px;}
.hpr-card__l{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass,#B89968);}
.hpr-card__v{font-family:'Fraunces',Georgia,serif;font-size:clamp(20px,2vw,27px);line-height:1.1;color:var(--paper,#F2EBD9);margin-top:7px;}
.hpr-card__v em{font-style:italic;color:var(--ember,#E97E2D);}
.hpr-card__s{font-family:'Inter',system-ui,sans-serif;font-size:13px;line-height:1.45;color:var(--paper-2,#DCD4BD);margin-top:8px;}
.hpr-card__src{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--paper-4,#6B6657);margin-top:10px;}
.hpr-reading{max-width:680px;margin:30px auto 0;text-align:center;font-family:'Fraunces',Georgia,serif;font-size:clamp(18px,1.9vw,24px);line-height:1.5;color:var(--paper,#F2EBD9);text-wrap:pretty;}
.hpr-reading em{font-style:italic;color:var(--ember,#E97E2D);}
/* PROOF — we read your land; here's one we already built nearby */
.hpr-proof{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);margin:36px auto 0;max-width:920px;border:1px solid var(--rule,rgba(184,153,104,0.22));overflow:hidden;background:#0c0b0a;}
.hpr-proof__media{display:block;position:relative;overflow:hidden;min-height:210px;}
.hpr-proof__media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.1s cubic-bezier(.2,.7,.2,1);}
.hpr-proof__media:hover img{transform:scale(1.05);}
.hpr-proof__body{padding:clamp(22px,3vw,36px);display:flex;flex-direction:column;justify-content:center;gap:13px;}
.hpr-proof__k{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--ember,#E97E2D);}
.hpr-proof__body p{font-family:'Fraunces',Georgia,serif;font-size:clamp(17px,1.7vw,23px);line-height:1.4;color:var(--paper,#F2EBD9);margin:0;text-wrap:pretty;}
.hpr-proof__body p em{font-style:italic;color:var(--ember,#E97E2D);}
.hpr-proof__cta{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--paper,#F2EBD9);border-bottom:1px solid rgba(232,126,45,.5);padding-bottom:5px;align-self:flex-start;transition:color .25s;}
.hpr-proof__cta:hover{color:var(--ember,#E97E2D);}
@media(max-width:620px){.hpr-proof{grid-template-columns:1fr;}.hpr-proof__media{aspect-ratio:16/9;min-height:0;}}
/* PIPELINE — pathways grid (matches the data-card aesthetic): act · deeper · learn · build */
.hpr-cta{display:grid;grid-template-columns:repeat(auto-fit,minmax(208px,1fr));gap:1px;background:var(--rule,rgba(184,153,104,0.22));border:1px solid var(--rule,rgba(184,153,104,0.22));margin-top:1px;}
.hpr-path{display:flex;flex-direction:column;gap:6px;padding:20px 22px;background:var(--bg-deep,#0F0F0E);transition:background .25s ease;}
.hpr-path:hover{background:#16120c;}
.hpr-path__k{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--brass,#B89968);}
.hpr-path__t{font-family:'Fraunces',Georgia,serif;font-size:clamp(16px,1.5vw,20px);line-height:1.15;color:var(--paper,#F2EBD9);transition:color .25s;}
.hpr-path__s{font-family:'Inter',system-ui,sans-serif;font-size:12.5px;line-height:1.4;color:var(--paper-3,#A8A08B);}
.hpr-path:hover .hpr-path__t{color:var(--ember,#E97E2D);}
.hpr-path--go{background:linear-gradient(135deg,rgba(232,126,45,.14),rgba(232,126,45,.04));}
.hpr-path--go .hpr-path__k,.hpr-path--go .hpr-path__t{color:var(--ember,#E97E2D);}
.hpr-map .leaflet-container{background:#0c0b0a;}
.hpr-map .leaflet-control-zoom{border:none!important;margin:10px!important;box-shadow:none!important;}
.hpr-map .leaflet-control-zoom a{background:rgba(9,8,7,.72)!important;color:#DCD4BD!important;border:1px solid rgba(184,153,104,0.22)!important;}
.hpr-map .leaflet-control-attribution{background:rgba(9,8,7,.5)!important;color:rgba(242,235,217,.45)!important;font-size:8.5px!important;}
.hpr-map .leaflet-control-attribution a{color:rgba(232,126,45,.6)!important;}
/* THE COMPANION dock — the mark's small self, reading the page with you */
.hm-dock{position:fixed;right:clamp(16px,2.6vw,34px);bottom:clamp(16px,3vh,30px);z-index:60;width:84px;height:84px;cursor:pointer;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .5s ease,transform .5s ease;display:flex;align-items:center;}
.hm-dock.is-visible{opacity:1;transform:none;pointer-events:auto;}
.hm-dock svg{width:84px;height:84px;display:block;filter:drop-shadow(0 4px 14px rgba(0,0,0,.45));}
.hm-dock [data-dsys]{transition:opacity .45s ease;}
.hm-dock__label{position:absolute;right:92px;top:50%;transform:translateY(-50%);white-space:nowrap;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-3,#A8A08B);background:rgba(10,10,9,.72);border:1px solid rgba(184,153,104,.22);border-radius:99px;padding:7px 13px;opacity:0;transition:opacity .35s ease;pointer-events:none;}
.hm-dock.has-label .hm-dock__label{opacity:1;}
.hm-dock:focus-visible{outline:2px solid var(--ember,#E97E2D);outline-offset:4px;border-radius:50%;}
@media(max-width:720px){.hm-dock{display:none;}}
@media(prefers-reduced-motion:reduce){.hm-dock{transition:opacity .2s;}}

/* THE INTRO overlay — ceremony over darkness, then condense + hand off */
.hm-intro{position:fixed;inset:0;z-index:200;background:#0F0F0E;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.hm-intro .hero__mark{width:min(56vh,480px);max-width:86vw;margin:0;transition:transform .85s cubic-bezier(.5,0,.6,1),opacity .8s ease;}
.hm-intro .hm-legend{display:none;}
.hm-intro__skip{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;letter-spacing:.22em;text-transform:uppercase;color:rgba(168,160,139,.6);}
.hm-intro.is-done{opacity:0;transition:opacity .7s ease .15s;pointer-events:none;}
.hm-intro.is-done .hero__mark{transform:scale(.18);opacity:0;}
html.no-intro .hm-intro{display:none;}
body.mark-docked .hm-dock{opacity:1;transform:none;pointer-events:auto;}

/* THE WELL — one organism, scroll-condensed */
.well .hero__mark{position:fixed;left:50%;top:50%;margin:0;width:min(42vh,390px);max-width:80vw;z-index:240;transform:translate(-50%,-50%);will-change:transform;animation:none;opacity:1;}   /* hm-rise fill:forwards would override the morph's inline transform */
.well .hero__mark.is-condensed{pointer-events:auto;cursor:pointer;}
.well .hero__mark.is-condensed:hover .hm-mini{filter:brightness(1.15);}
.well .hm-legend{display:none;}
.well .hero__mark::before{inset:-40%;}
.hm-mini circle{transition:opacity .45s ease;}
.hm-arms{transition:opacity .3s linear;}
.ceremony{height:92vh;display:flex;align-items:flex-end;justify-content:center;padding-bottom:34px;}
.well-cue{background:none;border:0;cursor:pointer;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:rgba(168,160,139,.65);padding:10px 16px;transition:color .3s;}
.well-cue:hover{color:var(--paper,#F2EBD9);}
.hm-voice{position:fixed;left:50%;transform:translateX(-50%);bottom:98px;top:auto;right:auto;z-index:41;white-space:nowrap;font-family:'JetBrains Mono',ui-monospace,monospace;font-size:9.5px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;color:var(--paper-3,#A8A08B);background:rgba(10,10,9,.74);border:1px solid rgba(184,153,104,.22);border-radius:99px;padding:7px 13px;opacity:0;transition:opacity .35s ease;pointer-events:none;}
.hm-voice.is-ready.has-text{opacity:1;}
@media(max-width:720px){.hm-voice{display:none;}.well .hero__mark{width:min(72vw,340px);}}

/* THE SEAL — engraved words, serif, part of the geometry */
.hm-rim{font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:11px;letter-spacing:.3em;text-transform:uppercase;fill:rgba(228,214,187,.9);pointer-events:auto;cursor:pointer;transition:fill .3s ease;}
.hm-rim:hover,.hm-rim.is-amb{fill:var(--paper,#F2EBD9);}
.hm-triad{position:absolute;left:50%;transform:translateX(-50%);bottom:-5%;white-space:nowrap;pointer-events:none;}
.hm-triad__sep{color:var(--paper-4,#6B6657);margin:0 10px;font-family:'Fraunces',Georgia,serif;}
.hm-life{background:none;border:0;padding:2px 2px;font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400;font-size:13px;letter-spacing:.06em;color:rgba(216,115,77,.8);pointer-events:auto;cursor:pointer;transition:color .3s ease;}
.hm-life:hover,.hm-life:focus-visible{color:var(--paper,#F2EBD9);}
.well .hm-stage{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:14px;font-weight:400;letter-spacing:.02em;text-transform:none;color:var(--paper-3,#A8A08B);}
.well .hm-readout{bottom:-11.5%;}
.well .hm-you span{font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:13px;letter-spacing:.14em;text-transform:none;transform:translateY(1.9em);}

/* THE FRONTISPIECE — the institute's name and charge above its seal */
.hm-title{position:fixed;left:50%;top:calc(50% - min(21vh,195px) - 164px);transform:translateX(-50%);z-index:241;text-align:center;pointer-events:none;width:max-content;max-width:92vw;}
/* stacked masthead — NOON carries the weight, INSTITUTE sits beneath as the qualifier */
.hm-title__name{display:block;font-family:'Fraunces',Georgia,serif;font-weight:500;font-size:clamp(26px,3.4vh,34px);letter-spacing:.34em;text-transform:uppercase;color:var(--paper,#F2EBD9);padding-left:.34em;line-height:1;}
.hm-title__inst{display:block;font-family:'Fraunces',Georgia,serif;font-weight:400;font-size:clamp(11px,1.5vh,14px);letter-spacing:.62em;text-transform:uppercase;color:var(--paper-2,#DCD4BD);margin:8px 0 11px;padding-left:.62em;}
.hm-title__charge{display:block;font-family:'Fraunces',Georgia,serif;font-style:italic;font-weight:400;font-size:clamp(13px,1.8vh,16px);letter-spacing:.04em;color:var(--paper-2,#DCD4BD);}
@media(max-height:700px){.hm-title{top:calc(50% - min(21vh,195px) - 112px);}}


/* THE VEIL — ceremony darkness that dissolves onto the film */
.well-veil{position:fixed;inset:0;z-index:5;will-change:opacity;pointer-events:none;
  /* the veil IS the patina page — same ground color, same fibre noise — so the arrival reads
     as the page itself dissolving into the flower */
  background-color:var(--bg);
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='320' height='320'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.65' numOctaves='3' seed='7'/><feColorMatrix values='0 0 0 0 0.92  0 0 0 0 0.89  0 0 0 0 0.82  0 0 0 0.10 0'/></filter><filter id='m'><feTurbulence type='fractalNoise' baseFrequency='0.04' numOctaves='2' seed='3'/><feColorMatrix values='0 0 0 0 0.96  0 0 0 0 0.92  0 0 0 0 0.83  0 0 0 0.05 0'/></filter><rect width='100%25' height='100%25' filter='url(%23m)'/><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}
.well-cue{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:6;}
.ceremony{height:100vh;display:block;}

/* v17 — bare seal on patina; veil lifts at arrival; the ground works for the work */
.well .hero__mark::after{display:none;}   /* no tooth over the film */
.well .hero__mark::before{display:block;inset:-46%;filter:none;
  /* the shield seal: an open carved band that carries the inscriptions — worn leather
     annulus, engraved grooves, irregular notches, center open to the film with a soft
     calm behind You. One static SVG; no mask, no per-frame cost. */
  background-size:100% 100%;background-repeat:no-repeat;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='620' height='620'><defs><filter id='er'><feTurbulence type='fractalNoise' baseFrequency='0.2' numOctaves='4' seed='9' result='n'/><feColorMatrix in='n' type='matrix' values='0 0 0 0 0  0 0 0 0 0  0 0 0 0 0  0 0 0 9 -6.6' result='m'/><feComposite in='SourceGraphic' in2='m' operator='out'/></filter></defs><g filter='url(%23er)'><circle cx='310' cy='310' r='181' fill='rgb(36,26,17)' fill-opacity='0.84'/><circle cx='310' cy='310' r='122' fill='rgb(26,19,12)' fill-opacity='0.4'/><circle cx='441.5' cy='310.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='440.8' cy='323.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='438.6' cy='337.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='435.1' cy='350.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='430.1' cy='363.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='423.9' cy='375.8' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='416.4' cy='387.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='407.7' cy='398.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='398.0' cy='407.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='387.3' cy='416.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='375.8' cy='423.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='363.5' cy='430.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='350.6' cy='435.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='337.3' cy='438.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='323.7' cy='440.8' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='310.0' cy='441.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='296.3' cy='440.8' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='282.7' cy='438.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='269.4' cy='435.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='256.5' cy='430.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='244.3' cy='423.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='232.7' cy='416.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='222.0' cy='407.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='212.3' cy='398.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='203.6' cy='387.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='196.1' cy='375.8' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='189.9' cy='363.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='184.9' cy='350.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='181.4' cy='337.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='179.2' cy='323.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='178.5' cy='310.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='179.2' cy='296.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='181.4' cy='282.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='184.9' cy='269.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='189.9' cy='256.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='196.1' cy='244.2' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='203.6' cy='232.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='212.3' cy='222.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='222.0' cy='212.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='232.7' cy='203.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='244.2' cy='196.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='256.5' cy='189.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='269.4' cy='184.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='282.7' cy='181.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='296.3' cy='179.2' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='310.0' cy='178.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='323.7' cy='179.2' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='337.3' cy='181.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='350.6' cy='184.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='363.5' cy='189.9' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='375.8' cy='196.1' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='387.3' cy='203.6' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='398.0' cy='212.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='407.7' cy='222.0' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='416.4' cy='232.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='423.9' cy='244.2' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='430.1' cy='256.5' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='435.1' cy='269.4' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='438.6' cy='282.7' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='440.8' cy='296.3' r='1.25' fill='rgba(233,214,180,0.34)'/><circle cx='310' cy='310' r='128' fill='none' stroke='rgba(233,214,180,0.4)' stroke-width='1.1' stroke-opacity='1'/><circle cx='392.9' cy='195.9' r='4.2' fill='rgb(14,9,5)' fill-opacity='0.55' stroke='rgba(233,214,180,0.46)' stroke-width='1.2'/><circle cx='392.9' cy='195.9' r='1.3' fill='rgba(150,166,150,0.6)'/><circle cx='444.1' cy='353.6' r='4.2' fill='rgb(14,9,5)' fill-opacity='0.55' stroke='rgba(233,214,180,0.46)' stroke-width='1.2'/><circle cx='444.1' cy='353.6' r='1.3' fill='rgba(150,166,150,0.6)'/><circle cx='310.0' cy='451.0' r='4.2' fill='rgb(14,9,5)' fill-opacity='0.55' stroke='rgba(233,214,180,0.46)' stroke-width='1.2'/><circle cx='310.0' cy='451.0' r='1.3' fill='rgba(150,166,150,0.6)'/><circle cx='175.9' cy='353.6' r='4.2' fill='rgb(14,9,5)' fill-opacity='0.55' stroke='rgba(233,214,180,0.46)' stroke-width='1.2'/><circle cx='175.9' cy='353.6' r='1.3' fill='rgba(150,166,150,0.6)'/><circle cx='227.1' cy='195.9' r='4.2' fill='rgb(14,9,5)' fill-opacity='0.55' stroke='rgba(233,214,180,0.46)' stroke-width='1.2'/><circle cx='227.1' cy='195.9' r='1.3' fill='rgba(150,166,150,0.6)'/><circle cx='310' cy='310' r='152.5' fill='none' stroke='rgba(233,214,180,0.4)' stroke-width='1' stroke-opacity='1'/><circle cx='310' cy='310' r='161.5' fill='none' stroke='rgba(233,214,180,0.4)' stroke-width='1' stroke-opacity='1'/><line x1='463.6' y1='310.0' x2='470.4' y2='310.0' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='463.0' y1='323.4' x2='466.6' y2='323.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='461.3' y1='336.7' x2='464.8' y2='337.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='458.4' y1='349.8' x2='464.9' y2='351.5' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='454.3' y1='362.5' x2='457.7' y2='363.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='449.2' y1='374.9' x2='452.5' y2='376.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='443.0' y1='386.8' x2='448.9' y2='390.2' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='435.8' y1='398.1' x2='438.8' y2='400.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='427.7' y1='408.7' x2='430.4' y2='411.0' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='418.6' y1='418.6' x2='423.4' y2='423.4' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='408.7' y1='427.7' x2='411.0' y2='430.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='398.1' y1='435.8' x2='400.2' y2='438.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='386.8' y1='443.0' x2='390.2' y2='448.9' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='374.9' y1='449.2' x2='376.4' y2='452.5' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='362.5' y1='454.3' x2='363.8' y2='457.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='349.8' y1='458.4' x2='351.5' y2='464.9' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='336.7' y1='461.3' x2='337.3' y2='464.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='323.4' y1='463.0' x2='323.7' y2='466.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='310.0' y1='463.6' x2='310.0' y2='470.4' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='296.6' y1='463.0' x2='296.3' y2='466.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='283.3' y1='461.3' x2='282.7' y2='464.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='270.2' y1='458.4' x2='268.5' y2='464.9' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='257.5' y1='454.3' x2='256.2' y2='457.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='245.1' y1='449.2' x2='243.6' y2='452.5' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='233.2' y1='443.0' x2='229.8' y2='448.9' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='221.9' y1='435.8' x2='219.8' y2='438.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='211.3' y1='427.7' x2='209.0' y2='430.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='201.4' y1='418.6' x2='196.6' y2='423.4' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='192.3' y1='408.7' x2='189.6' y2='411.0' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='184.2' y1='398.1' x2='181.2' y2='400.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='177.0' y1='386.8' x2='171.1' y2='390.2' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='170.8' y1='374.9' x2='167.5' y2='376.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='165.7' y1='362.5' x2='162.3' y2='363.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='161.6' y1='349.8' x2='155.1' y2='351.5' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='158.7' y1='336.7' x2='155.2' y2='337.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='157.0' y1='323.4' x2='153.4' y2='323.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='156.4' y1='310.0' x2='149.6' y2='310.0' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='157.0' y1='296.6' x2='153.4' y2='296.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='158.7' y1='283.3' x2='155.2' y2='282.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='161.6' y1='270.2' x2='155.1' y2='268.5' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='165.7' y1='257.5' x2='162.3' y2='256.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='170.8' y1='245.1' x2='167.5' y2='243.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='177.0' y1='233.2' x2='171.1' y2='229.8' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='184.2' y1='221.9' x2='181.2' y2='219.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='192.3' y1='211.3' x2='189.6' y2='209.0' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='201.4' y1='201.4' x2='196.6' y2='196.6' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='211.3' y1='192.3' x2='209.0' y2='189.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='221.9' y1='184.2' x2='219.8' y2='181.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='233.2' y1='177.0' x2='229.8' y2='171.1' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='245.1' y1='170.8' x2='243.6' y2='167.5' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='257.5' y1='165.7' x2='256.2' y2='162.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='270.2' y1='161.6' x2='268.5' y2='155.1' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='283.3' y1='158.7' x2='282.7' y2='155.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='296.6' y1='157.0' x2='296.3' y2='153.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='310.0' y1='156.4' x2='310.0' y2='149.6' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='323.4' y1='157.0' x2='323.7' y2='153.4' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='336.7' y1='158.7' x2='337.3' y2='155.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='349.8' y1='161.6' x2='351.5' y2='155.1' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='362.5' y1='165.7' x2='363.8' y2='162.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='374.9' y1='170.8' x2='376.4' y2='167.5' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='386.8' y1='177.0' x2='390.2' y2='171.1' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='398.1' y1='184.2' x2='400.2' y2='181.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='408.7' y1='192.3' x2='411.0' y2='189.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='418.6' y1='201.4' x2='423.4' y2='196.6' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='427.7' y1='211.3' x2='430.4' y2='209.0' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='435.8' y1='221.9' x2='438.8' y2='219.8' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='443.0' y1='233.2' x2='448.9' y2='229.8' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='449.2' y1='245.1' x2='452.5' y2='243.6' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='454.3' y1='257.5' x2='457.7' y2='256.2' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='458.4' y1='270.2' x2='464.9' y2='268.5' stroke='rgba(233,214,180,0.44)' stroke-width='1.3'/><line x1='461.3' y1='283.3' x2='464.8' y2='282.7' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><line x1='463.0' y1='296.6' x2='466.6' y2='296.3' stroke='rgba(233,214,180,0.28)' stroke-width='0.85'/><path d='M310.0 149.1 l2.9 3.9 l-2.9 3.9 l-2.9 -3.9 Z' fill='rgba(216,115,80,0.85)'/><g transform='translate(339.4 143.1) rotate(10.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(368.0 150.7) rotate(20.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(394.8 163.2) rotate(30.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(419.0 180.2) rotate(40.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(439.8 201.0) rotate(50.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(456.8 225.2) rotate(60.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(469.3 252.0) rotate(70.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(476.9 280.6) rotate(80.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(479.5 310.0) rotate(90.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(476.9 339.4) rotate(100.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(469.3 368.0) rotate(110.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(456.8 394.8) rotate(120.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(439.8 419.0) rotate(130.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(419.0 439.8) rotate(140.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(394.8 456.8) rotate(150.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(368.0 469.3) rotate(160.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(339.4 476.9) rotate(170.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(310.0 479.5) rotate(180.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(280.6 476.9) rotate(190.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(252.0 469.3) rotate(200.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(225.3 456.8) rotate(210.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(201.0 439.8) rotate(220.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(180.2 419.0) rotate(230.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(163.2 394.8) rotate(240.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(150.7 368.0) rotate(250.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(143.1 339.4) rotate(260.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(140.5 310.0) rotate(270.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(143.1 280.6) rotate(280.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(150.7 252.0) rotate(290.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(163.2 225.2) rotate(300.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(180.2 201.0) rotate(310.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-4.5 0 Q-2.2 -3.4 0 0 T4.5 0'/></g><g transform='translate(201.0 180.2) rotate(320.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle cx='0' cy='-2.6' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='-2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/><circle cx='2.4' cy='1.8' r='1.05' fill='rgba(150,166,150,0.5)' stroke='none'/></g><g transform='translate(225.2 163.2) rotate(330.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M-3.8 2.4 L0 -3 L3.8 2.4'/></g><g transform='translate(252.0 150.7) rotate(340.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><path d='M0 -3.4 C2.6 -3.4 3.4 -0.6 1.6 0.8 C0.2 1.9 -1.8 1.2 -1.8 -0.5 C-1.8 -1.7 -0.6 -2.4 0.4 -1.9'/></g><g transform='translate(280.6 143.1) rotate(350.0) scale(0.92)' stroke='rgba(150,166,150,0.5)' fill='none' stroke-width='1.5' stroke-linecap='round'><circle r='3.1'/><circle r='0.95' fill='rgba(150,166,150,0.5)' stroke='none'/></g><circle cx='310' cy='310' r='171' fill='none' stroke='rgb(14,9,5)' stroke-width='10' stroke-opacity='0.28'/><circle cx='310' cy='310' r='174.8' fill='none' stroke='rgba(233,214,180,0.28)' stroke-width='0.7' stroke-opacity='1'/><circle cx='310' cy='310' r='179' fill='none' stroke='rgba(233,214,180,0.1)' stroke-width='4' stroke-opacity='1'/><circle cx='310' cy='310' r='179' fill='none' stroke='rgba(233,214,180,0.5)' stroke-width='1.5' stroke-opacity='1'/></g></svg>");
  animation:lensbreath 9.5s ease-in-out infinite;
  opacity:var(--wellgrad,1);}
@keyframes lensbreath{0%,100%{opacity:calc(var(--wellgrad,1) * 1);}50%{opacity:calc(var(--wellgrad,1) * 0.94);}}
@media(prefers-reduced-motion:reduce){.well .hero__mark::before{animation:none;}}
#groundShade{position:fixed;inset:0;z-index:0;background:#0A0908;opacity:0;pointer-events:none;}
.hero__backdrop{opacity:0;}   /* the film waits inside the hero; the driver raises it */

/* v17.2 — the well condenses into the Log button; the header breathes wider (homepage only) */
.nb-nav{padding-top:20px!important;padding-bottom:20px!important;}
@media(max-width:760px){.nb-nav{padding-top:15px!important;padding-bottom:15px!important;}}

/* v17.4 — on phones the well seats in the socket between Call and Book a Site Read */
@media (max-width:760px){
  .nb-callbar::after{content:'';position:absolute;left:50%;top:0;transform:translate(-50%,-50%);
    width:46px;height:46px;border-radius:50%;
    background:radial-gradient(circle at 50% 50%, #E17B4E 0, #D8734D 4.6px, rgba(216,115,77,0) 5.6px), #141210;
    border:1px solid rgba(220,205,168,.5);box-shadow:0 0 0 4px rgba(15,15,14,.6), inset 0 0 0 4.5px rgba(220,205,168,.14);
    opacity:var(--socket,1);}
  /* mobile: the SOCKET is the docked mark (paints reliably over the blurred bar); the seal is the tap target */
  .well .hero__mark.is-condensed .hm-dock{ opacity:0; }
  /* the mini spiral is never the mark on mobile — hide it so it can't 'load in' over the socket mid-descent */
  .hm-mini{ display:none !important; }
  .nb-callbar__call{padding-right:20px;}
  .nb-callbar__cta{padding-left:32px;}
}

/* v17.6 — the ceremony yields to an open menu (the z240 seal must never paint over it or steal its taps) */
body.nb-nav-open .well .hero__mark,
body.nb-nav-open .hm-voice,
body.nb-nav-open .hm-title{visibility:hidden;}

/* v17.7 — drawer meets the taller homepage bar */
@media (max-width:760px){ .nb-nav__menu{top:71px;} }

/* v18 — the well settles at bottom-center on desktop (Dorian: "i like the bottom") */
#wellSeat{position:fixed;left:50%;bottom:30px;transform:translateX(-50%);width:54px;height:54px;border-radius:50%;
  background:#141210;border:1px solid rgba(184,153,104,.45);box-shadow:0 0 0 4px rgba(15,15,14,.6);
  z-index:239;opacity:0;pointer-events:none;}
@media (max-width:760px){#wellSeat{display:none;}}

/* elite pass — panel picks 3 & 12 + medallion clearance */
@media (max-width:760px){ .well-cue{ bottom:calc(84px + env(safe-area-inset-bottom)); } }   /* the ENTER cue was buried behind the call bar */
.hero__addr-submit:focus-visible,.hero__addr-pin:focus-visible,.ladder__cta:focus-visible,.hp-news__btn:focus-visible,.final-cta__btn:focus-visible{outline:2px solid var(--ember,#E97E2D);outline-offset:3px;}
@media (min-width:761px){ .pr-foot{ padding-bottom:130px; } }   /* the seated medallion must never eclipse the copyright line */


/* the bird flits — a small bob and tilt, mostly stillness */
@keyframes birdflit{0%,86%,100%{transform:none}89%{transform:translateY(-1.6px) rotate(-6deg)}92%{transform:translateY(.3px) rotate(3deg)}95%{transform:none}}
.nb-callbar__call svg{animation:birdflit 7s ease-in-out infinite;transform-origin:55% 60%;}
@media(prefers-reduced-motion:reduce){.nb-callbar__call svg,.hero__addr-birds svg{animation:none;}}
/* the hero verb — a soft breath between senses */
.hero-verb{display:inline-block;transition:opacity .36s ease,transform .36s ease;}
.hero-verb.is-swap{opacity:0;transform:translateY(.16em);}

/* five elite moves */
@view-transition{navigation:auto;}                       /* seamless crossing to /read/ where supported */
.well .hero__mark{view-transition-name:noon-seal;}
.well .hero__mark.is-quickened{filter:brightness(1.32);}  /* the instrument answers the hand */
.well .hero__mark{transition:filter .45s ease;}
.well .hero__mark.is-quickened .hm-heart{animation-duration:1.4s;}

/* the inscriptions cut the luminous band — engraved, not printed */
.hm-rim, .hm-rim textPath{paint-order:stroke;stroke:rgba(18,12,7,0.6);stroke-width:2.4px;stroke-linejoin:round;}

/* the grown bezel needs air beneath — words step down clear of the instrument */
.well .hm-triad{bottom:-16%;}
.well .hm-readout{bottom:-25%;}

/* the words glow — majestic, not neon; the bottom breathes */
.hm-title__name{text-shadow:0 0 34px rgba(233,214,180,0.34),0 0 8px rgba(233,214,180,0.18),0 1px 2px rgba(0,0,0,0.45);}
.hm-title__inst{text-shadow:0 0 18px rgba(233,214,180,0.24);}
.hm-title__charge{text-shadow:0 0 16px rgba(233,214,180,0.13);}
.well .hm-triad .hm-life{text-shadow:0 0 13px rgba(216,115,80,0.34);}
.well .hm-readout{opacity:.92;}
.well .well-cue{bottom:36px;letter-spacing:.3em;}

/* frontispiece grammar: title plate closes with a fleuron; the motto opens with a rule */
.hm-title::after{content:'\25C6';display:block;margin-top:12px;font-size:7px;line-height:1;color:rgba(216,115,80,0.72);text-shadow:0 0 10px rgba(216,115,80,0.35);}
.well .hm-triad::before{content:'';display:block;width:46px;height:1px;margin:0 auto 15px;background:rgba(233,214,180,0.3);}

/* the bar bird — real songs on click; flits while singing */
.hero__addr-birds{background:none;border:0;padding:0 2px;margin:0;cursor:pointer;color:var(--brass,#B89968);display:flex;align-items:center;transition:color .25s ease;}
.hero__addr-birds:hover{color:var(--ember,#E97E2D);}
.hero__addr-birds:focus-visible{outline:2px solid var(--ember,#E97E2D);outline-offset:3px;border-radius:6px;}
.hero__addr-birds svg{width:22px;height:22px;transform-origin:55% 60%;}
.hero__addr-birds.is-singing{color:var(--ember,#E97E2D);}
.hero__addr-birds.is-singing svg{animation:birdflit 1.7s ease-in-out infinite;}

/* reduced-motion visitors read the still — the film stays quiet */
@media (prefers-reduced-motion:reduce){
  .hero__backdrop video{display:none;}
  .hero__backdrop{background:url('/assets/work/lotus-flyover-poster.jpg?v=10') center 44%/cover no-repeat;}
}

/* ceremony focus — every interactive landing shows its ring */
.well-cue:focus-visible,.hm-life:focus-visible{outline:2px solid var(--ember,#E97E2D);outline-offset:3px;border-radius:4px;}

/* portrait phones: the flyover is a MOVING shot — framing solved from the pedestal's
   tracked trajectory (mean 51.9%/46.7% of source, wander ±52px): anchor the mean under
   the seal and let the flight orbit inside it. Desktop framing untouched. */
@media (max-width:760px){
  .hero__backdrop video{object-position:52% 34%;transform:scale(1.25);transform-origin:52% 34%;}
}

/* ── the living seal: readable words, a hover that flows, a water pulse that beats like a heart ── */
.well .hm-rim{ fill: rgba(228,214,187,.92); }               /* just enough to read against the band */
.well .hero__mark:hover .hm-rim{ fill: var(--paper,#F2EBD9); }   /* go over it and the words come up */

.hm-arms{ transform-box: view-box; transform-origin: 150px 150px; animation: hm-livebeat 3.8s ease-in-out infinite; }
@keyframes hm-livebeat{ 0%,100%{ filter: brightness(1); } 48%{ filter: brightness(1.17); } }   /* everything breathes with the heart */

/* hover: the spiral turns — a slow, smooth creep, water moving in the well (keeps the beat) */
.well .hero__mark:not(.is-condensed):hover .hm-arms{ animation: hm-livebeat 3.8s ease-in-out infinite, hm-flow 54s linear infinite; }
@keyframes hm-flow{ to{ transform: rotate(360deg); } }

/* the water pulse — a ring rises from the heart and spreads, from the first breath on */
.well .hero__mark::after{
  content:''; display:block; position:absolute; left:50%; top:50%; width:60%; height:60%;
  border-radius:50%; border:1.5px solid rgba(203,153,120,.5); pointer-events:none; z-index:2;
  transform:translate(-50%,-50%) scale(.5);
  animation: hm-waterpulse 4.6s cubic-bezier(.25,.6,.3,1) infinite;
}
@keyframes hm-waterpulse{
  0%{ transform:translate(-50%,-50%) scale(.5); opacity:0; }
  16%{ opacity:.5; }
  100%{ transform:translate(-50%,-50%) scale(1.28); opacity:0; }
}
/* the seal calms the moment it starts folding — no ripple, no creep as it shrinks into the nook */
.well .hero__mark.is-folding::after,
.well .hero__mark.is-condensed::after{ display:none; }
.well .hero__mark.is-condensed .hm-arms{ animation:none; }

/* the docked nook: shed the whole detailed instrument, show one clean circumpunct
   (plain SVG ring + coral dot — renders identically on every device, no crush) */
.hm-dock{ transition: opacity .3s ease; }
.well .hero__mark.is-condensed .hm-dock{ opacity:1; }
.well .hero__mark.is-condensed .hm-mini,
.well .hero__mark.is-condensed .hm-arms,
.well .hero__mark.is-condensed .hm-rim,
.well .hero__mark.is-condensed .hm-heart,
.well .hero__mark.is-condensed .hm-heartring{ opacity:0 !important; }
.well .hero__mark.is-condensed::before{ display:none !important; }   /* kill the band for certain on iOS, not just faded */