:root{
  --paper:#EEF1F4; --surface:#FFFFFF; --surface-2:#F7F9FA;
  --ink:#0F161C; --muted:#576674; --faint:#8494A2;
  --line:#D6DDE4; --line-soft:#E6EBEF;
  --air:#1B4E8A; --water:#0E7C86; --signal:#9A5A08; --signal-bg:#FBF2E4;
  --shadow:0 1px 2px rgba(15,22,28,.05), 0 8px 24px -12px rgba(15,22,28,.18);
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#0B1116; --surface:#131C23; --surface-2:#101820;
    --ink:#E7EDF2; --muted:#95A5B3; --faint:#6E7F8D;
    --line:#22303A; --line-soft:#1A252E;
    --air:#78AEEC; --water:#3FC3CD; --signal:#DDA55F; --signal-bg:#1E1913;
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"]{
  --paper:#0B1116; --surface:#131C23; --surface-2:#101820;
  --ink:#E7EDF2; --muted:#95A5B3; --faint:#6E7F8D;
  --line:#22303A; --line-soft:#1A252E;
  --air:#78AEEC; --water:#3FC3CD; --signal:#DDA55F; --signal-bg:#1E1913;
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 10px 30px -14px rgba(0,0,0,.7);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
  font-size:17px; line-height:1.62; -webkit-font-smoothing:antialiased;
}
.wrap{max-width:1080px; margin:0 auto; padding:0 24px}
h1,h2,h3{font-family:"Golos Text","IBM Plex Sans",Arial,sans-serif; text-wrap:balance; margin:0; letter-spacing:-.018em}
a{color:inherit}
.mono{font-family:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,monospace; font-variant-numeric:tabular-nums}
.eyebrow{font-family:"IBM Plex Mono",monospace; font-size:12px; letter-spacing:.16em; text-transform:uppercase; color:var(--faint); font-weight:500}

/* ── идентификация ── */
.top{border-bottom:1px solid var(--line); background:var(--surface)}
.top .wrap{display:flex; flex-wrap:wrap; gap:16px 28px; align-items:baseline; padding-top:20px; padding-bottom:20px}
.who{font-family:"Golos Text",sans-serif; font-weight:700; font-size:17px; letter-spacing:-.01em}
.role{color:var(--muted); font-size:15px}
.top .contacts{margin-left:auto; display:flex; gap:20px; flex-wrap:wrap; font-size:15px}
.top .contacts a{color:var(--water); text-decoration:none; font-weight:500; border-bottom:1px solid transparent}
.top .contacts a:hover,.top .contacts a:focus-visible{border-bottom-color:currentColor}

/* ── лид ── */
.lead{padding:64px 0 52px}
.lead h1{font-size:clamp(32px,5.2vw,52px); font-weight:800; line-height:1.08; max-width:19ch}
.lead .sub{margin-top:22px; max-width:62ch; font-size:19px; color:var(--muted)}
.lead .sub strong{color:var(--ink); font-weight:600}
.offer{margin-top:32px; display:flex; flex-wrap:wrap; gap:10px}
.chip{font-family:"IBM Plex Mono",monospace; font-size:13px; letter-spacing:.02em; padding:7px 13px;
  border:1px solid var(--line); border-radius:999px; background:var(--surface); color:var(--muted)}

/* ── товар ── */
.spec{background:var(--surface); border:1px solid var(--line); border-radius:4px; box-shadow:var(--shadow);
  overflow:hidden; margin-bottom:28px}
.spec-head{display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 16px; padding:26px 30px 22px; border-bottom:1px solid var(--line-soft)}
.spec-head h2{font-size:clamp(25px,3.4vw,34px); font-weight:800}
.spec-head .id{font-family:"IBM Plex Mono",monospace; font-size:13px; color:var(--faint); letter-spacing:.03em}
.tag{font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase;
  padding:4px 9px; border-radius:3px; font-weight:600}
.tag.air{color:var(--air); background:color-mix(in srgb, var(--air) 12%, transparent)}
.tag.water{color:var(--water); background:color-mix(in srgb, var(--water) 12%, transparent)}
.spec-body{display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:0}
.spec-main{padding:26px 30px 30px; min-width:0}
.spec-img{border-left:1px solid var(--line-soft); background:var(--surface-2); display:flex; align-items:flex-start; justify-content:center; padding:26px 22px}
.spec-img img{position:sticky; top:24px}
.spec-img img{width:100%; height:auto; display:block; mix-blend-mode:multiply}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .spec-img img{mix-blend-mode:normal; border-radius:3px}}
:root[data-theme="dark"] .spec-img img{mix-blend-mode:normal; border-radius:3px}
.claim{font-size:19px; line-height:1.5; margin:0 0 24px; max-width:56ch}
.claim b{font-weight:600}
.claim .big{font-family:"Golos Text",sans-serif; font-weight:800; font-size:34px; letter-spacing:-.02em; display:inline-block; margin-right:6px}
.spec.air .claim .big{color:var(--air)}
.spec.water .claim .big{color:var(--water)}

