/* =============================================================
   Happy Valley Detailing — custom theme
   Palette: ink #010101 · coal #232527 · cloud #F1F1F1 · glow #37C0EF
   Type: Archivo Expanded (display) · Hanken Grotesk (body) · Fraunces italic (accent)
   ============================================================= */

:root{
  --ink:#010101;
  --coal:#232527;
  --coal-2:#2a2d30;
  --coal-3:#313539;
  --cloud:#F1F1F1;
  --cloud-dim:#c9cbcd;
  --glow:#37C0EF;
  --glow-deep:#1e9ecb;
  --glow-soft:rgba(55,192,239,.13);
  --line:rgba(241,241,241,.13);
  --line-strong:rgba(241,241,241,.24);
  --ink-line:rgba(1,1,1,.14);
  --font-display:"Archivo", "Arial Black", sans-serif;
  --font-body:"Hanken Grotesk", -apple-system, "Segoe UI", sans-serif;
  --font-accent:"Fraunces", Georgia, serif;
  --wrap:1180px;
  --r-lg:22px;
  --r-md:14px;
  --shadow-glow:0 8px 40px -12px rgba(55,192,239,.45);
  --ease:cubic-bezier(.22,.7,.24,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:110px;-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{
  font-family:var(--font-body);
  background:var(--ink);
  color:var(--cloud);
  line-height:1.72;
  font-size:17px;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--glow);color:var(--ink)}

/* Custom scrollbar */
html{scrollbar-width:thin;scrollbar-color:var(--glow) var(--ink)}
::-webkit-scrollbar{width:11px}
::-webkit-scrollbar-track{background:var(--ink)}
::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--glow),var(--glow-deep));border-radius:8px;border:3px solid var(--ink)}

.skip-link{
  position:fixed;top:-60px;left:16px;z-index:200;
  background:var(--glow);color:var(--ink);font-weight:700;
  padding:.6rem 1.1rem;border-radius:8px;transition:top .2s;
}
.skip-link:focus{top:12px}

/* Focus visibility */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{
  outline:2px solid var(--glow);outline-offset:3px;border-radius:4px;
}

.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:clamp(18px,4vw,36px)}

/* =============== type helpers =============== */
.kicker{
  display:inline-flex;align-items:center;gap:.75rem;
  font-size:.7rem;font-weight:800;letter-spacing:.34em;text-transform:uppercase;
  color:var(--glow);
}
.kicker::before{content:"";width:26px;height:2px;background:var(--glow);display:inline-block}
.h-display{
  font-family:var(--font-display);font-stretch:125%;
  font-weight:830;
  text-transform:uppercase;
  line-height:.98;
  letter-spacing:.005em;
}
.h-xl{font-size:clamp(2.3rem,4.9vw,4.2rem)}
.h-lg{font-size:clamp(1.7rem,3.2vw,2.7rem)}
@media (max-width:470px){
  .h-xl{font-size:clamp(1.7rem,8.5vw,2.7rem)}
  .h-lg{font-size:clamp(1.5rem,6.4vw,2rem)}
}
.h-md{font-size:clamp(1.32rem,2.1vw,1.8rem)}
.accent-i{font-family:var(--font-accent);font-style:italic;font-weight:500;text-transform:none;letter-spacing:0;color:var(--glow);line-height:1;font-size:1.02em}
.lead{font-size:clamp(1.02rem,1.4vw,1.16rem);color:var(--cloud-dim);max-width:56ch}
.center{text-align:center}
.center .lead{margin-inline:auto}

