/* Ridge Web Designs — one navy night-to-dawn world */
:root{
  --canvas:#0A1017;
  --panel:#121B26;
  --accent:#F0A868;
  --accent-hover:#F6BC85;
  --accent-muted:rgba(240,168,104,.16);
  --text-secondary:#93A8BC;
  --text-primary:#ECF2F8;
  --ridge-deep:#24344A;
  --ridge-mid:#4E7093;
  --ridge-pale:#A9C4D8;
  --line:rgba(169,196,216,.14);
  --line-strong:rgba(169,196,216,.55);
  --ease-out:cubic-bezier(.22,.61,.2,1);
  --ease-io:cubic-bezier(.6,.04,.2,1);
  --tsh:0 1px 2px rgba(4,8,14,.85),0 2px 12px rgba(4,8,14,.55),0 0 28px rgba(4,8,14,.4);
  --font-d:'Unbounded',Verdana,sans-serif;
  --font-b:'Manrope','Segoe UI',sans-serif;
  --font-m:'JetBrains Mono',Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
html,body{overflow-x:hidden;overflow-x:clip}
body{
  background:var(--canvas);color:var(--text-primary);
  font-family:var(--font-b);font-size:1.0625rem;line-height:1.65;
  opacity:0;transition:opacity .8s var(--ease-out);
}
body.ready{opacity:1}
[hidden]{display:none!important}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none;
  appearance:none;-webkit-appearance:none}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;top:-48px;left:16px;z-index:99;background:var(--accent);color:var(--canvas);
  padding:.6em 1.1em;border-radius:8px;font-weight:700;text-decoration:none;transition:top .3s var(--ease-out)}
.skip:focus-visible{top:12px}
body.paused *,body.paused *::before,body.paused *::after{animation-play-state:paused!important}

/* ---------- environment (one fixed layer behind everything) ---------- */
.env{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.env i{position:absolute;inset:-12%;display:block}
.stars{background-image:
  radial-gradient(1.4px 1.4px at 12% 22%,rgba(236,242,248,.9),transparent 55%),
  radial-gradient(1px 1px at 34% 64%,rgba(236,242,248,.7),transparent 55%),
  radial-gradient(1.2px 1.2px at 56% 14%,rgba(236,242,248,.8),transparent 55%),
  radial-gradient(1px 1px at 72% 48%,rgba(236,242,248,.6),transparent 55%),
  radial-gradient(1.3px 1.3px at 88% 78%,rgba(236,242,248,.85),transparent 55%),
  radial-gradient(1px 1px at 22% 86%,rgba(236,242,248,.6),transparent 55%),
  radial-gradient(1.1px 1.1px at 44% 38%,rgba(236,242,248,.7),transparent 55%),
  radial-gradient(1px 1px at 66% 92%,rgba(236,242,248,.55),transparent 55%),
  radial-gradient(1.2px 1.2px at 8% 52%,rgba(236,242,248,.7),transparent 55%),
  radial-gradient(1px 1px at 94% 30%,rgba(236,242,248,.6),transparent 55%);
  background-size:520px 520px}
.s1{opacity:.34}
.s2{opacity:.18;background-size:340px 340px}
.envglow{background:radial-gradient(46% 38% at 68% 82%,var(--accent-muted),transparent 70%);opacity:.5}
body.anim-ok .s1{animation:drift1 140s linear infinite}
body.anim-ok .s2{animation:drift2 100s linear infinite}
body.anim-ok .envglow{animation:breathe 70s var(--ease-io) -22s infinite}
@keyframes drift1{from{transform:translate3d(0,0,0)}to{transform:translate3d(-520px,-260px,0)}}
@keyframes drift2{from{transform:translate3d(0,0,0)}to{transform:translate3d(340px,-340px,0)}}
@keyframes breathe{0%,100%{opacity:.32}50%{opacity:.62}}

/* ---------- shared ---------- */
.wrap{max-width:1180px;margin:0 auto;padding:0 clamp(20px,4vw,44px)}
.sec{position:relative;padding:clamp(84px,11vw,150px) 0}
.kicker{font-family:var(--font-m);font-weight:500;font-size:.78rem;letter-spacing:.34em;
  color:var(--accent);margin-bottom:1.1rem}
/* the horizon rule: a hairline dawns under each section kicker, a sun dot settling at its end */
.sec .kicker::after{content:"";display:block;width:64px;height:7px;margin-top:.7rem;
  background:
    radial-gradient(circle at calc(100% - 3.5px) 50%,var(--accent) 3px,transparent 3.6px) no-repeat,
    linear-gradient(var(--line-strong),var(--line-strong)) 0 50%/calc(100% - 10px) 1.5px no-repeat;
  clip-path:inset(0 100% 0 0);transition:clip-path .95s var(--ease-io) .25s}
.reveal.in .kicker::after,body:not(.anim-ok) .sec .kicker::after{clip-path:inset(0 0 0 0)}
.sec-pricing .kicker::after,.sec-call .kicker::after{margin-left:auto;margin-right:auto}
.h2{font-family:var(--font-d);font-weight:600;font-size:clamp(1.7rem,4.2vw,3rem);
  line-height:1.14;letter-spacing:.005em;margin-bottom:1.15rem;max-width:22ch}
.h3{font-family:var(--font-d);font-weight:600;font-size:clamp(1.05rem,2vw,1.35rem);line-height:1.25;margin-bottom:.55rem}
.lede{color:var(--text-secondary);font-size:clamp(1.05rem,1.6vw,1.2rem);max-width:56ch;margin-bottom:1.4rem}
.sec p{max-width:60ch}
.sec-head{margin-bottom:clamp(2.2rem,5vw,3.6rem)}
.btn{position:relative;overflow:hidden;display:inline-block;text-decoration:none;font-weight:700;border-radius:999px;
  padding:.85em 1.7em;font-size:1rem;line-height:1.2;
  transition:transform .45s var(--ease-out),box-shadow .45s var(--ease-out),
    background-color .3s var(--ease-out),color .3s var(--ease-out),border-color .3s var(--ease-out)}
.btn:hover{transform:translateY(-2px)}
.btn::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(130px circle at var(--sx,50%) var(--sy,50%),rgba(255,255,255,.25),transparent 65%);
  opacity:0;transition:opacity .45s var(--ease-out)}
