:root{
  --ink:#101820; --muted:#66727d; --green:#1a8f5a; --green2:#eaf6ef;
  --line:#e6eaed; --panel:#f7f9fa; --white:#fff;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--ink);background:#fff;line-height:1.6;
}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.container{width:min(1120px,92%);margin:auto}
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);border-bottom:1px solid var(--line);backdrop-filter:blur(10px)}
.nav{height:74px;display:flex;align-items:center;gap:26px}
.brand{font-size:1.28rem;font-weight:900;letter-spacing:-.04em;margin-right:auto}.brand span{color:var(--green)}
nav{display:flex;gap:22px;font-size:.93rem;font-weight:700}nav a:hover{color:var(--green)}
.btn{display:inline-block;background:var(--ink);color:#fff;padding:12px 18px;border-radius:10px;font-weight:800;border:1px solid var(--ink)}
.btn.secondary{background:#fff;color:var(--ink)}
.btn.small{padding:8px 12px;font-size:.86rem}
.hero{background:linear-gradient(135deg,#f0f7f3,#eef3f7);padding:84px 0}
.hero-grid{display:grid;grid-template-columns:1.22fr .78fr;gap:62px;align-items:center}
.eyebrow{font-size:.73rem;font-weight:900;letter-spacing:.15em;color:var(--green);text-transform:uppercase}
h1{font-size:clamp(2.8rem,6vw,5.1rem);line-height:1.02;letter-spacing:-.065em;margin:.25em 0}
h2{font-size:2.1rem;letter-spacing:-.04em;line-height:1.15}
h3{line-height:1.25}
.lead{font-size:1.16rem;color:var(--muted);max-width:690px}
.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.hero-card{background:var(--ink);color:#fff;padding:28px;border-radius:20px;box-shadow:0 20px 50px #1018201b}
.hero-card p{color:#c7d0d6}.choice{display:flex;justify-content:space-between;padding:15px 0;border-top:1px solid #ffffff24;font-weight:800}
.section{padding:74px 0}.section.alt{background:var(--panel)}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:26px}
.grid{display:grid;gap:22px}.grid.three{grid-template-columns:repeat(3,1fr)}.grid.two{grid-template-columns:repeat(2,1fr)}
.card{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#fff}
.card-visual{height:176px;display:grid;place-items:center;font-size:3.8rem;background:var(--green2)}
.card-body{padding:20px}.tag{font-size:.7rem;font-weight:900;letter-spacing:.12em;color:var(--green)}
.card h3{margin:7px 0 6px}.card p{color:var(--muted);margin-top:0}.card a.more{font-weight:800;color:#126f46}
.feature{padding:25px;border:1px solid var(--line);border-radius:15px;background:#fff}.feature-num{font-weight:900;color:var(--green)}
.notice{background:#f7f9fa;border-left:4px solid var(--green);padding:15px 17px;border-radius:8px;margin:25px 0}
.article{max-width:900px;margin:auto;padding:65px 0}.article h1{font-size:clamp(2.5rem,5vw,4.3rem)}
.article h2{margin-top:42px}
.product-list{display:grid;gap:16px;margin:28px 0}
.product{display:grid;grid-template-columns:130px 1fr;gap:20px;padding:18px;border:1px solid var(--line);border-radius:15px}
.product-art{min-height:145px;display:grid;place-items:center;font-size:3rem;border-radius:12px;background:#f1f4f5}
.meta{display:flex;gap:18px;flex-wrap:wrap;margin:9px 0 14px;color:var(--muted)}.meta strong{color:var(--ink)}
.table-wrap{overflow-x:auto}.compare{width:100%;border-collapse:collapse;margin:20px 0}.compare th,.compare td{padding:12px;border-bottom:1px solid var(--line);text-align:left}.compare th{background:#f7f9fa}
.callout{background:var(--ink);color:#fff;border-radius:18px;padding:28px}.callout p{color:#c5ced4}
footer{background:#0b1116;color:#fff;padding:50px 0 20px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:36px}
footer p{color:#9ca7af}footer h4{margin-top:0}footer .links{display:flex;flex-direction:column;gap:8px;color:#cbd2d7}
.copy{border-top:1px solid #ffffff18;margin-top:35px;padding-top:16px;color:#7f8a93;font-size:.85rem}
@media(max-width:820px){nav{display:none}.hero-grid,.grid.three,.grid.two{grid-template-columns:1fr}.section{padding:52px 0}.section-head{align-items:flex-start;flex-direction:column}.footer-grid{grid-template-columns:1fr 1fr}.footer-grid>div:first-child{grid-column:1/-1}}
@media(max-width:620px){.product{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.footer-grid>div:first-child{grid-column:auto}}