/* =============== buttons & chips =============== */
.btn{
  position:relative;
  display:inline-flex;align-items:center;justify-content:center;gap:.55rem;
  font-weight:600;font-size:.8rem;
  letter-spacing:.13em;text-transform:uppercase;
  padding:1rem 2.1rem;border-radius:10px;
  transition:transform .25s var(--ease), box-shadow .25s, background .25s, color .25s, border-color .25s, filter .25s;
  will-change:transform;
}
.btn--glow{
  background:linear-gradient(160deg,#5ecdf6 0%,var(--glow) 48%,#1e9ecb 100%);
  color:#03202b;
  box-shadow:0 14px 34px -14px rgba(55,192,239,.6), inset 0 1px 0 rgba(255,255,255,.45), inset 0 -1px 0 rgba(1,1,1,.18);
}
.btn--glow:hover{transform:translateY(-2px);filter:brightness(1.07)}
.btn--ghost{
  border:1px solid var(--line-strong);color:var(--cloud);
  background:rgba(241,241,241,.03);
  box-shadow:inset 0 1px 0 rgba(241,241,241,.05);
}
.btn--ghost:hover{background:rgba(241,241,241,.08);border-color:rgba(241,241,241,.45);transform:translateY(-2px)}
.btn--ink{background:var(--ink);color:var(--cloud);box-shadow:inset 0 1px 0 rgba(241,241,241,.08)}
.btn--ink:hover{transform:translateY(-2px);box-shadow:0 10px 30px -12px rgba(1,1,1,.55)}
.chip-link{
  display:inline-flex;align-items:center;gap:.4rem;
  font-size:.85rem;font-weight:700;color:var(--cloud-dim);
  border:1px solid var(--line);border-radius:999px;padding:.45rem 1rem;
  transition:all .25s;
}
.chip-link:hover{color:var(--glow);border-color:var(--glow)}

/* =============== maison header — centered crest, split nav =============== */
.site-head{
  position:sticky;top:0;z-index:100;
}
.site-head__bar{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  align-items:center;
  gap:clamp(1rem,3vw,2.5rem);
  padding:1.1rem clamp(20px,4vw,56px) 1rem;
  background:var(--ink);
  transition:box-shadow .35s;
}
.site-head.is-scrolled .site-head__bar{
  box-shadow:0 24px 60px -30px rgba(1,1,1,.95);
}
/* dripping gloss edge under the menu bar */
.site-head::after{
  content:"";display:block;height:17px;
  margin-bottom:-17px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 90' preserveAspectRatio='none'%3E%3Cpath fill='%23010101' d='M0,0 H1440 V22 c-30,0 -42,34 -60,34 s-22,-34 -48,-34 c-30,0 -30,52 -52,52 s-24,-52 -56,-52 c-28,0 -34,20 -52,20 s-26,-20 -56,-20 c-34,0 -30,64 -54,64 s-22,-64 -58,-64 c-26,0 -32,30 -52,30 s-28,-30 -60,-30 c-30,0 -28,44 -50,44 s-26,-44 -60,-44 c-28,0 -34,18 -54,18 s-28,-18 -58,-18 c-32,0 -28,58 -52,58 s-24,-58 -58,-58 c-26,0 -34,26 -54,26 s-30,-26 -62,-26 c-28,0 -26,40 -48,40 s-28,-40 -62,-40 c-26,0 -36,14 -56,14 s-30,-14 -60,-14 c-30,0 -26,50 -50,50 s-28,-50 -62,-50 c-24,0 -36,22 -56,22 s-32,-22 -64,-22 z'/%3E%3C/svg%3E");
  background-size:1100px 17px;
  background-repeat:repeat-x;
  pointer-events:none;
}
.site-head__group{display:flex;align-items:center;gap:clamp(1.2rem,2.6vw,2.6rem)}
.site-head__group--l{justify-content:flex-start}
.site-head__group--r{justify-content:flex-end;gap:clamp(1rem,2vw,1.8rem)}
.site-head__rnav{display:flex;align-items:center;gap:clamp(1.2rem,2.6vw,2.6rem)}
.site-head__group a:not(.btn),
.site-head__rnav a{
  position:relative;
  font-size:.8rem;font-weight:600;
  letter-spacing:.18em;text-transform:uppercase;
  color:#e4e6e7;
  padding:.5rem 0;
  white-space:nowrap;
  transition:color .25s;
  opacity:.85;
}
.site-head__group a:not(.btn)::after,
.site-head__rnav a::after{
  content:"";position:absolute;left:50%;bottom:.15rem;
  width:0;height:1px;background:var(--glow);
  transform:translateX(-50%);
  transition:width .3s var(--ease);
}
.site-head__group a:not(.btn):hover,.site-head__rnav a:hover{color:var(--glow);opacity:1}
.site-head__group a:not(.btn):hover::after,.site-head__rnav a:hover::after{width:100%}
.site-head__group a[aria-current="page"],.site-head__rnav a[aria-current="page"]{color:var(--cloud);opacity:1}
.site-head__group a[aria-current="page"]::after,.site-head__rnav a[aria-current="page"]::after{width:100%}

.site-head__badge{
  display:block;
  margin-bottom:-3.6rem;              /* crest breaks the header line */
  filter:drop-shadow(0 16px 34px rgba(1,1,1,.8));
  transform-origin:50% 12%;
  transition:transform .35s var(--ease);
}
.site-head.is-scrolled .site-head__badge{transform:scale(.58)} /* tucks fully inside the bar */
.site-head.is-scrolled .site-head__badge:hover{transform:scale(.6)}
.site-head__badge img{
  width:clamp(124px,11.5vw,168px);height:auto;
  transition:width .35s var(--ease);
}
.site-head__badge:hover{transform:translateY(-2px) scale(1.03)}

.site-head__call{
  display:inline-flex;align-items:center;gap:.5rem;
  font-size:.85rem;font-weight:600;letter-spacing:.05em;
  color:var(--cloud-dim);
  transition:color .25s;
}
.site-head__call em{font-style:normal}
.site-head__call svg{color:var(--glow)}
.site-head__call:hover{color:var(--glow)}
.site-head__book{padding:.8rem 1.55rem;font-size:.74rem;border-radius:9px}
.site-head__burger{
  display:none;flex-direction:column;gap:5px;
  width:48px;height:48px;border-radius:50%;
  border:1px solid var(--line-strong);
  align-items:center;justify-content:center;
  flex:none;
}
.site-head__burger i{width:18px;height:2px;background:var(--cloud);border-radius:2px;transition:transform .3s,opacity .3s}
.site-head__burger[aria-expanded="true"] i:nth-child(1){transform:translateY(7px) rotate(45deg)}
.site-head__burger[aria-expanded="true"] i:nth-child(2){opacity:0}
.site-head__burger[aria-expanded="true"] i:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

@media (max-width:1180px){
  .site-head__call{display:none}
}
@media (max-width:1000px){
  /* top of page: crest centered & large */
  .site-head__bar{grid-template-columns:1fr auto 1fr;padding-block:.7rem}
  .site-head__group--l{display:none}
  .site-head__rnav{display:none}
  .site-head__badge{grid-column:2;justify-self:center;margin-bottom:-1.5rem;transform:none}
  .site-head__badge img{width:154px}
  .site-head__group--r{grid-column:3;justify-self:end}
  .site-head__burger{display:flex}
  /* on scroll: crest tucks into the top-left corner, small */
  .site-head.is-scrolled .site-head__bar{grid-template-columns:auto 1fr auto;padding-block:.5rem}
  .site-head.is-scrolled .site-head__badge{grid-column:1;justify-self:start;margin-bottom:-.9rem;transform:none}
  .site-head.is-scrolled .site-head__badge:hover{transform:translateY(-2px)}
  .site-head.is-scrolled .site-head__badge img{width:72px}
}
@media (max-width:520px){
  .site-head__book{display:none}
}

/* Mobile poster nav */
.mobile-nav[hidden]{display:none}
.mobile-nav{
  position:fixed;inset:0;z-index:90;
  background:
    radial-gradient(140% 90% at 85% 8%, rgba(55,192,239,.16), transparent 55%),
    var(--ink);
  padding:130px clamp(24px,7vw,60px) 40px;
  display:flex;flex-direction:column;
}
.mobile-nav nav{display:flex;flex-direction:column}
.mobile-nav nav a{
  font-family:var(--font-display);font-stretch:125%;font-weight:800;text-transform:uppercase;
  font-size:clamp(1.35rem,5.6vw,2rem);line-height:1.3;letter-spacing:.01em;
  border-bottom:1px solid var(--line);
  padding:.4rem 0;
  display:flex;align-items:baseline;gap:1rem;
  transition:color .2s,padding-left .25s var(--ease);
}
.mobile-nav nav a span{font-family:var(--font-body);font-size:.8rem;font-weight:800;color:var(--glow)}
.mobile-nav nav a:hover{color:var(--glow);padding-left:.5rem}
.mobile-nav__cta{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:2rem}
.mobile-nav__note{margin-top:auto;color:var(--cloud-dim);font-size:.85rem}

/* =============== marquee ticker =============== */
.marquee{overflow:hidden;white-space:nowrap;user-select:none}
.marquee__track{
  display:inline-flex;
  animation:marquee 30s linear infinite;
}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track span{
  display:inline-block;
  font-family:var(--font-display);font-stretch:125%;font-weight:700;text-transform:uppercase;
  letter-spacing:.09em;
}
@keyframes marquee{to{transform:translateX(-50%)}}
.ticker{
  background:var(--ink);
  color:var(--glow);
  padding:.62rem 0;
  border-block:1px solid rgba(55,192,239,.55);
  box-shadow:0 16px 44px -18px rgba(1,1,1,.9);
  position:relative;z-index:5;
}
.ticker .marquee__track span{font-size:.85rem;letter-spacing:.2em;font-weight:600;font-family:var(--font-body)}
.marquee--outline .marquee__track span{
  font-size:clamp(2.3rem,5.6vw,4.4rem);
  color:transparent;
  -webkit-text-stroke:1.2px rgba(241,241,241,.16);
  line-height:1.05;
}

/* =============== section dividers =============== */
.dvd{display:block;line-height:0;position:relative;z-index:4}
.dvd svg{display:block;width:100%;height:auto;shape-rendering:geometricPrecision}

/* dripping gloss — the divider div carries the BELOW section's bg;
   the path is filled with the ABOVE section's color and drips down over it.
   -1px top margin + 1px upward nudge kill sub-pixel seams at any zoom. */
.dvd--drip{margin-top:-1px;margin-bottom:-1px}
.dvd--drip.dvd--overhang{
  background:transparent;
  margin-bottom:calc(-1*clamp(44px,7vw,90px));
  position:relative;z-index:6;
}
.dvd--drip svg{height:clamp(44px,7vw,90px);transform:translateY(-1px)}
.dvd--drip path{fill:var(--ink)}
.dvd--drip.from-coal path{fill:var(--coal)}
.dvd--drip.from-cloud path{fill:var(--cloud)}
.bg-ink{background:var(--ink)}
.bg-coal{background:var(--coal)}
.bg-cloud{background:var(--cloud)}

/* dot-matrix fade band */
.dvd--dots{
  height:76px;margin-top:-1px;
  background-image:radial-gradient(rgba(55,192,239,.55) 1.3px, transparent 1.6px);
  background-size:22px 22px;
  -webkit-mask-image:linear-gradient(180deg,transparent, #000 45%, transparent);
          mask-image:linear-gradient(180deg,transparent, #000 45%, transparent);
  opacity:.5;
}

/* thin accent line with center gem */
.dvd--gem{display:flex;align-items:center;gap:1.2rem;padding-block:.4rem}
.dvd--gem::before,.dvd--gem::after{
  content:"";flex:1;height:1px;
  background:linear-gradient(90deg,transparent,var(--glow) 45%,var(--glow) 55%,transparent);
  opacity:.55;
}
.dvd--gem i{
  width:11px;height:11px;flex:none;
  background:var(--glow);
  transform:rotate(45deg);
  box-shadow:0 0 18px 2px rgba(55,192,239,.6);
}

/* gradient cross-fade band */
.dvd--fade{height:120px;margin-block:-60px;position:relative;z-index:3;pointer-events:none}
.dvd--fade.to-coal{background:linear-gradient(180deg,transparent,var(--coal))}
.dvd--fade.to-ink{background:linear-gradient(180deg,transparent,var(--ink))}

/* =============== hero =============== */
.hero{
  position:relative;
  padding:clamp(76px,10vh,110px) 0 0;
  background:
    radial-gradient(120% 65% at 50% -8%, rgba(55,192,239,.17), transparent 58%),
    var(--ink);
  overflow:hidden;
}
.hero::before{ /* faint water-bead texture */
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(241,241,241,.05) 1px, transparent 1.4px);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(90% 70% at 50% 20%, #000, transparent 75%);
          mask-image:radial-gradient(90% 70% at 50% 20%, #000, transparent 75%);
  pointer-events:none;
}
/* video hero */
.hero--video{
  min-height:min(94vh,1020px);
  display:flex;flex-direction:column;justify-content:center;
  padding:clamp(130px,17vh,200px) 0 clamp(110px,16vh,190px);
}
.hero__video{position:absolute;inset:0;overflow:hidden}
.hero__video video{
  position:absolute;inset:0;
  width:100%;height:100%;
  object-fit:cover;object-position:center 58%;
}
.hero__video::after{
  content:"";position:absolute;inset:0;
  background:
    radial-gradient(110% 85% at 50% 38%, transparent 30%, rgba(1,1,1,.66)),
    linear-gradient(180deg, rgba(1,1,1,.8), rgba(1,1,1,.48) 26%, rgba(1,1,1,.5) 60%, var(--ink) 97%);
}
.hero--video .hero__inner{position:relative;z-index:2}
.hero--video .hero__seal{
  right:clamp(4%,7vw,9%);
  bottom:clamp(44px,9vh,88px);
}
@media (max-width:640px){
  .hero--video{min-height:88vh}
  .hero--video .hero__seal{width:92px;right:5%;bottom:26px}
}

.hero__inner{position:relative;text-align:center}
.hero__rating{
  display:inline-flex;align-items:center;gap:.6rem;
  font-size:.82rem;font-weight:700;color:var(--cloud-dim);
  border:1px solid var(--line);border-radius:999px;
  padding:.5rem 1.15rem;margin-bottom:1.6rem;
  transition:border-color .25s,color .25s;
}
.hero__rating:hover{border-color:var(--glow);color:var(--cloud)}
.hero__rating b{color:var(--glow);letter-spacing:.18em;font-size:.9rem}
.hero__title{margin-bottom:1.3rem}
.hero__title .accent-i{font-size:.92em}
.hero .lead{margin-inline:auto;margin-bottom:2rem}
.hero__cta{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap;margin-bottom:1rem}
.hero__hint{font-size:.8rem;color:var(--cloud-dim);opacity:.85}
.hero__hint strong{color:var(--glow)}

/* showroom triptych */
.hero__stage{
  position:relative;
  display:flex;align-items:flex-end;justify-content:center;gap:clamp(12px,2vw,26px);
  max-width:980px;margin:clamp(30px,5vh,54px) auto 0;
  padding-inline:clamp(16px,4vw,36px);
}
.hero__arch{
  position:relative;flex:1;
  border-radius:clamp(90px,14vw,170px) clamp(90px,14vw,170px) 0 0;
  overflow:hidden;
  border:1px solid var(--line-strong);
  border-bottom:none;
  transform:translateY(0);
}
.hero__arch::before{
  content:"";position:absolute;inset:10px;z-index:2;
  border:1px solid rgba(241,241,241,.16);
  border-radius:inherit;
  pointer-events:none;
}
.hero__arch img{width:100%;height:100%;object-fit:cover}
.hero__arch--main img{object-position:50% 74%}   /* keep the car, crop the building */
.hero__arch--side{max-width:24%;aspect-ratio:3/4.6;opacity:.88}
.hero__arch--main{max-width:46%;aspect-ratio:3/3.6;box-shadow:0 30px 80px -30px rgba(55,192,239,.25)}
.hero__arch::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(1,1,1,0) 55%,rgba(1,1,1,.55));
}
.hero__seal{
  position:absolute;z-index:6;
  right:clamp(2%,6vw,13%);bottom:clamp(120px,22vh,220px);
  width:clamp(104px,12vw,150px);height:auto;
  filter:drop-shadow(0 10px 24px rgba(1,1,1,.6));
  animation:none;
}
@media (max-width:640px){
  .hero__seal{width:92px;right:4%;bottom:34px}
}
@keyframes spin{to{transform:rotate(360deg)}}

/* trust strip along hero bottom */
.trust{
  position:relative;z-index:5;
  background:var(--coal);
  border-block:1px solid var(--line);
}
.trust__row{
  display:grid;grid-template-columns:repeat(4,1fr);
  max-width:var(--wrap);margin-inline:auto;
}
.trust__item{
  display:flex;align-items:center;gap:.8rem;justify-content:center;
  padding:1.1rem 1rem;
  font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--cloud-dim);
}
.trust__item + .trust__item{border-left:1px solid var(--line)}
.trust__item svg{color:var(--glow);flex:none}
@media (max-width:900px){
  .trust__row{grid-template-columns:1fr 1fr}
  .trust__item:nth-child(3){border-left:none}
  .trust__item:nth-child(n+3){border-top:1px solid var(--line)}
}
@media (max-width:520px){
  .trust__row{grid-template-columns:1fr}
  .trust__item{justify-content:flex-start;border-left:none !important;border-top:1px solid var(--line)}
  .trust__item:first-child{border-top:none}
}

/* =============== generic sections =============== */
.sec{position:relative;padding-block:clamp(76px,10vw,150px)}
.sec--coal{background:var(--coal)}

/* brand-blue statement section */
.sec--blue{
  /* gradient flattens to a single solid before the bottom edge so the
     from-blue drip below matches it with zero seam at any width */
  background:
    radial-gradient(80% 55% at 18% 0%, rgba(255,255,255,.22), transparent 55%),
    linear-gradient(180deg,#41c5f0 0%,var(--glow) 45%,#21a8da 78%,#21a8da 100%);
  color:var(--ink);
}
.sec--blue .kicker{color:var(--ink)}
.sec--blue .kicker::before{background:var(--ink)}
.sec--blue .lead{color:rgba(1,10,14,.72)}
.sec--blue .accent-i{color:var(--ink)}
.dvd--drip.from-blue path{fill:#21a8da}

/* open, card-less steps on the blue field */
.sec--blue .process{gap:clamp(1.6rem,3.2vw,3rem)}
.sec--blue .process__step,
.sec--blue .process__step:nth-child(2){
  background:none;border:none;box-shadow:none;transform:none;
}
.sec--blue .process__step:hover,
.sec--blue .process__step:nth-child(2):hover{transform:translateY(-6px);border:none}
.sec--blue .process__media{
  aspect-ratio:4/3.3;
  border-radius:120px 120px 26px 26px;
  border:2px solid rgba(1,10,14,.85);
  box-shadow:0 26px 50px -24px rgba(1,20,28,.55);
  overflow:hidden;
}
.sec--blue .process__media::after{display:none}
.sec--blue .process__num{
  top:auto;bottom:14px;left:50%;transform:translateX(-50%);
  width:56px;height:56px;border-radius:50%;
  background:var(--ink);
  display:grid;place-items:center;
  font-size:1.5rem;color:var(--glow);
  border:2px solid rgba(55,192,239,.6);
  text-shadow:none;
}
.sec--blue .process__body{padding:1.5rem .4rem 0;text-align:center}
.sec--blue .process__body h3{color:var(--ink)}
.sec--blue .process__body p{color:rgba(1,10,14,.72)}

/* faceted / streaked section backdrops (pure texture, keeps AA contrast) */
.sec--poly::after,.sec--facets::after,.sec--streaks::after{
  content:"";position:absolute;inset:0;z-index:0;pointer-events:none;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);
          mask-image:linear-gradient(180deg,transparent,#000 10%,#000 90%,transparent);
}
.sec--poly::after{
  background:url('/assets/img/bg-poly.svg') left center / cover no-repeat;
}
.sec--facets::after{
  background:url('/assets/img/bg-facets.svg') center / cover no-repeat;
}
.sec--streaks::after{
  background:
    linear-gradient(115deg, transparent 8%, rgba(241,241,241,.05) 22%, transparent 34%),
    linear-gradient(115deg, transparent 55%, rgba(241,241,241,.028) 68%, transparent 82%),
    repeating-linear-gradient(115deg,
      rgba(241,241,241,.020) 0 90px, transparent 90px 150px,
      rgba(241,241,241,.032) 150px 260px, transparent 260px 340px),
    repeating-linear-gradient(115deg, rgba(1,1,1,.45) 0 2px, transparent 2px 170px);
}
.sec--poly > .wrap,.sec--facets > .wrap,.sec--streaks > .wrap{position:relative;z-index:1}
.sec--cloud{background:var(--cloud);color:var(--ink)}
.sec--cloud .lead{color:#4b4e51}
.sec--cloud .kicker{color:var(--glow-deep)}
.sec__head{margin-bottom:clamp(2.2rem,4vw,3.6rem)}
.sec__head .h-display{margin:.65rem 0 1rem}

/* =============== process timeline =============== */
.process{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.2rem,2.5vw,2.2rem);counter-reset:step}
.process__step{
  position:relative;
  background:linear-gradient(165deg,var(--coal-2),var(--coal));
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  overflow:hidden;
  transition:transform .35s var(--ease), border-color .35s;
}
.process__step:hover{transform:translateY(-6px);border-color:rgba(55,192,239,.5)}
.process__step:nth-child(2){transform:translateY(22px)}
.process__step:nth-child(2):hover{transform:translateY(16px)}
.process__media{position:relative;aspect-ratio:4/3;overflow:hidden}
.process__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.process__step:hover .process__media img{transform:scale(1.05)}
.process__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(35,37,39,.92))}
.process__num{
  position:absolute;top:14px;left:16px;z-index:2;
  font-family:var(--font-accent);font-style:italic;font-weight:600;font-size:2.6rem;line-height:1;
  color:var(--glow);
  text-shadow:0 4px 18px rgba(1,1,1,.65);
}
.process__body{padding:1.4rem 1.5rem 1.7rem}
.process__body h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.02rem;letter-spacing:.02em;margin-bottom:.5rem}
.process__body p{font-size:.94rem;color:var(--cloud-dim)}
@media (max-width:860px){
  .process{grid-template-columns:1fr}
  .process__step:nth-child(2){transform:none}
  .process__step:nth-child(2):hover{transform:translateY(-6px)}
  .process__media{aspect-ratio:16/8}
}