.btn-ghost::after{background:radial-gradient(130px circle at var(--sx,50%) var(--sy,50%),rgba(240,168,104,.2),transparent 65%)}
body.anim-ok .btn:hover::after{opacity:1}
.btn-solid{background:var(--accent);color:var(--canvas)}
.btn-solid:hover{background:var(--accent-hover);box-shadow:0 10px 34px -10px rgba(240,168,104,.55)}
.btn-ghost{border:1px solid var(--line-strong);color:var(--text-primary);background:rgba(18,27,38,.35)}
.btn-ghost:hover{border-color:var(--accent);color:var(--accent-hover)}
.btn-big{font-size:1.12rem;padding:1em 2.2em}
.chip{display:inline-block;font-family:var(--font-m);font-size:.8rem;letter-spacing:.06em;
  background:rgba(10,16,23,.66);border:1px solid var(--line);border-radius:999px;
  padding:.45em 1em;color:var(--text-secondary)}
.text-link{color:var(--accent);text-decoration:none;font-weight:600;letter-spacing:.02em}
.text-link:hover{color:var(--accent-hover);text-decoration:underline;text-underline-offset:4px}

/* ---------- nav ---------- */
nav{position:fixed;top:0;left:0;right:0;z-index:40;display:flex;align-items:center;gap:1.6rem;
  padding:.8rem clamp(16px,3vw,36px);
  transition:background-color .5s var(--ease-out),border-color .5s var(--ease-out),
    opacity .45s var(--ease-out),transform .45s var(--ease-out);
  border-bottom:1px solid transparent}
nav.scrolled{background:rgba(10,16,23,.82);border-bottom-color:var(--line)}
.nav-brand{display:flex;align-items:center;gap:.6rem;text-decoration:none}
.nav-mark{width:34px;height:auto;flex:none}
.nav-name{font-family:var(--font-d);font-weight:700;font-size:1.02rem;letter-spacing:.06em}
.nav-links{display:flex;gap:1.5rem;margin-left:auto}
.nav-links a{text-decoration:none;color:var(--text-secondary);font-weight:600;font-size:.95rem;
  transition:color .3s var(--ease-out)}
.nav-links a:hover{color:var(--text-primary)}
.btn-nav{padding:.55em 1.25em;font-size:.92rem}
body.filming nav{opacity:0;pointer-events:none;transform:translateY(-8px)}

