/* The Phone Thread: chapters below the carousel. Motion uses transform and opacity only (PIN, SCRUB, BEAT, HAND-OFF). */
.pt{--top:80px;--capH:212px;--shrink:.9;--shrink1:1;position:relative;background:var(--sw-bg,#10131a);color:var(--cream);transition:background-color .6s}
.pt-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pt .eyebrow,.pt-founder .eyebrow,.pt-faq .eyebrow,.pt-finale .eyebrow{font-size:12px;letter-spacing:.14em}
.pt-label,.pt-static-label{font-size:12px;line-height:1.4;letter-spacing:.02em;color:rgba(243,240,233,.78)}
/* Static frames: the reduced-motion and no-script layout (three frames per chapter, about one screen each) */
.pt-ch{padding:64px 6vw 56px;position:relative}
.pt-ch+.pt-ch{border-top:1px solid rgba(243,240,233,.14)}
.pt-static{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.pt-static h3{font-size:15px;font-weight:600;line-height:1.2;letter-spacing:-.02em;margin-top:12px}
.pt-static h3 em{color:var(--volt);font-size:1.12em}
.pt-static p{font-size:12px;line-height:1.45;color:rgba(243,240,233,.8);margin-top:6px}
.pt-frame{position:relative;display:block;aspect-ratio:390/822;border-radius:14px;overflow:hidden;background:#000;border:3px solid #050506;box-shadow:0 18px 40px #0007}
.pt-frame img{position:absolute;inset:0 0 auto;width:100%;height:auto}
.pt-frame .pt-frame-scroll{transform:translateY(-33.7%)}
.pt-frame-dim{position:absolute;inset:0;background:#000;opacity:.5}
.pt-frame.is-dim img{opacity:.55}
.pt-frame .pt-frame-sheet{height:100%;object-fit:cover}
.pt-static-foot,.pt-static-price,.pt-static-ctas{margin-top:22px}
.pt-static-label{margin-top:18px}
.pt-price{font-size:15px;line-height:1.5;color:rgba(243,240,233,.86)}
.pt-price strong{font-size:22px;color:var(--cream);letter-spacing:-.02em}
.pt-foot{font-size:12px;line-height:1.45;color:rgba(243,240,233,.78)}
.pt-ctas{display:flex;flex-wrap:wrap;align-items:center;gap:6px 22px}
.pt .button.pt-share,.pt-finale .pt-share{min-height:56px;padding:0 24px;background:var(--volt);border-color:var(--volt);color:var(--ink);font-size:15px;font-weight:600;margin:0}
.pt .text-link{font-size:13px;color:var(--cream)}
.pt-chip{position:absolute;top:9%;left:50%;transform:translateX(-50%);padding:5px 10px;border-radius:99px;background:rgba(11,11,12,.82);color:var(--cream);font-size:12px;font-weight:600;letter-spacing:.02em;white-space:nowrap;border:1px solid rgba(243,240,233,.3)}
.pt-chip.is-live,.pt-chip-b{background:var(--volt);color:var(--ink);border-color:var(--volt)}
.pt-mark{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);padding:4px 8px;border-radius:99px;background:var(--cream);color:var(--ink);font-size:12px;font-weight:600;white-space:nowrap;box-shadow:0 0 0 4px rgba(222,255,142,.55)}
.pt-static .pt-mark{display:none}.pt-static .pt-chip{font-size:12px;padding:3px 7px;white-space:nowrap;top:4%;padding:3px 6px}
.pt-stage{display:none}
/* Motion layout: one sticky stage carries the phone through both chapters */
html.pt-on .pt-ch{height:var(--len);padding:0;border:0}
html.pt-on #your-website{--len:240svh}
html.pt-on #how-it-works{--len:180svh}
html.pt-on .pt-ch>*{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
html.pt-on .pt-ch>.pt-static,html.pt-on .pt-ch>.pt-static-ctas,html.pt-on .pt-ch>.pt-static-foot,html.pt-on .pt-ch>.pt-static-label{display:none}
html.pt-on #your-website{margin-top:-100svh}
html.pt-on .pt-stage{display:grid;position:sticky;top:0;height:100svh;grid-template-rows:var(--top) 26px minmax(0,1fr) var(--capH);padding:0 6vw;contain:layout paint;z-index:1;overflow:hidden}
.pt-rail{grid-row:2;display:flex;align-items:center;gap:14px}
.pt-ticks{flex:1;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.pt-ticks i{height:3px;background:rgba(243,240,233,.22);overflow:hidden;position:relative}
.pt-ticks i::after{content:"";position:absolute;inset:0;background:var(--sw-accent,#9db0ff);transform-origin:0 50%;transform:scaleX(clamp(0,calc(var(--pc,0)*3 - var(--k)),1))}
.pt-step{font-size:12px;letter-spacing:.08em;font-variant-numeric:tabular-nums;color:rgba(243,240,233,.82)}
.pt-phone-box{grid-row:3;display:flex;justify-content:center;align-items:center;min-height:0;padding:10px 0}
.pt-phone{height:min(392px,100%);aspect-ratio:186/392;border-radius:26px;padding:5px;background:#050506;box-shadow:0 0 0 1px #ffffff1f,0 30px 70px #000a;transform-origin:50% 0;transform:translate3d(0,calc(var(--ho,0)*-8px),0) scale(calc((1 - var(--ho,0)*.035 + var(--ho,0)*var(--ho,0)*.035)*(1 - (1 - var(--shrink1))*var(--k1,0) - (1 - var(--shrink))*var(--k2,0))));will-change:transform}
.pt-screen{position:relative;width:100%;height:100%;border-radius:21px;overflow:hidden;background:#000;contain:paint}
.pt-tall{position:absolute;left:0;top:0;width:100%;height:auto;transform:translate3d(0,calc(var(--scr,0)*var(--S)*-1%),0);will-change:transform}
.pt-hero{position:absolute;inset:0;opacity:var(--hero,1)}
.pt-hero img,.pt-hero video{position:absolute;left:0;top:0;width:100%;height:auto}
.pt-hero video{object-fit:cover;opacity:0;transition:opacity .4s}
.pt-hero video.is-live{opacity:1}
.pt-dim{position:absolute;inset:0;background:#000;opacity:var(--dim,0)}
.pt-sheet{position:absolute;left:0;top:0;width:100%;height:100%;transform:translate3d(0,calc((1 - var(--sh,0))*100%),0)}
.pt-stage .pt-chip{opacity:0;transition:opacity .35s}
.pt[data-beat^="2"] .pt-chip-a,.pt[data-beat="h"] .pt-chip-a{opacity:1}
.pt[data-beat="2c"] .pt-chip-a{opacity:0}
.pt[data-beat="2c"] .pt-chip-b{opacity:1}
.pt-stage .pt-mark{opacity:0;transform:translate(-50%,-50%) scale(.6);transition:opacity .3s,transform .4s cubic-bezier(.2,.8,.2,1)}
.pt[data-beat="2b"] .pt-stage .pt-mark{opacity:1;transform:translate(-50%,-50%) scale(1)}
.pt[data-beat="2b"] .pt-stage .pt-mark+.pt-mark{transition-delay:.12s}
.pt-caps{grid-row:4;position:relative;display:flex;flex-direction:column;justify-content:flex-end}
.pt-lane{height:calc(80px + env(safe-area-inset-bottom));padding:10px 108px 0 0;flex:none}
.pt-cap{display:none}
.pt-cap h3{font-size:clamp(28px,8vw,36px);font-weight:500;line-height:1.02;letter-spacing:-.05em}
.pt-cap h3 em{color:var(--volt);font-size:1.1em;letter-spacing:-.03em}
.pt-cap h3.one{font-size:clamp(26px,7.4vw,34px)}
.pt-cap>p{font-size:14px;line-height:1.45;color:rgba(243,240,233,.86);margin-top:10px;max-width:34em}
.pt-cap .pt-price{margin-top:8px}
.pt-cap .pt-ctas{margin-top:12px}
.pt-cap .pt-foot{margin-top:8px}
.pt-cap .text-link{margin-top:6px}
.ln{display:block;overflow:hidden;padding-bottom:.06em}
.ln>*{display:inline-block}
.pt[data-beat="1a"] [data-cap="1a"],.pt[data-beat="1b"] [data-cap="1b"],.pt[data-beat="1c"] [data-cap="1c"],.pt[data-beat="2a"] [data-cap="2a"],.pt[data-beat="2b"] [data-cap="2b"],.pt[data-beat="2c"] [data-cap="2c"]{display:block}
.pt-cap .ln>*{animation:ptLine .55s cubic-bezier(.2,.8,.2,1) both}
.pt-cap .ln+.ln>*{animation-delay:.07s}
.pt-cap>p,.pt-cap>a,.pt-cap>.pt-ctas{animation:ptFade .45s .12s both}
@keyframes ptLine{from{transform:translateY(105%)}to{transform:none}}
@keyframes ptFade{from{opacity:0}to{opacity:1}}
.pt-stage .pt-label,.pt-lane .pt-foot{display:none;margin:0}
.pt[data-beat="2c"] .pt-lane .pt-foot{display:block}
.pt[data-beat^="1"] .pt-label[data-ch="1"],.pt[data-beat="2a"] .pt-label[data-ch="2"],.pt[data-beat="2b"] .pt-label[data-ch="2"]{display:block}
@media(max-height:760px){.pt{--top:76px;--capH:198px;--shrink:.82;--shrink1:.94}.pt-cap h3{font-size:clamp(26px,7.2vw,32px)}.pt-cap h3.one{font-size:26px}.pt-cap>p{font-size:13px;margin-top:8px}[data-cap="2c"] .pt-price{font-size:13px}[data-cap="2c"] .pt-price strong{font-size:18px}.pt-cap .pt-ctas{margin-top:8px}}
@media(max-height:700px){.pt{--capH:190px;--shrink:.78;--shrink1:.92}}
@media(max-height:660px){.pt{--capH:186px;--shrink:.7;--shrink1:.9}}
@media(min-width:800px){
  .pt-lane{height:auto;padding:16px 0 0}
  html.pt-on .pt-stage{grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:110px 30px minmax(0,1fr) 60px;column-gap:6vw;padding:0 8vw}
  .pt-rail{grid-column:1/-1}
  .pt-phone-box{grid-row:3}
  .pt-caps{grid-row:3;grid-column:2;align-self:center}
  .pt-cap h3{font-size:clamp(44px,4.4vw,64px)}.pt-cap h3.one{font-size:clamp(40px,4vw,56px)}.pt-cap>p{font-size:17px}
  .pt-phone{border-radius:34px;padding:7px}.pt-screen{border-radius:28px}
  .pt-ch{padding:90px 8vw}.pt-static{max-width:900px;gap:28px}.pt-static h3{font-size:22px}.pt-static p{font-size:14px}
}
/* Founder: static, one plain headline, three plain promise rows */
.pt-founder{display:block;padding-top:64px;padding-bottom:56px}
.pt-founder h2{font-size:clamp(32px,8.6vw,56px);line-height:1.05;letter-spacing:-.05em;max-width:14em}
.pt-founder .founder-lead{margin-top:22px;font-size:clamp(20px,5.4vw,28px);max-width:30em}
.pt-founder>p:not(.founder-lead):not(.founder-links):not(.founder-sign):not(.eyebrow){font-size:15px;line-height:1.65;margin-top:16px;color:#41413d;max-width:36em}
.pt-promises{list-style:none;padding:0;margin:22px 0 0;max-width:36em}
.pt-promises li{font-size:16px;line-height:1.45;padding:12px 0;border-top:1px solid var(--line)}
.pt-promises li:last-child{border-bottom:1px solid var(--line)}
.pt-founder .founder-sign{margin-top:18px}
.pt-founder .founder-sign em{font-size:36px}
.pt-founder .founder-links{margin-top:8px}
.pt-reveal .ln>*{transform:translateY(105%);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
.pt-reveal.is-in .ln>*,html:not(.pt-on) .pt-reveal .ln>*{transform:none}
/* FAQ: five full-width rows, a 40px headline at most */
.pt-faq{display:block}
.pt-faq h2{font-size:clamp(30px,8vw,40px);line-height:1.05;margin-bottom:24px;letter-spacing:-.05em}
.pt-faq .faq-list{width:100%;max-width:820px}
.pt-faq-salon>p{font-size:15px;line-height:1.7;color:#45453f;margin-bottom:10px;max-width:94%}
.pt-faq-links{display:flex;flex-wrap:wrap;gap:0 24px;padding-bottom:18px}
/* Finale: the seven worlds return */
.pt-finale{background:#0b0b0c;color:var(--cream);padding-top:40px;overflow:hidden}
.pt-finale h2{transform:none!important;font-size:clamp(52px,14vw,120px);line-height:.92;margin:6px 0 18px;letter-spacing:-.06em}
.pt-finale h2 em{color:var(--volt);font-size:1em}
.pt-finale .eyebrow{margin:18px 0 10px;color:rgba(243,240,233,.84)}
.pt-fan{position:relative;height:clamp(250px,64vw,380px);margin:0 -6vw;contain:layout paint}
.pt-fan img{position:absolute;left:50%;top:14px;width:clamp(104px,27vw,160px);height:auto;margin-left:calc(clamp(104px,27vw,160px)/-2);border-radius:14px;border:3px solid #050506;box-shadow:0 18px 40px #000a;z-index:calc(10 - var(--a));transform-origin:50% 120%;transform:translate3d(calc(var(--i)*var(--fan,1)*clamp(40px,11vw,70px)),calc(var(--a)*var(--fan,1)*12px + (1 - var(--fan,1))*70px),0) rotate(calc(var(--i)*var(--fan,1)*6.5deg));opacity:calc(.35 + var(--fan,1)*.65)}
.pt-fin-label{text-align:center}
.pt-finale .pt-price{margin-bottom:20px;max-width:30em}
.pt-fin-ctas{display:grid;gap:12px;margin-bottom:46px;max-width:480px}
.pt-finale .pt-ghost{min-height:56px;margin:0;background:transparent;border-color:rgba(243,240,233,.5);color:var(--cream);font-size:15px}
@media(min-width:800px){.pt-finale .pt-fan{margin:0}.pt-fin-label{text-align:left}}
@media(min-width:1100px){
  html.pt-on .pt-stage{grid-template-rows:110px 30px 680px 60px;min-height:880px}
  .pt-phone{height:640px;max-height:none}
  .pt-founder,.questions.pt-faq{width:min(1100px,calc(100% - 96px));margin-inline:auto}
}
/* Footer: Reduce motion sits with the legal links */
.footer nav[aria-label="Legal"] .motion-toggle{display:inline-flex;align-items:center;min-height:44px;margin-block:-12px;padding:0;font-size:12px;color:#45453f}
.footer nav[aria-label="Legal"] .motion-toggle[hidden]{display:none}
@media(prefers-reduced-motion:reduce){.pt-cap .ln>*,.pt-cap>p,.pt-cap>a,.pt-cap>.pt-ctas{animation:none}.pt-reveal .ln>*{transition:none;transform:none}}

/* 44px taps: founder links and the footer DGENIUS mark */
.founder-links a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.footer div a{display:inline-flex;align-items:center;min-height:44px}
/* Labels >=12px below the carousel; footer wordmark is a 44px tap target (same footer height) */
#start label>span{font-size:12px}
.footer>div>span{font-size:12px!important}
.footer .wordmark{display:flex;align-items:center;min-height:44px;margin-block:-5px}