/* =============== service ledger =============== */
.ledger{border-top:1px solid var(--line)}
.ledger__row{
  display:grid;
  grid-template-columns:auto 1fr auto auto;
  align-items:center;gap:clamp(1rem,3vw,2.6rem);
  padding:clamp(1.3rem,2.6vw,2rem) .4rem;
  border-bottom:1px solid var(--line);
  position:relative;
  transition:background .3s, padding-left .3s var(--ease);
}
.ledger__row:hover{background:linear-gradient(90deg,var(--glow-soft),transparent 65%);padding-left:1rem}
.ledger__idx{
  font-family:var(--font-accent);font-style:italic;font-weight:500;
  font-size:clamp(1.7rem,2.8vw,2.5rem);
  color:var(--glow);opacity:.85;
}
.ledger__name{min-width:0}
.ledger__name h3{
  font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-weight:800;
  font-size:clamp(1.1rem,1.9vw,1.55rem);line-height:1.1;letter-spacing:.01em;
}
.ledger__name p{font-size:.9rem;color:var(--cloud-dim);margin-top:.35rem}
.ledger__price{
  font-size:.8rem;font-weight:700;color:var(--cloud-dim);text-align:right;white-space:nowrap;
}
.ledger__price b{
  display:block;font-family:var(--font-display);font-stretch:125%;font-size:1.3rem;font-weight:800;color:var(--cloud);letter-spacing:.01em;
}
.ledger__go{
  width:52px;height:52px;flex:none;border-radius:50%;
  border:1.5px solid var(--line-strong);
  display:grid;place-items:center;
  font-size:1.25rem;color:var(--cloud-dim);
  transition:all .3s var(--ease);
}
.ledger__row:hover .ledger__go{background:var(--glow);border-color:var(--glow);color:var(--ink);transform:rotate(-45deg)}
@media (max-width:640px){
  .ledger__row{grid-template-columns:auto 1fr auto}
  .ledger__go{display:none}
  .ledger__price{text-align:left}
}
.ledger-note{margin-top:1.4rem;display:flex;flex-wrap:wrap;gap:.6rem;align-items:center}
.ledger-note em{font-size:.85rem;color:var(--cloud-dim);margin-right:.4rem;font-style:normal;font-weight:700}

/* =============== before / after lab =============== */
.lab{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(1.6rem,3.4vw,3rem);align-items:start}
.baslider{
  position:relative;
  border-radius:var(--r-lg);
  overflow:hidden;
  border:1px solid var(--line-strong);
  aspect-ratio:4/4.5;
  max-height:640px;
  width:100%;
  touch-action:pan-y;
  user-select:none;
  cursor:col-resize;
}
.baslider img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.baslider__after{clip-path:inset(0 0 0 var(--cut,50%))}
.baslider__bar{
  position:absolute;top:0;bottom:0;left:var(--cut,50%);width:2px;
  background:var(--glow);
  box-shadow:0 0 22px rgba(55,192,239,.8);
  pointer-events:none;
}
.baslider__knob{
  position:absolute;top:50%;left:var(--cut,50%);transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;
  background:var(--ink);
  border:2px solid var(--glow);
  display:grid;place-items:center;
  color:var(--glow);font-weight:800;font-size:.85rem;letter-spacing:.05em;
  pointer-events:none;
}
.baslider__tag{
  position:absolute;top:14px;z-index:2;
  font-size:.68rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase;
  padding:.4rem .85rem;border-radius:999px;
  background:rgba(1,1,1,.65);backdrop-filter:blur(6px);
  border:1px solid var(--line);
  pointer-events:none;
}
.baslider__tag--b{left:14px}
.baslider__tag--a{right:14px;color:var(--glow);border-color:rgba(55,192,239,.5)}
.lab__side .kicker{margin-bottom:.6rem}
.lab__side h2{margin-bottom:1rem}
.lab__side .lead{margin-bottom:1.7rem}
.lab__chips{display:flex;flex-direction:column;gap:.7rem}
.lab__chip{
  display:grid;grid-template-columns:56px 1fr auto;align-items:center;gap:1rem;
  text-align:left;
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:.6rem .9rem .6rem .6rem;
  transition:all .3s var(--ease);
}
.lab__chip img{width:56px;height:56px;object-fit:cover;border-radius:10px}
.lab__chip strong{font-size:.98rem;display:block}
.lab__chip small{color:var(--cloud-dim);font-size:.8rem}
.lab__chip i{font-style:normal;color:var(--cloud-dim);transition:transform .3s,color .3s}
.lab__chip:hover{border-color:var(--glow)}
.lab__chip.is-on{border-color:var(--glow);background:var(--glow-soft)}
.lab__chip.is-on i{color:var(--glow)}
.lab__foot{margin-top:1.6rem;font-size:.85rem;color:var(--cloud-dim)}
@media (max-width:920px){
  .lab{grid-template-columns:1fr}
  .baslider{aspect-ratio:4/4.2}
  .lab__chips{flex-direction:row;flex-wrap:wrap}
  .lab__chip{grid-template-columns:44px 1fr;flex:1 1 200px}
  .lab__chip i{display:none}
  .lab__chip img{width:44px;height:44px}
}