/* ---------- the stage (film hero) ---------- */
.stage{position:relative;height:100vh;height:100svh;min-height:520px;overflow:hidden;background:var(--canvas)}
#hero-video{position:absolute;inset:0;width:100%;height:100%}
/* poster oversized a hair so the depth drift never shows an edge */
.poster{position:absolute;inset:-18px;background:url('hero-still.jpg') center/cover no-repeat}
/* the living valley mist: two fog layers drifting through the vista while the hero rests */
.mist{position:absolute;left:-35%;width:170%;top:40%;height:42%;pointer-events:none;
  opacity:.55;transition:opacity .8s var(--ease-out)}
.m1{background:
  radial-gradient(38% 55% at 18% 55%,rgba(226,236,244,.10),transparent 70%),
  radial-gradient(30% 48% at 52% 42%,rgba(226,236,244,.08),transparent 70%),
  radial-gradient(42% 60% at 82% 60%,rgba(226,236,244,.11),transparent 70%)}
.m2{top:54%;height:32%;opacity:.42;background:
  radial-gradient(34% 52% at 30% 48%,rgba(210,226,240,.09),transparent 70%),
  radial-gradient(40% 58% at 68% 55%,rgba(210,226,240,.10),transparent 70%)}
body.anim-ok .stage.live .m1{animation:mistdrift1 95s var(--ease-io) -30s infinite alternate}
body.anim-ok .stage.live .m2{animation:mistdrift2 70s var(--ease-io) -12s infinite alternate}
@keyframes mistdrift1{from{transform:translate3d(-4.5%,0,0)}to{transform:translate3d(4.5%,1.2%,0)}}
@keyframes mistdrift2{from{transform:translate3d(3.5%,.6%,0)}to{transform:translate3d(-3.5%,-.6%,0)}}
.stage.playing .mist{opacity:0}
#hero-video{object-fit:cover;opacity:0;transition:opacity .3s ease}
.stage.playing:not(.buffering) #hero-video{opacity:1}
.scrim{position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(10,16,23,.42) 0%,rgba(10,16,23,.08) 34%,rgba(10,16,23,.05) 62%,rgba(10,16,23,.5) 100%)}
.film-spin{position:absolute;left:50%;top:50%;width:30px;height:30px;margin:-15px 0 0 -15px;
  border-radius:50%;border:2px solid rgba(236,242,248,.25);border-top-color:var(--accent);
  opacity:0;pointer-events:none}
.stage.playing.buffering .film-spin{opacity:1;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}

/* caption bands */
.band{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none}
.band::before{content:"";position:absolute;left:50%;top:50%;width:min(150vw,1400px);height:60vh;
  transform:translate(-50%,-50%);
  background:radial-gradient(52% 46% at 50% 50%,rgba(6,10,16,.68),rgba(6,10,16,.28) 55%,transparent 78%)}
#band3::before{background:radial-gradient(52% 46% at 50% 50%,rgba(6,10,16,.74),rgba(6,10,16,.32) 55%,transparent 78%)}
#band1,#band2{align-items:flex-start}
#band1 .band-line,#band2 .band-line{margin-top:24svh}
.band-line{position:relative;font-family:var(--font-d);font-weight:600;
  font-size:clamp(1.35rem,3.6vw,2.6rem);line-height:1.25;text-align:center;
  text-shadow:var(--tsh);padding:0 6vw;max-width:26ch}
.band .w{display:inline-block;white-space:nowrap}
.band .c{display:inline-block}

/* scatter — stars assembling */
.fx-scatter .c{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.6,1);opacity:var(--kc);
  transform:translate(calc((1 - var(--kc))*var(--jx,0px)),calc((1 - var(--kc))*var(--jy,0px)))
    rotate(calc((1 - var(--kc))*var(--jr,0deg)))}
/* drift-down — descending with the camera */
.fx-drift .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*2.8,1);opacity:var(--kc);
  transform:translateY(calc((1 - var(--kc))*-26px))}
/* blur-to-sharp — mist clearing (static blur, opacity crossfade only) */
.fx-b2s .band-line{display:grid}
.fx-b2s .copy{grid-area:1/1}
.fx-b2s .soft{filter:blur(9px);opacity:calc(.75*(1 - var(--k,0)))}
.fx-b2s .sharp{opacity:var(--k,0)}
/* halves parting — the cloud floor opening */
.fx-part .w{--kc:clamp(0,(var(--k,0) - var(--th,0))*3,1);opacity:var(--kc);
  transform:translateX(calc((1 - var(--kc))*var(--jx,0px)))}

