/* Porchlight Sites — brand site. Night lawn, warm porch light. */
@font-face{font-family:'Bricolage';src:url(fonts/bricolage-grotesque-800.woff2) format('woff2');font-weight:800;font-display:swap}
@font-face{font-family:'Bricolage';src:url(fonts/bricolage-grotesque-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/manrope-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/manrope-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'Manrope';src:url(fonts/manrope-800.woff2) format('woff2');font-weight:800;font-display:swap}
:root{
  --night:#070d0b; --night2:#0c1612; --moss:#12241b; --leaf:#7fae4e; --leaf2:#b9d98a;
  --amber:#ffb547; --amber2:#ffd48a; --ember:#ff8a3d; --paper:#f4f1ea; --mute:#a9b4ac; --line:rgba(255,236,200,.14);
  --hf:'Bricolage','Arial Narrow',system-ui,sans-serif; --bf:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --r:22px; --pad:clamp(20px,5vw,72px);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:auto}
html.lenis,html.lenis body{height:auto}
.lenis.lenis-smooth{scroll-behavior:auto!important}
body{margin:0;background:var(--night);color:var(--paper);font:400 17px/1.6 var(--bf);overflow-x:clip;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:var(--hf);font-weight:800;letter-spacing:-.035em;line-height:.95;margin:0}
p{margin:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--amber);color:#111;padding:8px 14px;border-radius:8px}
.skip:focus{left:8px}
:focus-visible{outline:2px solid var(--amber);outline-offset:3px;border-radius:6px}
.wrap{max-width:1280px;margin:0 auto;padding:0 var(--pad)}
.eyebrow{display:inline-flex;align-items:center;gap:10px;font:800 12px/1 var(--bf);letter-spacing:.18em;text-transform:uppercase;color:var(--amber2)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px rgba(255,181,71,.18),0 0 18px 4px rgba(255,181,71,.65);animation:pulse 2.6s ease-in-out infinite}
@keyframes pulse{50%{box-shadow:0 0 0 7px rgba(255,181,71,.06),0 0 26px 8px rgba(255,181,71,.4)}}

/* buttons */
.btn{--bg:var(--amber);position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 26px;border-radius:999px;background:var(--bg);color:#1a1206;font:800 16px/1 var(--bf);text-decoration:none;border:0;cursor:pointer;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s;box-shadow:0 10px 40px -8px rgba(255,170,60,.65),inset 0 1px 0 rgba(255,255,255,.5);white-space:nowrap}
.btn:hover{box-shadow:0 14px 56px -6px rgba(255,170,60,.85),inset 0 1px 0 rgba(255,255,255,.6)}
.btn svg{width:18px;height:18px;flex:none}
.btn.ghost{background:rgba(255,255,255,.06);color:var(--paper);box-shadow:inset 0 0 0 1.5px rgba(255,236,200,.28);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.btn.ghost:hover{box-shadow:inset 0 0 0 1.5px rgba(255,236,200,.6)}
.btn.sm{min-height:42px;padding:0 18px;font-size:14px}
.btn .price{font-weight:600;opacity:.75}

/* header */
.top{position:fixed;inset:0 0 auto 0;z-index:50;transition:background .4s,box-shadow .4s,backdrop-filter .4s}
.top.solid{background:rgba(7,13,11,.72);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 1px 0 var(--line)}
.nav{display:flex;align-items:center;gap:28px;height:72px;max-width:1380px;margin:0 auto;padding:0 var(--pad)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:800 19px/1 var(--hf);letter-spacing:-.02em}
.brand svg{width:30px;height:30px;flex:none}
.nav .links{display:flex;gap:26px;margin-left:auto}
.nav .links a{text-decoration:none;font-weight:600;font-size:15px;color:#d8dcd6;opacity:.85}
.nav .links a:hover{opacity:1;color:#fff}
@media (max-width:900px){.nav .links{display:none}.nav .btn{margin-left:auto}.nav{height:62px}}

/* HERO */
.hero{position:relative;height:100vh;height:100svh;min-height:600px;overflow:hidden;isolation:isolate;
  background:
   radial-gradient(120% 60% at 70% 62%,rgba(255,160,70,.28),transparent 60%),
   repeating-linear-gradient(90deg,rgba(130,180,80,.10) 0 8vw,rgba(20,40,20,.0) 8vw 16vw),
   linear-gradient(180deg,#0a1222 0%,#1a1d2e 30%,#4a3036 47%,#1b2c17 54%,#0b170d 100%)}
.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;opacity:0;transition:opacity 1.4s ease}
.hero.gl canvas{opacity:1}
.hero .shade{position:absolute;inset:0;z-index:1;pointer-events:none;background:
  linear-gradient(90deg,rgba(5,10,8,.86) 0%,rgba(5,10,8,.55) 38%,rgba(5,10,8,0) 66%),
  linear-gradient(180deg,rgba(5,10,8,.65) 0%,rgba(5,10,8,0) 22%,rgba(5,10,8,0) 70%,rgba(7,13,11,1) 100%)}
.grain{position:absolute;inset:-50%;z-index:2;pointer-events:none;opacity:.07;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");animation:grain 1.2s steps(6) infinite}
@keyframes grain{0%{transform:translate(0,0)}20%{transform:translate(-3%,2%)}40%{transform:translate(2%,-3%)}60%{transform:translate(-2%,-1%)}80%{transform:translate(3%,3%)}100%{transform:translate(0,0)}}
.stage{position:absolute;z-index:3}
.stage1{left:var(--pad);top:50%;transform:translateY(-46%);max-width:min(640px,52vw)}
.h-title{font-size:clamp(46px,6.6vw,104px);margin:22px 0 22px;text-wrap:balance}
.h-title .ln{display:block;overflow:hidden;padding-bottom:.06em}
.h-title .ln>span{display:inline-block}
.h-title em{font-style:normal;color:var(--amber)}
.h-sub{font-size:clamp(17px,1.35vw,20px);color:#dfe4dc;max-width:520px}
.h-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.h-meta{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:22px;font-size:14px;color:var(--mute)}
.h-meta span{display:inline-flex;align-items:center;gap:7px}
.h-meta svg{width:15px;height:15px;color:var(--leaf2)}
.stage2,.stage3{inset:0;display:grid;place-items:center;text-align:center;padding:0 var(--pad);visibility:hidden;opacity:0;pointer-events:none}
.stage2 h2,.stage3 h2{font-size:clamp(44px,8vw,132px);text-shadow:0 10px 60px rgba(0,0,0,.55)}
.stage2 h2 span{color:var(--amber)}
.stage3 .inner{pointer-events:auto}
.stage3 .tags{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin:26px 0 30px}
.stage3 .tags b{font:800 15px/1 var(--bf);padding:12px 18px;border-radius:999px;background:rgba(10,18,14,.6);box-shadow:inset 0 0 0 1px var(--line);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.stage3 .tags b em{font-style:normal;color:var(--amber)}
/* device stack (CSS 3D) */
.devices{position:absolute;z-index:3;right:calc(var(--pad) - 10px);top:52%;width:min(46vw,700px);aspect-ratio:16/11;transform:translateY(-50%);perspective:1700px;pointer-events:none}
.dv{position:absolute;transform-style:preserve-3d;will-change:transform}
.dv .scr{position:relative;overflow:hidden;border-radius:14px;background:#0d1412;box-shadow:0 50px 90px -30px rgba(0,0,0,.85),0 0 0 1px rgba(255,236,200,.16),0 0 80px -20px rgba(255,170,60,.25)}
.dv .bar{display:flex;align-items:center;gap:6px;height:26px;padding:0 12px;background:#18201d;border-bottom:1px solid rgba(255,255,255,.06)}
.dv .bar i{width:8px;height:8px;border-radius:50%;background:#3a4440}
.dv .bar span{margin-left:10px;font:600 10.5px/1 var(--bf);color:#8d9993;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dv img{width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;object-position:top}
.dv.b1{width:86%;left:2%;top:6%;transform:rotateY(-20deg) rotateX(8deg) translateZ(0)}
.dv.b2{width:70%;left:22%;top:-6%;transform:rotateY(-20deg) rotateX(8deg) translateZ(-180px);filter:brightness(.7)}
.dv.ph{width:24%;right:-2%;top:30%;transform:rotateY(-20deg) rotateX(8deg) translateZ(140px)}
.dv.ph .scr{border-radius:26px;border:6px solid #111816}
.dv.ph img{aspect-ratio:9/19.5}
.dv .glow{position:absolute;inset:-30%;background:radial-gradient(closest-side,rgba(255,170,70,.22),transparent);z-index:-1;transform:translateZ(-60px)}
.scrollcue{position:absolute;z-index:3;left:50%;bottom:26px;transform:translateX(-50%);font:800 11px/1 var(--bf);letter-spacing:.3em;color:var(--mute);display:flex;flex-direction:column;align-items:center;gap:10px}
.scrollcue i{width:1px;height:38px;background:linear-gradient(var(--amber),transparent);animation:drop 2s ease-in-out infinite;transform-origin:top}
@keyframes drop{0%{transform:scaleY(0)}50%{transform:scaleY(1)}100%{transform:scaleY(1);opacity:0}}
.progress{position:absolute;z-index:3;left:var(--pad);right:var(--pad);bottom:22px;height:2px;background:rgba(255,255,255,.1);opacity:0}
.progress b{display:block;height:100%;background:var(--amber);transform:scaleX(0);transform-origin:left;box-shadow:0 0 14px var(--amber)}
@media (max-width:900px){
  .hero{min-height:640px}
  .hero .shade{background:linear-gradient(180deg,rgba(5,10,8,.82) 0%,rgba(5,10,8,.5) 48%,rgba(5,10,8,.15) 70%,rgba(7,13,11,1) 100%)}
  .stage1{left:var(--pad);right:var(--pad);top:92px;transform:none;max-width:none}
  .h-title{font-size:clamp(40px,11.4vw,64px);margin:16px 0 14px}
  .h-sub{font-size:16px}
  .h-cta{margin-top:20px}.h-cta .btn{flex:1 1 auto}
  .h-meta{font-size:13px;margin-top:16px}
  .devices{left:50%;right:auto;top:auto;bottom:-13%;width:108vw;transform:translateX(-46%);opacity:.95}
  .scrollcue{display:none}
}
@media (max-width:900px) and (max-height:760px){.devices{bottom:-16%}.h-meta{display:none}}

/* statement */
.statement{padding:clamp(110px,16vw,220px) 0 clamp(80px,10vw,140px);position:relative}
.statement .big{font:800 clamp(30px,4.4vw,66px)/1.08 var(--hf);letter-spacing:-.03em;max-width:1120px}
.statement .w{opacity:.14;transition:none}
.statement .w.hl{color:var(--amber)}
html.nojs .statement .w{opacity:1}

/* gallery */
.gal{position:relative;padding:40px 0 120px}
.gal-head{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:end;margin-bottom:56px}
.gal-head h2{font-size:clamp(42px,6vw,92px)}
.gal-head p{color:#c7cec8;max-width:470px}
.gal-head .note{display:flex;gap:10px;margin-top:16px;font-size:13.5px;color:var(--mute);line-height:1.5}
.gal-head .note svg{flex:none;width:18px;height:18px;margin-top:1px;color:var(--amber2)}
.track-wrap{perspective:1800px}
.track{display:flex;gap:34px;padding:10px var(--pad) 30px;width:max-content;transform-style:preserve-3d}
.card{position:relative;width:min(540px,38vw,64vh);flex:none;text-decoration:none;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.card .frame{position:relative;border-radius:18px;overflow:hidden;background:#0f1714;box-shadow:0 0 0 1px var(--line),0 40px 80px -40px rgba(0,0,0,.9);transform:translateZ(0)}
.card .frame .bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 14px;background:#151e1a;border-bottom:1px solid rgba(255,255,255,.05)}
.card .frame .bar i{width:9px;height:9px;border-radius:50%;background:#33403a}
.card .frame .bar span{margin-left:10px;font:600 11.5px/1 var(--bf);color:#8a968f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.card .shot{position:relative;aspect-ratio:16/10;overflow:hidden}
.card .shot img{width:100%;height:100%;object-fit:cover;object-position:top;transition:transform 1.2s cubic-bezier(.2,.8,.2,1)}
.card:hover .shot img{transform:scale(1.04)}
.card .phone{position:absolute;right:-18px;bottom:-26px;width:15%;border-radius:18px;overflow:hidden;border:4px solid #0f1513;box-shadow:0 30px 50px -14px rgba(0,0,0,.85),0 0 0 1px var(--line);transform:translateZ(24px) rotate(4deg);background:#0f1513}
.card .phone img{aspect-ratio:9/19.5;object-fit:cover;object-position:top;width:100%;height:auto;display:block}
.card .shine{position:absolute;inset:0;pointer-events:none;background:radial-gradient(500px circle at var(--mx,50%) var(--my,0%),rgba(255,210,140,.16),transparent 45%);opacity:0;transition:opacity .4s}
.card:hover .shine{opacity:1}
.card .cap{display:flex;align-items:baseline;justify-content:space-between;gap:16px;margin-top:22px;padding-right:20px}
.card h3{font-size:clamp(22px,1.9vw,28px);letter-spacing:-.025em;line-height:1.1}
.card .meta{font-size:13.5px;color:var(--mute);margin-top:6px}
.card .open{flex:none;display:inline-flex;align-items:center;gap:6px;font:800 13px/1 var(--bf);color:var(--amber2);padding:10px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px rgba(255,212,138,.3)}
.card .open svg{width:14px;height:14px}
.card .tag{position:absolute;left:14px;top:44px;z-index:2;font:800 10.5px/1 var(--bf);letter-spacing:.14em;text-transform:uppercase;background:rgba(7,13,11,.78);color:var(--amber2);padding:8px 10px;border-radius:8px;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.gal-foot{display:flex;justify-content:center;margin-top:30px}
@media (max-width:900px){
  .gal-head{grid-template-columns:1fr;gap:18px;margin-bottom:34px}
  .track-wrap{overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;perspective:none}
  .track-wrap::-webkit-scrollbar{display:none}
  .track{gap:18px;padding:6px var(--pad) 40px}
  .card{width:82vw;scroll-snap-align:center}
  .card .phone{right:-6px;bottom:-14px;width:18%;border-width:3px;border-radius:12px}
  .swipe{display:flex!important}
}
.swipe{display:none;align-items:center;justify-content:center;gap:8px;font-size:13px;color:var(--mute);margin-top:4px}

/* included marquee */
.marq{padding:30px 0;border-block:1px solid var(--line);overflow:hidden;background:linear-gradient(90deg,var(--night),var(--night2),var(--night))}
.marq .row{display:flex;gap:46px;width:max-content;font:800 clamp(22px,2.6vw,38px)/1 var(--hf);letter-spacing:-.02em;color:#e9ece6;white-space:nowrap;align-items:center}
.marq .row span{display:inline-flex;align-items:center;gap:46px}
.marq .row span::after{content:"";width:10px;height:10px;border-radius:50%;background:var(--amber);box-shadow:0 0 16px var(--amber)}

/* how it works */
.how{padding:clamp(100px,13vw,180px) 0 clamp(80px,10vw,140px);position:relative}
.how h2{font-size:clamp(42px,6vw,92px);max-width:900px}
.how .lead{color:#c7cec8;max-width:560px;margin-top:22px}
.steps{position:relative;list-style:none;padding:0;margin:80px 0 0;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;perspective:1200px}
.steps svg.path{position:absolute;left:0;right:0;top:44px;width:100%;height:60px;z-index:0;overflow:visible}
.steps li{position:relative;z-index:1;padding:30px 30px 34px;border-radius:var(--r);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));box-shadow:inset 0 0 0 1px var(--line);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.steps .n{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--amber2),var(--amber) 55%,var(--ember));color:#1a1206;font:800 22px/1 var(--hf);box-shadow:0 0 0 8px rgba(255,181,71,.08),0 0 40px rgba(255,170,60,.5);margin-bottom:26px}
.steps h3{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.025em;margin-bottom:12px;line-height:1.05}
.steps p{color:#c3cbc4;font-size:16px}
.steps .t{display:inline-block;margin-top:18px;font:800 12px/1 var(--bf);letter-spacing:.14em;text-transform:uppercase;color:var(--leaf2)}
@media (max-width:900px){.steps{grid-template-columns:1fr;margin-top:46px;gap:16px}.steps svg.path{display:none}}

/* pricing */
.pricing{padding:clamp(80px,10vw,150px) 0;position:relative;overflow:hidden}
.pricing::before{content:"";position:absolute;left:50%;top:40%;width:1100px;height:800px;transform:translate(-50%,-50%);background:radial-gradient(closest-side,rgba(255,160,60,.16),transparent);pointer-events:none}
.pricing .head{text-align:center;max-width:820px;margin:0 auto 60px}
.pricing h2{font-size:clamp(42px,6vw,92px)}
.pricing .head p{color:#c7cec8;margin-top:20px}
.plan{position:relative;max-width:1080px;margin:0 auto;border-radius:32px;padding:2px;background:conic-gradient(from var(--ang,0deg),rgba(255,181,71,.0),rgba(255,181,71,.9),rgba(185,217,138,.5),rgba(255,181,71,0) 40%,rgba(255,181,71,0) 60%,rgba(255,181,71,.7),rgba(255,181,71,0));transform-style:preserve-3d;transition:transform .6s cubic-bezier(.2,.8,.2,1)}
.plan-in{position:relative;border-radius:30px;background:linear-gradient(180deg,#101a16,#0a110e);display:grid;grid-template-columns:1fr 1fr;overflow:hidden}
.plan-in::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(600px circle at var(--mx,30%) var(--my,0%),rgba(255,200,120,.10),transparent 45%)}
.col{padding:clamp(28px,4vw,56px)}
.col+.col{border-left:1px solid var(--line)}
.col .k{font:800 12px/1 var(--bf);letter-spacing:.18em;text-transform:uppercase;color:var(--amber2)}
.amt{display:flex;align-items:flex-start;gap:6px;margin:18px 0 6px;font:800 clamp(72px,9vw,128px)/.85 var(--hf);letter-spacing:-.05em}
.amt sup{font-size:.36em;margin-top:.12em;letter-spacing:0}
.amt small{align-self:flex-end;font:600 18px/1.2 var(--bf);letter-spacing:0;color:var(--mute);margin-bottom:.4em}
.col .sub{color:#c7cec8;font-size:15.5px}
.col ul{list-style:none;padding:0;margin:26px 0 0;display:grid;gap:13px}
.col li{display:flex;gap:12px;font-size:16px;color:#e4e8e2}
.col li svg{flex:none;width:20px;height:20px;margin-top:2px;color:var(--leaf2)}
.plan-cta{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:16px 24px;padding:28px clamp(28px,4vw,56px);border-top:1px solid var(--line);background:rgba(255,181,71,.045)}
.plan-cta .fine{flex:1 1 300px;font-size:14px;color:var(--mute)}
.plan-cta .btns{display:flex;flex-wrap:wrap;gap:12px}
.domain-note{max-width:1080px;margin:26px auto 0;display:flex;gap:12px;font-size:14.5px;color:var(--mute);padding:0 6px}
.domain-note svg{flex:none;width:20px;height:20px;color:var(--amber2)}
@media (max-width:900px){.plan-in{grid-template-columns:1fr}.col+.col{border-left:0;border-top:1px solid var(--line)}.plan-cta .btns,.plan-cta .btn{width:100%}}

/* faq */
.faq{padding:clamp(60px,9vw,130px) 0}
.faq .grid{display:grid;grid-template-columns:.8fr 1.2fr;gap:60px}
.faq h2{font-size:clamp(42px,5.4vw,80px);position:sticky;top:120px}
.faq .grid>div>p{color:var(--mute);margin-top:18px;position:sticky;top:300px}
details{border-bottom:1px solid var(--line)}
details:first-of-type{border-top:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 4px;font:800 clamp(19px,1.6vw,23px)/1.25 var(--hf);letter-spacing:-.015em}
summary::-webkit-details-marker{display:none}
summary .pm{flex:none;position:relative;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(255,236,200,.25);transition:transform .45s cubic-bezier(.2,.8,.2,1),background .3s}
summary .pm::before,summary .pm::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;background:var(--amber);border-radius:2px}
summary .pm::after{transform:rotate(90deg);transition:transform .45s}
details[open] summary .pm{background:rgba(255,181,71,.12);transform:rotate(180deg)}
details[open] summary .pm::after{transform:rotate(0)}
details .a{padding:0 4px 26px;color:#c9d0ca;max-width:680px}
details .a p+p{margin-top:12px}
@media (max-width:900px){.faq .grid{grid-template-columns:1fr;gap:20px}.faq h2,.faq .grid>div>p{position:static}}

/* final CTA */
.final{position:relative;padding:clamp(110px,14vw,200px) 0 clamp(90px,11vw,160px);text-align:center;overflow:hidden;--lit:0}
.final .bg{position:absolute;inset:0;background:radial-gradient(60% 55% at 50% 28%,rgba(255,170,70,calc(.35*var(--lit))),transparent 70%),radial-gradient(100% 60% at 50% 120%,rgba(60,110,40,.35),transparent 70%);pointer-events:none}
.lamp{width:120px;height:auto;margin:0 auto 34px;overflow:visible}
.lamp .bulb{opacity:calc(.25 + .75*var(--lit))}
.lamp .halo{opacity:var(--lit)}
.final h2{position:relative;font-size:clamp(46px,7.6vw,128px);max-width:1100px;margin:0 auto;text-wrap:balance}
.final h2 em{font-style:normal;color:var(--amber);text-shadow:0 0 calc(50px*var(--lit)) rgba(255,170,60,.7)}
.final p{position:relative;color:#c9d0ca;max-width:560px;margin:26px auto 0;font-size:18px}
.final .h-cta{justify-content:center;position:relative}

/* footer */
footer{border-top:1px solid var(--line);padding:56px 0 110px;font-size:14px;color:var(--mute);background:#050a08}
footer .fg{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:40px}
footer .brand{margin-bottom:14px;color:var(--paper)}
footer h4{margin:0 0 12px;font:800 12px/1 var(--bf);letter-spacing:.16em;text-transform:uppercase;color:#d8dcd6}
footer a{color:#d8dcd6}
footer ul{list-style:none;padding:0;margin:0;display:grid;gap:8px}
footer .legal{margin-top:40px;padding-top:24px;border-top:1px solid var(--line);display:grid;gap:10px;font-size:12.5px;line-height:1.55}
@media (max-width:900px){footer .fg{grid-template-columns:1fr;gap:28px}}

/* mobile sticky CTA */
.sticky{position:fixed;left:12px;right:12px;bottom:max(12px,env(safe-area-inset-bottom));z-index:60;display:none;align-items:center;gap:12px;padding:10px 10px 10px 18px;border-radius:999px;background:rgba(12,20,16,.86);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 20px 40px -10px rgba(0,0,0,.7),inset 0 0 0 1px var(--line);transform:translateY(140%);transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.sticky.on{transform:none}
.sticky .t{font:800 14px/1.2 var(--bf)}
.sticky .t small{display:block;font-weight:600;color:var(--mute);font-size:12px}
.sticky .btn{margin-left:auto;min-height:44px;padding:0 18px;font-size:14.5px}
@media (max-width:900px){.sticky{display:flex}}

/* simple pages */
.doc{max-width:780px;margin:0 auto;padding:130px var(--pad) 80px}
.doc h1{font-size:clamp(40px,6vw,72px);margin-bottom:12px}
.doc .upd{color:var(--mute);font-size:14px;margin-bottom:40px}
.doc h2{font-size:26px;letter-spacing:-.02em;line-height:1.15;margin:44px 0 12px}
.doc p,.doc li{color:#d3d9d3}
.doc p+p{margin-top:12px}
.doc ul{padding-left:22px;display:grid;gap:6px}
.doc .box{margin-top:16px;padding:18px 20px;border-radius:14px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px var(--line)}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.statement .w{opacity:1}}
.card .fw{position:relative;transform-style:preserve-3d}
@media (max-width:900px){.stage3 h2 br{display:none}}