/* Concept 1 · Immersive: final visual implementation (2026-11-07).
   Hero campaign image, the two-phone screenshot stage, the final CTA, section choreography,
   stronger mobile pricing and a compact mobile footer. Loaded after style.css. */
:root{
  --ease-cine:cubic-bezier(.16,1,.3,1);
  --d-cam:2800ms; --d-sheen:2200ms; --d-sheen-delay:1100ms; --d-haze:22s; --d-phone:1500ms; --d-phone-2:260ms;
  --d-push:3600ms; --d-line:900ms; --d-step:160ms; --d-step-0:200ms; --d-word-step:55ms; --d-check:600ms; --d-check-0:320ms; --d-check-step:80ms;
  --d-cue:2400ms; --d-card:900ms;
  --curtain:1.75rem; --persp-phone:1400px; --thick:.55rem;
  --steel:#4E6478; --steel-d:#34465A; --steel-l:#B7C4D0;
  --stage-1:#15171A; --stage-2:#2B2F34; --stage-3:#0E0F11;
  --rim:linear-gradient(135deg,#5E646B 0%,#202327 16%,#34383D 46%,#15171A 80%,#555B61 100%);
  --rim-edge:linear-gradient(180deg,#3A3E43 0%,#16181B 100%);
  --shadow-btn-dark:0 .0625rem .125rem rgba(0,0,0,.2),0 .6rem 1.4rem -.8rem rgba(34,38,42,.7);
  --shadow-lift:0 .125rem .25rem rgba(34,38,42,.06),0 1.75rem 3.1rem -1.6rem rgba(34,38,42,.42);
  --shadow-rail:0 .0625rem .125rem rgba(34,38,42,.08),0 1.1rem 2.25rem -1.25rem rgba(34,38,42,.4);
  --glass-black:#050607; --screen-white:#FFFFFF;
  --shade:rgba(26,29,32,.92); --shade-2:rgba(26,29,32,.6); --shade-0:rgba(26,29,32,0);
}

/* ---------- Header: no phone number; wordmark centred, menu left ---------- */
.hdr .wrap{grid-template-columns:1fr auto 1fr}
.burger:active{transform:scale(.96)}
.burger{transition:transform var(--d-press) var(--ease-out)}

/* ---------- HERO: the black metal card, lit like a campaign still ---------- */
.hero{display:flex;flex-direction:column;justify-content:flex-start;min-height:max(40rem,100svh);padding:calc(var(--hdr-h) + clamp(2.5rem,9vh,6rem)) 0 calc(clamp(4rem,10vh,6.5rem) + var(--curtain))}
.hero::before{background:linear-gradient(90deg,var(--charcoal-3) 0%,rgba(26,29,32,.85) 34%,var(--shade-0) 62%);z-index:1}
.hero .smoke,.hero .dash{display:none}
.hero-media{position:absolute;top:0;right:0;bottom:0;width:min(58%,58rem);overflow:hidden;z-index:0;-webkit-mask-image:linear-gradient(90deg,transparent 0%,black 36%);mask-image:linear-gradient(90deg,transparent 0%,black 36%)}
.hero-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--shade) 0%,rgba(26,29,32,.4) 24%,var(--shade-0) 44%,var(--shade-0) 74%,rgba(26,29,32,.75) 100%);pointer-events:none}
.hero .cam{position:absolute;inset:0;transform-origin:50% 40%}
@media (min-width:980px){.hero .cam{top:7%;bottom:-7%}.hero-copy .second{margin-top:clamp(1rem,3vh,2rem)}}
.hero .cam img{width:100%;height:100%;object-fit:cover;object-position:50% 0%;transform:scale(1.09) translate3d(-1.2%,1.6%,0);filter:brightness(.5) contrast(1.04);transition:transform var(--d-cam) var(--ease-cine),filter var(--d-cam) ease}
.hero.media-in .cam img{transform:none;filter:brightness(.95) contrast(1.04)}
.hero .sheen{position:absolute;inset:0;background:linear-gradient(105deg,transparent 38%,rgba(255,255,255,.22) 50%,transparent 62%);mix-blend-mode:soft-light;transform:translateX(-110%);pointer-events:none}
.hero.media-in .sheen{animation:sc-sheen var(--d-sheen) var(--ease-in-out) var(--d-sheen-delay) both}
@keyframes sc-sheen{to{transform:translateX(110%)}}
.hero-haze{position:absolute;inset:-20%;z-index:1;pointer-events:none;background:radial-gradient(30% 24% at 70% 30%,rgba(197,199,200,.10) 0%,transparent 70%),radial-gradient(26% 20% at 30% 80%,rgba(146,151,155,.08) 0%,transparent 70%);animation:sc-haze var(--d-haze) ease-in-out infinite alternate}
@keyframes sc-haze{to{transform:translate3d(-4%,3%,0)}}
.hero-copy{position:relative;z-index:2;width:100%}
.hero .second{margin-top:.6rem}
.hero .sub{margin-top:1.1rem}
.hero .ctas{margin-top:1.8rem}
.scroll-cue{position:absolute;left:var(--gutter);bottom:calc(var(--curtain) + 1.6rem);z-index:2;width:var(--line);height:3rem;background:var(--hair-d);overflow:hidden}
.scroll-cue i{position:absolute;left:0;top:0;width:100%;height:40%;background:var(--silver);animation:sc-cue var(--d-cue) var(--ease-in-out) infinite}
@keyframes sc-cue{0%{transform:translateY(-100%)}60%,100%{transform:translateY(260%)}}
@media (min-width:980px){.hero-copy .second,.hero-copy .sub,.hero-copy .ctas,.hero-copy .assure{max-width:min(40rem,44vw)}}
@media (max-width:979px){
  .hero{min-height:0;justify-content:flex-start;padding-bottom:0}
  .hero::before{background:linear-gradient(180deg,var(--charcoal-3) 0%,rgba(26,29,32,.6) 100%)}
  .hero-copy{order:1}
  .hero-media{order:2;position:relative;width:auto;height:min(112vw,36rem);margin-top:-1.5rem;-webkit-mask-image:linear-gradient(180deg,transparent 0%,black 24%);mask-image:linear-gradient(180deg,transparent 0%,black 24%)}
  .hero-media::after{background:linear-gradient(180deg,var(--shade-0) 0%,var(--shade-0) 70%,rgba(26,29,32,.7) 100%)}
  .hero .cam img{object-position:50% 34%}
  .scroll-cue{display:none}
}