/* film hud */
.film-hud{position:absolute;left:0;right:0;bottom:0;pointer-events:none;opacity:0;
  transition:opacity .5s var(--ease-out)}
.stage.playing .film-hud{opacity:1}
.chapter-chip{position:absolute;bottom:26px;left:clamp(16px,3vw,36px);color:var(--ridge-pale)}
.film-rail{position:absolute;bottom:0;left:0;right:0;height:2px;background:rgba(236,242,248,.14)}
#film-rail-fill{position:absolute;inset:0;background:var(--accent);
  transform-origin:0 50%;transform:scaleX(0)}

/* the play orb (in the hero column, below the CTAs) */
.play-orb{position:relative;z-index:5;margin-top:clamp(1.5rem,4.5svh,3rem);
  display:flex;flex-direction:column;align-items:center;gap:.7rem;text-align:center;
  opacity:0;translate:0 14px;transition:opacity .9s var(--ease-out),translate .9s var(--ease-out)}
.play-orb::before{content:"";position:absolute;left:50%;top:34px;width:300px;height:300px;
  transform:translate(-50%,-50%);pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,rgba(6,10,16,.55),rgba(6,10,16,.22) 55%,transparent 75%)}
.stage.orb-in .play-orb{opacity:1;translate:0 0}
.stage.watched .play-orb,body.filming .play-orb{opacity:0;pointer-events:none}
.orb-ring{position:relative;width:68px;height:68px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1.5px solid rgba(236,242,248,.85);background:rgba(10,16,23,.38);color:var(--text-primary);
  transition:transform .5s var(--ease-out),border-color .3s,background-color .3s}
.orb-ring svg{width:24px;height:24px;margin-left:3px}
.play-orb:hover .orb-ring{transform:scale(1.08);border-color:var(--accent);background:rgba(10,16,23,.55)}
.orb-ring::after{content:"";position:absolute;inset:-1.5px;border-radius:50%;
  border:1.5px solid var(--accent);opacity:0;transform:scale(1)}
.stage.attract .orb-ring::after{animation:ripple 1.6s var(--ease-out) 1}
@keyframes ripple{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(2.1)}}
.orb-label{position:relative;font-family:var(--font-m);font-weight:500;font-size:.8rem;
  letter-spacing:.22em;text-shadow:var(--tsh)}
.orb-whisper{position:relative;font-size:.88rem;color:var(--ridge-pale);text-shadow:var(--tsh)}
.film-skip{position:absolute;top:calc(16px + env(safe-area-inset-top,0px));right:clamp(16px,3vw,36px);z-index:6;
  color:var(--text-primary);background:rgba(10,16,23,.66)}
.film-skip:hover{border-color:var(--accent);color:var(--accent-hover)}

/* the resting lockup (choreographed by --k) */
.hero-home{position:absolute;inset:0;z-index:4;display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;padding:8svh 6vw 6svh;
  pointer-events:none}
.hero-home>*{pointer-events:auto}
.hero-home{transition:opacity .45s var(--ease-out)}
body.filming .hero-home{opacity:0;pointer-events:none}
body.filming .hero-home>*{pointer-events:none}
.hero-kicker{--kk:clamp(0,calc(var(--k,1)*2.2),1);opacity:var(--kk);
  transform:translateY(calc((1 - var(--kk))*14px));text-shadow:var(--tsh);margin-bottom:1.3rem}
.lockup{line-height:1}
.lockup-visual{display:flex;flex-direction:column;align-items:center}
.lockup-mark{width:clamp(74px,11vw,110px);height:auto;
  --km:clamp(0,calc((var(--k,1) - .05)*2.2),1);opacity:var(--km);
  transform:translateY(calc((1 - var(--km))*18px));
  filter:drop-shadow(0 4px 18px rgba(4,8,14,.6))}
.lockup-name{display:block;font-family:var(--font-d);font-weight:700;
  font-size:clamp(2.9rem,8.5vw,5.8rem);letter-spacing:.05em;margin-top:1.2rem;
  text-shadow:var(--tsh)}