table{width:100%; border-collapse:collapse; font-size:15px}
caption{text-align:left; font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--faint); padding-bottom:9px; font-weight:500}
td{padding:9px 0; border-bottom:1px solid var(--line-soft); vertical-align:baseline}
tr:last-child td{border-bottom:0}
td:first-child{color:var(--muted); padding-right:18px}
td:last-child{text-align:right; font-family:"IBM Plex Mono",monospace; font-weight:500; white-space:nowrap}
.filters-strip{margin-top:26px; padding-top:22px; border-top:1px solid var(--line-soft)}
.filters-strip img{width:100%; height:auto; display:block; margin:12px 0 14px; mix-blend-mode:multiply}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .filters-strip img{mix-blend-mode:normal; opacity:.9; background:#fff; border-radius:3px; padding:8px}}
:root[data-theme="dark"] .filters-strip img{mix-blend-mode:normal; opacity:.9; background:#fff; border-radius:3px; padding:8px}
.filters-strip p{margin:0; font-size:15px; color:var(--muted)}
.filters-strip b{color:var(--ink); font-weight:600}
.proof{margin-top:24px; padding:16px 18px; border-left:2px solid currentColor; font-size:15px; line-height:1.55}
.spec.air .proof{color:var(--air)}
.spec.water .proof{color:var(--water)}
.proof span{color:var(--muted)}
.proof b{color:var(--ink)}

/* ── метод ── */
.method{padding:24px 0 8px}
.method h2{font-size:clamp(24px,3.4vw,32px); font-weight:800; margin-bottom:8px}
.method>.wrap>p{color:var(--muted); max-width:60ch; margin:0 0 28px}
.steps{display:grid; grid-template-columns:repeat(auto-fit,minmax(255px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line)}
.step{background:var(--surface); padding:24px 24px 26px}
.step .n{font-family:"IBM Plex Mono",monospace; font-size:12px; font-weight:600; color:var(--water); letter-spacing:.1em}
.step h3{font-size:18px; font-weight:700; margin:10px 0 8px}
.step p{margin:0; font-size:15px; color:var(--muted)}

/* ── кому ── */
.who-for{padding:56px 0 8px}
.who-for h2{font-size:clamp(24px,3.4vw,32px); font-weight:800; margin-bottom:20px}
.rows{border-top:1px solid var(--line)}
.row{display:grid; grid-template-columns:minmax(0,210px) minmax(0,1fr); gap:6px 28px;
  padding:16px 0; border-bottom:1px solid var(--line-soft)}
.row dt{font-weight:600; font-size:16px; margin:0}
.row dd{margin:0; color:var(--muted); font-size:15.5px}

/* ── честные ограничения ── */
.limits{margin:56px 0 0; background:var(--signal-bg); border:1px solid color-mix(in srgb, var(--signal) 34%, transparent); border-radius:4px; padding:30px 32px}
.limits h2{font-size:22px; font-weight:700; color:var(--signal); margin-bottom:6px}
.limits .why{color:var(--muted); font-size:15px; margin:0 0 18px; max-width:64ch}
.limits ul{margin:0; padding:0; list-style:none; display:grid; gap:11px}
.limits li{padding-left:20px; position:relative; font-size:16px; line-height:1.5}
.limits li::before{content:"—"; position:absolute; left:0; color:var(--signal); font-family:"IBM Plex Mono",monospace}

/* ── контакт ── */
.contact{margin:56px 0 0; padding:44px 0 64px; border-top:1px solid var(--line)}
.contact h2{font-size:clamp(24px,3.6vw,34px); font-weight:800; max-width:22ch}
.contact p{color:var(--muted); max-width:58ch; margin:16px 0 28px}
.cta{display:flex; flex-wrap:wrap; gap:12px; align-items:center}
.btn{display:inline-flex; align-items:center; gap:9px; padding:14px 22px; border-radius:3px; text-decoration:none;
  font-weight:600; font-size:16px; border:1px solid var(--water); transition:transform .12s ease}
.btn.primary{background:var(--water); color:#fff}
.btn.ghost{color:var(--water); background:transparent}
.btn:hover{transform:translateY(-1px)}
.btn:focus-visible{outline:2px solid var(--air); outline-offset:3px}
.card-details{margin-top:30px; display:grid; gap:5px; font-size:15px; color:var(--muted)}
.card-details b{color:var(--ink); font-weight:600}
footer{border-top:1px solid var(--line-soft); padding:22px 0 40px; font-size:13.5px; color:var(--faint)}
footer p{margin:0 0 6px; max-width:78ch}

@media (max-width:820px){
  .spec-body{grid-template-columns:1fr}
  .spec-img{border-left:0; border-top:1px solid var(--line-soft); order:-1; padding:26px 26px 6px}
  .spec-img img{position:static}
  .spec-img img{max-width:330px; margin:0 auto}
  .top .contacts{margin-left:0; width:100%}
  .row{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}