/* Wise Power Company — wisepower.co */
:root{
  --red:#d9303b; --red-2:#e13a44; --red-dark:#a81f29; --red-soft:#fcefef;
  --ink:#121212; --ink-2:#3f3f3f; --muted:#6f6b67;
  --line:#e9e4de; --bg:#ffffff; --cream:#faf6f0; --night:#0b0d14;
  --radius:18px; --shadow:0 18px 50px rgba(18,18,18,.10);
  --max:1160px;
  --font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --display:"Sora","Inter",system-ui,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);line-height:1.6;font-size:17px;-webkit-font-smoothing:antialiased}
img,svg{max-width:100%;display:block}
a{color:var(--red)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 22px}
h1,h2,h3{font-family:var(--display);line-height:1.08;margin:0 0 .5em;letter-spacing:-.025em;font-weight:700}
h1{font-size:clamp(2.3rem,5.6vw,4.4rem)}
h2{font-size:clamp(1.8rem,3.8vw,3rem)}
h3{font-size:1.2rem;letter-spacing:-.01em;line-height:1.25}
p{margin:0 0 1em}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:.76rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--red);margin-bottom:1.1em}
.eyebrow:before{content:"";width:26px;height:2px;background:currentColor;border-radius:2px}
.lead{font-size:clamp(1.05rem,1.5vw,1.25rem);color:var(--ink-2);max-width:60ch}
.muted{color:var(--muted)} .small{font-size:.85rem} .center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
.hide{display:none!important}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;white-space:nowrap;background:var(--red);color:#fff!important;text-decoration:none;font-weight:700;border:0;border-radius:999px;padding:15px 28px;font-size:1rem;cursor:pointer;font-family:var(--font);transition:transform .2s,box-shadow .2s,background .2s;box-shadow:0 8px 24px rgba(191,25,34,.28)}
.btn:hover{background:var(--red-2);transform:translateY(-2px);box-shadow:0 12px 30px rgba(191,25,34,.36)}
.btn .arr{transition:transform .2s}.btn:hover .arr{transform:translateX(4px)}
.btn.light{background:#fff;color:var(--ink)!important;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.btn.ghost{background:transparent;color:inherit!important;box-shadow:none;border:1.5px solid currentColor}
.btn.ghost:hover{background:rgba(127,127,127,.12)}
.btn.block{width:100%}
.link{font-weight:700;text-decoration:none;display:inline-flex;gap:8px;align-items:center}
.link:hover{text-decoration:underline}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .3s,box-shadow .3s,color .3s;color:#fff}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:74px;gap:16px}
.brand{display:block;position:relative;height:58px;width:168px;flex:0 0 auto}
.brand img{height:58px;width:auto;position:absolute;left:0;top:0;transition:opacity .3s}
.brand .l-dark{opacity:0}
.nav{display:flex;align-items:center;gap:26px}
.nav a:not(.btn){color:inherit;text-decoration:none;font-weight:600;font-size:.93rem;opacity:.9}
.nav a:not(.btn):hover{opacity:1}
.nav .btn{padding:11px 20px;font-size:.92rem}
.top.solid,.top.always{background:rgba(255,255,255,.92);backdrop-filter:saturate(1.6) blur(14px);-webkit-backdrop-filter:saturate(1.6) blur(14px);box-shadow:0 1px 0 var(--line);color:var(--ink)}
.top.solid .brand .l-light,.top.always .brand .l-light{opacity:0}
.top.solid .brand .l-dark,.top.always .brand .l-dark{opacity:1}
.menu-btn{display:none;background:none;border:0;color:inherit;padding:8px;cursor:pointer}
.menu-btn svg{width:26px;height:26px}
@media (max-width:980px){
  .nav a:not(.btn){display:none}
  .menu-btn{display:block}
  .brand{width:134px;height:46px}.brand img{height:46px}
  .top .wrap{height:64px}
  .nav{gap:8px}.nav .btn{padding:9px 16px;font-size:.86rem}
  .top.open{background:#fff;color:var(--ink)}
  .top.open .brand .l-light{opacity:0}.top.open .brand .l-dark{opacity:1}
  .top.open .drawer{display:flex}
}
.drawer{display:none;flex-direction:column;background:#fff;color:var(--ink);padding:8px 22px 22px;border-top:1px solid var(--line);box-shadow:0 20px 40px rgba(0,0,0,.12)}
.drawer a{padding:14px 0;border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-weight:600}

/* hero */
.hero{position:relative;min-height:100svh;display:flex;align-items:center;color:#fff;overflow:hidden;
  background:radial-gradient(120% 80% at 50% 118%,#ffb36b 0%,#e2303a 22%,#5a1230 46%,#160b1c 70%,#0b0d14 100%)}
.hero:after{content:"";position:absolute;inset:0;background:radial-gradient(60% 50% at 20% 20%,rgba(255,255,255,.06),transparent 60%);pointer-events:none}
.hero .wrap{position:relative;z-index:2;padding-top:110px;padding-bottom:90px;width:100%}
.hero h1{font-size:clamp(2.2rem,5.2vw,4.1rem)}
.hero h1 br.dk{display:none}
@media (min-width:900px){.hero h1 br.dk{display:inline}}
.hero .swap{display:block;color:#ffd9a8;min-height:1.15em}
@media (max-width:700px){.hero .swap{min-height:2.25em}}
.rings{position:absolute;right:-12vw;top:50%;width:62vw;height:62vw;max-width:900px;max-height:900px;transform:translateY(-46%);border-radius:50%;background:repeating-radial-gradient(circle,rgba(255,217,168,.10) 0 1px,transparent 1px 46px);-webkit-mask-image:radial-gradient(circle,#000 30%,transparent 70%);mask-image:radial-gradient(circle,#000 30%,transparent 70%);pointer-events:none}
@media (max-width:900px){.rings{right:-40vw;width:120vw;height:120vw;opacity:.7}}
.hero .swap span{display:inline-block;transition:opacity .45s,transform .45s}
.hero .swap span.out{opacity:0;transform:translateY(14px)}
.hero .lead{color:rgba(255,255,255,.86);margin-top:.4em}
.zipbar{display:flex;gap:10px;margin-top:30px;max-width:520px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);padding:8px;border-radius:999px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.zipbar input{flex:1;min-width:0;background:transparent;border:0;color:#fff;font-size:1.05rem;padding:0 18px;font-family:var(--font);outline:none}
.zipbar input::placeholder{color:rgba(255,255,255,.7)}
.zipnote{font-size:.85rem;color:rgba(255,255,255,.72);margin-top:14px}
.ziperr{color:#ffd9a8;font-size:.88rem;margin-top:10px;min-height:1.2em}
.scrollcue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);z-index:2;color:rgba(255,255,255,.8);font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:10px}
.scrollcue i{width:1px;height:38px;background:linear-gradient(#fff,transparent);animation:cue 1.8s infinite}
@keyframes cue{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
@media (max-width:600px){.zipbar{flex-direction:column;border-radius:22px;padding:10px}.zipbar input{padding:12px 14px;text-align:center}.scrollcue{display:none}.hero .wrap{padding-top:96px;padding-bottom:60px}}

/* scroll story: a day powered by you */
.day{position:relative;height:440vh;background:var(--night)}
.day-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;color:#fff}
.sky{position:absolute;inset:0;opacity:0;will-change:opacity}
.sky.dawn{background:linear-gradient(180deg,#27224f 0%,#7a4a7c 38%,#f08a5d 72%,#ffd08a 100%)}
.sky.noon{background:linear-gradient(180deg,#1c74d8 0%,#58a9f0 50%,#cdeaff 100%)}
.sky.dusk{background:linear-gradient(180deg,#2a1f55 0%,#8a3b6e 40%,#f2643d 76%,#ffb45e 100%)}
.sky.night{background:linear-gradient(180deg,#05070f 0%,#0d1430 60%,#1a2147 100%)}
.stars{position:absolute;inset:0;opacity:0;background-image:radial-gradient(1.4px 1.4px at 12% 18%,#fff,transparent),radial-gradient(1.2px 1.2px at 28% 9%,#fff,transparent),radial-gradient(1.6px 1.6px at 44% 22%,#fff,transparent),radial-gradient(1.2px 1.2px at 61% 12%,#fff,transparent),radial-gradient(1.5px 1.5px at 76% 26%,#fff,transparent),radial-gradient(1.2px 1.2px at 88% 14%,#fff,transparent),radial-gradient(1.3px 1.3px at 19% 36%,#fff,transparent),radial-gradient(1.2px 1.2px at 68% 38%,#fff,transparent),radial-gradient(1.4px 1.4px at 93% 40%,#fff,transparent),radial-gradient(1.1px 1.1px at 36% 44%,#fff,transparent),radial-gradient(1.3px 1.3px at 52% 6%,#fff,transparent),radial-gradient(1.2px 1.2px at 6% 48%,#fff,transparent)}
.sun{position:absolute;left:0;top:0;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:radial-gradient(circle,#fff 0%,#ffe9a8 38%,#ffc65c 62%,rgba(255,190,80,0) 72%);box-shadow:0 0 90px 40px rgba(255,205,110,.45);will-change:transform}
.moon{position:absolute;right:14%;top:16%;width:64px;height:64px;border-radius:50%;background:#f3f1e6;box-shadow:0 0 40px 10px rgba(243,241,230,.25);opacity:0}
.moon:after{content:"";position:absolute;right:-6px;top:-4px;width:56px;height:56px;border-radius:50%;background:#0b1026}
.day-sticky{--g:38%}
.ground{position:absolute;left:0;right:0;bottom:0;height:var(--g);background:#0a0e1c}
.land{position:absolute;left:0;right:0;bottom:calc(var(--g) - 2px);width:100%;height:34vh}
.land .win{fill:#1b2233;transition:fill .2s}
.day-copy{position:absolute;left:0;right:0;bottom:0;height:var(--g);z-index:3}
.moment{position:absolute;inset:0;margin:0 auto;max-width:820px;text-align:center;opacity:0;will-change:opacity,transform;padding:0 26px 10px;display:flex;flex-direction:column;justify-content:center}
.moment .time{font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;opacity:.85;margin-bottom:12px;display:block}
.moment .time{color:#ffb9a0}
.moment h2{font-size:clamp(1.7rem,4.2vw,3.1rem);margin-bottom:.3em}
.moment p{font-size:clamp(1rem,1.5vw,1.18rem);color:rgba(255,255,255,.8);max-width:54ch;margin:0 auto}
.day-dots{position:absolute;right:22px;top:34%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px;z-index:4}
.day-dots i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.35);transition:all .3s}
.day-dots i.on{background:#fff;transform:scale(1.5)}
.day-title{position:absolute;left:22px;top:92px;z-index:4;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;opacity:.85}
@media (max-width:600px){.day-sticky{--g:44%}.land{height:28vh}.sun{width:84px;height:84px;margin:-42px 0 0 -42px}.day-dots{right:12px;top:30%}.moon{width:44px;height:44px}.moon:after{width:38px;height:38px}}
/* reduced motion: show as simple stacked panel */
.day.static{height:auto}
.day.static .day-sticky{position:relative;height:auto}
.day.static .sky,.day.static .sun,.day.static .day-dots,.day.static .land,.day.static .ground,.day.static .stars,.day.static .moon{display:none}
.day.static .day-copy{position:relative;height:auto;display:grid;gap:44px;padding:120px 0 70px}
.day.static .moment{position:relative;inset:auto;opacity:1;transform:none}

/* sections */
section{padding:clamp(70px,10vw,130px) 0}
.cream{background:var(--cream)}
.dark{background:var(--night);color:#fff}
.dark .lead,.dark .muted{color:rgba(255,255,255,.74)}
.head{max-width:800px;margin:0 0 54px}
.head.center{margin-left:auto;margin-right:auto}
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grid2{display:grid;grid-template-columns:repeat(2,1fr);gap:24px}
.grid4{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
@media (max-width:980px){.grid3,.grid4{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.grid3,.grid4,.grid2{grid-template-columns:1fr}}

/* reveal on scroll */
.rv{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.rv.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){.rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* benefit cards */
.benefit{border-radius:var(--radius);padding:34px 30px;background:#fff;border:1px solid var(--line);position:relative;overflow:hidden;transition:transform .3s,box-shadow .3s;height:100%}
.benefit:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.benefit .big{font-family:var(--display);font-size:3.4rem;font-weight:700;line-height:1;color:var(--red-soft);position:absolute;right:20px;top:14px;-webkit-text-stroke:1px #f1caca}
.benefit h3{font-size:1.45rem;margin-top:46px}
.icon{width:50px;height:50px;border-radius:14px;background:var(--red-soft);display:flex;align-items:center;justify-content:center}
.icon svg{width:26px;height:26px;stroke:var(--red);fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}

/* mystery / unlock */
.unlock{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
@media (max-width:900px){.unlock{grid-template-columns:1fr;gap:36px}}
.vault{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.lock{border-radius:16px;padding:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);position:relative;overflow:hidden}
.lock .lbl{font-size:.74rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:rgba(255,255,255,.7)}
.lock .bars{margin-top:16px;display:grid;gap:8px;filter:blur(5px)}
.lock .bars i{height:12px;border-radius:6px;background:linear-gradient(90deg,#ffd9a8,#e2303a)}
.lock .bars i:nth-child(2){width:70%}.lock .bars i:nth-child(3){width:45%}
.lock .key{position:absolute;right:16px;top:16px;width:30px;height:30px;border-radius:50%;background:rgba(255,255,255,.12);display:flex;align-items:center;justify-content:center}
.lock .key svg{width:15px;height:15px;stroke:#fff;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lock:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.10) 50%,transparent 70%);transform:translateX(-100%);animation:sheen 4s infinite}
.lock:nth-child(2):after{animation-delay:.6s}.lock:nth-child(3):after{animation-delay:1.2s}.lock:nth-child(4):after{animation-delay:1.8s}
@keyframes sheen{0%,60%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@media (prefers-reduced-motion:reduce){.lock:after,.scrollcue i{animation:none}}

/* split home / business */
.split{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:800px){.split{grid-template-columns:1fr}}
.panel{border-radius:24px;padding:44px 38px;min-height:340px;display:flex;flex-direction:column;justify-content:flex-end;color:#fff;position:relative;overflow:hidden;text-decoration:none;transition:transform .3s}
.panel:hover{transform:translateY(-6px)}
.panel.home{background:linear-gradient(160deg,#ffb36b 0%,#e2303a 45%,#5a1230 100%)}
.panel.biz{background:linear-gradient(160deg,#3d4a7a 0%,#1a2147 55%,#0b0d14 100%)}
.panel h3{font-size:1.9rem;color:#fff}
.panel p{color:rgba(255,255,255,.88);max-width:40ch}
.panel .tagx{position:absolute;top:30px;left:38px;font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;font-weight:700;opacity:.85}

/* video cards */
.vcard{display:block;border-radius:var(--radius);overflow:hidden;background:#fff;border:1px solid var(--line);text-decoration:none;color:var(--ink);transition:transform .3s,box-shadow .3s;height:100%}
.vcard:hover{transform:translateY(-6px);box-shadow:var(--shadow)}
.vthumb{aspect-ratio:16/9;background:linear-gradient(135deg,#1a2147,#5a1230 60%,#e2303a);position:relative;display:flex;align-items:center;justify-content:center}
.play{width:62px;height:62px;border-radius:50%;background:rgba(255,255,255,.95);display:flex;align-items:center;justify-content:center;box-shadow:0 10px 30px rgba(0,0,0,.3);transition:transform .2s}
.play:after{content:"";border-left:18px solid var(--red);border-top:11px solid transparent;border-bottom:11px solid transparent;margin-left:5px}
.vcard:hover .play,.video:hover .play{transform:scale(1.08)}
.vcard .body{padding:22px}
.vcard .q{font-family:var(--display);font-weight:700;font-size:1.12rem;line-height:1.3;margin-bottom:6px}
.video{aspect-ratio:16/9;border-radius:22px;overflow:hidden;position:relative;background:linear-gradient(135deg,#1a2147,#5a1230 60%,#e2303a);display:flex;align-items:center;justify-content:center;flex-direction:column;gap:16px;color:#fff;box-shadow:var(--shadow);cursor:pointer}
.video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.video .cap{font-weight:600;font-size:.95rem;opacity:.92;text-align:center;padding:0 20px}
.video .soon{position:absolute;top:16px;left:16px;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;background:rgba(0,0,0,.35);padding:6px 12px;border-radius:999px}
.video.small{border-radius:14px;margin:14px 0 4px;max-width:520px}

/* steps */
.stepx{padding:30px;border-radius:var(--radius);background:#fff;border:1px solid var(--line);height:100%}
.num{font-family:var(--display);font-weight:700;font-size:.85rem;color:var(--red);letter-spacing:.14em;margin-bottom:18px;display:block}

/* form */
.formwrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center}
@media (max-width:900px){.formwrap{grid-template-columns:1fr;gap:34px}}
.card{background:#fff;border:1px solid var(--line);border-radius:24px;box-shadow:var(--shadow);padding:34px;color:var(--ink)}
.formcard h3{font-size:1.45rem;margin-bottom:.25em}
.progress{height:5px;background:var(--line);border-radius:99px;margin:18px 0 24px;overflow:hidden}
.progress span{display:block;height:100%;width:16%;background:linear-gradient(90deg,var(--red),#ff8a5c);border-radius:99px;transition:width .4s}
.step{display:none}
.step.active{display:block;animation:fade .35s ease}
@keyframes fade{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}
.q{font-weight:700;margin:0 0 14px;font-size:1.1rem;font-family:var(--display);letter-spacing:-.01em}
.choices{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.choice{border:1.5px solid var(--line);border-radius:14px;padding:15px 16px;background:#fff;text-align:left;font-size:.98rem;font-weight:600;cursor:pointer;font-family:var(--font);color:var(--ink);transition:border-color .15s,background .15s,transform .15s}
.choice:hover,.choice.sel{border-color:var(--red);background:var(--red-soft);transform:translateY(-1px)}
label.f{display:block;font-weight:600;font-size:.88rem;margin:12px 0 6px}
input.in{width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:12px;font-size:1rem;font-family:var(--font);background:#fff}
input.in:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 4px rgba(191,25,34,.12)}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
@media (max-width:520px){.row2,.choices{grid-template-columns:1fr}.card{padding:24px}}
.consent{display:flex;gap:10px;align-items:flex-start;margin:16px 0 14px;font-size:.76rem;line-height:1.45;color:var(--ink-2)}
.consent input{margin-top:3px;width:18px;height:18px;flex:0 0 auto;accent-color:var(--red)}
.back{background:none;border:0;color:var(--muted);font-weight:600;cursor:pointer;margin-top:14px;padding:0;font-family:var(--font);font-size:.9rem}
.err{color:var(--red);font-size:.85rem;margin-top:8px;display:none}
.note{background:var(--cream);border-radius:12px;padding:14px;font-size:.92rem;color:var(--ink-2)}
.secure{text-align:center;color:var(--muted);font-size:.8rem;margin-top:12px}
.checks{list-style:none;padding:0;margin:24px 0 0}
.checks li{padding-left:32px;position:relative;margin:.7em 0}
.checks li:before{content:"";position:absolute;left:0;top:.3em;width:20px;height:20px;border-radius:50%;background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}

/* faq */
.faq details{border-bottom:1px solid var(--line);padding:22px 0}
.faq summary{cursor:pointer;font-weight:700;font-family:var(--display);font-size:1.08rem;list-style:none;display:flex;justify-content:space-between;gap:16px;letter-spacing:-.01em}
.faq summary::-webkit-details-marker{display:none}
.faq summary:after{content:"+";color:var(--red);font-size:1.5rem;line-height:1;transition:transform .2s}
.faq details[open] summary:after{transform:rotate(45deg)}
.faq details p{margin:12px 0 0;color:var(--ink-2);max-width:70ch}

/* cta band */
.band{background:linear-gradient(135deg,#e2303a,#8f121a 60%,#5a1230);color:#fff;border-radius:28px;padding:clamp(36px,6vw,70px);display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;position:relative;overflow:hidden}
.band h2{margin:0;max-width:18ch}
.band p{margin:.6em 0 0;opacity:.9}

/* sub pages */
.subhero{background:radial-gradient(120% 120% at 80% -10%,#5a1230 0%,#160b1c 45%,#0b0d14 100%);color:#fff;padding:150px 0 80px}
.subhero h1{font-size:clamp(2.1rem,4.6vw,3.6rem);max-width:18ch}
.subhero .lead{color:rgba(255,255,255,.82)}
.subhero .eyebrow{color:#ffb9a0}
.two{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center}
@media (max-width:900px){.two{grid-template-columns:1fr;gap:30px}.subhero{padding:120px 0 60px}}
.prose{max-width:760px}
.prose h2{font-size:clamp(1.5rem,2.6vw,2rem);margin-top:1.8em}
.prose p,.prose li{color:var(--ink-2)}
.prose ul{padding-left:1.2em}
.tbl{width:100%;border-collapse:collapse;margin:20px 0;font-size:.95rem}
.tbl th,.tbl td{padding:14px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl th{font-family:var(--display);font-size:.9rem}
.tbl-wrap{overflow-x:auto}
.more a{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border:1px solid var(--line);border-radius:16px;text-decoration:none;color:var(--ink);font-weight:700;font-family:var(--display);background:#fff;transition:border-color .2s,transform .2s}
.more a:hover{border-color:var(--red);transform:translateX(4px)}
.more a span{color:var(--red)}

/* footer */
footer{background:var(--night);color:#a9a9b2;padding:64px 0 110px;font-size:.9rem}
footer .grid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:34px}
footer img{height:32px;width:auto;margin-bottom:16px}
footer a{color:#e9e9ee;text-decoration:none}
footer a:hover{text-decoration:underline}
footer h4{color:#fff;font-size:.82rem;margin:0 0 12px;font-family:var(--display);letter-spacing:.08em;text-transform:uppercase}
footer ul{list-style:none;padding:0;margin:0}
footer li{margin:8px 0}
.legal{border-top:1px solid #23252f;margin-top:36px;padding-top:20px;font-size:.78rem;color:#8a8a94}
@media (max-width:800px){footer .grid{grid-template-columns:1fr 1fr}}

/* mobile sticky CTA */
.sticky-cta{position:fixed;left:12px;right:12px;bottom:12px;z-index:40;display:none;transform:translateY(220%);transition:transform .35s}
.sticky-cta.show{transform:none}
@media (max-width:800px){.sticky-cta{display:block}}

/* legal + thanks */
.doc{max-width:820px;margin:0 auto;padding:130px 22px 80px}
.doc h1{font-size:2.3rem}.doc h2{font-size:1.25rem;margin-top:2em}
.doc p,.doc li{color:var(--ink-2)}
.thanks{min-height:100svh;display:flex;align-items:center;padding:120px 0 60px;background:var(--cream)}
.thanks .card{max-width:640px;margin:0 auto;text-align:center;padding:48px}
.bigcheck{width:74px;height:74px;border-radius:50%;background:var(--red);margin:0 auto 22px;display:flex;align-items:center;justify-content:center}

@media (max-width:900px){.formwrap .checks{display:none}}

/* ===================== v3: cinematic home ===================== */
.top{transition:background .3s,box-shadow .3s,color .3s,transform .35s}
.top.up{transform:translateY(-100%)}
.top.open{transform:none}

/* video hero */
.vhero{min-height:100svh;align-items:flex-end;background:#0b0d14}
.vhero .bgv{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vhero .shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,14,.55) 0%,rgba(8,9,14,.15) 30%,rgba(8,9,14,.55) 62%,rgba(8,9,14,.92) 100%),linear-gradient(90deg,rgba(8,9,14,.55),rgba(8,9,14,0) 65%)}
.vhero:after{display:none}
.vhero .wrap{padding-top:120px;padding-bottom:56px}
.vhero h1{font-size:clamp(2.6rem,6.4vw,5.2rem);max-width:14ch;letter-spacing:-.035em}
.vhero .lead{font-size:clamp(1.08rem,1.6vw,1.35rem);color:rgba(255,255,255,.9);max-width:48ch}
.vhero .zipbar{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.34)}
.trust{display:flex;flex-wrap:wrap;gap:12px 30px;margin-top:38px;padding-top:24px;border-top:1px solid rgba(255,255,255,.2);font-size:.9rem;font-weight:600;color:rgba(255,255,255,.9)}
.trust span{display:inline-flex;align-items:center;gap:9px}
.trust span:before{content:"";width:18px;height:18px;border-radius:50%;background:rgba(255,255,255,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/11px no-repeat}
@media (max-width:600px){.vhero .wrap{padding-bottom:34px}.trust{gap:10px 18px;font-size:.82rem;margin-top:26px;padding-top:18px}}

/* marquee */
.marquee{overflow:hidden;background:var(--red);color:#fff;padding:18px 0;font-family:var(--display);font-weight:700;font-size:clamp(.95rem,1.4vw,1.15rem);letter-spacing:-.01em}
.marquee .track{display:flex;gap:0;white-space:nowrap;width:max-content;animation:marq 46s linear infinite}
.marquee span{padding:0 28px;display:inline-flex;align-items:center;gap:56px}
.marquee span:after{content:"";width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.6)}
@keyframes marq{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.marquee .track{animation:none}}

/* pillars */
.pillar{border-radius:22px;padding:38px 32px;background:var(--cream);height:100%;transition:transform .3s,box-shadow .3s,background .3s;border:1px solid transparent}
.pillar:hover{transform:translateY(-6px);background:#fff;border-color:var(--line);box-shadow:var(--shadow)}
.pillar .icon{width:58px;height:58px;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(18,18,18,.07)}
.pillar .icon svg{width:28px;height:28px}
.pillar h3{font-size:1.5rem;margin-top:26px}
.pillar p{color:var(--ink-2);margin:0}

/* scroll story */
.story{position:relative;height:440vh;background:#000;padding:0}
.story-sticky{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden;color:#fff}
.scene{position:absolute;inset:0;opacity:0;will-change:opacity}
.scene:first-child{opacity:1}
.scene .m{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scene:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.35) 0%,rgba(0,0,0,0) 28%,rgba(0,0,0,.2) 55%,rgba(0,0,0,.86) 100%)}
.scene .cap{position:absolute;left:0;right:0;bottom:11%;z-index:2}
.scene .cap .in{max-width:720px}
.scene .time{font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;font-weight:700;color:#ffd9a8;display:block;margin-bottom:14px}
.scene h2{font-size:clamp(2rem,5.4vw,4.2rem);letter-spacing:-.03em;margin-bottom:.25em}
.scene p{font-size:clamp(1.02rem,1.5vw,1.25rem);color:rgba(255,255,255,.88);max-width:52ch;margin:0}
.story-ui{position:absolute;left:0;right:0;bottom:4.5%;z-index:3}
.story-ui .wrap{display:flex;align-items:center;gap:18px}
.story-count{font-family:var(--display);font-weight:700;font-size:.85rem;letter-spacing:.1em;min-width:58px}
.story-bar{flex:1;height:2px;background:rgba(255,255,255,.25);border-radius:2px;overflow:hidden}
.story-bar span{display:block;height:100%;width:0;background:#fff}
.story-tag{position:absolute;left:0;right:0;top:96px;z-index:3;font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;font-weight:700;opacity:.9}
.story.static{height:auto}
.story.static .story-sticky{position:relative;height:auto}
.story.static .scene{position:relative;opacity:1;min-height:78vh}
.story.static .story-ui,.story.static .story-tag{display:none}

/* calculator */
.calc{display:grid;grid-template-columns:.95fr 1.05fr;gap:64px;align-items:center}
@media (max-width:900px){.calc{grid-template-columns:1fr;gap:34px}}
.calc-card{background:#fff;border:1px solid var(--line);border-radius:26px;box-shadow:var(--shadow);padding:clamp(24px,3.4vw,40px)}
.calc-row{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:600;font-size:.95rem}
.calc-row output{font-family:var(--display);font-weight:700;font-size:1.25rem;color:var(--ink)}
input[type=range].rng{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:99px;background:linear-gradient(90deg,var(--red) var(--p,50%),var(--line) var(--p,50%));margin:16px 0 26px;outline:none}
input[type=range].rng::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid var(--red);box-shadow:0 4px 12px rgba(191,25,34,.3);cursor:pointer}
input[type=range].rng::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--red);box-shadow:0 4px 12px rgba(191,25,34,.3);cursor:pointer}
input[type=range].rng:focus-visible{box-shadow:0 0 0 4px rgba(191,25,34,.18)}
.calc-out{border-top:1px solid var(--line);margin-top:6px;padding-top:24px}
.calc-out .lbl{font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.calc-big{font-family:var(--display);font-weight:700;font-size:clamp(2.6rem,6vw,4.2rem);letter-spacing:-.04em;line-height:1.05;color:var(--ink);margin:6px 0 18px;font-variant-numeric:tabular-nums}
.calc-two{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:22px}
.calc-two div{background:var(--cream);border-radius:14px;padding:16px}
.calc-two b{display:block;font-family:var(--display);font-size:1.35rem;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.calc-two small{color:var(--muted);font-size:.8rem;line-height:1.35;display:block;margin-top:2px}

/* lifestyle split */
.life{display:grid;grid-template-columns:1.1fr .9fr;gap:70px;align-items:center}
@media (max-width:900px){.life{grid-template-columns:1fr;gap:40px}}
.collage{position:relative;padding:0 12% 14% 0}
.collage .a{border-radius:24px;box-shadow:var(--shadow);aspect-ratio:4/3;object-fit:cover;width:100%}
.collage .b{position:absolute;right:0;bottom:0;width:46%;aspect-ratio:1/1;object-fit:cover;border-radius:20px;border:6px solid #fff;box-shadow:var(--shadow)}
.life h2 .swap{display:block;color:var(--red);min-height:1.15em}
.life h2 .swap span{display:inline-block;transition:opacity .45s,transform .45s}
.life h2 .swap span.out{opacity:0;transform:translateY(14px)}
@media (max-width:700px){.life h2 .swap{min-height:2.3em}}
.quote{border-left:3px solid var(--red);padding-left:18px;margin-top:26px;font-family:var(--display);font-weight:700;font-size:1.15rem;letter-spacing:-.01em}

/* guide */
.guide{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:end;margin-bottom:54px}
@media (max-width:900px){.guide{grid-template-columns:1fr;gap:18px}}
.tcard{border-radius:var(--radius);overflow:hidden;background:#fff;border:1px solid var(--line)}
.tcard .video{border-radius:0;box-shadow:none}
.tcard .body{padding:18px 20px;font-weight:600}
.tcard .body small{display:block;color:var(--muted);font-weight:500}

/* photo panel */
.panel.home{background:linear-gradient(180deg,rgba(11,13,20,.05) 0%,rgba(11,13,20,.82) 78%),url(media/living-tall.jpg) center 30%/cover}

/* v3 refinements */
.calc>*,.life>*,.formwrap>*,.unlock>*,.guide>*,.two>*{min-width:0}
.calc-row label{min-width:0}
.vhero .zipbar{max-width:600px}
.scene .cap .in{max-width:900px}
.scene h2{font-size:clamp(2rem,5vw,3.9rem)}
.scene:after{background:linear-gradient(180deg,rgba(0,0,0,.4) 0%,rgba(0,0,0,0) 26%,rgba(0,0,0,.12) 48%,rgba(0,0,0,.9) 100%)}
.scene .m.low{object-position:center 78%}
.panel{min-height:440px;padding-top:84px}
@media (max-width:640px){.panel{min-height:380px}.panel h3{font-size:1.6rem}}
.vthumb{background-size:cover;background-position:center}

/* ===================== v4: old logo, hero reel, work gallery ===================== */
footer img{height:56px}
.vhero .bgv{opacity:0;transition:opacity 1.4s ease}
.vhero .bgv.on{opacity:1}
.work{padding-bottom:clamp(60px,8vw,100px);overflow:hidden}
.work .head{margin-bottom:40px}
.feature{margin:0 0 22px;position:relative;border-radius:24px;overflow:hidden;aspect-ratio:21/9;background:#161a26}
.feature img{position:absolute;left:0;top:0;width:100%;height:120%;object-fit:cover;object-position:center 45%;will-change:transform}
.feature figcaption,.shot figcaption{position:absolute;left:0;right:0;bottom:0;padding:44px 20px 16px;font-weight:600;font-size:.92rem;color:#fff;background:linear-gradient(180deg,rgba(0,0,0,0),rgba(0,0,0,.72))}
.feature figcaption{font-size:1rem;padding:60px 26px 22px}
@media (max-width:700px){.feature{aspect-ratio:4/3;border-radius:18px}}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:4px max(22px,calc((100vw - var(--max))/2 + 22px)) 8px;scroll-padding-left:max(22px,calc((100vw - var(--max))/2 + 22px));cursor:grab;outline:none}
.rail::-webkit-scrollbar{display:none}
.rail.drag{scroll-snap-type:none;cursor:grabbing;scroll-behavior:auto}
.rail:focus-visible{box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}
.shot{position:relative;flex:0 0 auto;width:clamp(260px,74vw,440px);aspect-ratio:4/3;margin:0;border-radius:18px;overflow:hidden;scroll-snap-align:start;background:#161a26}
.shot img{width:100%;height:100%;object-fit:cover;user-select:none;-webkit-user-drag:none;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.shot:hover img{transform:scale(1.04)}
.rail-ui{display:flex;align-items:center;gap:14px;margin-top:26px}
.rail-bar{flex:1;height:2px;background:rgba(255,255,255,.2);border-radius:2px;overflow:hidden}
.rail-bar span{display:block;height:100%;width:12%;background:#fff;border-radius:2px;transition:width .15s linear}
.rail-btn{width:46px;height:46px;border-radius:50%;border:1.5px solid rgba(255,255,255,.45);background:transparent;color:#fff;font-size:1.1rem;cursor:pointer;transition:background .2s,opacity .2s;font-family:var(--font)}
.rail-btn:hover{background:rgba(255,255,255,.14)}
.rail-btn:disabled{opacity:.3;cursor:default}
@media (max-width:700px){.rail-btn{display:none}}
.life .lead strong{display:block;color:var(--ink);font-family:var(--display);font-size:1.2em;letter-spacing:-.01em;margin-bottom:.25em}
.inl{margin:34px 0 0;border-radius:18px;overflow:hidden;position:relative}
.inl img{width:100%;display:block}
.inl figcaption{font-size:.88rem;color:var(--muted);padding:10px 2px 0}

/* ===================== v5: founder's bill proof ===================== */
.bills{display:grid;grid-template-columns:1fr 1fr;gap:24px}
@media (max-width:800px){.bills{grid-template-columns:1fr;gap:34px}}
.bill{margin:0;position:relative;background:#fff;border:1px solid var(--line);border-radius:20px;padding:34px 18px 14px;box-shadow:var(--shadow)}
.bill img{width:100%;height:auto;display:block}
.bill .tag{position:absolute;left:18px;top:-14px;background:var(--ink);color:#fff;font-size:.74rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:7px 14px;border-radius:999px}
.bill.after{border-color:var(--red)}
.bill.after .tag{background:var(--red)}
.pstats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
@media (max-width:800px){.pstats{grid-template-columns:1fr}}
.pstat{background:var(--cream);border-radius:16px;padding:20px 22px}
.pstat .lbl{font-size:.76rem;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--muted)}
.pv{display:flex;align-items:baseline;gap:10px;margin-top:8px;font-family:var(--display);font-variant-numeric:tabular-nums;flex-wrap:wrap}
.pv .was{color:var(--muted);font-weight:600;font-size:1.05rem}
.pv .arrow{color:var(--muted)}
.pv b{font-size:1.6rem;letter-spacing:-.02em}
.pnotes{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:28px;font-size:.92rem;color:var(--ink-2)}
.pnotes p{margin:0}
@media (max-width:800px){.pnotes{grid-template-columns:1fr;gap:14px}}

/* ===================== v6: hero turns into the report form after ZIP ===================== */
.hafter{display:none}
.hafter .h1{font-family:var(--display);font-weight:700;letter-spacing:-.02em;line-height:1.05;font-size:clamp(1.9rem,4.2vw,3.3rem);margin:.25em 0 0}
.hafter .hzip{color:#fff}
.hlist{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px;color:rgba(255,255,255,.9);font-size:1rem}
.hlist li{position:relative;padding-left:30px}
.hlist li:before{content:"";position:absolute;left:0;top:.2em;width:18px;height:18px;border-radius:50%;background:var(--red)}
.hlist li:after{content:"";position:absolute;left:6px;top:.42em;width:5px;height:9px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.hform{display:none}
.vhero.zip-on .hbefore{display:none}
.vhero.zip-on .hafter{display:block;animation:hin .5s both}
.vhero.zip-on .hform{display:block;animation:hin .5s .08s both}
.vhero.zip-on .hgrid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,480px);gap:48px;align-items:center}
.vhero.zip-on .hform .formcard{box-shadow:0 30px 80px rgba(0,0,0,.45)}
@keyframes hin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.vhero.zip-on .hafter,.vhero.zip-on .hform{animation:none}}
@media (max-width:900px){
 .vhero.zip-on .hgrid{grid-template-columns:minmax(0,1fr);gap:20px;padding-top:84px;padding-bottom:36px}
 .vhero.zip-on{align-items:flex-start}
 .vhero.zip-on .hafter .h1{font-size:1.65rem}
 .vhero.zip-on .hafter .lead{display:none}
 .vhero.zip-on .hlist{display:none}
 .vhero.zip-on .hform .formcard{padding:20px}
 .vhero.zip-on .hform .formcard h3{font-size:1.15rem}
}
#report.moved{display:none}

/* v7: steady hero copy while the form changes height; thank-you shows next steps */
.vhero.zip-on{align-items:flex-start}
@media (min-width:901px){.vhero.zip-on .hgrid{align-items:start;padding-top:clamp(120px,19vh,200px)}}
.thanks .card{max-width:760px}
.next{text-align:left;margin-top:30px;padding-top:26px;border-top:1px solid var(--line)}
.next h2{font-size:1.3rem;margin:0 0 16px}
.nsteps{list-style:none;counter-reset:n;padding:0;margin:22px 0 0;display:grid;gap:14px}
.nsteps li{counter-increment:n;position:relative;padding-left:44px;font-size:.96rem;color:var(--ink-2);line-height:1.5}
.nsteps li:before{content:counter(n);position:absolute;left:0;top:0;width:30px;height:30px;border-radius:50%;background:var(--red);color:#fff;font-weight:700;font-size:.85rem;display:flex;align-items:center;justify-content:center}
.nsteps strong{color:var(--ink)}
.next + p.small{margin-top:22px}
/* v7: work rail starts centered (photos on both sides) and a tap puts a photo in the big frame */
.shot{scroll-snap-align:center;cursor:pointer}
.shot:after{content:"";position:absolute;inset:0;border-radius:18px;border:2px solid transparent;transition:border-color .25s;pointer-events:none}
.shot.sel:after{border-color:#fff}
.shot:focus-visible:after{border-color:rgba(255,255,255,.6)}
.feature img{transition:opacity .28s}
.feature.swap img{opacity:0}