/* Curtain: the next section slides up over the hero, and the footer over the final scene */
.hero + section{position:relative;z-index:3;background:var(--pearl);border-radius:var(--curtain) var(--curtain) 0 0;margin-top:calc(-1 * var(--curtain));box-shadow:0 -1.5rem 3rem -1.5rem rgba(0,0,0,.55)}
.foot{position:relative;z-index:3;border-radius:var(--curtain) var(--curtain) 0 0;margin-top:calc(-1 * var(--curtain));border-top:0}

/* ---------- Section headlines: words rise out of a mask ---------- */
[data-words] .w{display:inline-block;overflow:hidden;vertical-align:top;padding:0 .06em .12em 0;margin:0 -.06em -.12em 0}
[data-words] .wi{display:inline-block}
.js-motion:not(.rm) [data-words] .wi{transform:translateY(108%);transition:transform var(--d-word) var(--ease-cine);transition-delay:calc(var(--wi,0) * var(--d-word-step))}
.js-motion [data-words].is-in .wi{transform:none}

/* ---------- Benefits: the rule draws down, copy follows; checks draw themselves ---------- */
.expect .story{border-left:0;position:relative}
.expect .story::before{content:"";position:absolute;left:0;top:0;bottom:0;width:var(--line);background:var(--stone);transform-origin:top center}
.js-motion [data-reveal="line"]{opacity:0;transform:translateX(.75rem)}
.js-motion [data-reveal="line"]::before{transform:scaleY(0);transition:transform var(--d-rule) var(--ease-cine)}
.js-motion [data-reveal="line"].is-in{opacity:1;transform:none}
.js-motion [data-reveal="line"].is-in::before{transform:none}
.js-motion .checklist>li[data-reveal]:not(.is-in){transform:translateX(1.25rem)}
.js-motion .checklist .ck path{stroke-dasharray:14;stroke-dashoffset:14;transition:stroke-dashoffset var(--d-check) var(--ease-out);transition-delay:calc(var(--i,0) * var(--d-check-step) + var(--d-check-0))}
.js-motion .checklist .is-in .ck path{stroke-dashoffset:0}

/* ---------- What we can help address: tiles settle in, refined hover ---------- */
.js-motion .issues>li[data-reveal]:not(.is-in){transform:scale(.94)}
.issues .ck circle,.issues .ck path{transition:fill var(--d-hover) ease,stroke var(--d-hover) ease,opacity var(--d-hover) ease}
@media (hover:hover) and (pointer:fine){
  .issues li:hover{border-color:var(--charcoal);transform:translateY(calc(-1 * var(--lift) / 2));box-shadow:var(--shadow)}
  .issues li:hover .ck circle{fill:var(--charcoal);stroke:var(--charcoal);opacity:1}
  .issues li:hover .ck path{stroke:var(--pearl)}
}