.lockup-name .c{display:inline-block;
  --kc:clamp(0,calc((var(--k,1) - .16 - var(--th,0))*3.4),1);opacity:var(--kc);
  transform:translateX(calc((1 - var(--kc))*var(--jx,0px)))}
/* the gleam: every 16s a band of dawn light grazes the wordmark, one pass, gone */
@keyframes gleam{
  0%{color:var(--text-primary)}
  1.8%{color:#FFF2DC;text-shadow:0 1px 2px rgba(4,8,14,.85),0 2px 12px rgba(4,8,14,.55),0 0 30px rgba(240,168,104,.6)}
  4.2%{color:var(--text-primary)}
  100%{color:var(--text-primary)}}
body.anim-ok .stage.live .lockup-name .c{animation:gleam 16s linear var(--gd,0s) infinite}
.lockup-sub{display:block;font-family:var(--font-b);font-weight:600;
  font-size:clamp(.82rem,1.6vw,1.05rem);letter-spacing:.58em;text-indent:.58em;
  color:var(--ridge-pale);margin-top:.9rem;text-shadow:var(--tsh);
  --ku:clamp(0,calc((var(--k,1) - .5)*4),1);opacity:var(--ku)}
.tagline{--kt:clamp(0,calc((var(--k,1) - .64)*4),1);opacity:var(--kt);
  transform:translateY(calc((1 - var(--kt))*12px));
  color:var(--text-primary);font-size:clamp(1rem,1.9vw,1.22rem);font-weight:600;
  max-width:44ch;margin-top:1.5rem;text-shadow:var(--tsh)}
.cta-row{--kb:clamp(0,calc((var(--k,1) - .78)*5),1);opacity:var(--kb);
  transform:translateY(calc((1 - var(--kb))*12px));
  display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center;margin-top:1.9rem}

/* ---------- ridgeline dividers (the signature thread) ---------- */
.ridgeline{position:absolute;top:0;left:0;width:100%;height:clamp(44px,7vw,90px);display:block;pointer-events:none}
.ridgeline path{fill:none;stroke:rgba(169,196,216,.32);stroke-width:1.6;
  stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.9s var(--ease-io)}
.ridgeline.drawn path{stroke-dashoffset:0}

/* ---------- proof ---------- */
.sec-proof{padding-top:clamp(110px,14vw,190px)}
.stat-row{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.6rem}
.stat{color:var(--text-primary)}
.sec-proof .lede{max-width:62ch}

/* ---------- work ---------- */
.work-card{display:grid;grid-template-columns:1.25fr 1fr;gap:clamp(1.4rem,4vw,3.4rem);
  align-items:center;padding:clamp(1.8rem,4vw,3rem) 0;border-top:1px solid var(--line)}
.work-card.flip .shot{order:2}
.work-card.flip .work-info{order:1}
.shot{position:relative;display:block;border-radius:14px;overflow:hidden;
  border:1px solid var(--line-strong);background:var(--panel);
  transition:transform .6s var(--ease-out),box-shadow .6s var(--ease-out),border-color .4s}
.shot:hover{transform:translateY(-7px);border-color:var(--accent);
  box-shadow:0 26px 60px -22px rgba(4,8,14,.9),0 0 0 1px var(--accent-muted)}
.shot-bar{display:flex;gap:6px;padding:10px 14px;background:rgba(236,242,248,.06);
  border-bottom:1px solid var(--line)}
.shot-bar i{width:9px;height:9px;border-radius:50%;background:rgba(169,196,216,.35)}
.shot img{aspect-ratio:1600/1000;object-fit:cover;object-position:top;
  clip-path:inset(0 0 100% 0);transform:translateY(5%);
  transition:clip-path 1.15s var(--ease-io) .15s,transform 1.15s var(--ease-io) .15s}
.work-card.in .shot img{clip-path:inset(0 0 0 0);transform:none}
body:not(.anim-ok) .shot img{clip-path:none;transform:none}
/* the lamp: a warm glow follows the cursor over the prints */
.shot::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:inherit;
  background:radial-gradient(260px circle at var(--lx,50%) var(--ly,50%),rgba(240,168,104,.16),transparent 70%);
  opacity:0;transition:opacity .5s var(--ease-out)}
body.anim-ok .shot:hover::before{opacity:1}
.work-info p{color:var(--text-secondary);margin-bottom:1rem}
.card-flag{font-family:var(--font-m);font-weight:500;font-size:.72rem;letter-spacing:.3em;
  color:var(--accent);margin-bottom:.55rem}