/* =============== fleet: feature panel + filmstrip =============== */
.fleet{display:grid;grid-template-columns:1fr 118px;gap:clamp(1.2rem,2.4vw,1.8rem)}
.fleet__stage{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  border:1px solid var(--line-strong);
  aspect-ratio:16/10.5;
  background:var(--coal);
}
.fleet__stage img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .5s var(--ease);
}
.fleet__stage img.is-on{opacity:1}
.fleet__stage figcaption{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:2.4rem 1.6rem 1.3rem;
  background:linear-gradient(180deg,transparent,rgba(1,1,1,.82));
  display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;
}
.fleet__stage figcaption b{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.05rem;letter-spacing:.02em}
.fleet__stage figcaption span{font-size:.82rem;color:var(--cloud-dim)}
.fleet__corner{position:absolute;inset:12px;pointer-events:none;z-index:2}
.fleet__corner::before,.fleet__corner::after,
.fleet__corner b::before,.fleet__corner b::after{
  content:"";position:absolute;width:26px;height:26px;
  border:2px solid rgba(55,192,239,.85);
}
.fleet__corner::before{top:0;left:0;border-right:none;border-bottom:none}
.fleet__corner::after{top:0;right:0;border-left:none;border-bottom:none}
.fleet__corner b::before{bottom:0;left:0;border-right:none;border-top:none}
.fleet__corner b::after{bottom:0;right:0;border-left:none;border-top:none}
.fleet__strip{
  display:flex;flex-direction:column;gap:.8rem;
  overflow-y:auto;max-height:560px;
  scrollbar-width:none;
}
.fleet__strip::-webkit-scrollbar{display:none}
.fleet__thumb{
  position:relative;flex:none;
  border-radius:12px;overflow:hidden;
  border:2px solid transparent;
  opacity:.55;
  transition:opacity .3s,border-color .3s;
}
.fleet__thumb img{width:100%;aspect-ratio:1/1.05;object-fit:cover}
.fleet__thumb:hover{opacity:.85}
.fleet__thumb.is-on{opacity:1;border-color:var(--glow)}
@media (max-width:760px){
  .fleet{grid-template-columns:1fr}
  .fleet__stage{aspect-ratio:4/4.4}
  .fleet__strip{flex-direction:row;max-height:none;overflow-x:auto;padding-bottom:.3rem}
  .fleet__thumb{width:84px}
}

/* =============== founder teaser =============== */
.founder{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(2rem,4.5vw,4.2rem);align-items:center}
.founder__photo{position:relative;max-width:430px;justify-self:center}
.founder__photo img{
  border-radius:clamp(80px,10vw,130px) clamp(80px,10vw,130px) var(--r-lg) var(--r-lg);
  border:1px solid rgba(1,1,1,.2);
  width:100%;
}
.founder__stamp{
  position:absolute;right:-26px;bottom:34px;width:120px;
  animation:none;
  filter:drop-shadow(0 8px 18px rgba(1,1,1,.35));
}
.founder__body .h-display{margin:.65rem 0 1.2rem}
.founder__quote{
  font-family:var(--font-accent);font-style:italic;font-weight:500;
  font-size:clamp(1.4rem,2.2vw,1.75rem);line-height:1.45;
  color:var(--ink);
  border-left:3px solid var(--glow);
  padding-left:1.2rem;margin:1.4rem 0 1.6rem;
}
.founder__values{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:1.9rem}
.founder__values span{
  font-size:.8rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  border:1.5px solid var(--ink-line);border-radius:999px;
  padding:.42rem 1rem;color:#3c3f42;
}
@media (max-width:880px){
  .founder{grid-template-columns:1fr}
  .founder__photo{max-width:340px}
  .founder__stamp{right:-10px}
}

/* =============== testimonial =============== */
.testimonial{max-width:920px;margin-inline:auto;text-align:center;position:relative}
.testimonial::before{
  content:"\201C";
  position:absolute;top:-.9em;left:50%;transform:translateX(-50%);
  font-family:var(--font-accent);font-style:italic;
  font-size:clamp(7rem,14vw,11rem);line-height:1;
  color:rgba(55,192,239,.14);
  pointer-events:none;
}
.testimonial__stars{color:var(--glow);letter-spacing:.35em;font-size:1.25rem;margin-bottom:1.6rem}
.testimonial blockquote{
  font-family:var(--font-accent);font-style:italic;font-weight:500;
  font-size:clamp(1.7rem,3.3vw,2.7rem);line-height:1.42;
  color:var(--cloud);
}
.testimonial blockquote strong{color:var(--glow);font-weight:400}
.testimonial figcaption{margin-top:1.8rem;font-size:.9rem;color:var(--cloud-dim)}
.testimonial figcaption b{color:var(--cloud);display:block;font-size:1rem;letter-spacing:.04em}
.testimonial__cta{margin-top:1.6rem}

