:root{--ink:#0e0f0c;--forest:#163300;--deep:#054d28;--lime:#9fe870;--lime-h:#8fdc5f;--mist:#e2f6d5;--grey:#e8ebe6;--body:#454745;--mute:#6a6c6a}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--body);font-family:Inter,ui-sans-serif,system-ui,sans-serif;font-feature-settings:'calt'}
a{color:var(--forest);text-decoration:none}
a:hover{color:var(--deep);text-decoration:underline}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible{outline:2px solid var(--forest);outline-offset:2px}
input,button{font-family:inherit}
input:focus{outline:none}
p{margin:0}
.wrap{max-width:1200px;margin:0 auto;padding-left:24px;padding-right:24px}
.grow{flex:1}
.display{margin:0;font-weight:900;text-transform:uppercase;letter-spacing:-.045em;line-height:.85;color:var(--ink);text-wrap:balance}

/* header */
.top{position:sticky;top:0;z-index:20;background:#fff}
.hbar{height:64px;display:flex;align-items:center;gap:24px}
.logo{font-weight:900;font-size:28px;letter-spacing:-.04em;color:var(--forest);line-height:1}
.logo span,.mock-logo span{color:var(--lime)}
.logo:hover{text-decoration:none;color:var(--forest)}
.logo.sm{font-size:22px}
nav{display:flex;gap:4px}
.pill-link{height:36px;padding:0 14px;border-radius:9999px;display:flex;align-items:center;font-size:15px;font-weight:500}
.pill-link:hover{background:var(--mist);text-decoration:none}
.btn{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:9999px;font-weight:600;cursor:pointer;border:0}
.btn:hover{text-decoration:none}
.btn-outline{height:40px;padding:0 20px;border:1px solid var(--forest);font-size:15px;font-weight:500;color:var(--forest);background:transparent}
.btn-outline:hover{background:var(--mist)}
.btn-lime{height:52px;padding:0 28px;background:var(--lime);color:var(--forest);font-size:17px}
.btn-lime:hover{background:var(--lime-h);color:var(--forest)}
.btn-l{height:56px;padding:0 32px;font-size:18px;margin-top:36px}

/* hero */
.hero{padding-top:72px;text-align:center}
.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:9999px;background:var(--mist);color:var(--forest);font-size:14px;font-weight:500}
.badge i{width:8px;height:8px;border-radius:9999px;background:var(--forest)}
h1.display{margin:28px auto 0;max-width:1100px;font-size:clamp(56px,10vw,128px)}
.lead{margin:28px auto 0;max-width:640px;font-size:clamp(18px,2vw,22px);line-height:1.45;text-wrap:pretty}
.cta-row{margin-top:36px;display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.cta-row .btn-l{margin-top:0}
.lang{height:36px;min-width:44px;padding:0 12px;border-radius:9999px;border:0;background:var(--mist);color:var(--forest);font:inherit;font-size:14px;font-weight:600;cursor:pointer}
.lang:hover{background:var(--grey)}
.hint{margin-top:14px;font-size:14px;color:var(--mute)}
.mock{margin:64px auto 0;max-width:1100px;border-radius:28px 28px 0 0;background:var(--forest);padding:28px 28px 0}
.mock-win{border-radius:16px 16px 0 0;background:#fff;overflow:hidden;text-align:left}
.mock-bar{display:flex;align-items:center;gap:12px;padding:14px 20px;border-bottom:1px solid var(--grey);flex-wrap:wrap}
.mock-logo{font-weight:900;font-size:20px;letter-spacing:-.04em;color:var(--forest)}
.seg{display:flex;gap:2px;padding:3px;background:var(--grey);border-radius:9999px}
.seg span{height:28px;padding:0 12px;border-radius:9999px;font-size:12px;font-weight:500;display:flex;align-items:center}
.seg .on{background:var(--lime);color:var(--forest)}
.mock-body{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;padding:24px}
.list{background:var(--grey);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:8px}
.list-h{font-size:14px;font-weight:600;color:var(--ink)}
.row{display:flex;justify-content:space-between;gap:8px;padding:8px 12px;border-radius:10px;background:#fff;font-size:14px}
.row b{color:var(--ink);font-weight:500}
.row span{color:var(--mute);white-space:nowrap}
.row em{font-style:normal;font-weight:600;color:var(--ink)}
.result{background:var(--forest);border-radius:20px;padding:24px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;gap:16px}
.small{font-size:13px;color:var(--mist)}
.shop{font-weight:900;font-size:40px;line-height:.95;letter-spacing:-.035em;color:var(--lime);margin-top:4px}
.total{font-size:40px;font-weight:700;letter-spacing:-.02em}
.opts{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.opts div{padding:10px;border-radius:12px;background:var(--deep);font-size:15px;font-weight:700}
.opts span{display:block;font-size:11px;font-weight:400;color:var(--mist)}
.opts .sel{background:var(--lime);color:var(--forest)}
.opts .sel span{color:var(--forest)}

/* strip */
.strip{border-top:1px solid var(--grey)}
.strip-in{padding-top:28px;padding-bottom:28px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap}
.strip-l{font-size:14px;color:var(--mute);font-weight:500;margin-right:8px}
.chip{display:flex;align-items:center;gap:8px;height:40px;padding:0 16px 0 6px;border-radius:9999px;background:var(--grey);color:var(--forest);font-size:15px;font-weight:600}
.chip i{width:28px;height:28px;border-radius:9999px;background:#fff;display:grid;place-items:center;font-size:11px;font-weight:700;font-style:normal}

/* sections */
.sec{padding-top:96px;padding-bottom:48px}
.sec-s{padding-top:48px;padding-bottom:48px}
.sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:32px;flex-wrap:wrap;margin-bottom:48px}
.sec-h .h2{max-width:760px}
.sec-h p{max-width:380px;font-size:18px;line-height:1.5}
.h2{font-size:clamp(44px,6.5vw,89px);line-height:.85}
.h3{font-size:clamp(40px,5.5vw,72px);line-height:.88;letter-spacing:-.04em;text-transform:none;margin-top:14px}
.h4{font-size:clamp(44px,6vw,72px);line-height:.88;margin-bottom:32px}
.h5{font-size:clamp(48px,8vw,105px);color:var(--lime);margin:0 auto;max-width:900px}
.mb{margin-bottom:48px}
.kicker{font-size:14px;font-weight:600;color:var(--forest)}
.kicker.light{color:var(--mist)}
.grid-f{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px}
.card{border-radius:28px;min-width:0}
.card-wide{grid-column:1/-1;background:var(--mist);padding:36px;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:28px;align-items:center}
.card-wide p{font-size:16px;line-height:1.55;margin-top:12px}
.card-t{font-size:25px;font-weight:700;letter-spacing:-.02em;color:var(--ink);line-height:1.15}
.card-t.big{font-size:36px;line-height:1.1;margin-top:8px}
.card-g{background:var(--grey);padding:32px;display:flex;flex-direction:column;gap:10px;min-height:240px}
.card-g p{font-size:16px;line-height:1.55}
.card-g .kicker{margin-top:12px}
.num{width:44px;height:44px;border-radius:9999px;background:var(--forest);color:var(--lime);display:grid;place-items:center;font-weight:900;font-size:16px;letter-spacing:-.02em}
.unit{display:flex;flex-direction:column;gap:8px}
.u{display:grid;grid-template-columns:28px minmax(0,1fr) 92px;gap:12px;align-items:center;padding:10px 14px;border-radius:14px;background:#fff;font-size:14px;font-weight:600;color:var(--ink)}
.u b{font-weight:900;font-size:20px;color:var(--forest)}
.u span{text-align:right;font-weight:700}
.bar{height:6px;border-radius:9999px;background:var(--grey);margin-top:6px;overflow:hidden}
.bar i{display:block;height:100%;background:var(--forest);border-radius:9999px}

.dark{background:var(--forest);border-radius:28px;padding:clamp(32px,5vw,64px);display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:48px;align-items:center}
.lime{color:var(--lime)}
.light-p{margin-top:20px;font-size:18px;line-height:1.5;color:#fff;max-width:440px}
.swaps{display:flex;flex-direction:column;gap:10px}
.swap{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center;padding:14px 16px;border-radius:16px;background:var(--deep)}
.swap b{display:block;font-size:15px;font-weight:600;color:#fff}
.swap span{font-size:13px;color:var(--mist)}
.swap em{font-style:normal;padding:5px 12px;border-radius:9999px;background:var(--lime);color:var(--forest);font-weight:700;font-size:15px}
.swap .r{text-align:right}

.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:32px}
.steps>div{padding-top:24px;border-top:2px solid var(--forest)}
.sn{font-weight:900;font-size:61px;line-height:.85;letter-spacing:-.04em;color:var(--forest)}
.steps h3{margin:12px 0 0;font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.01em}
.steps p{margin-top:12px;font-size:16px;line-height:1.55}

.mist{background:var(--mist)}
.mist-in{padding-top:96px;padding-bottom:96px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:48px;align-items:center}
.ink{color:var(--ink)}
.mist-p{margin-top:20px;font-size:18px;line-height:1.5;max-width:460px}
.tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:28px}
.tag{height:36px;padding:0 16px;border-radius:9999px;background:var(--forest);color:#fff;font-size:14px;font-weight:500;display:flex;align-items:center}
.tag.o{background:transparent;color:var(--forest);border:1px solid var(--forest)}
.phone-w{display:flex;justify-content:center}
.phone{width:min(360px,100%);border-radius:48px;background:var(--ink);padding:10px;box-shadow:rgba(0,0,0,.15) 0 10px 32px,rgba(0,0,0,.04) 0 40px 40px}
.screen{border-radius:38px;overflow:hidden;background:#fff;min-height:660px;display:flex;flex-direction:column}
.ph-h{background:var(--forest);color:#fff;padding:18px 22px 28px}
.ph-s{display:flex;justify-content:space-between;font-size:13px;font-weight:600}
.notch{width:96px;height:24px;border-radius:9999px;background:var(--ink)}
.ph-t{font-weight:900;font-size:36px;line-height:.9;letter-spacing:-.035em;color:var(--lime);margin-top:22px}
.ph-b{padding:16px 20px 22px;flex:1;display:flex;flex-direction:column}
.d{display:flex;align-items:center;gap:12px;padding:14px 0;border-top:1px solid var(--grey)}
.d i{width:28px;height:28px;border-radius:9999px;background:var(--grey);color:var(--forest);font-weight:700;font-size:10px;display:grid;place-items:center;font-style:normal;flex-shrink:0}
.d div{flex:1;min-width:0}
.d b{display:block;font-size:13px;font-weight:600;color:var(--ink)}
.d span{font-size:11px;color:var(--mute)}
.d strong{font-size:14px;color:var(--ink)}
.ph-btn{margin-top:auto;height:46px;border-radius:9999px;background:var(--lime);color:var(--forest);font-size:15px;font-weight:600;display:grid;place-items:center}

.faq{max-width:880px;margin:0 auto;padding:96px 24px}
details{border-top:1px solid var(--grey)}
summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;cursor:pointer;font-size:20px;font-weight:600;color:var(--ink)}
summary::-webkit-details-marker{display:none}
summary i{width:36px;height:36px;flex-shrink:0;border-radius:9999px;border:1px solid var(--forest);position:relative}
summary i::before,summary i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2px;background:var(--forest);transform:translate(-50%,-50%)}
summary i::after{transform:translate(-50%,-50%) rotate(90deg)}
details[open] summary i::after{display:none}
details p{margin:0 0 24px;max-width:680px;font-size:17px;line-height:1.6}

.cta-s{padding-bottom:96px}
.cta{background:var(--forest);border-radius:28px;padding:clamp(40px,7vw,96px) clamp(24px,5vw,64px);text-align:center}
.cta p{margin:24px auto 0;max-width:520px;font-size:18px;line-height:1.5;color:#fff}

footer{border-top:1px solid var(--grey)}
.foot{padding-top:32px;padding-bottom:32px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--mute)}
.foot-l{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.foot-r{display:flex;gap:20px}

@media (max-width:700px){
  nav{display:none}
  .hbar{gap:12px}
  .hero{padding-top:40px}
  .wrap{padding-left:16px;padding-right:16px}
  .mock{padding:16px 16px 0;margin-top:40px}
  .cta-row{flex-direction:column}
  .btn-lime,.cta-row .btn-outline{width:100%}
  .phone{width:100%;max-width:380px}
  .screen{min-height:620px}
  .sec{padding-top:64px}
  .card-wide{padding:24px}
  .swap{grid-template-columns:1fr auto}
  .swap .r{grid-column:1/-1;text-align:left}
  .mist-in{padding-top:64px;padding-bottom:64px}
  .u{grid-template-columns:24px minmax(0,1fr) auto}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

[hidden]{display:none !important}
.alert{max-width:520px;margin:0 auto 20px;padding:12px 18px;border-radius:16px;background:var(--grey);color:#cb272f;font-size:14px}
.dark .light-p a.lt{color:var(--lime);text-decoration:underline}
.mcp-box{display:flex;flex-direction:column;gap:10px;min-width:0}
.mcp-url{display:flex;align-items:center;gap:8px;padding:8px 8px 8px 16px;border-radius:16px;background:var(--deep);min-width:0}
.mcp-url code{flex:1;min-width:0;overflow-x:auto;white-space:nowrap;color:#fff;font-size:15px}
.mcp-url button{height:36px;padding:0 16px;border:0;border-radius:9999px;background:var(--lime);color:var(--forest);font:600 14px Inter,sans-serif;cursor:pointer}
.mcp-url button:hover{background:var(--lime-h)}
.mcp-cmd{margin:0;padding:14px 16px;border-radius:16px;background:var(--deep);overflow-x:auto;color:#fff;font-size:14px}
.mcp-tools{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.mcp-tools span{padding:4px 10px;border-radius:9999px;background:var(--deep);color:var(--mist);font:500 12px ui-monospace,monospace}