/* ---------- STAY INFORMED: two real phones on a dark studio surface ---------- */
.phones-sec{position:relative;overflow:hidden;background:radial-gradient(70% 70% at 70% 40%,var(--white) 0%,var(--pearl-2) 55%,var(--pearl-3) 100%)}
.phones,.phones-sec .ph{display:none}
.phones-grid{display:grid;gap:clamp(2rem,5vw,4rem);align-items:center}
.phones-grid>*{min-width:0}
@media (min-width:980px){.phones-grid{grid-template-columns:5fr 7fr}}
.shots-note{margin-top:1.1rem;max-width:46ch}
.tap-hint{margin-top:.5rem;color:var(--ink-2)}
.stage{position:relative;aspect-ratio:10/9;border-radius:var(--r);overflow:hidden;isolation:isolate;background:radial-gradient(70% 55% at 60% 16%,rgba(197,199,200,.22) 0%,transparent 62%),radial-gradient(90% 40% at 50% 100%,rgba(146,151,155,.12) 0%,transparent 70%),linear-gradient(180deg,var(--stage-2) 0%,var(--stage-1) 58%,var(--stage-3) 100%);box-shadow:var(--shadow-lg)}
.stage::after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;opacity:.22;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .5 0 0 0 0 .5 0 0 0 0 .5 0 0 0 .7 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.stage::before{content:"";position:absolute;left:0;right:0;bottom:0;height:44%;background:linear-gradient(180deg,rgba(255,255,255,.035) 0%,rgba(0,0,0,.28) 100%);z-index:0}
.slot{position:absolute;z-index:2}
.slot-up{right:9%;bottom:8%;width:38%}
.slot-flat{left:14%;bottom:5%;width:34%;z-index:3;perspective:var(--persp-phone);perspective-origin:50% 0%}

.iphone{display:block;position:relative;width:100%;aspect-ratio:.4877;padding:1.5%;border:0;border-radius:16.5% / 8%;background:var(--rim);cursor:zoom-in;font:inherit;color:inherit;box-shadow:inset 0 0 0 var(--line) rgba(255,255,255,.16)}
.iphone::before{content:"";position:absolute;right:-1%;top:25%;width:1.2%;height:11%;border-radius:0 var(--r-sm) var(--r-sm) 0;background:var(--rim-edge)}
.iphone .scr{position:relative;display:block;width:100%;height:100%;padding:3%;border-radius:15% / 7.2%;background:var(--glass-black);overflow:hidden}
.iphone .scr img{width:100%;height:100%;object-fit:cover;object-position:50% 0%;border-radius:12.4% / 5.9%;background:var(--screen-white)}
.iphone .scr-web img{object-fit:contain;object-position:50% 44%}
.iphone .scr::before{content:"";position:absolute;top:5.4%;left:50%;width:29%;height:3.4%;transform:translateX(-50%);border-radius:var(--r-pill);background:var(--glass-black);z-index:2}
.iphone .scr::after{content:"";position:absolute;inset:3%;border-radius:12.4% / 5.9%;background:linear-gradient(118deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 26%);pointer-events:none;z-index:1}
.iphone:focus-visible{outline:var(--focus-w) solid var(--pearl);outline-offset:var(--focus-off)}

/* Standing phone: turned slightly toward the light, reflected in the surface */
.iphone.up{transform:perspective(var(--persp-phone)) rotateY(-14deg) rotateX(2deg);box-shadow:inset 0 0 0 var(--line) rgba(255,255,255,.16),1.6rem 1.8rem 3rem -1rem rgba(0,0,0,.7);-webkit-box-reflect:below .35rem linear-gradient(transparent 84%,rgba(255,255,255,.13));transition:transform var(--d-phone) var(--ease-cine),opacity var(--d-reveal) ease}
.floor-shadow{position:absolute;left:4%;right:-6%;bottom:-4%;height:7%;border-radius:50%;background:radial-gradient(50% 50% at 50% 50%,rgba(0,0,0,.75) 0%,transparent 100%);filter:blur(var(--glow-blur));z-index:-1}

/* Lying phone: on the surface, with real thickness and a contact shadow */
.iphone.flat{transform-style:preserve-3d;transform:rotateX(60deg) rotateZ(-28deg);transform-origin:50% 60%;box-shadow:inset 0 0 0 var(--line) rgba(255,255,255,.18),0 2.2rem 2.4rem -.4rem rgba(0,0,0,.8);transition:transform var(--d-phone) var(--ease-cine) var(--d-phone-2),opacity var(--d-reveal) ease var(--d-phone-2)}
.iphone.flat .edge{position:absolute;inset:0;border-radius:inherit;background:var(--rim-edge);transform:translateZ(calc(-1 * var(--thick)))}