/* =============== pricing =============== */
.pricing{overflow-x:auto;border:1px solid var(--ink-line);border-radius:var(--r-lg);background:#fff}
.pricing table{width:100%;border-collapse:collapse;min-width:640px}
.pricing th,.pricing td{padding:1.05rem 1.3rem;text-align:left;border-bottom:1px solid var(--ink-line);font-size:.95rem}
.pricing thead th{
  font-family:var(--font-body);text-transform:uppercase;letter-spacing:.22em;
  font-size:.72rem;font-weight:800;background:var(--ink);color:var(--cloud);
  padding-block:1.15rem;
}
.pricing thead th:first-child{border-radius:0}
.pricing tbody tr:last-child td{border-bottom:none}
.pricing tbody tr{transition:background .2s}
.pricing tbody tr:hover{background:var(--glow-soft)}
.pricing td b{font-weight:800}
.pricing td small{display:block;color:#6a6d70;font-size:.8rem}
.pricing .num{font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.pricing__note{margin-top:1.2rem;font-size:.85rem;color:#54575a}
.pricing-swipe{display:none}
@media (max-width:700px){
  .pricing-swipe{display:block;font-size:.75rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--glow-deep);margin-bottom:.5rem}
}

/* =============== FAQ =============== */
.faq{max-width:820px;margin-inline:auto}
.faq details{
  border:1px solid var(--line);
  border-radius:var(--r-md);
  margin-bottom:.8rem;
  background:linear-gradient(160deg,var(--coal-2),var(--coal));
  overflow:hidden;
  transition:border-color .3s;
}
.faq details[open]{border-color:rgba(55,192,239,.5)}
.faq summary{
  list-style:none;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:1.15rem 1.4rem;
  font-weight:600;font-size:1.05rem;letter-spacing:.01em;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";flex:none;
  width:30px;height:30px;border-radius:50%;
  border:1.5px solid var(--line-strong);
  display:grid;place-items:center;
  font-weight:600;color:var(--glow);
  transition:transform .3s var(--ease), background .3s;
}
.faq details[open] summary::after{transform:rotate(45deg);background:var(--glow-soft)}
.faq .faq__body{padding:0 1.4rem 1.3rem;color:var(--cloud-dim);font-size:.95rem}
.faq .faq__body a{color:var(--glow);font-weight:700}
.sec--cloud .faq details{background:#fff;border-color:var(--ink-line)}
.sec--cloud .faq .faq__body{color:#4b4e51}

/* =============== CTA banner =============== */
.cta-banner{
  position:relative;
  min-height:520px;
  display:grid;place-items:center;
  text-align:center;
  overflow:hidden;
  isolation:isolate;
}
.cta-banner__bg{position:absolute;inset:0;z-index:-2}
.cta-banner__bg img{width:100%;height:100%;object-fit:cover;object-position:center 62%}
.cta-banner::before{
  content:"";position:absolute;inset:0;z-index:-1;
  background:
    radial-gradient(80% 90% at 50% 100%, rgba(1,1,1,.18), rgba(1,1,1,.66)),
    linear-gradient(180deg, var(--ink) 0%, rgba(1,1,1,.25) 30%),
    linear-gradient(0deg, var(--ink) 0%, transparent 26%); /* bottom edge lands on ink so the footer drip is seamless */
}
.cta-banner__inner{padding:90px 20px}
.cta-banner .h-display{text-shadow:0 6px 40px rgba(1,1,1,.8)}
.cta-banner .lead{margin:1.1rem auto 2.1rem;color:var(--cloud)}
.cta-banner__row{display:flex;gap:.9rem;justify-content:center;flex-wrap:wrap}
.cta-banner__sub{margin-top:1.4rem;font-size:.85rem;color:var(--cloud-dim)}
.cta-banner__sub a{color:var(--glow);font-weight:700}

/* =============== sub-page hero =============== */
.page-hero{
  position:relative;
  padding:clamp(100px,13vh,140px) 0 clamp(40px,6vh,64px);
  background:
    radial-gradient(90% 70% at 78% 0%, rgba(55,192,239,.14), transparent 55%),
    url('/assets/img/bg-facets.svg') center / cover no-repeat,
    var(--ink);
  overflow:hidden;
}
.page-hero::after{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(241,241,241,.05) 1px, transparent 1.4px);
  background-size:24px 24px;
  -webkit-mask-image:radial-gradient(75% 90% at 80% 10%, #000, transparent 70%);
          mask-image:radial-gradient(75% 90% at 80% 10%, #000, transparent 70%);
  pointer-events:none;
}
.page-hero__crumb{font-size:.78rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--glow);margin-bottom:1rem}
.page-hero__crumb a{color:var(--cloud-dim)}
.page-hero__crumb a:hover{color:var(--glow)}
.page-hero .h-display{max-width:14ch}
.page-hero .lead{margin-top:1.2rem}

/* sticky anchor pills (services page) */
.subnav{
  position:sticky;top:96px;z-index:40;
  display:flex;gap:.5rem;flex-wrap:wrap;
  background:rgba(10,11,12,.85);backdrop-filter:blur(12px);
  border:1px solid var(--line);border-radius:999px;
  padding:.45rem;
  width:max-content;max-width:100%;
  margin:0 auto;
}
.subnav a{
  font-size:.82rem;font-weight:800;letter-spacing:.03em;
  padding:.55rem 1.1rem;border-radius:999px;color:var(--cloud-dim);
  transition:all .25s;white-space:nowrap;
}
.subnav a:hover,.subnav a.is-on{background:var(--glow);color:var(--ink)}
@media (max-width:640px){
  .subnav{width:auto;overflow-x:auto;flex-wrap:nowrap;justify-content:flex-start;border-radius:16px}
}

/* =============== package cards =============== */
.pack-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:clamp(1.2rem,2.4vw,1.8rem)}
.pack{
  position:relative;
  background:linear-gradient(168deg,var(--coal-2),var(--coal) 70%);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:2.2rem 2rem 2.1rem;
  display:flex;flex-direction:column;
  box-shadow:inset 0 1px 0 rgba(241,241,241,.06), 0 30px 60px -34px rgba(1,1,1,.8);
  transition:transform .35s var(--ease), border-color .35s, box-shadow .35s;
}
.pack:hover{transform:translateY(-6px);border-color:rgba(55,192,239,.55);box-shadow:0 24px 60px -28px rgba(55,192,239,.35)}
/* corner brackets */
.pack::before,.pack::after{
  content:"";position:absolute;width:22px;height:22px;
  border:2px solid rgba(55,192,239,.0);
  transition:border-color .35s;
}
.pack::before{top:10px;left:10px;border-right:none;border-bottom:none}
.pack::after{bottom:10px;right:10px;border-left:none;border-top:none}
.pack:hover::before,.pack:hover::after{border-color:rgba(55,192,239,.8)}
.pack--hot{border-color:rgba(55,192,239,.55);background:linear-gradient(168deg,#213036,var(--coal) 75%)}
.pack__flag{
  position:absolute;top:-13px;left:26px;
  background:var(--glow);color:var(--ink);
  font-size:.68rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;
  padding:.32rem .9rem;border-radius:999px;
}
.pack__tier{font-size:.72rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--glow);margin-bottom:.5rem}
.pack h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.18rem;line-height:1.2;letter-spacing:.01em;margin-bottom:.8rem}
.pack__price{display:flex;align-items:baseline;gap:.5rem;margin-bottom:1rem}
.pack__price b{font-family:var(--font-display);font-stretch:125%;font-size:2.3rem;font-weight:800;line-height:1}
.pack__price span{font-size:.8rem;color:var(--cloud-dim);font-weight:700}
.pack__blurb{font-size:.93rem;color:var(--cloud-dim);margin-bottom:1.2rem}
.pack ul{list-style:none;margin-bottom:1.3rem}
.pack ul li{
  position:relative;padding:.42rem 0 .42rem 1.6rem;
  font-size:.92rem;border-bottom:1px dashed var(--line);
}
.pack ul li:last-child{border-bottom:none}
.pack ul li::before{
  content:"";position:absolute;left:2px;top:.95rem;
  width:8px;height:8px;transform:rotate(45deg);
  background:var(--glow);
}
.pack ul li em{font-style:normal;color:var(--cloud-dim)}
.pack__meta{
  display:flex;flex-wrap:wrap;gap:.45rem;margin-bottom:1.4rem;
}
.pack__meta span{
  font-size:.76rem;font-weight:700;color:var(--cloud-dim);
  border:1px solid var(--line);border-radius:999px;padding:.3rem .8rem;
}
.pack .btn{width:100%;margin-top:auto}
.pack--wide{grid-column:1/-1}
.pack--wide ul{columns:2;column-gap:2.6rem}
.pack--wide ul li{break-inside:avoid}
@media (max-width:720px){.pack--wide ul{columns:1}}

/* sizes footnote table inside pack */
.pack__sizes{display:flex;gap:.5rem;margin-bottom:1.3rem;flex-wrap:wrap}
.pack__sizes span{
  flex:1;min-width:96px;text-align:center;
  border:1px solid var(--line);border-radius:10px;padding:.5rem .4rem;
  font-size:.74rem;color:var(--cloud-dim);font-weight:700;
}
.pack__sizes b{display:block;font-size:.92rem;color:var(--cloud);font-family:var(--font-display);font-stretch:125%;font-weight:700;letter-spacing:.04em}

/* =============== add-ons =============== */
.addons{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1rem}
@media (max-width:940px){.addons{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.addons{grid-template-columns:1fr}}
.addon{
  display:flex;flex-direction:column;
  border:1px solid var(--ink-line);
  border-radius:var(--r-md);
  background:#fff;overflow:hidden;
  transition:transform .3s var(--ease), box-shadow .3s;
}
.addon:hover{transform:translateY(-5px);box-shadow:0 24px 54px -22px rgba(1,1,1,.32)}
.addon__img{position:relative;aspect-ratio:16/10;overflow:hidden;background:#e7e8ea}
.addon__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.addon:hover .addon__img img{transform:scale(1.05)}
.addon__body{position:relative;padding:1.5rem 1.4rem 1.5rem}
.addon__ico{
  position:absolute;top:-24px;left:18px;z-index:2;
  width:48px;height:48px;border-radius:13px;
  background:linear-gradient(160deg,#5ecdf6,var(--glow) 55%,#1e9ecb);
  color:#04222e;
  display:grid;place-items:center;
  border:2px solid #fff;
  box-shadow:0 10px 22px -6px rgba(55,192,239,.6);
}
.addon h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1rem;letter-spacing:.02em;margin:.6rem 0 .5rem}
.addon p{font-size:.9rem;color:#4b4e51}

/* =============== contact =============== */
.contact-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(2rem,4vw,3.6rem);align-items:start}
.form-card{
  background:linear-gradient(168deg,var(--coal-2),var(--coal) 70%);
  border:1px solid var(--line);
  border-radius:var(--r-lg);
  padding:clamp(1.6rem,3vw,2.4rem);
  position:relative;
}
.form-card::before{content:"";position:absolute;top:10px;left:10px;width:22px;height:22px;border:2px solid rgba(55,192,239,.6);border-right:none;border-bottom:none}
.form-card::after{content:"";position:absolute;bottom:10px;right:10px;width:22px;height:22px;border:2px solid rgba(55,192,239,.6);border-left:none;border-top:none}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.field{margin-bottom:1.1rem}
.field label{display:block;font-size:.8rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--cloud-dim);margin-bottom:.45rem}
.field label b{color:var(--glow)}
.field input,.field select,.field textarea{
  width:100%;
  background:rgba(1,1,1,.45);
  border:1px solid var(--line);
  border-radius:12px;
  color:var(--cloud);
  font:inherit;font-size:.95rem;
  padding:.85rem 1rem;
  transition:border-color .25s, box-shadow .25s;
}
.field select{appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--glow) 50%),linear-gradient(135deg,var(--glow) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--glow);box-shadow:0 0 0 3px rgba(55,192,239,.18)}
.field--hp{position:absolute !important;left:-9999px;opacity:0;height:0;overflow:hidden}
.form-note{font-size:.78rem;color:var(--cloud-dim);margin-top:.9rem}
.form-alert{
  border-radius:var(--r-md);
  padding:1rem 1.3rem;margin-bottom:1.4rem;
  font-weight:700;font-size:.93rem;
}
.form-alert--ok{background:rgba(74,222,128,.12);border:1px solid rgba(74,222,128,.5);color:#86efac}
.form-alert--err{background:rgba(248,113,113,.1);border:1px solid rgba(248,113,113,.5);color:#fca5a5}
.form-alert ul{margin:.4rem 0 0 1.2rem;font-weight:500}
@media (max-width:880px){
  .contact-grid{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
}
.info-stack{display:flex;flex-direction:column;gap:1rem}
.info-card{
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:1.6rem 1.7rem;
  background:linear-gradient(160deg,var(--coal-2),var(--coal));
  box-shadow:inset 0 1px 0 rgba(241,241,241,.06), 0 26px 50px -30px rgba(1,1,1,.7);
}
.info-card h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:.94rem;margin-bottom:.6rem;letter-spacing:.03em}
.info-card p{font-size:.92rem;color:var(--cloud-dim)}
.info-card .big-phone{
  display:block;font-family:var(--font-display);font-stretch:125%;font-size:1.7rem;font-weight:800;color:var(--cloud);
  margin:.3rem 0 .4rem;letter-spacing:.01em;white-space:nowrap;
}
.info-card .big-phone:hover{color:var(--glow)}
.info-card--glow{border-color:rgba(55,192,239,.45);background:linear-gradient(160deg,#1d2c33,var(--coal))}

/* =============== terms page =============== */
.legal{max-width:780px}
.legal h2{
  font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.12rem;letter-spacing:.02em;
  margin:2.4rem 0 .8rem;display:flex;gap:.8rem;align-items:baseline;
}
.legal h2 span{color:var(--glow);font-size:1.1rem}
.legal p,.legal li{color:var(--cloud-dim);font-size:.97rem}
.legal ul{margin:.6rem 0 .6rem 1.3rem}
.legal .legal__intro{
  font-size:1.08rem;color:var(--cloud);
  border-left:3px solid var(--glow);padding-left:1.2rem;margin-top:1.4rem;
}

/* =============== gift strip =============== */
.gift{
  display:flex;align-items:center;justify-content:space-between;gap:1.6rem;flex-wrap:wrap;
  border:1px dashed rgba(55,192,239,.55);
  border-radius:var(--r-lg);
  padding:1.7rem 2rem;
  background:var(--glow-soft);
}
.gift h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.12rem;letter-spacing:.02em}
.gift p{font-size:.92rem;color:var(--cloud-dim);max-width:52ch}
.sec--cloud .gift p{color:#4b4e51}

/* ceramic maintenance band */
.maint{
  display:grid;grid-template-columns:1.35fr .9fr;gap:clamp(1.3rem,3vw,2.6rem);align-items:center;
  border:1px solid var(--line-strong);border-radius:var(--r-lg);
  padding:clamp(1.5rem,3vw,2.4rem);
  background:linear-gradient(155deg,rgba(55,192,239,.07),rgba(255,255,255,.015));
}
.maint__copy .kicker{margin-bottom:.2rem}
.maint__copy p{font-size:.95rem}
.maint__buy{border-left:1px solid var(--line-strong);padding-left:clamp(1.3rem,3vw,2.4rem)}
.maint__buy .btn{width:100%;justify-content:center}
@media(max-width:760px){
  .maint{grid-template-columns:1fr}
  .maint__buy{border-left:0;border-top:1px solid var(--line-strong);padding-left:0;padding-top:1.5rem}
}

/* maintenance memberships */
.mplans{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1rem,2.5vw,1.6rem)}
.mplan{display:flex;flex-direction:column;border:1px solid var(--line-strong);border-radius:var(--r-lg);padding:clamp(1.4rem,3vw,2rem);background:linear-gradient(160deg,rgba(255,255,255,.02),transparent)}
.mplan--alt{background:linear-gradient(160deg,rgba(55,192,239,.07),transparent);border-color:rgba(55,192,239,.32)}
.mplan h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:clamp(1.35rem,2.4vw,1.7rem);letter-spacing:.01em;color:var(--cloud);margin:0 0 .2rem}
.mplan__tag{font-size:.86rem;color:var(--cloud-dim);margin-bottom:.6rem}
.mplan__row{padding:1rem 0;border-top:1px solid var(--line-strong)}
.mplan__row h4{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--glow);margin:0 0 .6rem}
.mplan .btn{margin-top:1.3rem;width:100%;justify-content:center}
@media(max-width:720px){.mplans{grid-template-columns:1fr}}

/* =============== google reviews =============== */
.gstars{color:#fbbf24;letter-spacing:1px;white-space:nowrap;font-size:1rem}
.gstars__off{color:rgba(255,255,255,.22)}
.greviews__glabel svg{width:16px;height:16px;vertical-align:-3px;margin-right:2px}
.greviews__summary{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;max-width:600px;margin:0 auto clamp(2rem,4vw,3rem);padding:1.05rem 1.5rem;border:1px solid var(--line-strong);border-radius:var(--r-lg);background:rgba(255,255,255,.03)}
.greviews__glogo svg{width:34px;height:34px;display:block}
.greviews__rate{display:flex;flex-direction:column;line-height:1.15;gap:1px}
.greviews__rate b{font-size:1.7rem;font-weight:800;color:var(--cloud);letter-spacing:-.01em}
.greviews__rate .gstars{font-size:1.05rem}
.greviews__rate small{color:var(--cloud-dim);font-size:.8rem;margin-top:2px}
.greviews__summary .btn{margin-left:auto}
.greviews__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,380px));justify-content:center;gap:clamp(1rem,2vw,1.4rem)}
.greview{display:flex;flex-direction:column;gap:.75rem;padding:clamp(1.2rem,2.5vw,1.55rem);border:1px solid var(--line-strong);border-radius:var(--r-lg);background:linear-gradient(160deg,rgba(255,255,255,.035),transparent)}
.greview__head{display:flex;align-items:center;gap:.7rem}
.greview__avatar{flex:0 0 auto;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:1.05rem;font-family:var(--font-display)}
.greview__who{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.greview__who b{color:var(--cloud);font-size:.98rem;font-weight:700}
.greview__who small{color:var(--cloud-dim);font-size:.78rem}
.greview__g{margin-left:auto;flex:0 0 auto}
.greview__g svg{width:20px;height:20px;display:block;opacity:.95}
.greview__text{color:var(--cloud-dim);font-size:.95rem;line-height:1.6;margin:0;font-style:normal}
.greview__text--clamp{display:-webkit-box;-webkit-line-clamp:8;-webkit-box-orient:vertical;overflow:hidden}
.greview.is-open .greview__text--clamp{display:block;-webkit-line-clamp:unset;overflow:visible}
.greview__more{align-self:flex-start;background:none;border:0;padding:0;cursor:pointer;color:var(--cloud);font:inherit;font-size:.85rem;font-weight:700;text-decoration:underline;text-underline-offset:3px;opacity:.85}
.greview__more:hover{opacity:1}
/* carousel */
.gcar{position:relative}
.gcar__track{display:flex;align-items:flex-start;gap:clamp(1rem,2vw,1.4rem);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:.25rem .25rem 1.1rem;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.gcar__track::-webkit-scrollbar{display:none}
.gcar__track:focus-visible{outline:2px solid var(--line-strong);outline-offset:4px;border-radius:var(--r-lg)}
.gcar__track .greview{flex:0 0 min(380px,86%);scroll-snap-align:start}
.gcar__btn{position:absolute;top:150px;z-index:2;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;border:1px solid var(--line-strong);background:rgba(10,12,14,.82);color:var(--cloud);cursor:pointer;transition:background .2s,opacity .2s;backdrop-filter:blur(4px)}
.gcar__btn svg{width:20px;height:20px}
.gcar__btn:hover{background:rgba(255,255,255,.08)}
.gcar__btn[disabled]{opacity:.3;pointer-events:none}
.gcar__btn--prev{left:-10px}
.gcar__btn--next{right:-10px}
@media(max-width:640px){
  .gcar__btn{width:38px;height:38px;top:130px}
  .gcar__btn--prev{left:-6px}
  .gcar__btn--next{right:-6px}
}
@media(max-width:540px){
  .greviews__summary{flex-direction:column;text-align:center}
  .greviews__summary .btn{margin-left:0}
  .greviews__rate{align-items:center}
}

/* =============== learn / articles =============== */
.learnband{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:clamp(1rem,2vw,1.4rem)}
.learnband__card{display:flex;flex-direction:column;gap:.7rem;padding:clamp(1.2rem,2.5vw,1.55rem);border:1px solid var(--line-strong);border-radius:var(--r-lg);background:linear-gradient(160deg,rgba(255,255,255,.035),transparent);text-decoration:none;transition:border-color .25s,transform .25s}
.learnband__card:hover{border-color:rgba(55,192,239,.5);transform:translateY(-3px)}
.learnband__card .art__chip{align-self:flex-start}
.learnband__card b{color:var(--cloud);font-size:1.05rem;line-height:1.4}
.learnband__card p{margin:0;color:var(--cloud-dim);font-size:.9rem;line-height:1.6}
.learnband__card i{margin-top:auto;color:var(--glow);font-style:normal;font-size:.85rem;font-weight:700}
.art__wrap{max-width:840px}
.art__meta{color:var(--cloud-dim);font-size:.9rem;margin-top:1rem;display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.art__chip{display:inline-block;background:rgba(55,192,239,.12);border:1px solid rgba(55,192,239,.35);color:var(--glow);font-size:.75rem;font-weight:700;padding:3px 11px;border-radius:999px}
.art{color:var(--cloud-dim);line-height:1.75;font-size:1.02rem}
.art h2{color:var(--cloud);font-family:var(--font-display);font-size:clamp(1.3rem,2.6vw,1.65rem);letter-spacing:.01em;margin:2.4rem 0 .9rem}
.art h3{color:var(--cloud);font-size:1.08rem;font-weight:700;margin:1.7rem 0 .6rem}
.art p{margin:0 0 1.1rem}
.art ul,.art ol{margin:0 0 1.2rem;padding-left:1.3rem}
.art li{margin-bottom:.45rem}
.art a{color:var(--glow);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.art strong{color:var(--cloud)}
.art .art__answer{margin:0 0 1.6rem;padding:1.1rem 1.3rem;border-left:3px solid var(--glow);border-radius:0 var(--r-lg) var(--r-lg) 0;background:rgba(55,192,239,.07);color:var(--cloud)}
.art .art__answer p{margin:0}
.art__cta{display:flex;align-items:center;justify-content:space-between;gap:1.4rem;flex-wrap:wrap;margin:2.6rem 0;padding:1.4rem 1.6rem;border:1px solid var(--line-strong);border-radius:var(--r-lg);background:linear-gradient(160deg,rgba(55,192,239,.08),transparent)}
.art__cta b{color:var(--cloud);font-size:1.05rem}
.art__cta p{margin:.3rem 0 0;color:var(--cloud-dim);font-size:.92rem}
.art__cta-btns{display:flex;gap:.7rem;flex-wrap:wrap}
.art__related{margin-top:2.4rem;padding-top:1.6rem;border-top:1px solid var(--line-strong)}
.art__related h2{color:var(--cloud);font-family:var(--font-display);font-size:1.25rem;margin:0 0 .9rem}
.art__related ul{list-style:none;margin:0 0 1.1rem;padding:0}
.art__related li{margin-bottom:.55rem}
.art__related a{color:var(--cloud-dim);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.art__related a:hover{color:var(--glow)}
.learn__catnav{display:flex;flex-wrap:wrap;gap:.55rem;margin-bottom:clamp(2rem,4vw,3rem)}
.learn__catnav a{display:inline-block;border:1px solid var(--line-strong);border-radius:999px;padding:.45rem 1rem;color:var(--cloud-dim);font-size:.85rem;font-weight:600;text-decoration:none}
.learn__catnav a:hover{color:var(--glow);border-color:rgba(55,192,239,.5)}
.learn__catnav small{color:var(--glow);margin-left:4px}
.learn__cat{margin-bottom:clamp(2.2rem,4vw,3.2rem)}
.learn__cat h2{margin-bottom:1rem}
.learn__list{list-style:none;margin:0;padding:0;columns:2;column-gap:2.4rem}
.learn__list li{break-inside:avoid;margin-bottom:.6rem}
.learn__list a{color:var(--cloud-dim);font-size:.95rem;font-weight:600;text-decoration:underline;text-underline-offset:3px}
.learn__list a:hover{color:var(--glow)}
@media(max-width:700px){.learn__list{columns:1}}

/* =============== footer =============== */
.site-foot{position:relative;background:var(--coal);overflow:hidden}
.site-foot::before{ /* bead texture */
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(rgba(241,241,241,.045) 1.2px, transparent 1.5px);
  background-size:24px 24px;
  pointer-events:none;
}
.site-foot .dvd--drip{position:relative}
.site-foot .dvd--drip path{fill:var(--ink)}
.site-foot__marquee{padding:2.2rem 0 .5rem;position:relative}
.site-foot__grid{
  position:relative;
  display:grid;
  grid-template-columns:1.25fr .7fr .7fr 1.05fr;
  gap:clamp(1.8rem,3.5vw,3rem);
  padding-block:3rem 3.4rem;
}
.site-foot__brand img{width:250px;height:auto;margin-bottom:1.2rem;filter:drop-shadow(0 10px 26px rgba(1,1,1,.55))}
.site-foot__brand p{font-size:.92rem;color:var(--cloud-dim);max-width:34ch}
.site-foot__verse{font-family:var(--font-accent);font-style:italic;color:var(--cloud);margin-top:.9rem;font-size:.98rem}
.site-foot__social{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.3rem}
.site-foot__col h3,.site-foot__card h3{
  font-family:var(--font-body);text-transform:uppercase;letter-spacing:.28em;
  font-size:.74rem;font-weight:800;color:var(--glow);margin-bottom:1.1rem;
}
.site-foot__col{display:flex;flex-direction:column;gap:.55rem}
.site-foot__col a{font-size:.92rem;color:var(--cloud-dim);width:max-content;position:relative;transition:color .2s}
.site-foot__col a::after{content:"";position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--glow);transition:width .25s var(--ease)}
.site-foot__col a:hover{color:var(--cloud)}
.site-foot__col a:hover::after{width:100%}
.site-foot__card{
  border:1px solid var(--line);border-radius:var(--r-lg);
  background:rgba(1,1,1,.35);
  padding:1.6rem 1.7rem;
}
.site-foot__phone{
  display:block;font-family:var(--font-display);font-stretch:125%;font-weight:800;font-size:1.62rem;white-space:nowrap;letter-spacing:.01em;
  color:var(--cloud);margin-bottom:.6rem;letter-spacing:.02em;
}
.site-foot__phone:hover{color:var(--glow)}
.site-foot__card p{font-size:.87rem;color:var(--cloud-dim);margin-bottom:.9rem}
.site-foot__chips{display:flex;flex-wrap:wrap;gap:.4rem}
.site-foot__chips span{
  font-size:.74rem;font-weight:700;
  border:1px solid var(--line);border-radius:999px;
  padding:.28rem .75rem;color:var(--cloud-dim);
}
.site-foot__pay em{color:var(--glow);font-style:normal;font-size:.8rem}
.site-foot__card .btn{width:100%;margin-top:.4rem}
.site-foot__legal{
  position:relative;
  border-top:1px solid var(--line);
  display:flex;flex-wrap:wrap;gap:.6rem 2rem;justify-content:space-between;
  padding:1.3rem clamp(18px,4vw,36px);
  font-size:.8rem;color:var(--cloud-dim);
  max-width:var(--wrap);margin-inline:auto;
}
.site-foot__legal a{color:var(--cloud)}
.site-foot__legal a:hover{color:var(--glow)}
@media (max-width:1020px){
  .site-foot__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .site-foot__grid{grid-template-columns:1fr}
}

/* =============== reveal animations =============== */
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease), transform .7s var(--ease)}
.rv.is-in{opacity:1;transform:none}
.rv-d1{transition-delay:.08s}
.rv-d2{transition-delay:.16s}
.rv-d3{transition-delay:.24s}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001s !important;transition-duration:.001s !important;scroll-behavior:auto}
  .rv{opacity:1;transform:none}
  .marquee__track{animation:none}
  .hero__seal,.founder__stamp{animation:none}
}


/* =============================================================
   LUXURY LAYER — reveals, chrome, parallax, concierge, details
   ============================================================= */

/* cross-document page transitions (progressive, Chromium) */
@view-transition { navigation: auto; }

/* ---- line-mask headline reveals (spans injected by main.js) ---- */
.rl{display:block;overflow:hidden;padding-bottom:.08em;margin-bottom:-.08em}
.rl__inner{display:inline-block;transform:translateY(118%);transition:transform .95s var(--ease)}
.rl:nth-child(2) .rl__inner{transition-delay:.1s}
.rl:nth-child(3) .rl__inner{transition-delay:.2s}
.is-in .rl__inner,.h-split.is-in .rl__inner{transform:none}
@media (prefers-reduced-motion:reduce){.rl__inner{transform:none;transition:none}}

/* ---- brushed-chrome type moments ---- */
.chrome{
  background:linear-gradient(100deg,
    #fdfdfe 0%, #c9cdd1 24%, #83898f 40%, #eef0f1 50%,
    #9aa1a7 62%, #dfe2e4 78%, #f6f7f8 100%);
  background-size:220% 100%;
  -webkit-background-clip:text;background-clip:text;
  color:transparent;
  animation:chromeSheen 9s var(--ease) infinite;
}
@keyframes chromeSheen{
  0%,55%{background-position:110% 0}
  85%,100%{background-position:-15% 0}
}
@media (prefers-reduced-motion:reduce){.chrome{animation:none}}

/* scroll parallax removed for performance */

/* ---- ghost section numerals ---- */
.sec__head{position:relative}
.ghost-num{
  position:absolute;right:0;top:-.55em;z-index:-1;
  font-family:var(--font-display);font-stretch:125%;font-weight:800;font-style:normal;
  font-size:clamp(5.5rem,11vw,10rem);line-height:1;
  color:transparent;
  -webkit-text-stroke:1px rgba(241,241,241,.085);
  pointer-events:none;user-select:none;
}
.center .ghost-num{right:auto;left:50%;transform:translateX(-50%)}
.sec--cloud .ghost-num{-webkit-text-stroke-color:rgba(1,1,1,.075)}
.sec--blue .ghost-num{-webkit-text-stroke-color:rgba(1,10,14,.16)}

/* ---- fleet cinemagraph slide ---- */
.fleet__stage video{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:0;transition:opacity .5s var(--ease);
}
.fleet__stage video.is-on{opacity:1}
.fleet__thumb .play-dot{
  position:absolute;right:6px;top:6px;
  width:22px;height:22px;border-radius:50%;
  background:rgba(1,1,1,.75);
  display:grid;place-items:center;
  color:var(--glow);font-size:.55rem;
}

/* ---- cinemagraph figure (ceramic page) ---- */
.cinefig{position:relative}
.cinefig video{
  width:100%;display:block;
  border-radius:var(--r-lg);border:1px solid var(--line-strong);
}

/* ---- founder sign-off ---- */
.signoff{
  font-family:var(--font-accent);font-style:italic;font-weight:600;
  font-size:2.1rem;line-height:1;
  margin:1.1rem 0 1.6rem;
  color:var(--glow-deep);
}
.sec .signoff--light{color:var(--glow)}

/* ---- concierge bar (mobile) ---- */
.concierge{display:none}
@media (max-width:760px){
  .concierge{
    position:fixed;left:12px;right:12px;z-index:80;
    bottom:calc(10px + env(safe-area-inset-bottom));
    display:grid;grid-template-columns:1fr 1.35fr;gap:8px;
    padding:8px;border-radius:16px;
    background:rgba(6,7,8,.86);
    backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
    border:1px solid var(--line);
    box-shadow:0 18px 44px -16px rgba(1,1,1,.9);
  }
  .concierge .btn{padding:.9rem .5rem;font-size:.74rem;width:100%}
  body{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .site-foot{padding-bottom:1rem}
}

/* ---- typographic fine detail ---- */
.pricing td,.pricing th{font-variant-numeric:tabular-nums}
.testimonial blockquote{hanging-punctuation:first}

/* ---- case study editorial ---- */
.cs-chapters{display:grid;gap:clamp(3rem,6vw,5rem)}
.cs-chapter{display:grid;grid-template-columns:1.02fr .98fr;gap:clamp(1.8rem,4vw,3.6rem);align-items:center}
.cs-chapter:nth-child(even) .cs-chapter__media{order:2}
.cs-chapter__media{position:relative;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line-strong)}
.cs-chapter__media img{width:100%}
.cs-chapter__no{
  font-family:var(--font-accent);font-style:italic;font-weight:500;
  font-size:2.2rem;color:var(--glow);display:block;margin-bottom:.4rem;
}
.cs-chapter h2{font-family:var(--font-display);font-stretch:125%;font-weight:800;text-transform:uppercase;font-size:clamp(1.15rem,2vw,1.6rem);margin-bottom:.9rem}
.cs-chapter p{color:var(--cloud-dim)}
@media (max-width:820px){
  .cs-chapter{grid-template-columns:1fr}
  .cs-chapter:nth-child(even) .cs-chapter__media{order:0}
}

/* cinemagraphs inside step arches & case-study frames */
.process__media video{width:100%;height:100%;object-fit:cover;display:block}
.cs-chapter__media video{width:100%;display:block}

/* drip pinned to the top inside a section — the section's own gradient
   shows through between the drips, so layered backgrounds stay seamless */
.dvd--intop{position:absolute;top:-1px;left:0;right:0;margin:0;z-index:1}

/* =============================================================
   SERVICE PAGES — hero split, includes card, related cards, nav menu
   ============================================================= */

/* service hero: copy + framed media */
.svc-hero{padding-bottom:clamp(48px,7vw,84px)}
.svc-hero__grid{
  display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem,4.5vw,4rem);align-items:center;
}
.svc-hero__copy .kicker{margin:.4rem 0 1rem}
.svc-hero__copy .h-display{margin-bottom:1.1rem}
.svc-hero__copy .hero__cta{justify-content:flex-start;margin:1.8rem 0 1rem}
.svc-hero__from{font-size:.9rem;color:var(--cloud-dim)}
.svc-hero__from strong{color:var(--glow)}
.svc-hero__media{
  position:relative;border-radius:clamp(90px,12vw,150px) clamp(90px,12vw,150px) var(--r-lg) var(--r-lg);
  overflow:hidden;border:1px solid var(--line-strong);
  aspect-ratio:4/4.4;max-height:640px;
  box-shadow:0 40px 90px -40px rgba(55,192,239,.3);
}
.svc-hero__media img,.svc-hero__media video{width:100%;height:100%;object-fit:cover}
.svc-hero__media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,1,1,0) 55%,rgba(1,1,1,.5))}
.svc-hero__corner{position:absolute;inset:14px;pointer-events:none;z-index:2}
.svc-hero__corner::before,.svc-hero__corner::after,
.svc-hero__corner b::before,.svc-hero__corner b::after{content:"";position:absolute;width:26px;height:26px;border:2px solid rgba(55,192,239,.85)}
.svc-hero__corner::before{top:0;left:0;border-right:none;border-bottom:none}
.svc-hero__corner::after{top:0;right:0;border-left:none;border-bottom:none}
.svc-hero__corner b::before{bottom:0;left:0;border-right:none;border-top:none}
.svc-hero__corner b::after{bottom:0;right:0;border-left:none;border-top:none}
@media (max-width:860px){
  .svc-hero__grid{grid-template-columns:1fr}
  .svc-hero__media{aspect-ratio:4/3.4;max-height:460px}
}

