:root{
  /* Brand tokens — night sky over the marsh, lit by a launch */
  --night:#070b18;
  --night-2:#0c1226;
  --dusk:#161f42;
  --line:rgba(244,239,230,.13);
  --line-strong:rgba(244,239,230,.26);

  --cream:#f4efe6;
  --muted:rgba(244,239,230,.70);
  --faint:rgba(244,239,230,.48);

  --amber:#f5a524;
  --sunset:#e8623c;
  --marsh:#4fb08d;
  --sky-blue:#6ba8e8;

  --flame:linear-gradient(100deg,var(--amber),var(--sunset));

  --wrap:1140px;
  --gutter:clamp(16px,5vw,40px);
  --radius:16px;
  --radius-lg:24px;

  --h1:clamp(2.35rem,6.2vw,4.4rem);
  --h2:clamp(1.65rem,3.6vw,2.6rem);
  --body:clamp(1rem,1.05vw,1.0625rem);

  --font-display:"Space Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-body:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--night);color:var(--cream);
  font:var(--body)/1.65 var(--font-body);
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
}

h1,h2,h3,h4,.wordmark,.stat-num{font-family:var(--font-display);font-weight:700;letter-spacing:-.02em;line-height:1.08;margin:0}
p{margin:0}
a{color:inherit}
img,svg{display:block;max-width:100%}

.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.eyebrow{font-family:var(--font-display);font-weight:500;font-size:.75rem;
  letter-spacing:.2em;text-transform:uppercase;color:var(--amber);
  text-shadow:0 0 18px rgba(245,165,36,.35)}
.eyebrow::before{content:"";display:inline-block;width:16px;height:1px;
  background:var(--amber);vertical-align:3px;margin-right:.7rem;opacity:.7}
/* the dash costs a line on the narrowest phones */
@media (max-width:400px){.eyebrow::before{display:none}.eyebrow{letter-spacing:.16em}}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:0}
.skip:focus{left:8px;top:8px;z-index:99;background:var(--cream);color:var(--night);padding:10px 16px;border-radius:8px}
:where(a,button,input,select,textarea,[tabindex]):focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}