.js-motion:not(.rm) .stage:not(.is-in) .iphone.up{transform:perspective(var(--persp-phone)) translate3d(0,3rem,0) rotateY(-30deg) rotateX(4deg);opacity:0}
.js-motion:not(.rm) .stage:not(.is-in) .iphone.flat{transform:translate3d(-2.5rem,0,0) rotateX(60deg) rotateZ(-40deg);opacity:0}
@media (hover:hover) and (pointer:fine){
  .stage.is-in .iphone.up:hover{transform:perspective(var(--persp-phone)) rotateY(-8deg) rotateX(1deg);transition-delay:var(--d-none)}
  .stage.is-in .iphone.flat:hover{transform:rotateX(56deg) rotateZ(-24deg);transition-delay:var(--d-none)}
}
@media (min-width:760px) and (max-width:979px){.stage{max-width:44rem;margin-inline:auto;width:100%}}
@media (max-width:759px){
  .stage{aspect-ratio:1/1.32;margin-inline:calc(-.5 * var(--gutter))}
  .slot-up{right:6%;bottom:5%;width:57%}
  .slot-flat{left:7%;bottom:3%;width:42%}
  .iphone.flat{transform:rotateX(52deg) rotateZ(-14deg)}
  .js-motion:not(.rm) .stage:not(.is-in) .iphone.flat{transform:translate3d(-2rem,0,0) rotateX(52deg) rotateZ(-26deg)}
  .slot-up{right:5%;width:55%}
}
@media (min-width:760px){.tap-hint{display:none}}

/* ---------- Pricing: clean entrances, lifts on hover, louder sale prices ---------- */
.js-motion .prices>.price[data-reveal]{transition:opacity var(--d-card) var(--ease-out),transform var(--d-card) var(--ease-cine),clip-path var(--d-card) var(--ease-cine),box-shadow var(--d-hover) ease,border-color var(--d-hover) ease}
.js-motion .prices>.price[data-reveal]:not(.is-in){transform:translateY(1.5rem);clip-path:inset(10% 0 0 0 round var(--r))}
.js-motion .prices>.price.is-in{clip-path:inset(0 0 0 0 round var(--r))}
.amt{gap:.6rem}
.amt s{color:var(--graphite);font-size:1rem;text-decoration-color:var(--steel);text-decoration-thickness:var(--focus-w)}
.amt b{color:var(--charcoal);font-size:3.6rem}
.flash{background:linear-gradient(135deg,var(--charcoal) 0%,var(--steel-d) 100%);color:var(--pearl);box-shadow:inset 0 0 0 var(--line) rgba(255,255,255,.18)}
.price .btn{background:var(--charcoal);color:var(--pearl);box-shadow:var(--shadow-btn-dark)}
.price .btn::before{background:var(--steel-d)}
@media (hover:hover) and (pointer:fine){
  .prices>.price.is-in:hover{transform:translateY(calc(-1 * var(--lift)));border-color:var(--stone);box-shadow:var(--shadow-lift)}
}
.btn-silver::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);pointer-events:none}
@media (hover:hover) and (pointer:fine){.btn-silver:hover::after{transform:translateX(120%);transition:transform var(--d-rule) var(--ease-out)}}

.ptabs{display:none}
@media (max-width:759px){
  .ptabs{display:flex;gap:.4rem;overflow-x:auto;scrollbar-width:none;margin:-.5rem calc(-1 * var(--gutter)) .5rem;padding:.25rem var(--gutter)}
  .ptabs::-webkit-scrollbar{display:none}
  .ptabs button{flex:none;min-height:2.75rem;padding:0 1rem;border-radius:var(--r-pill);border:var(--line) solid var(--hair-2);background:var(--white);color:var(--ink);font:700 .8125rem var(--body);letter-spacing:.02em;cursor:pointer;transition:background-color var(--d-hover) ease,color var(--d-hover) ease,border-color var(--d-hover) ease}
  .ptabs button[aria-current]{background:var(--charcoal);border-color:var(--charcoal);color:var(--pearl)}
  .price{gap:.6rem}
  .price h3{font-size:1.45rem}
  .amt b{font-size:3.3rem}
  .rail-m>.price{box-shadow:var(--shadow-rail);border-color:var(--hair-2)}
  .rail-m{padding-bottom:.75rem;align-items:flex-start}
  .price-more{margin-top:.75rem}
}

/* ---------- How it works: a line draws through the steps in order ---------- */
.steps li{position:relative;border-top-color:var(--hair-d)}
.steps li::before{content:"";position:absolute;left:0;right:0;top:calc(-1 * var(--line));height:var(--line);background:var(--silver);transform-origin:left center}
.js-motion .steps li[data-reveal]{transform:none}
.js-motion .steps li::before{transform:scaleX(0);transition:transform var(--d-line) var(--ease-in-out);transition-delay:calc(var(--i,0) * var(--d-step) + var(--d-step-0))}
.js-motion .steps li.is-in::before{transform:scaleX(1)}
.js-motion .steps .n{display:inline-block;transform:translateY(35%);opacity:0;transition:transform var(--d-reveal) var(--ease-cine),opacity var(--d-reveal) ease;transition-delay:calc(var(--i,0) * var(--d-step) + var(--d-step-0))}
.js-motion .steps li.is-in .n{transform:none;opacity:1}
@media (min-width:980px){.steps{column-gap:0}.steps li{padding-right:2rem}}

