/* Homepage (shown to visitors who aren't logged in). Everything is scoped to #landing. */
html:not(.app-mode) #app,html:not(.app-mode) #tabs{display:none!important}
html.app-mode #landing{display:none!important}
#landing{--lp-max:1120px;--lp-pink:var(--accent,#f28cb5);--lp-soft:#26272b;color:var(--ink);font-size:16px;line-height:1.55;overflow-x:hidden}
#landing *{box-sizing:border-box}
#landing a{color:inherit;text-decoration:none}
#landing img,#landing video{display:block;max-width:100%}
.lp-in{max-width:var(--lp-max);margin:0 auto;padding:0 20px}

/* top bar */
.lp-nav{position:sticky;top:0;z-index:20;background:rgba(20,21,23,.78);-webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);border-bottom:1px solid rgba(255,255,255,.06);padding-top:env(safe-area-inset-top)}
.lp-nav .lp-in{display:flex;align-items:center;gap:10px;height:62px}
.lp-brand{display:flex;align-items:center;gap:9px;font-weight:750;font-size:17px;letter-spacing:-.01em;margin-right:auto}
.lp-brand img{width:32px;height:32px;border-radius:9px}
.lp-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;border-radius:999px;font-weight:700;font-size:15px;padding:12px 20px;border:1px solid transparent;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s;white-space:nowrap;font-family:inherit}
.lp-btn:active{transform:scale(.97)}
#landing .lp-btn.pri{background:var(--lp-pink);color:#1b1214;box-shadow:0 8px 28px -10px var(--lp-pink)}
.lp-btn.pri:hover{box-shadow:0 10px 34px -8px var(--lp-pink)}
.lp-btn.sec{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:var(--ink)}
.lp-btn.sm{padding:8px 14px;font-size:14px}
.lp-nav .lp-login{color:var(--muted);font-weight:600;font-size:14px;padding:8px 6px}

