:root{
  --paper:#f4f2ea; --ink:#15221b; --soft:#4f5f55; --faint:#889389;
  --card:#fbfaf5; --line:#e5e2d6;
  --forest:#1f7a59; --moss:#39c98c; --hero:#102a1f; --hero2:#0a1d16;
}
@media (prefers-color-scheme:dark){:root{
  --paper:#090e0b; --ink:#e9f1ea; --soft:#9fb0a5; --faint:#64736a;
  --card:#121a15; --line:#233029; --forest:#4bcf96; --hero:#0c221a; --hero2:#07130e;
}}
:root[data-theme="dark"]{
  --paper:#090e0b; --ink:#e9f1ea; --soft:#9fb0a5; --faint:#64736a;
  --card:#121a15; --line:#233029; --forest:#4bcf96; --hero:#0c221a; --hero2:#07130e;
}
:root[data-theme="light"]{
  --paper:#f4f2ea; --ink:#15221b; --soft:#4f5f55; --faint:#889389;
  --card:#fbfaf5; --line:#e5e2d6; --forest:#1f7a59; --hero:#102a1f; --hero2:#0a1d16;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{margin:0;font-family:-apple-system,system-ui,"Segoe UI",Roboto,Helvetica,sans-serif;
  background:var(--paper);color:var(--ink);line-height:1.65;-webkit-font-smoothing:antialiased;}
a{color:var(--forest);text-decoration:none;}
img{max-width:100%;display:block;}
.wrap{max-width:1120px;margin:0 auto;padding:0 28px;}

/* Nav */
.nav{position:sticky;top:0;z-index:30;backdrop-filter:blur(14px);
  background:color-mix(in srgb, var(--paper) 82%, transparent);border-bottom:1px solid var(--line);}
.nav .wrap{display:flex;align-items:center;height:70px;gap:24px;}
.brand{display:flex;align-items:center;gap:11px;font-weight:800;font-size:20px;letter-spacing:-.02em;color:var(--ink);}
.brand img{width:32px;height:32px;border-radius:9px;}
.nav .menu{margin-left:auto;display:flex;gap:28px;align-items:center;font-weight:600;font-size:15px;}
.nav .menu a{color:var(--soft);}
.nav .menu a:hover{color:var(--ink);}
@media(max-width:640px){.nav .menu a.hide{display:none;}}

/* Hero */
.hero{position:relative;overflow:hidden;background:linear-gradient(160deg,var(--hero),var(--hero2));color:#eaf3ec;}
.hero .route-bg{position:absolute;inset:0;width:100%;height:100%;opacity:.16;pointer-events:none;}
.hero .wrap{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center;
  padding:100px 28px 92px;}
.kicker{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:13px;letter-spacing:.09em;
  text-transform:uppercase;color:var(--moss);}
.kicker img{width:20px;height:20px;border-radius:5px;}
.hero h1{font-size:clamp(46px,7.2vw,82px);line-height:1.0;letter-spacing:-.04em;font-weight:850;
  margin:20px 0 18px;color:#fff;text-wrap:balance;}
.hero .sub{font-size:21px;color:#c3d6c9;max-width:47ch;margin:0;}
.hero-actions{margin-top:36px;display:flex;align-items:center;gap:18px;flex-wrap:wrap;}
.hero .phone{justify-self:center;width:100%;max-width:335px;filter:drop-shadow(0 44px 70px rgba(0,0,0,.5));}

/* App Store badge */
.appstore{display:inline-flex;align-items:center;gap:12px;background:#000;color:#fff;
  border:1px solid rgba(255,255,255,.22);border-radius:14px;padding:11px 18px;line-height:1;transition:transform .15s ease;}
.appstore:hover{transform:translateY(-2px);}
.appstore svg{width:26px;height:26px;fill:#fff;flex:none;}
.appstore .t{display:flex;flex-direction:column;gap:3px;}
.appstore .t small{font-size:11px;font-weight:500;opacity:.92;}
.appstore .t b{font-size:19px;font-weight:600;letter-spacing:-.01em;}
.soon{font-size:14px;font-weight:600;color:#93a99b;}

/* Sections */
section{padding:96px 0;}
.head{max-width:720px;}
.head.center{margin:0 auto;text-align:center;}
h2{font-size:clamp(30px,4.6vw,47px);line-height:1.07;letter-spacing:-.028em;font-weight:820;margin:0 0 14px;text-wrap:balance;}
.lead{font-size:19px;color:var(--soft);margin:0;}

/* Features */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:56px;}
.feat{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:32px;}
.feat svg{width:34px;height:34px;stroke:var(--forest);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.feat h3{margin:18px 0 8px;font-size:20px;font-weight:750;letter-spacing:-.01em;}
.feat p{margin:0;color:var(--soft);font-size:16px;}

/* Showcase band */
.band{background:color-mix(in srgb, var(--forest) 7%, var(--paper));border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.showcase{display:flex;gap:40px;justify-content:center;align-items:flex-start;flex-wrap:wrap;margin-top:52px;}
.showcase figure{margin:0;max-width:300px;text-align:center;}
.showcase img{filter:drop-shadow(0 34px 54px rgba(15,44,32,.24));}
.showcase figcaption{margin-top:20px;font-weight:750;font-size:17px;letter-spacing:-.01em;}
.showcase figcaption span{display:block;font-weight:500;color:var(--soft);font-size:15px;margin-top:4px;}

/* CTA */
.cta{background:linear-gradient(160deg,var(--hero),var(--hero2));color:#eaf3ec;text-align:center;}
.cta h2{color:#fff;}
.cta .lead{color:#bcd0c4;font-size:19px;margin:0 0 30px;}

/* Footer */
footer{border-top:1px solid var(--line);padding:46px 0;color:var(--faint);font-size:15px;}
footer .wrap{display:flex;flex-wrap:wrap;gap:18px;align-items:center;justify-content:space-between;}
footer a{color:var(--soft);}
footer .brand{font-size:17px;}

/* Legal / support pages */
.doc{max-width:720px;margin:0 auto;padding:72px 28px 96px;}
.doc .back{display:inline-flex;align-items:center;gap:7px;font-weight:650;color:var(--soft);margin-bottom:30px;}
.doc h1{font-size:clamp(34px,5vw,52px);letter-spacing:-.035em;font-weight:840;margin:0 0 6px;}
.doc .updated{color:var(--faint);font-size:15px;margin:0 0 44px;}
.doc h2{font-size:22px;margin:42px 0 10px;letter-spacing:-.015em;}
.doc p,.doc li{color:var(--soft);font-size:17px;}
.doc strong{color:var(--ink);}
.doc ul{padding-left:22px;}
.faq{max-width:760px;margin:44px auto 0;display:grid;gap:14px;}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:2px 22px;}
.faq summary{cursor:pointer;font-weight:750;font-size:17px;padding:18px 0;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--forest);font-weight:700;font-size:20px;}
.faq details[open] summary::after{content:"\00d7";}
.faq p{margin:0 0 18px;color:var(--soft);}

@media(max-width:860px){
  .hero .wrap{grid-template-columns:1fr;text-align:center;padding:68px 28px 56px;}
  .hero-actions{justify-content:center;}
  .hero .sub{margin:0 auto;}
  .feats{grid-template-columns:1fr;}
  section{padding:68px 0;}
}