/* ---------- Final CTA: a slow camera push behind the headline ---------- */
.final{display:flex;align-items:center;min-height:clamp(32rem,82vh,48rem)}
.final .bg{inset:-6% 0;opacity:1}
.final .push{position:absolute;inset:0}
.final .bg img{object-position:62% 50%;filter:grayscale(1) contrast(1.06) brightness(.82)}
.js-motion .final .push[data-reveal]{transform:scale(1.14);opacity:0;transition:transform var(--d-push) var(--ease-cine),opacity var(--d-rule) ease}
.js-motion .final .push.is-in{transform:none;opacity:1}
.final::after{background:linear-gradient(90deg,var(--shade) 0%,rgba(26,29,32,.62) 46%,rgba(26,29,32,.18) 100%)}
.final .wrap{padding-block:clamp(3.5rem,9vw,6.5rem) calc(clamp(3.5rem,9vw,6.5rem) + var(--curtain))}
.final-note{margin-top:1.25rem;color:var(--on-dark-2);max-width:52ch}
@media (max-width:759px){
  .final{align-items:flex-end;min-height:min(46rem,108vw + 18rem)}
  .final .bg img{object-position:66% 30%}
  .final::after{background:linear-gradient(180deg,rgba(26,29,32,.25) 0%,var(--shade-2) 42%,var(--shade) 70%)}
  .final .ctas .btn{flex:1 1 100%}
}

/* ---------- Navigation: refined drawer list ---------- */
@media (hover:hover) and (pointer:fine){
  .nav:hover a:not(:hover) .t{opacity:.45}
  .nav a .t{transition:transform var(--d-sweep) var(--ease-out),opacity var(--d-hover) ease}
  .burger:hover .bars i:first-child{transform:scaleX(.55)}
}
.drawer{transition-timing-function:var(--ease-drawer)}

/* ---------- Footer: compact on phones ---------- */
@media (max-width:759px){
  .foot{padding-block:calc(2rem + var(--curtain)) 1.25rem}
  .foot-top{grid-template-columns:1fr 1fr;gap:1.4rem 1rem}
  .foot-top>div:first-child{grid-column:1 / -1}
  .foot .mark{font-size:1.9rem}
  .tag{font-size:.875rem;margin-top:.35rem}
  .foot .label{margin-bottom:.45rem}
  .foot-links{grid-template-columns:1fr;gap:.3rem}
  .foot ul{gap:.3rem;font-size:.9375rem}
  .legal{margin-top:1.4rem;padding-top:.9rem;gap:1.1rem;font-size:.875rem}
  .copy-line{margin-top:.7rem}
}

/* ---------- Reduced motion: everything lands in place, nothing drifts ---------- */
@media (prefers-reduced-motion:reduce){
  .hero .cam img{transform:none;filter:brightness(.95) contrast(1.04);transition:none}
  .hero .sheen,.hero-haze,.scroll-cue i{animation:none}
  .hero .sheen{display:none}
  .iphone.up,.iphone.flat,.final .push,.steps .n,.steps li::before,.checklist .ck path,.prices>.price{transition:none!important}
  .js-motion .final .push[data-reveal]{transform:none;opacity:1}
  .js-motion .prices>.price[data-reveal]{clip-path:none}
}

/* Pre-reveal offsets (slide-ins) must never widen the page */
main{overflow-x:clip}

/* ===== Round 2 (2026-11-07 evening): mobile hero, continuous camera, Get Approved, Get Started, CTA backdrop ===== */
:root{--d-cam-loop:16s; --d-sheen-loop:11s; --d-intro:1800ms}

/* Hero camera: the one-off push finished in under 3s and then sat still, so the hero read as static.
   Now a slow, continuous dolly runs for as long as the hero is on screen, plus a recurring light pass. */
.hero .cam img{transform:scale(1.03);transition:filter var(--d-intro) ease}
.hero.media-in .cam img{animation:sc-cam var(--d-cam-loop) ease-in-out infinite alternate}
@keyframes sc-cam{from{transform:scale(1.03) translate3d(0,0,0)}to{transform:scale(1.12) translate3d(-1.6%,-1.2%,0)}}
.hero.media-in .sheen{animation:sc-sheen-loop var(--d-sheen-loop) var(--ease-in-out) var(--d-sheen-delay) infinite}
@keyframes sc-sheen-loop{0%{transform:translateX(-110%)}22%,100%{transform:translateX(110%)}}
.hero-haze{background:radial-gradient(34% 26% at 70% 30%,rgba(197,199,200,.14) 0%,transparent 70%),radial-gradient(28% 22% at 30% 80%,rgba(146,151,155,.12) 0%,transparent 70%)}
.m-br{display:none}