.work-card .shot::after{content:"";position:absolute;inset:0;pointer-events:none;border-radius:14px;
  box-shadow:inset 0 0 60px -18px rgba(240,168,104,.35);opacity:0}
body.anim-ok .sec-work.in-view .work-card.in .shot::after{animation:cardglow 7s var(--ease-io) -2s infinite}
@keyframes cardglow{0%,100%{opacity:0}50%{opacity:.5}}

/* ---------- approach ---------- */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.3rem,3vw,2.4rem);list-style:none}
.step-img{aspect-ratio:8/5;object-fit:cover;border-radius:12px;border:1px solid var(--line);
  margin-bottom:1.1rem}
.step-num{font-family:var(--font-m);color:var(--accent);letter-spacing:.3em;font-size:.8rem;margin-bottom:.4rem}
.step p{color:var(--text-secondary)}

/* ---------- pledge ---------- */
.sec-pledge{background:linear-gradient(180deg,transparent,rgba(18,27,38,.5) 18%,rgba(18,27,38,.5) 82%,transparent)}
.pledge-scene{max-width:880px;margin:0 auto;text-align:center}
.pledge-svg{width:100%;height:auto;display:block;border-radius:16px;border:1px solid var(--line);
  background:linear-gradient(180deg,#0D1520,#0A1017)}
.pl-sun{transform:translateY(calc((1 - var(--p,0))*195px))}
.pl-fog{opacity:calc(1 - var(--p,0))}
.pl-wash{opacity:var(--p,0)}
.hold-btn{display:inline-flex;align-items:center;gap:.55em;margin-top:1.4rem;
  user-select:none;-webkit-user-select:none;touch-action:none}
.hold-btn:active{transform:scale(.97)}
.hold-ic{width:1.15em;height:1.15em}
.pledges{list-style:none;margin-top:2rem;display:grid;gap:.9rem;justify-items:center}
.pledge-line{opacity:.22;transform:translateY(6px);font-size:clamp(1rem,1.8vw,1.18rem);font-weight:600;
  transition:opacity .8s var(--ease-out),transform .8s var(--ease-out),text-shadow .8s var(--ease-out)}
.pledge-line.lit{opacity:1;transform:none;text-shadow:0 0 22px rgba(240,168,104,.35)}

/* ---------- pricing ---------- */
.sec-pricing .wrap{text-align:center;display:flex;flex-direction:column;align-items:center}
.sec-pricing .h2,.sec-pricing .lede{margin-left:auto;margin-right:auto}
.price-figure{position:relative;font-family:var(--font-d);font-weight:600;
  font-size:clamp(1.6rem,4.6vw,3.2rem);line-height:1.2;margin:1.6rem 0 .9rem;max-width:none}
.price-figure strong{color:var(--accent);font-weight:700}
.price-figure::before{content:"";position:absolute;left:50%;top:50%;width:min(420px,80vw);height:150px;
  transform:translate(-50%,-50%);z-index:-1;pointer-events:none;
  background:radial-gradient(50% 50% at 50% 50%,var(--accent-muted),transparent 72%);opacity:.7}
body.anim-ok .sec-pricing.in-view .price-figure::before{animation:breathe 9s var(--ease-io) -3s infinite}
.price-note{color:var(--text-secondary);margin-bottom:1.8rem;max-width:52ch}

/* ---------- faq ---------- */
.faq-list{max-width:760px}
.qa{border-bottom:1px solid var(--line)}
.qa:first-child{border-top:1px solid var(--line)}
.qa-btn{display:flex;align-items:baseline;justify-content:space-between;gap:1.4rem;width:100%;
  text-align:left;padding:1.15rem .2rem;font-weight:700;font-size:1.05rem;
  transition:color .3s var(--ease-out)}
.qa-btn:hover{color:var(--accent-hover)}
.qa-mark{position:relative;flex:none;width:14px;height:14px;align-self:center}
.qa-mark::before,.qa-mark::after{content:"";position:absolute;left:0;top:6px;width:14px;height:2px;
  background:var(--accent);border-radius:2px;transition:transform .45s var(--ease-out)}
.qa-mark::after{transform:rotate(90deg)}
.qa.open .qa-mark::after{transform:rotate(0deg)}
.qa-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease-io)}
.qa.open .qa-panel{grid-template-rows:1fr}
.qa-panel>p{overflow:hidden;color:var(--text-secondary);padding-right:2rem}
.qa.open .qa-panel>p{padding-bottom:1.15rem}