/* hero */
.lp-hero{position:relative;padding:44px 0 30px}
.lp-hero:before{content:"";position:absolute;inset:-120px -20% auto;height:640px;background:radial-gradient(closest-side,rgba(242,140,181,.22),transparent 70%) 70% 20%/70% 80% no-repeat,radial-gradient(closest-side,rgba(143,179,236,.12),transparent 70%) 10% 70%/60% 70% no-repeat;pointer-events:none;z-index:-1}
.lp-hero .lp-in{display:grid;gap:34px;align-items:center}
.lp-pill{display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;color:var(--lp-pink);background:rgba(242,140,181,.12);border:1px solid rgba(242,140,181,.25);padding:6px 12px;border-radius:999px}
.lp-pill i{width:7px;height:7px;border-radius:50%;background:var(--lp-pink);box-shadow:0 0 0 0 rgba(242,140,181,.6);animation:lp-ping 1.8s infinite}
@keyframes lp-ping{0%{box-shadow:0 0 0 0 rgba(242,140,181,.55)}80%,100%{box-shadow:0 0 0 9px rgba(242,140,181,0)}}
.lp-hero h1{font-size:clamp(38px,9vw,64px);line-height:1.04;letter-spacing:-.035em;margin:16px 0 14px;font-weight:800}
.lp-hero h1 em{font-style:normal;background:linear-gradient(90deg,#f7a8c8,#f28cb5 40%,#c9a7f5);-webkit-background-clip:text;background-clip:text;color:transparent}
.lp-lead{font-size:18px;color:#b9bbc1;margin:0 0 22px;max-width:540px}
.lp-ctas{display:flex;gap:10px;flex-wrap:wrap}
.lp-trust{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:18px;font-size:13.5px;color:var(--muted)}
.lp-trust span:before{content:"✓";color:#7fd6a4;font-weight:800;margin-right:6px}
.lp-stage{position:relative;display:flex;justify-content:center;min-height:520px}
.lp-float{position:absolute;z-index:3;background:rgba(30,32,35,.92);border:1px solid rgba(255,255,255,.1);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:14px;padding:10px 12px;font-size:13px;box-shadow:0 18px 40px -18px rgba(0,0,0,.8);display:flex;gap:9px;align-items:center;animation:lp-bob 5s ease-in-out infinite}
.lp-float b{display:block;font-size:13.5px}.lp-float small{color:var(--muted);font-size:12px}
.lp-float .ic{width:30px;height:30px;border-radius:9px;display:grid;place-items:center;font-size:16px}
.lp-f1{left:0;top:16%}.lp-f1 .ic{background:rgba(127,214,164,.16)}
.lp-f2{right:0;bottom:18%;animation-delay:-2.5s}.lp-f2 .ic{background:rgba(242,140,181,.16)}
@keyframes lp-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}

/* phone frame */
.lp-phone{position:relative;width:min(280px,72vw);border-radius:40px;padding:9px;background:linear-gradient(145deg,#3a3c42,#151618);box-shadow:0 0 0 1px rgba(255,255,255,.08),0 40px 80px -30px rgba(0,0,0,.9),0 0 90px -30px rgba(242,140,181,.35);flex:none}
.lp-phone>video,.lp-phone>img{width:100%;height:auto;aspect-ratio:540/1011;object-fit:cover;object-position:top;border-radius:32px;background:#141517}
.lp-phone.sm{width:min(230px,62vw);border-radius:34px;padding:7px}.lp-phone.sm>img{border-radius:28px}

/* sections */
.lp-sec{padding:64px 0}
.lp-kicker{font-size:13px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lp-pink);margin:0 0 10px}
#landing h2{font-size:clamp(28px,6vw,42px);line-height:1.1;letter-spacing:-.03em;margin:0 0 12px;font-weight:800;text-transform:none;color:var(--ink)}
#landing h3{text-transform:none;color:var(--ink)}
.lp-sub{color:#a9abb2;font-size:17px;margin:0 0 30px;max-width:620px}
.lp-center{text-align:center}.lp-center .lp-sub{margin-left:auto;margin-right:auto}

.lp-pains{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.lp-pain{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;font-size:14.5px;color:#c9cbd0}
.lp-pain .em{font-size:26px;display:block;margin-bottom:8px}
.lp-pain s{color:var(--muted)}
.lp-arrow{margin:26px auto 0;text-align:center;font-size:18px;font-weight:700}
.lp-arrow b{color:var(--lp-pink)}

.lp-steps{display:grid;gap:56px}
.lp-step{display:grid;gap:26px;align-items:center}
.lp-step .lp-phone{margin:0 auto}
.lp-num{width:38px;height:38px;border-radius:12px;background:rgba(242,140,181,.14);color:var(--lp-pink);display:grid;place-items:center;font-weight:800;margin-bottom:12px}
.lp-step h3{font-size:26px;letter-spacing:-.02em;margin:0 0 8px;line-height:1.15}
.lp-step p{color:#a9abb2;margin:0 0 12px}
.lp-ticks{list-style:none;padding:0;margin:0;display:grid;gap:7px;font-size:15px}
.lp-ticks li{display:flex;gap:9px}.lp-ticks li:before{content:"";flex:none;width:18px;height:18px;margin-top:3px;border-radius:50%;background:rgba(127,214,164,.16) url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fd6a4' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><path d='M6 12l4 4 8-8'/></svg>") center/12px no-repeat}

.lp-grid{display:grid;gap:12px;grid-template-columns:1fr 1fr}
.lp-feat{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:16px;transition:transform .2s,border-color .2s}
.lp-feat:hover{transform:translateY(-3px);border-color:rgba(242,140,181,.35)}
.lp-feat .ic{font-size:22px;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:var(--lp-soft);margin-bottom:10px}
.lp-feat b{display:block;font-size:15.5px;margin-bottom:3px}
.lp-feat span{font-size:13.5px;color:var(--muted);line-height:1.45;display:block}

.lp-shots{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 20px 18px;margin:0 -20px;scrollbar-width:none}
.lp-shots::-webkit-scrollbar{display:none}
.lp-shot{scroll-snap-align:center;flex:none;text-align:center}
.lp-shot figcaption{margin-top:12px;font-weight:700;font-size:15px}.lp-shot figcaption small{display:block;color:var(--muted);font-weight:500;font-size:13px}
.lp-url{display:inline-flex;gap:0;align-items:center;margin:0 0 26px;background:var(--card);border:1px solid var(--line);border-radius:999px;padding:8px 14px;font-size:14.5px;color:#c9cbd0}
.lp-url b{color:var(--lp-pink)}

.lp-dash{display:grid;gap:30px;align-items:center}
.lp-dash>*,.lp-step>*,.lp-hero .lp-in>*{min-width:0}
.lp-dash .pair .lp-phone.sm{width:min(220px,43vw);border-radius:28px;padding:6px}.lp-dash .pair .lp-phone.sm>img{border-radius:23px}
.lp-dash .pair{display:flex;gap:14px;justify-content:center}
.lp-dash .pair .lp-phone.sm:nth-child(2){margin-top:46px}
.lp-dash .pair{padding-bottom:46px}

.lp-faq{max-width:760px;margin:0 auto}
.lp-faq details{border-bottom:1px solid var(--line);padding:4px 0}
.lp-faq summary{list-style:none;cursor:pointer;padding:16px 34px 16px 0;font-weight:700;font-size:16.5px;position:relative}
.lp-faq summary::-webkit-details-marker{display:none}
.lp-faq summary:after{content:"+";position:absolute;right:4px;top:12px;font-size:24px;font-weight:400;color:var(--lp-pink);transition:transform .2s}
.lp-faq details[open] summary:after{transform:rotate(45deg)}
.lp-faq details p{margin:0 0 16px;color:#a9abb2}

.lp-final{position:relative;margin:20px 0 0;padding:56px 24px;border-radius:28px;text-align:center;background:radial-gradient(120% 140% at 50% 0%,rgba(242,140,181,.25),rgba(242,140,181,.04) 60%),var(--card);border:1px solid rgba(242,140,181,.22);overflow:hidden}
.lp-final h2{margin-bottom:10px}
.lp-final p{color:#b9bbc1;margin:0 0 22px}
.lp-foot{padding:40px 0 calc(40px + env(safe-area-inset-bottom));color:var(--muted);font-size:14px}
.lp-foot .lp-in{display:flex;flex-wrap:wrap;gap:14px 22px;align-items:center}
.lp-foot .lp-brand{font-size:15px;color:var(--ink)}
.lp-foot a:hover{color:var(--ink)}
.lp-mbar{position:fixed;left:0;right:0;bottom:0;z-index:25;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(to top,rgba(20,21,23,.98) 60%,rgba(20,21,23,0));transform:translateY(110%);transition:transform .3s}
.lp-mbar.on{transform:none}
.lp-mbar .lp-btn{width:100%}

/* privacy pop-up */
.lp-modal{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.6);display:none;align-items:flex-end;justify-content:center}
.lp-modal.on{display:flex}
.lp-modal>div{background:var(--card);border:1px solid var(--line);border-radius:22px 22px 0 0;max-width:640px;width:100%;max-height:86vh;overflow:auto;padding:20px 20px calc(20px + env(safe-area-inset-bottom))}
.lp-modal h3{margin:0 0 6px;font-size:20px}

/* scroll reveal */
.lp-rv{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s ease}
.lp-rv.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.lp-rv{opacity:1;transform:none;transition:none}.lp-float,.lp-pill i{animation:none}}

@media (min-width:760px){
  .lp-hero{padding:70px 0 50px}
  .lp-hero .lp-in{grid-template-columns:1.05fr .95fr}
  .lp-pains{grid-template-columns:repeat(4,1fr)}
  .lp-step{grid-template-columns:1fr 1fr;gap:60px}
  .lp-step:nth-child(even) .lp-txt{order:2}
  .lp-grid{grid-template-columns:repeat(3,1fr)}
  .lp-shots{justify-content:center;overflow:visible}
  .lp-dash{grid-template-columns:1fr 1fr}
  .lp-mbar{display:none}
  .lp-modal{align-items:center}.lp-modal>div{border-radius:22px}
}
@media (min-width:1000px){.lp-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:420px){.lp-nav .lp-btn.sm{padding:8px 12px;font-size:13px}.lp-brand span{font-size:16px}.lp-float{transform:scale(.92)}.lp-f1{left:-6px}.lp-f2{right:-6px}}