/* "what's included" card */
.incl-card{
  background:linear-gradient(168deg,var(--coal-2),var(--coal) 70%);
  border:1px solid var(--line);border-radius:var(--r-lg);
  padding:clamp(1.6rem,3vw,2.3rem);
  box-shadow:inset 0 1px 0 rgba(241,241,241,.06), 0 30px 60px -34px rgba(1,1,1,.8);
}
.incl-card > h3{
  font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;
  font-size:1.05rem;letter-spacing:.03em;margin-bottom:1.3rem;color:var(--glow);
}
.incl-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,2.5vw,2rem)}
.incl-col h4{
  font-size:.72rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--cloud-dim);margin-bottom:.8rem;
}
.incl-col ul{list-style:none}
.incl-col li{
  position:relative;padding:.4rem 0 .4rem 1.7rem;font-size:.92rem;
  border-bottom:1px dashed var(--line);
}
.incl-col li:last-child{border-bottom:none}
.incl-col li::before{
  content:"";position:absolute;left:0;top:.72rem;width:11px;height:7px;
  border-left:2px solid var(--glow);border-bottom:2px solid var(--glow);
  transform:rotate(-45deg);
}
.incl-col li em{font-style:normal;color:var(--cloud-dim)}
@media (max-width:520px){.incl-grid{grid-template-columns:1fr}}