/* Scroll reveal — only armed when JS runs, so no-JS shows everything */
.js .reveal{opacity:0;transform:translateY(20px)}
.js .reveal.in{opacity:1;transform:none;transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
@media (prefers-reduced-motion:reduce){.js .reveal{opacity:1;transform:none}}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--font-display);font-weight:700;font-size:.95rem;
  padding:.85rem 1.5rem;border-radius:999px;border:1px solid transparent;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,border-color .18s ease;
}
.btn-primary{background:var(--flame);color:#1b1102;box-shadow:0 8px 28px -10px rgba(245,165,36,.7)}
.btn-primary:hover{transform:translateY(-2px);box-shadow:0 14px 34px -10px rgba(245,165,36,.85)}
.btn-ghost{border-color:var(--line-strong);color:var(--cream);background:rgba(244,239,230,.03)}
.btn-ghost:hover{border-color:var(--cream);background:rgba(244,239,230,.08)}

/* The sky does not stop at the hero: a faint fixed starfield sits behind the
   whole document so every section reads as being outdoors at night. */
.deepspace{position:fixed;inset:0;z-index:-10;pointer-events:none;
  background:
    radial-gradient(1.5px 1.5px at 8% 14%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.2px 1.2px at 21% 62%,rgba(244,239,230,.4),transparent),
    radial-gradient(1.6px 1.6px at 34% 28%,rgba(244,239,230,.5),transparent),
    radial-gradient(1.1px 1.1px at 47% 78%,rgba(200,222,255,.42),transparent),
    radial-gradient(1.4px 1.4px at 58% 18%,rgba(244,239,230,.48),transparent),
    radial-gradient(1.2px 1.2px at 69% 54%,rgba(255,236,200,.4),transparent),
    radial-gradient(1.5px 1.5px at 81% 34%,rgba(244,239,230,.5),transparent),
    radial-gradient(1.1px 1.1px at 92% 70%,rgba(244,239,230,.36),transparent),
    radial-gradient(1.3px 1.3px at 14% 88%,rgba(244,239,230,.4),transparent),
    radial-gradient(1.2px 1.2px at 63% 92%,rgba(200,222,255,.34),transparent),
    radial-gradient(1.4px 1.4px at 88% 8%,rgba(244,239,230,.44),transparent),
    radial-gradient(1px 1px at 4% 42%,rgba(244,239,230,.34),transparent),
    radial-gradient(1.2px 1.2px at 27% 6%,rgba(255,236,200,.4),transparent),
    radial-gradient(1px 1px at 41% 52%,rgba(244,239,230,.3),transparent),
    radial-gradient(1.3px 1.3px at 74% 84%,rgba(244,239,230,.38),transparent),
    radial-gradient(1px 1px at 96% 48%,rgba(200,222,255,.34),transparent),
    radial-gradient(1.1px 1.1px at 52% 4%,rgba(244,239,230,.36),transparent),
    radial-gradient(1px 1px at 33% 72%,rgba(244,239,230,.3),transparent),
    radial-gradient(1.2px 1.2px at 85% 60%,rgba(255,236,200,.36),transparent);
  animation:rf-deep 22s ease-in-out infinite alternate}
@keyframes rf-deep{from{opacity:.5}to{opacity:.95}}
.deepspace::after{content:"";position:absolute;inset:-6%;
  background:
    radial-gradient(1.3px 1.3px at 12% 30%,rgba(244,239,230,.5),transparent),
    radial-gradient(1px 1px at 26% 80%,rgba(200,222,255,.42),transparent),
    radial-gradient(1.5px 1.5px at 39% 12%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.1px 1.1px at 55% 64%,rgba(255,236,200,.4),transparent),
    radial-gradient(1.2px 1.2px at 66% 36%,rgba(244,239,230,.46),transparent),
    radial-gradient(1px 1px at 78% 86%,rgba(200,222,255,.38),transparent),
    radial-gradient(1.4px 1.4px at 90% 22%,rgba(244,239,230,.5),transparent),
    radial-gradient(1px 1px at 5% 58%,rgba(244,239,230,.34),transparent),
    radial-gradient(1.2px 1.2px at 48% 92%,rgba(255,236,200,.4),transparent),
    radial-gradient(1px 1px at 72% 6%,rgba(244,239,230,.36),transparent),
    radial-gradient(1.3px 1.3px at 94% 70%,rgba(200,222,255,.4),transparent),
    radial-gradient(1px 1px at 18% 48%,rgba(244,239,230,.3),transparent),
    radial-gradient(1.1px 1.1px at 60% 18%,rgba(244,239,230,.34),transparent),
    radial-gradient(1px 1px at 84% 50%,rgba(255,236,200,.32),transparent),
    radial-gradient(1.2px 1.2px at 33% 66%,rgba(244,239,230,.4),transparent);
  animation:rf-deep2 17s ease-in-out infinite alternate,rf-deep-drift 240s linear infinite alternate}
@keyframes rf-deep2{from{opacity:.25}to{opacity:1}}
@keyframes rf-deep-drift{from{transform:translate3d(0,0,0)}to{transform:translate3d(-2.5%,1.5%,0)}}
@media (prefers-reduced-motion:reduce){.deepspace,.deepspace::after{animation:none;opacity:.7}}
/* sections float over it */
.band-alt{background:linear-gradient(180deg,rgba(7,11,24,.86) 0%,rgba(10,16,32,.92) 100%)}

/* ---------- Header ---------- */
header{position:sticky;top:0;z-index:50;background:rgba(7,11,24,.8);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:.75rem;min-height:68px}
.nav .btn{flex:none;padding:.7rem 1.1rem;font-size:.85rem}
@media (min-width:600px){.nav .btn{padding:.85rem 1.5rem;font-size:.95rem}}
.cta-short{display:inline}.cta-long{display:none}
@media (min-width:480px){.cta-short{display:none}.cta-long{display:inline}}
.wordmark{display:flex;align-items:center;gap:.66rem;
  font-family:var(--font-display);text-decoration:none;flex:none;white-space:nowrap}
.wordmark svg{width:17px;height:24px;flex:none}
.wordmark-txt{display:flex;flex-direction:column;gap:.18em;line-height:1}
.wordmark-name{font-weight:500;font-size:clamp(.76rem,3vw,.94rem);
  letter-spacing:.2em;text-transform:uppercase;color:var(--cream)}
.wordmark-loc{font-weight:500;font-size:clamp(.5rem,1.9vw,.58rem);
  letter-spacing:.24em;text-transform:uppercase;color:var(--faint)}
.nav-links{display:none;gap:1.75rem;align-items:center}
.nav-links a{font-size:.9rem;font-weight:500;color:var(--muted);text-decoration:none;transition:color .15s}
.nav-links a:hover{color:var(--cream)}
@media (min-width:1000px){.nav-links{display:flex}}
@media (min-width:1000px) and (max-width:1140px){.nav-links{gap:1.1rem}.nav-links a{font-size:.84rem}}

/* ---------- Hero ---------- */
.hero{position:relative;isolation:isolate;padding:clamp(3.5rem,10vw,7.5rem) 0 clamp(3rem,7vw,5rem);overflow:hidden}
.sky{position:absolute;inset:0;z-index:-2;
  background:
    radial-gradient(120% 80% at 72% 6%,rgba(232,98,60,.22),transparent 58%),
    radial-gradient(90% 60% at 18% 0%,rgba(79,176,141,.12),transparent 60%),
    linear-gradient(180deg,#05080f 0%,var(--night-2) 45%,var(--dusk) 100%);
}
.stars{position:absolute;inset:-22%;z-index:-2;opacity:.85;
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%,rgba(244,239,230,.9),transparent),
    radial-gradient(1.2px 1.2px at 27% 8%,rgba(244,239,230,.7),transparent),
    radial-gradient(1.6px 1.6px at 41% 26%,rgba(244,239,230,.85),transparent),
    radial-gradient(1.1px 1.1px at 58% 12%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.5px 1.5px at 69% 31%,rgba(244,239,230,.8),transparent),
    radial-gradient(1.2px 1.2px at 83% 16%,rgba(244,239,230,.7),transparent),
    radial-gradient(1.3px 1.3px at 92% 34%,rgba(244,239,230,.75),transparent),
    radial-gradient(1px 1px at 7% 40%,rgba(244,239,230,.5),transparent),
    radial-gradient(1.1px 1.1px at 35% 44%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.4px 1.4px at 50% 5%,rgba(244,239,230,.8),transparent),
    radial-gradient(1px 1px at 76% 47%,rgba(244,239,230,.45),transparent),
    radial-gradient(1.2px 1.2px at 20% 30%,rgba(244,239,230,.6),transparent);
  animation:twinkle 7s ease-in-out infinite alternate,
             rf-sky-a 300s ease-in-out infinite alternate;
}
@keyframes rf-sky-a{from{transform:translate3d(0,0,0)}to{transform:translate3d(-3.5%,2%,0)}}
@keyframes twinkle{from{opacity:.55}to{opacity:.95}}
/* second, denser layer on a different beat so the sky shimmers rather than
   pulsing as one sheet */
.stars2{position:absolute;inset:-22%;z-index:-2;opacity:.7;
  background-image:
    radial-gradient(1.7px 1.7px at 5% 12%,rgba(244,239,230,.95),transparent),
    radial-gradient(1.2px 1.2px at 16% 26%,rgba(244,239,230,.7),transparent),
    radial-gradient(1.4px 1.4px at 23% 44%,rgba(255,236,200,.8),transparent),
    radial-gradient(1.1px 1.1px at 31% 16%,rgba(244,239,230,.65),transparent),
    radial-gradient(1.9px 1.9px at 44% 34%,rgba(244,239,230,.98),transparent),
    radial-gradient(1.2px 1.2px at 52% 22%,rgba(200,222,255,.75),transparent),
    radial-gradient(1.5px 1.5px at 61% 8%,rgba(244,239,230,.85),transparent),
    radial-gradient(1.1px 1.1px at 66% 41%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.8px 1.8px at 74% 24%,rgba(255,236,200,.9),transparent),
    radial-gradient(1.2px 1.2px at 81% 45%,rgba(244,239,230,.7),transparent),
    radial-gradient(1.6px 1.6px at 88% 9%,rgba(244,239,230,.88),transparent),
    radial-gradient(1.3px 1.3px at 95% 29%,rgba(200,222,255,.78),transparent),
    radial-gradient(1.1px 1.1px at 10% 38%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.4px 1.4px at 38% 6%,rgba(244,239,230,.8),transparent);
  animation:twinkle2 4.3s ease-in-out .9s infinite alternate,
             rf-sky-b 430s ease-in-out infinite alternate}
@keyframes rf-sky-b{from{transform:translate3d(0,0,0)}to{transform:translate3d(2.4%,-1.4%,0)}}
@keyframes twinkle2{from{opacity:.32}to{opacity:.9}}
/* third, densest layer: small, fast, out of phase with the other two */
.stars3{position:absolute;inset:-22%;z-index:-2;opacity:.75;
  background-image:
    radial-gradient(1px 1px at 3% 22%,rgba(244,239,230,.8),transparent),
    radial-gradient(1.3px 1.3px at 9% 51%,rgba(244,239,230,.7),transparent),
    radial-gradient(1px 1px at 13% 7%,rgba(255,236,200,.75),transparent),
    radial-gradient(1.2px 1.2px at 19% 33%,rgba(200,222,255,.7),transparent),
    radial-gradient(1px 1px at 26% 61%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.4px 1.4px at 29% 14%,rgba(244,239,230,.85),transparent),
    radial-gradient(1px 1px at 35% 48%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.1px 1.1px at 41% 19%,rgba(255,236,200,.7),transparent),
    radial-gradient(1px 1px at 47% 66%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.3px 1.3px at 49% 3%,rgba(244,239,230,.8),transparent),
    radial-gradient(1px 1px at 55% 39%,rgba(200,222,255,.65),transparent),
    radial-gradient(1.2px 1.2px at 58% 57%,rgba(244,239,230,.7),transparent),
    radial-gradient(1px 1px at 63% 13%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.5px 1.5px at 68% 30%,rgba(255,236,200,.85),transparent),
    radial-gradient(1px 1px at 72% 52%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.2px 1.2px at 77% 6%,rgba(244,239,230,.75),transparent),
    radial-gradient(1px 1px at 84% 38%,rgba(200,222,255,.7),transparent),
    radial-gradient(1.3px 1.3px at 86% 60%,rgba(244,239,230,.7),transparent),
    radial-gradient(1px 1px at 91% 17%,rgba(244,239,230,.6),transparent),
    radial-gradient(1.1px 1.1px at 96% 44%,rgba(255,236,200,.75),transparent),
    radial-gradient(1px 1px at 6% 78%,rgba(244,239,230,.5),transparent),
    radial-gradient(1.2px 1.2px at 22% 84%,rgba(244,239,230,.6),transparent),
    radial-gradient(1px 1px at 38% 90%,rgba(200,222,255,.55),transparent),
    radial-gradient(1.1px 1.1px at 53% 81%,rgba(244,239,230,.6),transparent),
    radial-gradient(1px 1px at 66% 94%,rgba(244,239,230,.5),transparent),
    radial-gradient(1.3px 1.3px at 79% 76%,rgba(255,236,200,.7),transparent),
    radial-gradient(1px 1px at 93% 88%,rgba(244,239,230,.55),transparent),
    radial-gradient(1.1px 1.1px at 16% 96%,rgba(244,239,230,.5),transparent);
  animation:twinkle3 2.6s ease-in-out .4s infinite alternate,
             rf-sky-c 380s ease-in-out infinite alternate}
@keyframes twinkle3{from{opacity:.25}to{opacity:.95}}
@keyframes rf-sky-c{from{transform:translate3d(0,0,0)}to{transform:translate3d(-1.6%,-2.2%,0)}}
/* fourth layer: sparse, larger, very slow — breaks up the shimmer rhythm */
.stars4{position:absolute;inset:-22%;z-index:-2;opacity:.6;
  background-image:
    radial-gradient(2px 2px at 11% 9%,rgba(255,246,225,.9),transparent),
    radial-gradient(1.8px 1.8px at 30% 37%,rgba(214,232,255,.85),transparent),
    radial-gradient(2.1px 2.1px at 48% 14%,rgba(244,239,230,.95),transparent),
    radial-gradient(1.7px 1.7px at 64% 44%,rgba(255,240,210,.8),transparent),
    radial-gradient(2px 2px at 79% 21%,rgba(244,239,230,.9),transparent),
    radial-gradient(1.8px 1.8px at 93% 40%,rgba(214,232,255,.85),transparent),
    radial-gradient(1.9px 1.9px at 21% 57%,rgba(244,239,230,.8),transparent),
    radial-gradient(1.7px 1.7px at 57% 64%,rgba(255,246,225,.75),transparent);
  animation:twinkle4 6.8s ease-in-out 1.6s infinite alternate,
             rf-sky-d 520s ease-in-out infinite alternate}
@keyframes twinkle4{from{opacity:.2}to{opacity:.85}}
@keyframes rf-sky-d{from{transform:translate3d(0,0,0)}to{transform:translate3d(2.8%,1.6%,0)}}

/* a handful of bright stars with a soft cross flare, each on its own beat */
.bstar{position:absolute;z-index:-2;width:14px;height:14px;pointer-events:none;
  background:
    radial-gradient(circle,rgba(255,255,255,1) 0,rgba(255,255,255,.9) 14%,rgba(244,239,230,.3) 30%,transparent 52%),
    linear-gradient(90deg,transparent 0,rgba(244,239,230,.55) 50%,transparent 100%),
    linear-gradient(0deg,transparent 0,rgba(244,239,230,.55) 50%,transparent 100%);
  background-size:100% 100%,100% 1px,1px 100%;
  background-position:center,center,center;background-repeat:no-repeat;
  animation:rf-bstar 3.4s ease-in-out infinite alternate}
.bstar.s1{top:12%;left:22%;animation-delay:.2s}
.bstar.s2{top:31%;left:6%;width:10px;height:10px;animation-delay:1.3s;animation-duration:4.1s}
.bstar.s3{top:8%;left:44%;width:11px;height:11px;animation-delay:2.1s;animation-duration:2.9s}
.bstar.s4{top:22%;left:71%;animation-delay:.8s;animation-duration:3.8s}
.bstar.s5{top:44%;left:88%;width:9px;height:9px;animation-delay:1.7s;animation-duration:4.6s}
.bstar.s6{top:56%;left:3%;width:9px;height:9px;animation-delay:2.6s}
.bstar.s7{top:5%;left:57%;width:12px;height:12px;animation-delay:.5s;animation-duration:2.4s}
.bstar.s8{top:38%;left:34%;width:8px;height:8px;animation-delay:3.1s;animation-duration:5.2s}
.bstar.s9{top:17%;left:12%;width:10px;height:10px;animation-delay:1.9s;animation-duration:3.1s}
.bstar.s10{top:49%;left:66%;width:9px;height:9px;animation-delay:2.4s;animation-duration:4.4s}
.bstar.s11{top:27%;left:83%;width:11px;height:11px;animation-delay:.9s;animation-duration:3.6s}
.bstar.s12{top:62%;left:47%;width:8px;height:8px;animation-delay:3.7s;animation-duration:2.7s}
.bstar.s13{top:3%;left:30%;width:9px;height:9px;animation-delay:1.1s;animation-duration:3.3s}
.bstar.s14{top:35%;left:94%;width:12px;height:12px;animation-delay:2.9s;animation-duration:4.9s}
.bstar.s15{top:14%;left:62%;width:8px;height:8px;animation-delay:.4s;animation-duration:2.6s}
.bstar.s16{top:69%;left:78%;width:10px;height:10px;animation-delay:3.4s;animation-duration:3.9s}
.bstar.s17{top:42%;left:16%;width:7px;height:7px;animation-delay:1.5s;animation-duration:5.6s}
.bstar.s18{top:2%;left:80%;width:10px;height:10px;animation-delay:2.2s;animation-duration:3.0s}
/* a couple carry a tint so the field is not uniformly white */
.bstar.warm{background:
    radial-gradient(circle,rgba(255,244,222,1) 0,rgba(255,228,180,.9) 14%,rgba(245,165,36,.28) 30%,transparent 52%),
    linear-gradient(90deg,transparent 0,rgba(255,222,170,.5) 50%,transparent 100%),
    linear-gradient(0deg,transparent 0,rgba(255,222,170,.5) 50%,transparent 100%);
  background-size:100% 100%,100% 1px,1px 100%;
  background-position:center,center,center;background-repeat:no-repeat}
.bstar.cool{background:
    radial-gradient(circle,rgba(238,246,255,1) 0,rgba(205,226,255,.9) 14%,rgba(150,190,255,.26) 30%,transparent 52%),
    linear-gradient(90deg,transparent 0,rgba(205,226,255,.5) 50%,transparent 100%),
    linear-gradient(0deg,transparent 0,rgba(205,226,255,.5) 50%,transparent 100%);
  background-size:100% 100%,100% 1px,1px 100%;
  background-position:center,center,center;background-repeat:no-repeat}
@keyframes rf-bstar{from{opacity:.35;scale:.8}to{opacity:1;scale:1.15}}
/* a deeper twinkle for a few, so the sky has more than one rhythm */
.bstar.deep{animation-name:rf-bstar-deep}
@keyframes rf-bstar-deep{
  0%  {opacity:.12;scale:.6}
  55% {opacity:1;scale:1.25}
  100%{opacity:.3;scale:.85}
}
/* ---- Launch: rises from behind the treeline on a loop ----
   Sits at z-index -2 so the dark horizon (-1) occludes the pad, which is
   what makes it read as a real liftoff. Only transform and opacity are
   animated, so it stays on the compositor. */
/* The rocket occupies the top 66% of a 120x560 viewBox, so its base sits
   0.34 x (width x 4.667) = 1.59 x width above the element's bottom edge.
   Offsetting by that keeps the engines planted on the treeline at any size
   instead of floating above it. */
/* Sits behind the copy and hazed back — it is thirty miles off, so reading it
   through atmosphere is truer than a crisp foreground object anyway. The veil
   below keeps the type legible over it. */
/* viewBox is 140x900 and the engine skirt sits at y=562, i.e. 62.4% down, so
   the base is 0.376 x (width x 6.4286) = 2.418 x width above the element's
   bottom edge. Deriving the offset keeps the engines on the treeline. */
.launch{--rw:clamp(54px,6.8vw,104px);
  position:absolute;z-index:-2;left:calc(65% - var(--rw) / 2);width:var(--rw);
  bottom:calc(30px - 2.418 * var(--rw));pointer-events:none;opacity:1}
@media (max-width:760px){.launch{--rw:72px;left:calc(58% - var(--rw) / 2);opacity:.8;
  bottom:calc(18px - 2.418 * var(--rw))}}

/* faint band of galaxy, slowly turning */
.milky{position:absolute;inset:-30%;z-index:-2;pointer-events:none;opacity:.5;
  background:
    radial-gradient(60% 18% at 50% 50%,rgba(150,170,220,.13),transparent 70%),
    radial-gradient(38% 11% at 38% 46%,rgba(214,198,235,.1),transparent 70%),
    radial-gradient(30% 9% at 64% 55%,rgba(180,205,235,.09),transparent 70%);
  transform:rotate(-22deg);
  animation:rf-galaxy 520s linear infinite}
@keyframes rf-galaxy{from{rotate:0deg}to{rotate:8deg}}

/* nebula: two very faint clouds of colour that breathe and drift over a
   couple of minutes, so the black is never quite still */
.nebula{position:absolute;inset:-20%;z-index:-2;pointer-events:none;opacity:.55;
  background:
    radial-gradient(42% 30% at 68% 22%,rgba(88,120,200,.16),transparent 70%),
    radial-gradient(34% 26% at 22% 64%,rgba(150,96,190,.12),transparent 70%),
    radial-gradient(28% 22% at 84% 70%,rgba(79,176,141,.09),transparent 70%);
  animation:rf-nebula 140s ease-in-out infinite alternate}
@keyframes rf-nebula{
  0%  {transform:translate3d(0,0,0) scale(1);opacity:.4}
  50% {opacity:.7}
  100%{transform:translate3d(-3%,2%,0) scale(1.06);opacity:.45}}

/* satellite train: seven faint points in a line, sliding across the top band
   on a long cycle with a long gap, the way a fresh batch looks after launch */
.sat-train{position:absolute;z-index:-2;top:34px;left:-12%;display:flex;gap:11px;pointer-events:none;opacity:0;
  transform:rotate(-6deg);animation:rf-train 96s linear infinite;animation-delay:14s}
.sat-train i{display:block;width:2.2px;height:2.2px;border-radius:50%;background:#e9f0ff;
  box-shadow:0 0 4px 1px rgba(200,222,255,.55)}
.sat-train i:nth-child(odd){animation:rf-satblink 2.8s ease-in-out infinite}
.sat-train i:nth-child(even){animation:rf-satblink 3.4s ease-in-out infinite;animation-delay:1.2s}
@keyframes rf-train{
  0%   {opacity:0;translate:0 0}
  2%   {opacity:.85}
  40%  {opacity:.85}
  44%  {opacity:0;translate:112vw -26px}
  100% {opacity:0;translate:112vw -26px}}
@keyframes rf-satblink{0%,100%{opacity:.5}50%{opacity:1}}

/* one lone satellite, brighter, on a slow diagonal over the right half of
   the sky with a slow flash as it tumbles */
.sat-one{position:absolute;z-index:-2;top:86%;left:58%;width:3px;height:3px;border-radius:50%;
  background:#fff;box-shadow:0 0 6px 2px rgba(244,239,230,.55);pointer-events:none;opacity:0;
  animation:rf-satone 74s linear infinite,rf-satflash 5.5s ease-in-out infinite;animation-delay:31s,0s}
@keyframes rf-satone{
  0%   {opacity:0;translate:0 0}
  3%   {opacity:1}
  52%  {opacity:1}
  56%  {opacity:0;translate:44vw -78vh}
  100% {opacity:0;translate:44vw -78vh}}
@keyframes rf-satflash{0%,100%{scale:.7}50%{scale:1.6}}

/* fireflies: warm pinpricks low over the treeline, each on its own rhythm */
.fireflies{position:absolute;left:0;right:0;bottom:0;height:150px;z-index:-1;pointer-events:none}
.fireflies i{position:absolute;bottom:20px;left:50%;width:3px;height:3px;border-radius:50%;
  background:#ffe9a8;box-shadow:0 0 6px 2px rgba(255,214,120,.7),0 0 14px 4px rgba(245,165,36,.25);
  opacity:0;animation:rf-fly 7s ease-in-out infinite,rf-float 11s ease-in-out infinite alternate}
@keyframes rf-fly{0%,100%{opacity:0}8%{opacity:0}14%{opacity:1}22%{opacity:.15}30%{opacity:.9}38%{opacity:0}}
@keyframes rf-float{from{transform:translate3d(0,0,0)}to{transform:translate3d(18px,-26px,0)}}
.fireflies .f1{left:6%;bottom:34px;animation-delay:.4s,0s}
.fireflies .f2{left:14%;bottom:62px;animation-delay:2.9s,1s;animation-duration:8.5s,13s}
.fireflies .f3{left:23%;bottom:22px;animation-delay:5.1s,2s;animation-duration:6.4s,9s}
.fireflies .f4{left:33%;bottom:48px;animation-delay:1.6s,.5s;animation-duration:9.2s,12s}
.fireflies .f5{left:41%;bottom:90px;animation-delay:3.8s,3s;animation-duration:7.6s,10s}
.fireflies .f6{left:52%;bottom:30px;animation-delay:6.3s,1.5s;animation-duration:8.1s,14s}
.fireflies .f7{left:61%;bottom:70px;animation-delay:.9s,2.5s;animation-duration:6.9s,11s}
.fireflies .f8{left:70%;bottom:40px;animation-delay:4.4s,.8s;animation-duration:9.8s,9.5s}
.fireflies .f9{left:78%;bottom:104px;animation-delay:2.2s,3.5s;animation-duration:7.2s,12.5s}
.fireflies .f10{left:86%;bottom:26px;animation-delay:5.7s,1.2s;animation-duration:8.8s,10.5s}
.fireflies .f11{left:93%;bottom:58px;animation-delay:3.3s,2.8s;animation-duration:6.6s,13.5s}
.fireflies .f12{left:47%;bottom:16px;animation-delay:7.4s,.3s;animation-duration:7.9s,11.5s}
@media (max-width:760px){
  .fireflies .f2,.fireflies .f5,.fireflies .f7,.fireflies .f9,.fireflies .f11{display:none}
  .sat-train{top:46px;gap:8px}
  .sat-train i{width:1.8px;height:1.8px}
  .sat-one{display:none}
}
@media (prefers-reduced-motion:reduce){
  .sat-train,.sat-one,.fireflies,.nebula{animation:none;opacity:0}
}

/* ---------- The saucer ----------
   One 48s loop: zip in from the right, hover, dart to the top-left, hover,
   dart back over the farm, hover with the beam down, then out. Only
   transform and opacity animate; the lights chase with stepped opacity. */
.ufo{position:absolute;z-index:-2;top:0;left:0;width:clamp(64px,7.5vw,118px);pointer-events:none;opacity:0;
  will-change:transform;animation:rf-ufo 48s cubic-bezier(.65,0,.35,1) infinite;animation-delay:6s}
.ufo svg{width:100%;height:auto;display:block;overflow:visible}
.ufo-glow{animation:rf-ufo-glow 1.8s ease-in-out infinite alternate}
@keyframes rf-ufo-glow{from{opacity:.55}to{opacity:1}}
.ufo-lights circle{fill:#dff4ff;opacity:.25;animation:rf-ufo-light 1.6s steps(1) infinite}
.ufo-lights circle:nth-child(1){animation-delay:0s}   .ufo-lights circle:nth-child(2){animation-delay:.2s}
.ufo-lights circle:nth-child(3){animation-delay:.4s}  .ufo-lights circle:nth-child(4){animation-delay:.6s}
.ufo-lights circle:nth-child(5){animation-delay:.8s}  .ufo-lights circle:nth-child(6){animation-delay:1s}
.ufo-lights circle:nth-child(7){animation-delay:1.2s} .ufo-lights circle:nth-child(8){animation-delay:1.4s}
@keyframes rf-ufo-light{0%{opacity:1}12.5%{opacity:.25}100%{opacity:.25}}
/* x in vw so it scales with the sky, y in px so it never dips into the copy */
@keyframes rf-ufo{
  0%   {opacity:0;transform:translate3d(108vw,60px,0) rotate(-8deg) scale(.7)}
  2%   {opacity:1}
  7%   {transform:translate3d(72vw,44px,0) rotate(3deg) scale(1)}
  9%   {transform:translate3d(72vw,52px,0) rotate(-2deg) scale(1)}
  11%  {transform:translate3d(72vw,44px,0) rotate(2deg) scale(1)}
  13%  {transform:translate3d(72vw,50px,0) rotate(0deg) scale(1)}
  15%  {transform:translate3d(72vw,44px,0) rotate(-14deg) scale(1)}
  21%  {transform:translate3d(26vw,14px,0) rotate(6deg) scale(.8)}
  23%  {transform:translate3d(26vw,20px,0) rotate(-3deg) scale(.8)}
  25%  {transform:translate3d(26vw,14px,0) rotate(3deg) scale(.8)}
  27%  {transform:translate3d(26vw,18px,0) rotate(0deg) scale(.8)}
  29%  {transform:translate3d(26vw,14px,0) rotate(16deg) scale(.8)}
  36%  {transform:translate3d(84vw,250px,0) rotate(-3deg) scale(1.15)}
  38%  {transform:translate3d(84vw,258px,0) rotate(2deg) scale(1.15)}
  40%  {transform:translate3d(84vw,250px,0) rotate(-2deg) scale(1.15)}
  50%  {transform:translate3d(84vw,254px,0) rotate(1deg) scale(1.15)}
  52%  {transform:translate3d(84vw,250px,0) rotate(0deg) scale(1.15)}
  54%  {opacity:1;transform:translate3d(84vw,236px,0) rotate(-20deg) scale(1.15)}
  59%  {opacity:0;transform:translate3d(-14vw,-40px,0) rotate(-6deg) scale(.6)}
  100% {opacity:0;transform:translate3d(-14vw,-40px,0) rotate(-6deg) scale(.6)}}

/* beam and the field below the hover spot; both keyed to the same 48s loop */
.ufo-scene{position:absolute;z-index:-1;left:84vw;bottom:0;width:0;height:100%;pointer-events:none}
.ufo-beam{position:absolute;left:0;bottom:0;width:160px;height:calc(100% - 290px);translate:calc(-50% + clamp(32px,3.75vw,59px)) 0;
  clip-path:polygon(44% 0,56% 0,100% 100%,0 100%);opacity:0;transform-origin:50% 0;
  background:linear-gradient(180deg,rgba(214,242,255,.95) 0%,rgba(140,210,255,.55) 35%,rgba(120,195,255,.22) 75%,rgba(120,195,255,.10) 100%);
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 30%,#000 70%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 30%,#000 70%,transparent 100%);
  animation:rf-beam 48s linear infinite;animation-delay:6s}
@keyframes rf-beam{0%,38%{opacity:0;transform:scaleY(.2)}40%{opacity:.72;transform:scaleY(1)}50%{opacity:.72;transform:scaleY(1)}52%,100%{opacity:0;transform:scaleY(.2)}}
.ufo-cow{position:absolute;left:0;bottom:14px;width:34px;max-width:none;translate:calc(-50% + clamp(32px,3.75vw,59px)) 0;fill:#1b2438;stroke:rgba(190,225,255,.55);stroke-width:.8;overflow:visible;
  animation:rf-cow 48s ease-in-out infinite;animation-delay:6s}
@keyframes rf-cow{
  0%,40%  {opacity:1;transform:translateY(0) rotate(0)}
  41.5%   {transform:translateY(-10px) rotate(-10deg)}
  49.5%   {opacity:1;transform:translateY(-420px) rotate(380deg) scale(.55)}
  50.5%,88% {opacity:0;transform:translateY(-520px) rotate(400deg) scale(.4)}
  92%     {opacity:0;transform:translateY(-40px) rotate(0)}
  96%,100%{opacity:1;transform:translateY(0) rotate(0)}}
/* narrow desktops: the headline can reach the hover spot, so no beam there */
@media (max-width:1199px){.ufo-beam,.ufo-cow{display:none}}
/* phones: top band only, small, no hover down over the copy */
@media (max-width:760px){
  .ufo{width:52px;animation-name:rf-ufo-m;animation-duration:36s}
  @keyframes rf-ufo-m{
    0%   {opacity:0;transform:translate3d(104vw,26px,0) rotate(-8deg) scale(.8)}
    3%   {opacity:1}
    12%  {transform:translate3d(58vw,18px,0) rotate(2deg) scale(1)}
    16%  {transform:translate3d(58vw,24px,0) rotate(-2deg) scale(1)}
    20%  {transform:translate3d(58vw,18px,0) rotate(12deg) scale(1)}
    30%  {transform:translate3d(14vw,8px,0) rotate(-4deg) scale(.85)}
    34%  {transform:translate3d(14vw,14px,0) rotate(3deg) scale(.85)}
    38%  {opacity:1;transform:translate3d(14vw,8px,0) rotate(-18deg) scale(.85)}
    44%  {opacity:0;transform:translate3d(-30vw,-20px,0) rotate(-6deg) scale(.5)}
    100% {opacity:0;transform:translate3d(-30vw,-20px,0) rotate(-6deg) scale(.5)}}
}
@media (prefers-reduced-motion:reduce){.ufo,.ufo-scene{display:none}}

/* meteors: thin streaks on long, offset cycles */
/* Meteors stay in the top band of the sky, on a shallow path. A bright streak
   crossing the headline reads as a rendering glitch and drops the contrast
   behind live type, so they are kept clear of the copy entirely. */
.meteor{position:absolute;z-index:-2;width:170px;height:2px;pointer-events:none;
  background:linear-gradient(90deg,transparent,rgba(244,239,230,.85) 62%,#fff);
  border-radius:2px;opacity:0;transform:rotate(7deg);
  animation:rf-meteor 15s linear infinite}
/* px offsets, not percentages: the hero's height and the viewport height scale
   independently, so a vh drop could still dip a streak into the copy. */
.meteor.m1{top:14px;left:-14%;animation-delay:3s}
.meteor.m2{top:46px;left:-18%;width:130px;animation-delay:9.5s;animation-duration:19s}
.meteor.m3{top:76px;left:-12%;width:205px;animation-delay:25s;animation-duration:23s}
.meteor.m4{top:30px;left:-16%;width:110px;animation-delay:41s;animation-duration:29s;transform:rotate(10deg)}
.meteor.m5{top:60px;left:-10%;width:150px;animation-delay:57s;animation-duration:31s;transform:rotate(5deg)}
@keyframes rf-meteor{
  0%      {opacity:0;translate:0 0}
  1.2%    {opacity:0}
  2.2%    {opacity:.9}
  7%      {opacity:.9}
  9%      {opacity:0;translate:96vw 18px}
  100%    {opacity:0;translate:96vw 18px}
}
/* the phone hero starts its copy much higher, so there is no clear band */
@media (max-width:760px){.meteor{display:none}.meteor.m1,.meteor.m4{display:block;top:8px;width:90px;height:1.5px}.meteor.m4{top:22px;width:70px}}
/* Phones: the tail is heavily blurred, and animating its scale re-rasterises
   those filters every frame. Hold it static and let opacity do the ignition. */
@media (max-width:760px){
  .rf-plume-far{animation:none;transform:scaleY(1)}
  .moon,.mars{will-change:transform}
}
@media (prefers-reduced-motion:reduce){.meteor{display:none}}

/* Moon and Mars sit above the veil so they stay crisp while the veil still
   knocks the vehicle back behind the type. */
.sky-bodies{position:absolute;inset:0;z-index:-1;pointer-events:none}
.sky-bodies img{width:100%;height:auto;display:block}

/* The Moon really does librate — a slow wobble plus drift keeps the disc from
   reading as a sticker. Transform and opacity only, so it all composites. */
.moon{position:absolute;top:5%;right:6%;width:clamp(66px,8.4vw,120px);
  filter:brightness(1.24) contrast(1.06)
         drop-shadow(0 0 14px rgba(244,239,230,.3))
         drop-shadow(0 0 38px rgba(214,226,255,.16));
  animation:rf-drift-moon 210s ease-in-out infinite alternate,
            rf-librate 96s ease-in-out infinite alternate}
.moon-base{position:absolute;inset:0;width:100%;height:100%}
.mars{position:absolute;top:31%;right:28%;width:clamp(26px,3.2vw,48px);
  filter:brightness(1.3) saturate(1.16)
         drop-shadow(0 0 12px rgba(255,146,92,.4))
         drop-shadow(0 0 34px rgba(232,98,60,.22));
  animation:rf-drift-mars 150s ease-in-out infinite alternate}
/* a terminator that creeps around the disc, so Mars reads as a lit sphere
   rather than a flat cut-out */
.mars-term{position:absolute;inset:0;border-radius:50%;
  background:linear-gradient(105deg,transparent 48%,rgba(11,18,38,.16) 76%,rgba(11,18,38,.44) 100%);
  animation:rf-term 120s linear infinite}

@keyframes rf-drift-moon{from{transform:translate3d(0,0,0)}to{transform:translate3d(-2.2%,1.6%,0)}}
@keyframes rf-librate{
  0%  {rotate:-1.1deg;scale:1}
  50% {rotate:.5deg;scale:1.012}
  100%{rotate:1.2deg;scale:1}
}
@keyframes rf-drift-mars{from{transform:translate3d(0,0,0)}to{transform:translate3d(3.4%,-2.4%,0)}}
@keyframes rf-term{from{rotate:0deg}to{rotate:360deg}}
@media (max-width:760px){
  /* The copy carries its own backing now, so the bodies sit in front of the
     veil on phones too and read at full brightness. */
  /* Mars sat 27px from the Moon and was swallowed by its glow. Opposite
     corners on phones, both in the clear band above the headline. */
  .moon{top:1.1%;right:4%;width:70px}
  .mars{top:1.8%;right:auto;left:6%;width:28px}
  .hero-copy{text-shadow:0 1px 3px rgba(7,11,24,.96),0 2px 16px rgba(7,11,24,.9)}
  .hero-copy::before{background:rgba(7,11,24,.58)}
  .launch{opacity:.6}
}

/* veil: protects the type where it sits, thins out to the right */
.hero-veil{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,rgba(7,11,24,.93) 0%,rgba(7,11,24,.8) 32%,
    rgba(7,11,24,.42) 56%,rgba(7,11,24,.12) 78%,transparent 100%)}
@media (max-width:760px){
  .hero-veil{background:linear-gradient(180deg,rgba(7,11,24,.82) 0%,
    rgba(7,11,24,.8) 46%,rgba(7,11,24,.58) 74%,rgba(7,11,24,.3) 100%)}
}

.launch-rise{will-change:transform;animation:rf-rise 22s linear infinite}
.launch-rise svg{width:100%;height:auto;display:block;overflow:visible}

/* accelerating climb, faked with keyframe spacing so easing stays linear */
@keyframes rf-rise{
  0%    {transform:translateY(0)}
  14%   {transform:translateY(0)}
  19%   {transform:translateY(-.8vh)}
  27%   {transform:translateY(-4vh)}
  38%   {transform:translateY(-12vh)}
  49%   {transform:translateY(-26vh)}
  60%   {transform:translateY(-48vh)}
  70%   {transform:translateY(-82vh)}
  78%   {transform:translateY(-125vh)}
  84%   {transform:translateY(-170vh)}
  100%  {transform:translateY(-170vh)}
}

/* plume grows downward out of the engine skirt */
.rf-plume{opacity:0;filter:saturate(1.12);
  animation:rf-plume 22s linear infinite}
/* only the tail lengthens; the throat stays welded to the bells */
.rf-plume-far{transform-box:fill-box;transform-origin:50% 0%;
  animation:rf-tail 22s linear infinite}
@keyframes rf-plume{
  0%,11% {opacity:0}
  13.5%  {opacity:.8}
  18%    {opacity:1}
  80%    {opacity:1}
  85%    {opacity:0}
  100%   {opacity:0}
}
@keyframes rf-tail{
  0%,11% {transform:scaleY(.18)}
  15%    {transform:scaleY(.55)}
  22%    {transform:scaleY(.86)}
  40%    {transform:scaleY(1)}
  80%    {transform:scaleY(1.06)}
  100%   {transform:scaleY(1.06)}
}
/* engine flicker rides on opacity so it does not fight the scale above */
.rf-core{animation:rf-flicker .16s steps(2,end) infinite}
@keyframes rf-flicker{from{opacity:.98}to{opacity:.74}}

/* rolling smoke column: three billows on staggered delays */
.rf-smokecol{position:absolute;z-index:-2;left:calc(65% - 150px);bottom:-40px;
  width:300px;height:340px;pointer-events:none;opacity:.75}
@media (max-width:760px){.rf-smokecol{left:calc(58% - 105px);width:210px;height:250px;opacity:.55}}
.rf-puff{position:absolute;bottom:0;border-radius:50%;filter:blur(7px);
  background:radial-gradient(circle at 46% 58%,rgba(244,239,230,.42),rgba(226,220,208,.18) 46%,transparent 72%);
  will-change:transform,opacity;opacity:0;animation:rf-puff 22s linear infinite}
.rf-puff.a{left:14%;width:46%;aspect-ratio:1;animation-delay:0s}
.rf-puff.b{left:38%;width:54%;aspect-ratio:1;animation-delay:1.1s}
.rf-puff.c{left:2%;width:40%;aspect-ratio:1;animation-delay:2.2s}
@keyframes rf-puff{
  0%,12%  {opacity:0;transform:translate3d(0,10%,0) scale(.3)}
  18%     {opacity:.62;transform:translate3d(0,-4%,0) scale(.72)}
  34%     {opacity:.46;transform:translate3d(6%,-32%,0) scale(1.15)}
  54%     {opacity:.26;transform:translate3d(14%,-68%,0) scale(1.6)}
  74%     {opacity:0;transform:translate3d(22%,-104%,0) scale(2)}
  100%    {opacity:0}
}
@media (prefers-reduced-motion:reduce){
  .rf-puff{opacity:.3;transform:translate3d(0,-6%,0) scale(.9)}
}

/* ignition cloud at the pad */
  .launch-smoke{--sw:clamp(150px,20vw,260px);
  position:absolute;z-index:-2;left:calc(65% - var(--sw) / 2);
  bottom:calc(14px - var(--sw) / 2);
  width:var(--sw);aspect-ratio:1;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 50% 62%,rgba(244,239,230,.5),rgba(244,239,230,.16) 42%,transparent 70%);
  opacity:0;will-change:transform,opacity;animation:rf-smoke 22s linear infinite}
@media (max-width:760px){.launch-smoke{--sw:190px;left:calc(58% - var(--sw) / 2)}}
@keyframes rf-smoke{
  0%,11% {opacity:0;transform:scale(.3)}
  17%    {opacity:.7;transform:scale(1)}
  38%    {opacity:.5;transform:scale(1.5) translateY(-4%)}
  62%    {opacity:.26;transform:scale(2) translateY(-9%)}
  82%    {opacity:0;transform:scale(2.4) translateY(-14%)}
  100%   {opacity:0}
}

/* Reduced motion: hold it on the pad, engines lit, nothing moving. */
@media (prefers-reduced-motion:reduce){
  .rf-plume{opacity:.92;transform:scale(1,1.25)}
  .launch-smoke{opacity:.3;transform:scale(1)}
}
.horizon{position:absolute;left:0;right:0;bottom:-1px;z-index:-1;width:100%;height:auto}

/* a faint glow low on the sky, the way the horizon reads near a town, so
   the silhouettes in front of it separate from the dark */
.horizon-glow{position:absolute;left:0;right:0;bottom:0;height:clamp(200px,24vw,340px);z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,transparent 0%,rgba(72,96,160,.10) 45%,rgba(96,120,190,.2) 80%,rgba(120,140,210,.26) 100%)}
@media (max-width:760px){.horizon-glow{height:200px;opacity:.75}}