/* Mobile hero: one immersive composition, the card behind the copy */
@media (max-width:979px){
  .hero{min-height:92svh;justify-content:flex-end;padding:calc(var(--hdr-h) + 1rem) 0 calc(2.25rem + var(--curtain))}
  .hero::before{background:linear-gradient(180deg,rgba(26,29,32,.55) 0%,rgba(26,29,32,0) 18%,rgba(26,29,32,0) 38%,rgba(26,29,32,.78) 60%,var(--charcoal-3) 88%)}
  .hero-media{order:0;position:absolute;inset:0;width:auto;height:auto;margin:0;-webkit-mask-image:none;mask-image:none}
  .hero-media::after{background:linear-gradient(180deg,rgba(26,29,32,.6) 0%,var(--shade-0) 22%)}
  .hero .cam{top:-6%;bottom:6%}
  .hero .cam img{object-position:50% 16%}
  .hero h1{font-size:clamp(2.45rem,11vw,3.4rem);line-height:1.02}
  .m-br{display:inline}
  .hero .second{font-size:clamp(1.6rem,7.4vw,2.2rem);margin-top:.4rem}
  .hero .sub{margin-top:.75rem;font-size:1rem}
  .hero .ctas{margin-top:1.15rem}
  .hero .ctas .btn-ghost,.hero .assure{display:none}
}

/* Get Approved: compact, no lede */
.phones-sec.pad{padding-block:clamp(2.25rem,5vw,4rem)}
.phones-copy .shots-note{margin-top:.9rem}
.iphone .scr-fit img{object-fit:contain;object-position:50% 0%}
@media (min-width:980px){.phones-grid{grid-template-columns:4fr 8fr}}
@media (max-width:759px){.phones-grid{gap:1.25rem}.stage{aspect-ratio:1/1.22}}

/* Get Started: tighter rhythm */
#how.pad{padding-block:clamp(2.5rem,5.5vw,4.25rem)}
#how .sec-head{margin-bottom:clamp(1.25rem,2.5vw,2rem)}
#how .steps-foot{margin-top:clamp(1.25rem,2.5vw,2rem)}
.js-motion:not(.rm) .steps li[data-reveal]:not(.is-in){transform:translateY(var(--rise-sm))}
.js-motion .steps li[data-reveal]{transition:opacity var(--d-reveal) var(--ease-cine),transform var(--d-reveal) var(--ease-cine)}

/* Final CTA without a photo yet: a graphite backdrop with a slow light drift, never a stock image */
.final .bg-empty{position:absolute;inset:0;background:radial-gradient(60% 70% at 78% 30%,rgba(197,199,200,.16) 0%,transparent 65%),radial-gradient(50% 60% at 15% 100%,rgba(83,89,96,.4) 0%,transparent 70%),var(--charcoal-2);animation:sc-haze var(--d-haze) ease-in-out infinite alternate}
.final:has(.bg-empty){min-height:0}
.final:has(.bg-empty)::after{background:none}

@media (prefers-reduced-motion:reduce){
  .hero.media-in .cam img,.hero.media-in .sheen,.final .bg-empty{animation:none}
  .hero .cam img{transform:none}
}

/* ===== Round 3 (2026-11-10): Homevia-inspired pricing cards, Get Approved images, office-photo CTA, black footer ===== */
:root{--card-r:1.25rem; --panel-r:.9rem; --foot-bg:var(--stage-3); --card-glow:0 1.5rem 3rem -1.75rem rgba(0,0,0,.8)}