/* related service cards */
.related{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2.2vw,1.6rem)}
.related__card{
  display:block;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;
  background:var(--coal);
  transition:transform .35s var(--ease),border-color .35s,box-shadow .35s;
}
.related__card:hover{transform:translateY(-6px);border-color:rgba(55,192,239,.5);box-shadow:0 26px 60px -30px rgba(55,192,239,.35)}
.related__media{aspect-ratio:16/10;overflow:hidden}
.related__media img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.related__card:hover .related__media img{transform:scale(1.06)}
.related__body{padding:1.3rem 1.4rem 1.5rem}
.related__body h3{font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:1.12rem;letter-spacing:.02em;margin-bottom:.4rem}
.related__body p{font-size:.9rem;color:var(--cloud-dim);margin-bottom:.7rem}
.related__go{font-size:.78rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--glow)}
@media (max-width:820px){.related{grid-template-columns:1fr}}

/* header services dropdown */
.has-drop{position:relative}
.has-drop__panel{
  position:absolute;top:calc(100% + 14px);left:0;transform:translateY(8px);
  min-width:260px;
  background:rgba(8,9,10,.97);
  backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);
  border:1px solid var(--line);border-radius:14px;
  padding:.5rem;
  box-shadow:0 30px 70px -24px rgba(1,1,1,.9);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .25s var(--ease),transform .25s var(--ease),visibility .25s;
  z-index:20;
}
.has-drop:hover .has-drop__panel,
.has-drop:focus-within .has-drop__panel{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
.has-drop__panel::before{content:"";position:absolute;top:-14px;left:0;right:0;height:14px} /* hover bridge */
.has-drop__panel a{
  display:block;padding:.62rem .85rem;border-radius:9px;
  font-size:.82rem !important;letter-spacing:.06em !important;
  color:var(--cloud-dim) !important;opacity:1 !important;
  white-space:nowrap;
}
.has-drop__panel a::after{display:none}
.has-drop__panel a:hover{background:var(--glow-soft);color:var(--cloud) !important}
.has-drop__panel a b{display:block;font-weight:700;letter-spacing:.06em;color:inherit}
.has-drop__panel a span{display:block;font-size:.68rem;letter-spacing:.02em;text-transform:none;color:#8f9295;margin-top:2px}
.has-drop > a::after{content:"" !important}
.has-drop__caret{display:inline-block;width:7px;height:7px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);margin-left:.45rem;opacity:.7}

/* mobile nav: nested service sub-links */
.mobile-nav__sub{display:flex;flex-direction:column;gap:.1rem;margin:.2rem 0 .4rem 1.6rem;border-left:1px solid var(--line);padding-left:1rem}
.mobile-nav__sub a{
  font-family:var(--font-body) !important;font-size:1rem !important;font-weight:600 !important;
  text-transform:none !important;letter-spacing:0 !important;
  border:none !important;padding:.32rem 0 !important;color:var(--cloud-dim) !important;
}
.mobile-nav__sub a:hover{color:var(--glow) !important;padding-left:.3rem !important}

/* =============================================================
   ADD-ON PAGES — icon badge, best-for band, note, icon cards
   ============================================================= */
.addon-badge{
  display:inline-grid;place-items:center;
  width:56px;height:56px;border-radius:15px;
  background:var(--glow-soft);
  border:1px solid rgba(55,192,239,.4);
  color:var(--glow);
  margin-bottom:1.1rem;
  box-shadow:inset 0 1px 0 rgba(241,241,241,.08);
}

/* best-for chip band */
.bestfor{
  display:flex;align-items:center;flex-wrap:wrap;gap:.6rem;
  padding:1.2rem 0 .2rem;
}
.bestfor__label{
  font-size:.7rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;
  color:var(--glow);margin-right:.5rem;
}
.bestfor__chip{
  font-size:.85rem;font-weight:600;color:var(--cloud);
  border:1px solid var(--line-strong);border-radius:999px;
  padding:.5rem 1.1rem;background:rgba(241,241,241,.03);
}

/* safety / recommendation note */
.addon-note{
  margin-top:2rem;
  border-left:3px solid var(--glow);
  padding:.9rem 0 .9rem 1.3rem;
  font-size:.95rem;color:var(--cloud-dim);
}
.addon-note a{color:var(--glow);font-weight:600}

/* icon-based related add-on cards */
.addon-related{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.4rem)}
.addon-rcard{
  display:flex;align-items:center;gap:1rem;
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:1.2rem 1.3rem;background:var(--coal);
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;
}
.addon-rcard:hover{transform:translateY(-4px);border-color:rgba(55,192,239,.5);box-shadow:0 20px 46px -24px rgba(55,192,239,.35)}
.addon-rcard__ico{
  flex:none;display:grid;place-items:center;width:46px;height:46px;border-radius:12px;
  background:var(--glow-soft);color:var(--glow);
}
.addon-rcard__body{min-width:0;flex:1}
.addon-rcard__body b{display:block;font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:.92rem;letter-spacing:.02em;line-height:1.15}
.addon-rcard__body small{display:block;font-size:.82rem;color:var(--cloud-dim);margin-top:.2rem}
.addon-rcard__go{flex:none;color:var(--cloud-dim);font-size:1.2rem;transition:transform .3s,color .3s}
.addon-rcard:hover .addon-rcard__go{color:var(--glow);transform:translateX(4px)}
@media (max-width:820px){.addon-related{grid-template-columns:1fr}}