/* ---------- Farmland foreground ----------
   Flat Acadiana prairie: rice levees converging on the horizon, irrigation
   ditches with a green cast and a slow shimmer, a fence line, a few small
   silhouettes far off. Everything dark, so the type is untouched. */
.fields{position:absolute;left:0;right:0;bottom:-1px;z-index:-1;height:clamp(150px,17vw,250px);pointer-events:none;overflow:hidden}
.fields svg{width:100%;height:100%;display:block}
.fields .land{fill:#06090f}
.fields .farline{fill:#080d18}
.fields .rows{fill:none;stroke:rgba(79,176,141,.11);stroke-width:1}
.fields .ditch{fill:rgba(79,176,141,.2)}
.fields .ditch-edge{fill:rgba(140,200,170,.24)}
.fields .ditch-shine{fill:rgba(160,210,190,.10);animation:rf-shine 9s ease-in-out infinite alternate}
@keyframes rf-shine{from{opacity:.35}to{opacity:1}}
.fields .fence,.fields .pole{fill:none;stroke:#0b1120;stroke-width:1.6;stroke-linecap:round}
.fields .wire{fill:none;stroke:rgba(150,170,215,.16);stroke-width:1}
.fields .wire.thin{stroke-width:.8}
.fields .bins,.fields .house,.fields .pump{fill:#070b16}
.fields .window{fill:#ffcf7a;animation:rf-window 6s ease-in-out infinite alternate}
@keyframes rf-window{from{opacity:.75}to{opacity:1}}
.fields .egret{fill:#070b16;stroke:#070b16;stroke-linecap:round}
.fields .tuft{fill:none;stroke:#0a1020;stroke-width:1.3;stroke-linecap:round;
  transform-box:fill-box;transform-origin:50% 100%;animation:rf-reed 5.5s ease-in-out infinite alternate}
@keyframes rf-reed{from{transform:rotate(-3deg)}to{transform:rotate(3deg)}}
@media (max-width:760px){.fields{height:150px}}
@media (prefers-reduced-motion:reduce){.fields .tuft,.fields .ditch-shine,.fields .window{animation:none}}

/* ground mist over the water, two layers drifting opposite ways */
.mist{position:absolute;left:-20%;right:-20%;bottom:0;height:90px;z-index:-1;pointer-events:none;opacity:.22;
  background:
    radial-gradient(38% 60% at 18% 100%,rgba(190,205,230,.55),transparent 70%),
    radial-gradient(46% 55% at 52% 100%,rgba(190,205,230,.45),transparent 70%),
    radial-gradient(34% 65% at 84% 100%,rgba(190,205,230,.5),transparent 70%);
  filter:blur(14px);animation:rf-mist 60s ease-in-out infinite alternate}
.mist2{height:60px;opacity:.16;animation:rf-mist2 44s ease-in-out infinite alternate;
  background:
    radial-gradient(30% 70% at 34% 100%,rgba(200,214,236,.5),transparent 70%),
    radial-gradient(40% 60% at 70% 100%,rgba(200,214,236,.45),transparent 70%)}
@keyframes rf-mist{from{transform:translate3d(0,0,0)}to{transform:translate3d(6%,-3px,0)}}
@keyframes rf-mist2{from{transform:translate3d(0,0,0)}to{transform:translate3d(-7%,2px,0)}}
@media (max-width:760px){
  .mist{opacity:.14}.mist2{opacity:.1}
  /* filters re-rasterise on every frame on a phone; hold the mist still */
  .mist,.mist2{animation:none}
}
@media (prefers-reduced-motion:reduce){.mist,.mist2{animation:none}}
/* fireflies live in the trees now, in front of them */
.fireflies{z-index:0}

.hero-copy{max-width:790px;position:relative;
  text-shadow:0 1px 3px rgba(7,11,24,.96),0 2px 20px rgba(7,11,24,.85)}
/* A uniform, feathered backing rather than a radial one: the radial left the
   far end of the headline uncovered, and that is exactly where the vehicle
   flies. Blurring the pseudo-element gives a soft edge with no visible box. */
.hero-copy::before{content:"";position:absolute;inset:-7% 7% -9% -11%;z-index:-1;
  pointer-events:none;border-radius:56px;background:rgba(7,11,24,.34);
  filter:blur(30px)}
.hero-copy>*{position:relative}
.hero h1{font-size:var(--h1);margin:0;text-wrap:balance}
.tagline{font-family:var(--font-display);font-weight:500;
  font-size:clamp(1.1rem,2.2vw,1.45rem);letter-spacing:-.01em;line-height:1.32;
  margin-top:1.15rem;max-width:40ch;text-wrap:balance;
  background:linear-gradient(100deg,var(--amber),var(--sunset));
  -webkit-background-clip:text;background-clip:text;color:transparent}
.hero .lede{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--muted);margin-top:1.4rem;max-width:51ch}
.tags{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem;list-style:none;padding:0}
.tags li{font-family:var(--font-display);font-weight:500;font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;border:1px solid var(--line-strong);border-radius:999px;padding:.45rem .95rem;background:rgba(244,239,230,.04)}
.hero-cta{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2.2rem}
.soon{display:inline-flex;align-items:center;gap:.55rem;margin:0 0 1rem;
  font-family:var(--font-display);font-weight:500;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
  color:var(--amber);border:1px solid rgba(245,165,36,.45);border-radius:999px;padding:.42rem .9rem .42rem .7rem;
  background:rgba(7,11,24,.92);max-width:100%;white-space:nowrap}
.soon-long{display:inline}.soon-short{display:none}
/* phones: a shorter label so the pill stays one line and clear of the Moon,
   and Mars lifts above the pill's row */
@media (max-width:760px){
  .soon-long{display:none}.soon-short{display:inline}
  .mars{top:.3%}
}
.soon-dot{width:7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 10px var(--amber);
  animation:rf-soon 1.8s ease-in-out infinite alternate}
@keyframes rf-soon{from{opacity:.45}to{opacity:1}}
.fine{font-size:.78rem;line-height:1.55;color:var(--faint);max-width:60ch}
.fine a{color:var(--amber);position:relative}
/* small-print links keep their size but get a 44px hit area on phones */
@media (max-width:760px){.fine a::before{content:"";position:absolute;inset:-15px -6px}}
.hero-fine{margin-top:1.1rem}

/* ---------- Stat strip ---------- */
.stats{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(7,11,24,.5)}
.stats-grid{display:grid;grid-template-columns:repeat(2,1fr)}
@media (min-width:860px){.stats-grid{grid-template-columns:repeat(4,1fr)}}
.stat{padding:1.8rem 1.4rem;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.stat:last-child{border-right:0}
@media (min-width:860px){.stat{border-bottom:0;text-align:center}}
.stat-num{font-size:clamp(1.55rem,3vw,2.15rem);background:var(--flame);-webkit-background-clip:text;background-clip:text;color:transparent}
.stat-label{font-size:.82rem;color:var(--faint);margin-top:.35rem;line-height:1.4}

/* ---------- Sections ---------- */
.band{padding:clamp(3.5rem,8vw,6.5rem) 0;position:relative}
.band-alt{background:linear-gradient(180deg,var(--night) 0%,#0a1020 100%)}
.head{max-width:66ch;margin-bottom:clamp(2rem,4vw,3rem)}
.head h2{font-size:var(--h2);margin-top:.9rem;text-wrap:balance}
.head p{color:var(--muted);margin-top:1rem}

/* Audience cards */
.cards{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media (min-width:760px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(180deg,rgba(244,239,230,.055),rgba(244,239,230,.015));padding:1.7rem;display:flex;flex-direction:column;gap:.85rem;transition:border-color .2s ease,transform .2s ease}
.card:hover{border-color:var(--line-strong);transform:translateY(-3px)}
.card-icon{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(245,165,36,.13);border:1px solid rgba(245,165,36,.3)}
.card-icon svg{width:20px;height:20px;stroke:var(--amber);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.card h3{font-size:1.16rem}
.card p{color:var(--muted);font-size:.95rem}
.card .note{margin-top:auto;padding-top:.9rem;border-top:1px solid var(--line);font-family:var(--font-display);font-weight:500;font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--amber)}

/* ---------- SITE MAP ---------- */
.map-tools{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1.2rem}
.chip{
  font-family:var(--font-display);font-weight:500;font-size:.8rem;
  padding:.5rem 1rem;border-radius:999px;cursor:pointer;
  border:1px solid var(--line-strong);background:rgba(244,239,230,.04);color:var(--muted);
  transition:all .15s ease;
}
.chip:hover{color:var(--cream);border-color:var(--cream)}
.chip[aria-pressed="true"]{background:var(--flame);border-color:transparent;color:#1b1102;font-weight:700}
.chip .dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:.45rem;vertical-align:1px}
.dot-50{background:var(--amber)}.dot-30{background:var(--sky-blue)}.dot-night{background:var(--marsh)}

.map-frame{position:relative;border:1px solid var(--line);border-radius:var(--radius-lg);background:linear-gradient(170deg,rgba(79,176,141,.06),rgba(7,11,24,.5));overflow:hidden}
.map-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch}
.map-scroll svg{width:100%;min-width:660px;height:auto;display:block}
.map-hint{font-size:.8rem;color:var(--faint);padding:.7rem 1.1rem;border-top:1px solid var(--line)}
@media (min-width:760px){.map-hint .touch-only{display:none}}

/* lot shapes */
.lot{cursor:pointer}
.lot .pad{fill:rgba(245,165,36,.16);stroke:var(--amber);stroke-width:1.6;transition:fill .15s ease,stroke-width .15s ease}
.lot[data-amps="30"] .pad{fill:rgba(107,168,232,.16);stroke:var(--sky-blue)}
.lot[data-term="nightly"] .pad{fill:rgba(79,176,141,.18);stroke:var(--marsh);stroke-dasharray:5 3}
.lot .num{font-family:"Space Grotesk",sans-serif;font-size:15px;font-weight:700;fill:var(--cream);text-anchor:middle;pointer-events:none;letter-spacing:.02em}
.lot:hover .pad,.lot.active .pad{fill:rgba(244,239,230,.42);stroke-width:2.6}
.lot.dim{opacity:.16}
.lot:focus{outline:none}
.lot:focus-visible .pad{stroke:var(--cream);stroke-width:3}
.road{fill:rgba(244,239,230,.07)}
.road-edge{stroke:rgba(244,239,230,.18);stroke-width:1;stroke-dasharray:7 7;fill:none}
.map-label{font-family:"Space Grotesk",sans-serif;font-size:11px;font-weight:500;fill:rgba(244,239,230,.45);letter-spacing:.14em;text-transform:uppercase}
.parcel{fill:none;stroke:rgba(244,239,230,.22);stroke-width:1.5}
.hedge{stroke:var(--marsh);stroke-width:3;stroke-linecap:round;opacity:.5;fill:none}

.tip{
  position:absolute;pointer-events:none;opacity:0;transform:translateX(-50%);
  background:rgba(5,8,15,.96);border:1px solid var(--line-strong);border-radius:12px;
  padding:.7rem .9rem;min-width:172px;z-index:5;
  box-shadow:0 18px 40px -14px rgba(0,0,0,.9);transition:opacity .13s ease;
}
.tip.show{opacity:1}
.tip-lot{font-family:var(--font-display);font-weight:700;font-size:1rem}
.tip-row{display:flex;justify-content:space-between;gap:1rem;font-size:.8rem;color:var(--muted);margin-top:.3rem}
.tip-price{font-family:var(--font-display);font-weight:700;font-size:1.05rem;margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--line);background:var(--flame);-webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- Lot table ---------- */
.table-scroll{overflow-x:auto;margin-top:1.6rem;border:1px solid var(--line);border-radius:var(--radius-lg)}
table{border-collapse:collapse;width:100%;min-width:560px;font-size:.92rem}
caption{text-align:left;padding:1.1rem 1.2rem .2rem;color:var(--faint);font-size:.85rem}
th{
  font-family:var(--font-display);font-weight:500;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint);text-align:left;padding:.9rem 1.2rem;border-bottom:1px solid var(--line-strong);white-space:nowrap;
}
td{padding:.85rem 1.2rem;border-bottom:1px solid var(--line);color:var(--muted)}
tbody tr:last-child td{border-bottom:0}
tbody tr{transition:background .15s ease}
tbody tr:hover,tbody tr.active{background:rgba(245,165,36,.09)}
td.lot-id{font-family:var(--font-display);font-weight:700;color:var(--cream);white-space:nowrap}
td.rate{font-family:var(--font-display);font-weight:700;color:var(--cream);white-space:nowrap}
td.rate small{font-weight:400;color:var(--faint);font-family:var(--font-body)}
.pill{display:inline-flex;align-items:center;gap:.4rem;font-size:.78rem;white-space:nowrap}
.pill::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--amber);flex:none}
tr[data-amps="30"] .pill::before{background:var(--sky-blue)}
tr[data-term="nightly"] .pill::before{background:var(--marsh)}
.tally{display:flex;flex-wrap:wrap;gap:1.5rem;margin-top:1.2rem;font-size:.87rem;color:var(--faint)}
.tally b{color:var(--cream);font-family:var(--font-display)}

/* ---------- Pricing tiers ---------- */
.tiers{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media (min-width:800px){.tiers{grid-template-columns:repeat(3,1fr)}}
.tier{border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.8rem;background:rgba(244,239,230,.025);display:flex;flex-direction:column;position:relative;overflow:hidden}
.tier-flag{position:absolute;top:0;left:0;right:0;height:3px;background:var(--amber)}
.tier[data-t="30"] .tier-flag{background:var(--sky-blue)}
.tier[data-t="night"] .tier-flag{background:var(--marsh)}
.tier-count{font-family:var(--font-display);font-weight:500;font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}
.tier h3{font-size:1.22rem;margin:.5rem 0 1rem}
.tier-price{display:flex;align-items:flex-end;gap:.4rem}
.tier-price b{font-family:var(--font-display);font-size:2.5rem;line-height:1;background:var(--flame);-webkit-background-clip:text;background-clip:text;color:transparent}
.tier-price span{color:var(--faint);font-size:.9rem;padding-bottom:.25rem}
.tier-sub{font-size:.85rem;color:var(--faint);margin-top:.5rem}
.tier ul{list-style:none;margin:1.3rem 0 0;padding:0;display:grid;gap:.55rem;font-size:.92rem;color:var(--muted)}
.tier li{padding-left:1.4rem;position:relative}
.tier li::before{content:"";position:absolute;left:.1rem;top:.55rem;width:6px;height:6px;border-radius:50%;background:var(--amber);opacity:.8}
.tier[data-t="30"] li::before{background:var(--sky-blue)}
.tier[data-t="night"] li::before{background:var(--marsh)}

.included{display:grid;gap:1.1rem;grid-template-columns:1fr;margin-top:1.6rem}
@media (min-width:780px){.included{grid-template-columns:1fr 1fr}}
.inc-box{border:1px solid var(--line);border-radius:var(--radius);padding:1.4rem 1.5rem;background:rgba(244,239,230,.02)}
.inc-box h4{font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:500;margin-bottom:.9rem}
.inc-box ul{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:.92rem;color:var(--muted)}
.inc-box li{padding-left:1.5rem;position:relative}
.inc-box li::before{content:"✓";position:absolute;left:0;top:-.05rem;color:var(--marsh);font-weight:700}
.inc-box.out li::before{content:"–";color:var(--faint)}
.terms{font-size:.83rem;color:var(--faint);margin-top:1.4rem;max-width:80ch}

/* ---------- Amenities ---------- */
.amenities{display:grid;gap:.9rem;grid-template-columns:1fr}
@media (min-width:620px){.amenities{grid-template-columns:repeat(2,1fr)}}
@media (min-width:980px){.amenities{grid-template-columns:repeat(3,1fr)}}
.amenity{display:flex;gap:.85rem;align-items:flex-start;padding:1.1rem 1.15rem;border:1px solid var(--line);border-radius:var(--radius);background:rgba(244,239,230,.02)}
.amenity svg{width:18px;height:18px;flex:none;margin-top:.3rem;stroke:var(--marsh);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.amenity strong{display:block;font-family:var(--font-display);font-weight:700;font-size:.97rem;letter-spacing:-.01em}
.amenity span{display:block;color:var(--faint);font-size:.88rem;margin-top:.2rem}

/* ---------- Phases ---------- */
.phases{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media (min-width:820px){.phases{grid-template-columns:repeat(3,1fr)}}
.phase{border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.7rem;background:rgba(244,239,230,.02);position:relative;overflow:hidden}
.phase::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--flame)}
.phase[data-later]::before{background:var(--line-strong)}
.phase-when{font-family:var(--font-display);font-weight:500;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--amber)}
.phase[data-later] .phase-when{color:var(--faint)}
.phase h3{font-size:1.2rem;margin:.55rem 0 .8rem}
.phase ul{margin:0;padding-left:1.15rem;color:var(--muted);font-size:.93rem;display:grid;gap:.35rem}
.phase-rate{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--line);font-size:.85rem;color:var(--faint)}
.phase-rate b{color:var(--cream);font-family:var(--font-display)}

/* ---------- Location ---------- */
.la-map{margin:0 0 clamp(2rem,4vw,3rem);max-width:430px}
.la-map svg{width:100%;height:auto;display:block}
.la-lbl{font-family:var(--font-display);font-weight:500;font-size:26px;
  letter-spacing:.1em;fill:var(--cream)}
.la-lbl.dim{font-size:21px;fill:var(--faint)}
.la-map figcaption{font-size:.85rem;color:var(--faint);margin-top:.9rem;max-width:42ch}
@media (min-width:900px){.la-map{max-width:390px;float:none}}

.loc{display:grid;gap:clamp(1.5rem,4vw,3rem);grid-template-columns:1fr;align-items:start}
.loc>*{min-width:0}
@media (min-width:900px){.loc{grid-template-columns:1.05fr .95fr}}
.loc-list{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem}
.loc-list li{padding-left:1.4rem;position:relative;color:var(--muted)}
.loc-list li::before{content:"";position:absolute;left:0;top:.6rem;width:7px;height:7px;border-radius:50%;background:var(--amber)}
.loc-list b{color:var(--cream);font-weight:600}
.dist-card{border:1px solid var(--line);border-radius:var(--radius-lg);padding:1.6rem;background:linear-gradient(180deg,rgba(79,176,141,.07),rgba(244,239,230,.015))}
.dist-card h3{font-size:1.05rem;margin-bottom:1rem}
.dist-row{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px dashed var(--line);font-size:.93rem}
.dist-row:last-of-type{border-bottom:0}
.addr{font-family:var(--font-display);font-weight:500;font-size:1.05rem;line-height:1.45;
  color:var(--cream);margin-bottom:1.2rem}
.dir-btns{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:1.5rem}
.dir-btns .btn{padding:.72rem 1.15rem;font-size:.88rem;
  white-space:normal;text-align:center;flex:1 1 auto;min-width:0}
.dir-label{font-family:var(--font-display);font-weight:500;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--faint);margin:0 0 .7rem}
.dir-from{display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.6rem}
.dir-from a{font-size:.85rem;text-decoration:none;color:var(--muted);
  border:1px solid var(--line-strong);border-radius:999px;padding:.4rem .8rem;
  transition:color .15s ease,border-color .15s ease,background .15s ease}
.dir-from a:hover{color:var(--night);background:var(--amber);border-color:transparent}
.gate-note{margin-top:1.3rem;padding-top:1.2rem;border-top:1px solid var(--line)}
.gate-note strong{display:block;font-family:var(--font-display);font-size:.78rem;
  letter-spacing:.14em;text-transform:uppercase;color:var(--amber);margin-bottom:.5rem}
.gate-note span{font-size:.9rem;color:var(--muted)}
.dist-row span{color:var(--muted)}
.dist-row b{font-family:var(--font-display);white-space:nowrap}

/* ---------- Reserve ---------- */
.pay-row{margin:1rem 0 0}
.faq{max-width:78ch;border-top:1px solid var(--line)}
.faq-item{border-bottom:1px solid var(--line)}
.faq-item summary{list-style:none;cursor:pointer;padding:1.15rem 2.4rem 1.15rem 0;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary h3{font-size:clamp(1rem,1.5vw,1.09rem);font-weight:700;display:inline;
  letter-spacing:-.01em;color:var(--cream)}
.faq-item summary::after{content:"";position:absolute;right:.5rem;top:1.55rem;
  width:9px;height:9px;border-right:2px solid var(--amber);border-bottom:2px solid var(--amber);
  rotate:45deg;transition:rotate .18s ease}
.faq-item[open] summary::after{rotate:225deg}
.faq-item summary:hover h3{color:#fff}
.faq-item > p{color:var(--muted);font-size:.97rem;padding:0 1.5rem 1.35rem 0;margin:0;max-width:72ch}

/* Touch targets: phones get at least 44px of height on every control, which
   is the mobile-usability floor search engines check and thumbs care about. */
@media (max-width:760px){
  .chip{min-height:44px;display:inline-flex;align-items:center}
  .dir-from a{min-height:44px;display:inline-flex;align-items:center}
  .wordmark{padding-block:.6rem}
  .faq-item summary{padding-block:1.25rem}
  .nav-links a{padding-block:.5rem}
  .foot-col a{min-height:44px;display:flex;align-items:center}
}

.signup{border-top:1px solid var(--line)}
.form-shell{border:1px solid var(--line-strong);border-radius:var(--radius-lg);background:linear-gradient(180deg,rgba(245,165,36,.07),rgba(244,239,230,.02));padding:clamp(1.5rem,4vw,2.6rem)}
form{display:grid;gap:1.1rem}
.row{display:grid;gap:1.1rem;grid-template-columns:1fr}
@media (min-width:680px){.row-2{grid-template-columns:1fr 1fr}}
.field{display:grid;gap:.45rem}
label{font-family:var(--font-display);font-weight:500;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
/* 16px minimum, otherwise iOS Safari zooms the viewport on focus */
input,select,textarea{font:inherit;font-size:1rem;color:var(--cream);background:rgba(7,11,24,.6);border:1px solid var(--line-strong);border-radius:10px;padding:.8rem .9rem;width:100%;transition:border-color .15s ease}
input::placeholder,textarea::placeholder{color:rgba(244,239,230,.35)}
input:hover,select:hover,textarea:hover{border-color:rgba(244,239,230,.4)}
textarea{resize:vertical;min-height:96px}
select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23f4efe6' stroke-width='1.6' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .95rem center;background-size:12px;padding-right:2.4rem}
select option{background:#0c1226;color:var(--cream)}
.form-foot{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;justify-content:space-between}
.privacy{font-size:.83rem;color:var(--faint);max-width:44ch}
.form-msg{display:none;margin-top:1.1rem;padding:.95rem 1.1rem;border-radius:10px;font-size:.93rem;border:1px solid rgba(79,176,141,.45);background:rgba(79,176,141,.12)}
.form-msg.show{display:block}
.form-msg a{color:var(--amber);font-weight:600}

/* ---------- Footer ---------- */
footer{border-top:1px solid var(--line);background:#05080f;padding:clamp(2.5rem,6vw,4rem) 0 2.5rem}
.foot-top{display:grid;gap:2rem;grid-template-columns:1fr}
@media (min-width:760px){.foot-top{grid-template-columns:1.3fr 1fr 1fr}}
.foot-col h4{font-family:var(--font-display);font-size:.78rem;letter-spacing:.16em;text-transform:uppercase;color:var(--faint);margin:0 0 .9rem;font-weight:500}
.foot-col p,.foot-col a{color:var(--muted);font-size:.93rem;text-decoration:none;display:block}
.foot-col a:hover{color:var(--cream)}
.foot-col a+a{margin-top:.5rem}
.disclaimer{margin-top:clamp(2rem,5vw,3rem);padding-top:1.6rem;border-top:1px solid var(--line);display:grid;gap:.85rem}
.disclaimer p{font-size:.78rem;color:rgba(244,239,230,.38);line-height:1.6;max-width:92ch}
.copyright{margin-top:1.4rem;font-size:.8rem;color:var(--faint)}

/* ---------- Mobile menu ---------- */
.nav-toggle{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border:1px solid var(--line-strong);border-radius:10px;background:rgba(244,239,230,.03);color:var(--cream);cursor:pointer;flex:none;margin-left:auto;padding:0}
.nav-toggle svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:2;stroke-linecap:round}
.nav-toggle .x{display:none}
header.open .nav-toggle .bars{display:none}
header.open .nav-toggle .x{display:block}
.nav-links a[aria-current="page"]{color:var(--cream)}
@media (max-width:999px){
  .nav-links{display:none;position:absolute;left:0;right:0;top:100%;flex-direction:column;align-items:stretch;gap:0;
    background:rgba(7,11,24,.97);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line);padding:.3rem var(--gutter) .6rem}
  header.open .nav-links{display:flex}
  .nav-links a{padding:.9rem 0;min-height:48px;display:flex;align-items:center;border-bottom:1px solid var(--line);font-size:1rem}
  .nav-links a:last-child{border-bottom:0}
}
@media (min-width:1000px){.nav-toggle{display:none}}
@media (max-width:360px){.nav{gap:.5rem}.nav .btn{padding:.65rem .85rem;font-size:.8rem}.wordmark-name{letter-spacing:.14em}.wordmark-loc{letter-spacing:.18em}}

/* ---------- Sub-page heads ---------- */
.head h1{font-size:clamp(2rem,5vw,3.3rem);margin-top:.9rem;text-wrap:balance}
.more{margin-top:clamp(1.6rem,3vw,2.4rem);display:flex;flex-wrap:wrap;gap:1rem 1.6rem;align-items:center}
.more p{color:var(--faint);font-size:.9rem;max-width:52ch}
.more p a{color:var(--amber)}
.more p a,.terms a{position:relative}
@media (max-width:760px){.more p a::before,.terms a::before{content:"";position:absolute;inset:-14px -4px}}
@media (max-width:600px){.more .btn{width:100%}}