@font-face{font-family:'Nunito';font-style:normal;font-weight:200 1000;font-display:swap;src:url(../fonts/nunito-latin-wght-normal.woff2) format('woff2')}
:root{padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px);
--bg:#F5F6F0;--ink:#2A1F1A;--muted:#6F625B;--line:#E4E3D8;--soft:#ECECE1;--peach:#FBE0D6;
--orange:#DB5E39;--orange-d:#C24A28;--font:'Nunito','Helvetica Neue',Arial,sans-serif}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:5rem}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.65 var(--font);overflow-x:hidden}
a{color:inherit}
:focus-visible{outline:3px solid var(--orange-d);outline-offset:3px}
.wrap{max-width:68rem;margin:0 auto;padding:0 1.5rem}
.narrow{max-width:44rem}
.center{text-align:center}

nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:5;background:rgba(245,246,240,.92);backdrop-filter:blur(10px)}
nav .wrap{display:flex;align-items:center;justify-content:space-between;height:4.6rem}
.logo img{display:block;height:46px;width:auto}
nav ul{display:flex;align-items:center;gap:1.8rem;list-style:none;margin:0;padding:0}
nav ul a{text-decoration:none;font-weight:600;color:var(--muted)}
nav ul a:hover{color:var(--orange-d)}
.pill{background:var(--orange-d);color:#fff!important;border-radius:999px;padding:.55rem 1.3rem;font-weight:700!important}
.pill:hover{background:var(--ink)}
@media(max-width:640px){nav ul li:not(:last-child){display:none}}

.hero{padding:4rem 0 3rem;text-align:center}
.tag{display:inline-block;background:var(--peach);color:var(--orange-d);border-radius:999px;padding:.4rem 1.1rem;font-weight:700;font-size:.92rem;margin-bottom:1.6rem}
h1{font-weight:900;font-size:clamp(2.6rem,7.5vw,5rem);line-height:1.02;letter-spacing:-.03em;margin:0 auto 1.3rem;max-width:15ch}
h1 em{font-style:normal;color:var(--orange)}
.lead{font-size:1.2rem;color:var(--muted);max-width:32rem;margin:0 auto 2rem}
.stores{display:flex;flex-wrap:wrap;gap:.8rem;justify-content:center}
.store{display:inline-flex;flex-direction:column;background:var(--ink);color:#fff;border-radius:1rem;padding:.6rem 1.5rem;line-height:1.2;text-align:left}
.store small{font-size:.72rem;opacity:.7}
.store b{font-weight:800;font-size:1.1rem}
.phones{display:flex;justify-content:center;align-items:flex-end;gap:1.5rem;margin-top:4rem}
.phone{width:280px;background:var(--ink);border-radius:2.6rem;padding:.6rem;text-align:left;flex:none;box-shadow:0 2rem 3.5rem -1.5rem rgba(42,31,26,.4)}
.phone.side{display:none;transform:translateY(2.5rem);opacity:.95}
@media(min-width:900px){.phone.side{display:block}}
.screen{background:#fff;border-radius:2.1rem;padding:1.5rem 1.1rem 1.2rem;min-height:500px}
.screen .sh{font-weight:900;font-size:1.3rem;line-height:1.15;margin:.4rem 0 1rem}
.c{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.c span{background:var(--soft);border-radius:999px;padding:.3rem .8rem;font-size:.9rem;font-weight:700}
.go{background:var(--orange-d);color:#fff;text-align:center;border-radius:999px;padding:.7rem;font-weight:800;margin-bottom:1.1rem}
.r{border:1.5px solid var(--line);border-radius:1rem;padding:.75rem .9rem;margin-bottom:.6rem}
.r b{display:block;font-weight:800}
.r small{color:var(--muted)}
.r.top{background:var(--peach);border-color:var(--peach)}
.pop{animation:pop .45s cubic-bezier(.2,1.4,.4,1) backwards;animation-delay:calc(var(--i)*.28s + .3s)}
.rise{animation:rise .6s ease-out backwards;animation-delay:calc(var(--i)*.25s + 1.9s)}
@keyframes pop{from{opacity:0;transform:scale(.4)}}
@keyframes rise{from{opacity:0;transform:translateY(1.2rem)}}
.cap{font-size:.85rem;color:var(--muted);margin-top:1.6rem}

section{padding:6rem 0}
h2{font-weight:900;font-size:clamp(2rem,4.5vw,3.1rem);line-height:1.08;letter-spacing:-.02em;margin:0 0 1rem}
.sub{color:var(--muted);font-size:1.15rem;max-width:34rem;margin:0 auto 3.5rem}
.why{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem;text-align:left}
@media(max-width:800px){.why{grid-template-columns:1fr;gap:2.2rem}}
.why b{display:grid;place-items:center;width:2.8rem;height:2.8rem;border-radius:50%;background:var(--orange-d);color:#fff;font-weight:800;margin-bottom:1rem}
.why h3{font-weight:800;font-size:1.3rem;margin:0 0 .5rem}
.why p{margin:0;color:var(--muted)}
.block{border-radius:2rem;margin:0 1rem;padding:5rem 1.5rem;text-align:center}
.feature{background:var(--orange-d);color:#fff}
.feature .tag{background:rgba(255,255,255,.18);color:#fff}
.feature h2{color:#fff}
.feature p{color:#FFE7DF;max-width:32rem;margin:0 auto}
details{border-bottom:1.5px solid var(--line);padding:1.3rem 0;text-align:left}
summary{font-weight:800;font-size:1.15rem;cursor:pointer}
details p{margin:.7rem 0 0;color:var(--muted)}
.cta{background:var(--ink);color:#fff}
.cta h2{color:#fff}
.cta p{color:#CFC4BD;max-width:30rem;margin:0 auto 2rem}
.btn{display:inline-block;background:var(--orange);color:#fff;text-decoration:none;font-weight:800;padding:1rem 2.2rem;border-radius:999px}
.btn:hover{background:#fff;color:var(--ink)}
.note{font-size:.88rem;margin:1.2rem 0 0!important}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.pop,.rise{animation:none}}
.view{background:var(--ink);border-radius:1.2rem;height:140px;position:relative;margin-bottom:1rem;display:grid;place-items:end center;padding-bottom:.6rem}
.view i{position:absolute;inset:14px 14px 34px;border:2.5px solid var(--orange);border-radius:.9rem}
.view small{color:#fff;font-weight:700;position:relative}
.input{border:1.5px solid var(--line);border-radius:999px;padding:.6rem 1rem;color:var(--muted);margin-bottom:.8rem}
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:3rem}
@media(max-width:800px){.steps{grid-template-columns:1fr;gap:2.2rem}}
.steps b{display:block;font-weight:900;font-size:4.5rem;line-height:1;color:var(--orange);margin-bottom:.5rem}
.steps h3{font-weight:800;font-size:1.4rem;margin:0 0 .4rem}
.steps p{margin:0;color:var(--muted)}
.goal{padding:4rem 0 0}
.goal h2 em{font-style:normal;color:var(--orange)}
.goal .sub{margin-bottom:0}
footer{margin-top:3rem;border-top:1.5px solid var(--line);padding:2rem 0}
footer .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1.2rem 2rem}
footer .logo img{height:34px}
.links{display:flex;flex-wrap:wrap;gap:.6rem 1.6rem}
.links a{color:var(--muted);text-decoration:none;font-weight:600;font-size:.95rem}
.links a:hover{color:var(--orange-d)}
footer p{margin:0;color:var(--muted);font-size:.9rem}
.demo{background:var(--soft)}
.demo .sub{margin-bottom:2rem}
.chips{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;max-width:40rem;margin:0 auto 2rem}
.chip{font:700 1rem var(--font);background:#fff;color:var(--ink);border:2px solid var(--line);border-radius:999px;padding:.55rem 1.2rem;cursor:pointer;transition:transform .15s,background .15s,color .15s,border-color .15s}
.chip:hover{border-color:var(--orange)}
.chip:active{transform:scale(.94)}
.chip[aria-pressed=true]{background:var(--orange-d);border-color:var(--orange-d);color:#fff}
.out{max-width:30rem;margin:0 auto;min-height:11rem;text-align:left}
.out .r{background:#fff;animation:rise .4s ease-out backwards}
.out .hint{text-align:center;color:var(--muted);padding-top:2rem}
.out .r.top{background:var(--peach);border-color:var(--peach)}
.demo .cap{margin-top:1.5rem}
.lab{font-weight:800;margin:0 0 .8rem}
.demo .chips{margin-bottom:1.6rem}
.c span.on{background:var(--orange-d);color:#fff}
@keyframes up{from{opacity:0;transform:translateY(1.6rem)}}
@keyframes sideIn{from{opacity:0;transform:translateY(5rem)}}
@keyframes drop{from{opacity:0;transform:translateY(-.8rem)}}
nav{animation:drop .6s ease-out backwards}
.hero .tag,.hero h1,.hero .lead,.hero .stores,.hero .cap{animation:up .8s cubic-bezier(.2,.7,.2,1) backwards}
.hero .tag{animation-delay:.1s}
.hero h1{animation-delay:.22s}
.hero .lead{animation-delay:.38s}
.hero .stores{animation-delay:.52s}
.phones .phone{animation:up .9s cubic-bezier(.2,.7,.2,1) .7s backwards}
.phones .phone.side{animation:sideIn 1s cubic-bezier(.2,.7,.2,1) .95s backwards}
.hero .cap{animation-delay:1.3s}
.store,.pill,.btn{transition:transform .2s,background .2s}
.store:hover{transform:translateY(-3px)}
.js .rv{opacity:0;transform:translateY(1.8rem);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.7,.2,1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){nav,.hero .tag,.hero h1,.hero .lead,.hero .stores,.hero .cap,.phones .phone,.phones .phone.side{animation:none}.js .rv{opacity:1;transform:none;transition:none}}

.store{flex-direction:row;align-items:center;gap:.75rem;text-decoration:none}
.store svg{width:26px;height:26px;fill:#fff;flex:none}
.store .tx{display:flex;flex-direction:column;line-height:1.2}
.store:active{transform:scale(.97)}
.toast{position:fixed;left:50%;bottom:calc(1.5rem + env(safe-area-inset-bottom,0px));transform:translate(-50%,1rem);background:var(--ink);color:#fff;padding:.8rem 1.4rem;border-radius:999px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s;z-index:20;max-width:90vw;text-align:center}
.toast.show{opacity:1;transform:translate(-50%,0)}
.legal{padding:3.5rem 0 4rem}
.legal h1{font-weight:900;font-size:clamp(2rem,6vw,3rem);line-height:1.1;letter-spacing:-.02em;margin:0 0 .6rem;max-width:none;text-align:left}
.legal h2{font-weight:800;font-size:1.3rem;margin:2.2rem 0 .5rem}
.legal h3{font-weight:800;font-size:1.05rem;margin:1.4rem 0 .3rem}
.legal p,.legal li{color:#463A34}
.legal ul{padding-left:1.2rem}
.legal a{color:var(--orange-d)}
.legal .meta{color:var(--muted);font-size:.95rem;margin:0 0 2rem}
.todo{background:#FFE98A;color:var(--ink);border-radius:.3rem;padding:0 .3rem}
