:root{--bg:#ffffff;--soft:#f3faf5;--card:#ffffff;--text:#0b1410;--body:#26332c;--muted:#5a6b61;--line:#dbe9df;--green:#16a34a;--green-d:#0f7a37;--green-dd:#0b4f27;--green-l:#e6f6ec;--gold:#f5b301}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:var(--bg);color:var(--text);line-height:1.65}
a{color:inherit}
.wrap{max-width:1040px;margin:0 auto;padding:0 20px}
header{padding:16px 0;border-bottom:1px solid var(--line);background:#fff;position:sticky;top:0;z-index:40}
header .wrap{display:flex;justify-content:space-between;align-items:center}
.logo{font-weight:800;font-size:1.25rem;text-decoration:none;color:var(--text);letter-spacing:-.3px}
.logo span{color:var(--green)}
.btn{display:inline-block;background:var(--green-d);color:#fff;padding:14px 28px;border-radius:10px;font-weight:700;text-decoration:none;transition:transform .15s,background .15s,box-shadow .15s;box-shadow:0 4px 14px rgba(22,163,74,.28)}
.btn:hover{transform:translateY(-2px);background:var(--green-dd);box-shadow:0 6px 18px rgba(22,163,74,.35)}
.btn.big{font-size:1.1rem;padding:17px 38px}
.hero{text-align:center;padding:84px 0 64px;background:radial-gradient(circle at 50% 0,#d9f4e3 0,#f3faf5 45%,#fff 80%)}
.badge{display:inline-block;background:var(--green-l);color:var(--green-dd);border:1px solid #bfe7cd;padding:6px 16px;border-radius:99px;font-size:.85rem;font-weight:700;margin-bottom:20px}
h1{font-size:clamp(2rem,5vw,3.4rem);line-height:1.15;margin-bottom:18px;color:var(--text);letter-spacing:-.8px}
h1 em{font-style:normal;color:var(--green-d);background:linear-gradient(transparent 62%,#bdeccf 62%)}
.sub{color:var(--body);max-width:640px;margin:0 auto 32px;font-size:1.12rem}
section{padding:56px 0}
h2{text-align:center;font-size:2rem;margin-bottom:36px;color:var(--text);letter-spacing:-.4px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px;box-shadow:0 2px 10px rgba(11,20,16,.04);transition:box-shadow .15s,border-color .15s}
.card:hover{border-color:#9fd8b4;box-shadow:0 8px 22px rgba(22,163,74,.12)}
.card h3{margin-bottom:8px;font-size:1.1rem}
.card h3 a{text-decoration:none}
.card p{color:var(--muted);font-size:.95rem}
.steps .num{width:40px;height:40px;border-radius:50%;background:var(--green-d);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:12px}
.offer{background:linear-gradient(160deg,var(--green-l),#fff);border:2px solid var(--green);border-radius:20px;padding:44px 28px;text-align:center}
.price{font-size:3.4rem;font-weight:800;color:var(--green-d)}
.price small{font-size:1rem;color:var(--muted);font-weight:500}
.coupons{display:flex;flex-wrap:wrap;gap:16px;justify-content:center;margin:28px 0}
.coupon{background:#fff;border:2px dashed var(--green);border-radius:12px;padding:16px 24px;min-width:230px;text-align:center;box-shadow:0 2px 10px rgba(22,163,74,.08)}
.coupon .code{font-size:1.5rem;font-weight:800;letter-spacing:2px;color:var(--green-d);cursor:pointer;font-family:ui-monospace,Menlo,Consolas,monospace}
.coupon .code:hover{color:var(--green-dd)}
.coupon .off{color:var(--muted);font-size:.9rem}
.copied{color:var(--green-d);font-size:.8rem;height:1em;font-weight:600}
.faq details{background:var(--soft);border:1px solid var(--line);border-radius:10px;padding:16px 20px;margin-bottom:12px}
.faq details[open]{background:#fff;border-color:#9fd8b4}
.faq summary{cursor:pointer;font-weight:600;color:var(--text)}
.faq p{color:var(--body);margin-top:10px}
footer{background:#0b1f14;color:#c9dccf;padding:34px 0;text-align:center;font-size:.85rem;margin-top:40px}
footer p{color:#a9c2b3}
/* v3 */
header .wrap{flex-wrap:wrap;gap:10px}
nav a{color:var(--body);text-decoration:none;margin-left:16px;font-size:.92rem;font-weight:500;padding:4px 0;border-bottom:2px solid transparent}
nav a:hover{color:var(--green-d)}
nav a[aria-current]{color:var(--green-d);border-bottom-color:var(--green);font-weight:700}
body{padding-bottom:70px}
.sticky{position:fixed;left:0;right:0;bottom:0;background:var(--green-dd);color:#fff;border-top:3px solid var(--green);padding:10px 0;z-index:50}
.sticky .wrap{display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:.92rem}
.sticky b{color:#9ff0bd}
.sticky .btn{padding:10px 22px;white-space:nowrap;background:#fff;color:var(--green-dd);box-shadow:none}
.sticky .btn:hover{background:var(--green-l);color:var(--green-dd)}
.article{max-width:820px;margin:0 auto;padding:40px 20px 20px}
.article h1{font-size:clamp(1.8rem,4vw,2.6rem)}
.article h2{text-align:left;font-size:1.6rem;margin:40px 0 14px;padding-bottom:8px;border-bottom:2px solid var(--green-l)}
.article h3{margin:24px 0 8px;font-size:1.15rem}
.article p,.article li{color:var(--body);margin-bottom:14px}
.article ul,.article ol{padding-left:24px;margin-bottom:14px}
.article li::marker{color:var(--green-d)}
.article a{color:var(--green-d);text-decoration:underline;text-decoration-color:#9fd8b4;text-underline-offset:3px}
.article a:hover{text-decoration-color:var(--green-d)}
.article .btn{color:#fff;text-decoration:none}
.article .card a,.article .links a{font-weight:600}
.crumbs{font-size:.85rem;color:var(--muted);margin-bottom:14px}
.crumbs a{color:var(--muted)}
.meta{color:var(--muted);font-size:.85rem;margin-bottom:22px}
.tldr{background:var(--green-l);border-left:4px solid var(--green);border-radius:8px;padding:16px 20px;margin:20px 0}
.tldr p{margin:0;color:var(--text)}
table{width:100%;border-collapse:collapse;margin:16px 0 24px;font-size:.95rem;border-radius:10px;overflow:hidden}
th,td{border:1px solid var(--line);padding:10px 12px;text-align:left;color:var(--body)}
th{background:var(--green-l);color:var(--text)}
tr:nth-child(even) td{background:#fafdfb}
.cta-box{text-align:center;background:linear-gradient(160deg,var(--green-l),#fff);border:1px solid #b6e3c7;border-radius:14px;padding:26px;margin:32px 0}
.cta-box p{color:var(--body)}
.fnav{display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;margin-bottom:14px}
.fnav a{color:#d6e8dc;text-decoration:none}
.fnav a:hover{color:#9ff0bd}
form label{display:block;margin:14px 0 6px;font-weight:600}
form input,form textarea{width:100%;padding:12px;border-radius:8px;border:1px solid #b9d3c3;background:#fff;color:var(--text);font:inherit}
form input:focus,form textarea:focus{outline:2px solid var(--green);border-color:var(--green)}
form button{margin-top:16px;border:0;cursor:pointer;font:inherit}
.links li{margin-bottom:8px}
:focus-visible{outline:2px solid var(--green);outline-offset:2px}
@media(max-width:640px){nav a{margin:0 12px 0 0}.sticky .wrap{font-size:.8rem}.sticky span{line-height:1.3}.hero{padding:56px 0 44px}header{position:static}}