/* make add-on service cards on the overview page clickable */
.addon--link{cursor:pointer;text-decoration:none;color:inherit}
.addon--link .addon__more{
  display:inline-block;margin-top:.9rem;font-size:.76rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--glow-deep);
}
.addon--link:hover .addon__more{color:var(--glow)}

/* before/after composite images shown fully (no crop) in the hero frame */
.svc-hero__media--contain{aspect-ratio:4/3.6;background:#0a0b0c}
.svc-hero__media--contain img{object-fit:contain}

/* package-card photo header */
.pack__img{
  margin:-2.2rem -2rem 1.5rem;
  aspect-ratio:16/9;overflow:hidden;
  border-radius:var(--r-lg) var(--r-lg) 0 0;
  position:relative;
}
.pack__img::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(1,1,1,0) 55%,rgba(1,1,1,.45))}
.pack__img img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease)}
.pack:hover .pack__img img{transform:scale(1.04)}
.pack:has(.pack__img)::before{display:none} /* drop top bracket over the photo */
.pack--wide .pack__img{aspect-ratio:24/7}

/* =============================================================
   FX LAYER — water bubbles, hover sheen, ground reflections
   ============================================================= */

/* ---- rising water bubbles behind the blue section ---- */
.sec--blue{overflow:hidden}
.sec--blue > .wrap{position:relative;z-index:1}
.bubbles{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.bubbles.is-paused .bubble{animation-play-state:paused}
.bubble{
  position:absolute;bottom:-8%;border-radius:50%;
  background:radial-gradient(circle at 32% 28%, rgba(255,255,255,.95), rgba(255,255,255,.22) 46%, rgba(255,255,255,.04) 70%);
  box-shadow:inset 0 0 8px rgba(255,255,255,.55), 0 0 7px rgba(255,255,255,.22);
  animation:bubbleRise var(--dur,15s) linear infinite;
  animation-delay:var(--delay,0s);
  will-change:transform,opacity;
}
@keyframes bubbleRise{
  0%  {transform:translate3d(0,0,0) scale(.85);opacity:0}
  10% {opacity:.75}
  85% {opacity:.5}
  100%{transform:translate3d(var(--drift,0),-118vh,0) scale(1.06);opacity:0}
}

/* image tiles keep positioning context (sheen sweep removed for performance) */
.pack__img,.addon__img,.related__media,.svc-hero__media,.fleet__stage,.cinefig{position:relative}

/* ---- periodic sheen glint on primary buttons ---- */
.btn{overflow:hidden}
.btn--glow::before{
  content:"";position:absolute;top:0;bottom:0;left:-60%;width:38%;
  background:linear-gradient(105deg, transparent, rgba(255,255,255,.55), transparent);
  transform:skewX(-18deg);
  animation:btnGlint 6s var(--ease) infinite;
  pointer-events:none;
}
@keyframes btnGlint{0%{left:-60%}14%{left:135%}100%{left:135%}}
.btn--glow:hover::before{animation-duration:1.1s}

/* ---- ground reflections under images ---- */
.sec--blue .process__media{
  -webkit-box-reflect: below 3px linear-gradient(rgba(0,0,0,.30), rgba(0,0,0,0) 46%);
}
/* fleet gallery reflection removed for scroll performance */
.svc-hero__media:not(.svc-hero__media--contain){
  -webkit-box-reflect: below 4px linear-gradient(rgba(0,0,0,.22), rgba(0,0,0,0) 40%);
}

@media (prefers-reduced-motion:reduce){
  .bubble{animation:none;opacity:.4}
  .btn--glow::before{animation:none;display:none}
}

/* =============================================================
   SERVICE AREAS — hub grid
   ============================================================= */
.area-region{margin-bottom:clamp(2.4rem,5vw,3.6rem)}
.area-region__title{
  font-family:var(--font-body);font-size:.74rem;font-weight:800;letter-spacing:.28em;text-transform:uppercase;
  color:var(--glow);margin-bottom:1.2rem;display:flex;align-items:center;gap:1rem;
}
.area-region__title::after{content:"";flex:1;height:1px;background:var(--line)}
.area-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(.8rem,1.8vw,1.2rem)}
.area-card{
  display:flex;align-items:center;gap:.9rem;
  border:1px solid var(--line);border-radius:var(--r-md);
  padding:1rem 1.1rem;background:var(--coal);
  transition:transform .3s var(--ease),border-color .3s,box-shadow .3s;
}
.area-card:hover{transform:translateY(-3px);border-color:rgba(55,192,239,.5);box-shadow:0 18px 40px -22px rgba(55,192,239,.35)}
.area-card__pin{flex:none;display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--glow-soft);color:var(--glow)}
.area-card__body{flex:1;min-width:0}
.area-card__body b{display:block;font-family:var(--font-display);font-stretch:125%;text-transform:uppercase;font-size:.94rem;letter-spacing:.02em;line-height:1.1}
.area-card__body small{display:block;font-size:.76rem;color:var(--cloud-dim);margin-top:.15rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.area-card__go{flex:none;color:var(--cloud-dim);transition:transform .3s,color .3s}
.area-card:hover .area-card__go{color:var(--glow);transform:translateX(3px)}
@media (max-width:820px){.area-grid{grid-template-columns:1fr 1fr}}
@media (max-width:520px){.area-grid{grid-template-columns:1fr}}

/* ---- pricing table → stacked cards on mobile (no horizontal scroll) ---- */
@media (max-width:680px){
  .pricing{border:none;background:transparent;overflow:visible;border-radius:0}
  .pricing table{min-width:0;width:100%}
  .pricing thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap} /* visually hide header, keep for a11y */
  .pricing table,.pricing tbody,.pricing tr,.pricing td{display:block;width:100%}
  .pricing tr{
    background:#fff;border:1px solid var(--ink-line);border-radius:var(--r-md);
    margin-bottom:.85rem;padding:.2rem 1.1rem .8rem;
    box-shadow:0 10px 26px -20px rgba(1,1,1,.25);
  }
  .pricing tbody tr:hover,.pricing tr:hover{background:#fff}
  .pricing td{
    border:none;padding:.5rem 0;
    display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
    text-align:right;font-variant-numeric:tabular-nums;
  }
  .pricing td:first-child{
    display:block;text-align:left;
    border-bottom:1px solid var(--ink-line);
    padding:.9rem 0 .6rem;margin-bottom:.35rem;
  }
  .pricing td:first-child b{font-size:1.05rem}
  .pricing td:not(:first-child)::before{
    content:attr(data-label);
    font-size:.68rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:#7b7e81;
    text-align:left;flex:none;
  }
  .pricing td.num{font-weight:800;color:var(--ink)}
}

/* Cerakote certification badge */
.cert-badge{
  display:inline-flex;align-items:center;gap:.6rem;
  margin-top:1.4rem;max-width:100%;
  font-size:.82rem;font-weight:600;letter-spacing:.02em;line-height:1.3;
  color:var(--cloud);
  border:1px solid rgba(55,192,239,.5);
  background:var(--glow-soft);
  border-radius:14px;padding:.6rem 1.05rem;
}
.cert-badge svg{color:var(--glow);flex:none}
.cert-badge b{color:var(--glow);font-weight:800}
.founder__body .cert-badge{margin:0 0 1.4rem}