/* Pricing: dark, tall rectangular cards; price and Buy Now sit in an inset panel at the base (Homevia's info panel, no imagery) */
#pricing{background:var(--charcoal-3);color:var(--on-dark)}
#pricing .lede,#pricing .fine{color:var(--on-dark-2)}
#pricing .btn-line{color:var(--on-dark);box-shadow:inset 0 0 0 var(--line) var(--hair-d2)}
#pricing .btn-line::before{background:rgba(243,243,241,.08)}
#pricing .price{background:linear-gradient(180deg,rgba(243,243,241,.05) 0%,rgba(243,243,241,.015) 100%);border:var(--line) solid var(--hair-d);border-radius:var(--card-r);box-shadow:var(--card-glow);padding:1.4rem;gap:1rem;color:var(--on-dark)}
#pricing .price h3{color:var(--pearl);font-size:1.75rem}
#pricing .flash{background:transparent;color:var(--silver);box-shadow:inset 0 0 0 var(--line) var(--hair-d2)}
#pricing .price-body{display:grid;gap:.75rem;flex:1;align-content:start}
#pricing .desc{color:var(--on-dark-2)}
#pricing .incl{border-top-color:var(--hair-d)}
#pricing .incl li{color:var(--on-dark-2)}
#pricing .incl .ck,#pricing .eta .ck{color:var(--silver)}
.eta{display:flex;align-items:center;gap:.5rem;font-size:.9375rem;font-weight:600;color:var(--pearl)}
.eta .ck{width:1.05rem;height:1.05rem}
.eta sup{color:var(--stone);font-weight:500}
#pricing .price-foot{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:.9rem .9rem .9rem 1.1rem;border-radius:var(--panel-r);background:rgba(243,243,241,.06);border:var(--line) solid var(--hair-d);-webkit-backdrop-filter:blur(var(--blur));backdrop-filter:blur(var(--blur));transition:background-color var(--d-hover) ease,border-color var(--d-hover) ease}
#pricing .amt{margin:0;flex-wrap:wrap;row-gap:0}
#pricing .amt s{color:var(--stone);font-size:1rem;text-decoration-color:var(--silver)}
#pricing .amt b{color:var(--pearl);font-size:3rem}
#pricing .price .btn{width:auto;margin:0;flex:none;background:var(--metal-btn);background-color:var(--silver);color:var(--charcoal);box-shadow:var(--btn-shadow)}
#pricing .price .btn::before{background:var(--metal-btn-hover)}
@media (hover:hover) and (pointer:fine){
  #pricing .prices>.price.is-in:hover{transform:translateY(calc(-1 * var(--lift)));border-color:var(--hair-d2);box-shadow:0 2rem 3.5rem -1.75rem rgba(0,0,0,.9)}
  #pricing .price:hover .price-foot{background:rgba(243,243,241,.09);border-color:var(--hair-d2)}
}
@media (min-width:760px){#pricing .prices{gap:1rem}}
@media (min-width:1180px){
  #pricing .prices>.price:nth-child(-n+3){min-height:29rem}
  #pricing .prices>.price.simple{display:flex;align-items:stretch;min-height:15rem}
  #pricing .prices>.price.simple .btn{width:auto}
  #pricing .prices>.price.simple .price-body>*,#pricing .prices>.price.simple .price-foot>*{grid-area:auto}
}
#pricing .eta-note{display:inline-block}
@media (max-width:759px){
  #pricing .ptabs button{background:transparent;color:var(--on-dark);border-color:var(--hair-d2)}
  #pricing .ptabs button[aria-current]{background:var(--pearl);color:var(--charcoal);border-color:var(--pearl)}
  #pricing .rail-m>.price{border-color:var(--hair-d2);box-shadow:var(--card-glow)}
  #pricing .price{padding:1.15rem}
  #pricing .price-foot{padding:.75rem .75rem .75rem .9rem}
  #pricing .amt b{font-size:2.6rem}
}

/* Final CTA: the supplied office photograph, people kept clear of the copy */
.final .bg-photo{inset:-4% 0}
.final .bg-photo img{width:100%;height:100%;object-fit:cover;object-position:50% 28%;filter:none}
.final:has(.bg-photo){align-items:flex-end;min-height:clamp(34rem,88vh,50rem)}
.final:has(.bg-photo)::after{background:linear-gradient(180deg,rgba(26,29,32,.1) 0%,rgba(26,29,32,.15) 38%,rgba(26,29,32,.82) 70%,var(--charcoal-3) 100%),linear-gradient(90deg,rgba(26,29,32,.55) 0%,var(--shade-0) 55%)}
.final:has(.bg-photo) h2{max-width:20ch}
.final:has(.bg-photo) .wrap{width:100%;padding-bottom:calc(clamp(2.5rem,6vw,4rem) + var(--curtain))}
@media (min-width:760px){.final .bg-photo img{object-position:50% 22%}}
@media (max-width:759px){
  .final:has(.bg-photo){display:block;min-height:0;background:var(--charcoal-3)}
  .final .bg-photo{position:relative;inset:auto;height:clamp(16rem,72vw,22rem);overflow:hidden}
  .final .bg-photo img{object-position:46% 30%}
  .final .bg-photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,var(--shade-0) 55%,var(--charcoal-3) 100%)}
  .final:has(.bg-photo)::after{display:none}
  .final:has(.bg-photo) .wrap{padding-top:.5rem}
}