/* ---------- call ---------- */
.sec-call{overflow:hidden}
.call-bg{position:absolute;inset:0;background:url('hero-still.jpg') center/cover no-repeat;opacity:.32}
.sec-call::before{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,var(--canvas) 0%,rgba(10,16,23,.55) 40%,rgba(10,16,23,.72) 100%)}
.sec-call .wrap{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;
  padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(40px,6vw,80px)}
.sec-call .h2,.sec-call .lede{margin-left:auto;margin-right:auto;text-shadow:var(--tsh)}
.sec-call .lede{color:var(--text-primary);opacity:.92}
.call-row{display:flex;gap:.9rem;flex-wrap:wrap;justify-content:center}
.call-micro{font-family:var(--font-m);font-size:.8rem;letter-spacing:.08em;color:var(--ridge-pale);
  margin-top:1rem;text-shadow:var(--tsh)}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--line);padding:2.6rem 0 2.2rem;background:rgba(13,21,32,.5)}
.foot-wrap{display:flex;align-items:center;gap:1.6rem;flex-wrap:wrap}
.foot-brand{display:flex;align-items:center;gap:.9rem}
.foot-line{color:var(--text-secondary);font-size:.95rem}
.foot-parent{color:var(--text-secondary);font-size:.9rem;margin-top:.2rem}
.foot-parent a{color:var(--ridge-pale);text-decoration:none;transition:color .3s var(--ease-out)}
.foot-parent a:hover{color:var(--accent-hover)}
.foot-contact{color:var(--text-secondary);font-size:.9rem;margin-top:.2rem}
.foot-contact a{color:inherit;text-decoration:none;transition:color .3s var(--ease-out)}
.foot-contact a:hover{color:var(--accent-hover)}
.foot-links{display:flex;gap:1.3rem;margin-left:auto}
.foot-links a{color:var(--text-secondary);text-decoration:none;font-size:.92rem}
.foot-links a:hover{color:var(--text-primary)}
.foot-copy{width:100%;color:var(--text-secondary);opacity:.7;font-size:.85rem}

/* ---------- entrances (staggers assigned and retired in JS) ---------- */
.reveal .part{opacity:0;transform:translateY(22px);
  transition:opacity .75s var(--ease-out),transform .75s var(--ease-out)}
.reveal.in .part{opacity:1;transform:none}

/* ---------- reduced motion: full stop, live in both directions ---------- */
body:not(.anim-ok) *,body:not(.anim-ok) *::before,body:not(.anim-ok) *::after{
  animation:none!important;transition:none!important}
body:not(.anim-ok) .reveal .part{opacity:1;transform:none}
body:not(.anim-ok) .ridgeline path{stroke-dashoffset:0}
body:not(.anim-ok) .play-orb{opacity:1;translate:0 0}
body.filming:not(.anim-ok) .play-orb,body:not(.anim-ok) .stage.watched .play-orb{opacity:0}

/* ---------- guards ---------- */
@media (max-height:640px){
  .orb-whisper,.chapter-chip{display:none}
  .lockup-mark{width:60px}
  .play-orb{margin-top:1rem}
  .hero-kicker{margin-bottom:.7rem}
}
@media (pointer:coarse){
  .btn,.qa-btn,.film-skip,.nav-links a{min-height:44px}
  .btn,.film-skip{display:inline-flex;align-items:center;justify-content:center}
  .nav-links a{display:inline-flex;align-items:center}
}

/* ---------- responsive ---------- */
@media (max-width:900px){
  .work-card,.work-card.flip{grid-template-columns:1fr}
  .work-card.flip .shot{order:0}
  .work-card.flip .work-info{order:1}
  .steps{grid-template-columns:1fr;max-width:520px}
}
@media (max-width:760px){
  .nav-links{display:none}
  .band-line{font-size:clamp(1.2rem,5.6vw,1.6rem)}
  #band1 .band-line,#band2 .band-line{margin-top:20svh}
  .foot-links{margin-left:0}
  /* keep the cresting sun in frame when portrait crops the sides */
  .poster,.call-bg{background-position:66% center}
  #hero-video{object-position:66% center}
}