/* Footer: compact, centred, black */
.foot.foot-dark{background:var(--foot-bg);color:var(--on-dark);text-align:center;padding-block:calc(var(--curtain) + clamp(2.25rem,5vw,3.25rem)) 1.25rem}
.foot-dark .wrap{display:grid;justify-items:center;gap:1.1rem}
.foot-dark .mark{font-size:clamp(2.2rem,4vw,3rem);color:var(--pearl)}
.foot-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:.5rem 1.6rem;font-size:.9375rem}
.foot-nav a{color:var(--on-dark);text-decoration:none;padding-block:.25rem}
.foot-contact{display:flex;flex-wrap:wrap;justify-content:center;gap:.35rem .75rem;color:var(--on-dark-2);font-size:.9375rem;margin:0}
.foot-contact a{color:var(--pearl);text-decoration:none}
.foot-social{display:grid;place-items:center;width:var(--tap);height:var(--tap);border-radius:50%;color:var(--pearl);box-shadow:inset 0 0 0 var(--line) var(--hair-d2)}
.foot-social svg{width:1.25rem;height:1.25rem}
.foot-base{width:100%;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.6rem 1.5rem;margin-top:.6rem;padding-top:1rem;border-top:var(--line) solid var(--hair-d)}
.foot-dark .legal{margin:0;padding:0;border:0;gap:1.25rem;font-size:.875rem}
.foot-dark .legal a{color:var(--on-dark-2)}
.foot-dark .copy-line{margin:0;color:var(--on-dark-2)}
@media (max-width:759px){
  .foot.foot-dark{padding-block:calc(var(--curtain) + 2rem) 1.1rem}
  .foot-nav{gap:.35rem 1.1rem;font-size:.9rem}
  .foot-contact{flex-direction:column;gap:.15rem}
  .foot-contact span[aria-hidden]{display:none}
  .foot-base{justify-content:center;text-align:center}
}

/* ===== Round 3 hero: Kling video background + oversized translucent wordmark (Homevia-inspired) ===== */
:root{--hv-zoom:1.07; --hv-ink:#0A0B0C}
.hero.hv{min-height:100svh;justify-content:flex-end;background:var(--hv-ink);padding:calc(var(--hdr-h) + 2rem) 0 calc(var(--curtain) + clamp(2.5rem,7vh,4.5rem))}
.hero.hv::before{display:none}
.hv-media{position:absolute;inset:0;overflow:hidden;transform:scale(var(--hv-zoom));transform-origin:18% 12%}
.hv-video{display:block;width:100%;height:100%;object-fit:cover;object-position:30% 40%;filter:brightness(.74) saturate(.8)}
.hv-shade{position:absolute;inset:0;z-index:1;opacity:.94;pointer-events:none;background:linear-gradient(180deg,rgba(10,11,12,.62) 0%,rgba(10,11,12,.12) 30%,rgba(10,11,12,.3) 56%,rgba(10,11,12,.9) 100%),linear-gradient(90deg,rgba(10,11,12,.72) 0%,rgba(10,11,12,0) 62%)}
.hv-word{position:absolute;left:0;right:0;top:calc(var(--hdr-h) + 1.5vh);z-index:1;margin:0;text-align:center;font-family:var(--display);font-size:min(33vw,40rem);line-height:.8;letter-spacing:-.03em;white-space:nowrap;pointer-events:none;transform-origin:50% 0}
.hv-word span{display:inline-block}
.hv-word i{display:inline-block;font-style:normal;background:linear-gradient(180deg,rgba(243,243,241,.7) 0%,rgba(243,243,241,.3) 46%,rgba(243,243,241,.02) 92%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;-webkit-text-stroke:var(--line) rgba(243,243,241,.26)}
.hero.hv .hero-copy{z-index:2}
.hv-note{z-index:3;bottom:calc(var(--curtain) + .75rem)}
@media (max-width:979px){
  .hero.hv{min-height:94svh;padding-bottom:calc(var(--curtain) + 2rem)}
  .hv-media{transform-origin:40% 30%}
  .hv-video{object-position:30% 45%}
  .hv-word{font-size:34vw;top:calc(var(--hdr-h) + 1.25rem)}
  .hv-shade{background:linear-gradient(180deg,rgba(10,11,12,.55) 0%,rgba(10,11,12,.1) 26%,rgba(10,11,12,.25) 46%,rgba(10,11,12,.86) 72%,var(--hv-ink) 100%)}
}
@media (prefers-reduced-motion:reduce){.hv-media{transform:scale(var(--hv-zoom))}}

/* Hero wordmark, refined (2026-11-10): a faint watermark integrated into the video, not a headline */
:root{--hv-word-a:.13; --hv-word-b:.05; --hv-word-line:.14}
.hv-word i{background:linear-gradient(180deg,rgba(243,243,241,var(--hv-word-a)) 0%,rgba(243,243,241,var(--hv-word-b)) 55%,rgba(243,243,241,0) 96%);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:var(--line) rgba(243,243,241,var(--hv-word-line))}
.hv-word{mix-blend-mode:difference}
@media (max-width:979px){.hero.hv{padding-bottom:calc(var(--curtain) + 3rem)}}
