/* ZMA · 01-mashina-na-klass-vyshe · documentary-comparison Регистр: холодная бумага, волосяные линии, две равные колонки сравнения. Шрифт один — Manrope variable (правило BUILD-TZ). Различие пула — композицией. */ @font-face{font-family:"Manrope";font-style:normal;font-weight:300 800;font-display:swap; src:url("../fonts/manrope-var-cyr.woff2") format("woff2"); unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116,U+20BD;} @font-face{font-family:"Manrope";font-style:normal;font-weight:300 800;font-display:swap; src:url("../fonts/manrope-var-lat.woff2") format("woff2"); unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC,U+2122,U+2212,U+2215,U+FEFF,U+FFFD;} :root{ --bg:#FAFAFA;--paper:#FFFFFF;--bg2:#F2F2F0;--bg3:#ECECEA; --ink:#1A1D22;--ink-soft:#3A3F47; --line:#E4E4E1;--line2:#D3D3CF; --accent:#3A5A7A;--accent2:#456A90;--accent-dark:#294763; --accent-tint:#EEF2F6;--accent-line:#CBD8E4;--on-accent:#FFFFFF; --r:14px;--r-chip:10px; --maxw:1140px;--u:8px; --sans:"Manrope","Segoe UI",-apple-system,BlinkMacSystemFont,Arial,sans-serif; } *,*::before,*::after{box-sizing:border-box} figure{margin:0} button,input,select,textarea{font:inherit;color:inherit} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth} body{margin:0;background:var(--bg);color:var(--ink); font:400 16px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden} img{max-width:100%;height:auto;display:block} a{color:var(--accent-dark)} .wrap{width:100%;max-width:var(--maxw);margin:0 auto;padding:0 16px} .tnum{font-variant-numeric:tabular-nums} /* ---------- типографика ---------- */ h1,h2,h3{margin:0;font-weight:800;letter-spacing:-.012em;word-spacing:.03em;line-height:1.06} h1{font-size:clamp(25px,3.5vw,44px);line-height:1.05} h2{font-size:clamp(23px,3.4vw,34px);line-height:1.1} h3{font-size:17px;font-weight:700;line-height:1.25;letter-spacing:-.01em} p{margin:0 0 12px} .eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:.12em; text-transform:uppercase;color:var(--accent);margin:0 0 10px} .sub{color:var(--ink-soft);font-size:16px;line-height:1.55;margin:0 0 14px} .lbl{display:block;font-size:11px;font-weight:600;letter-spacing:.07em; text-transform:uppercase;color:var(--ink-soft);margin:0 0 6px} .foot-note{font-size:13px;line-height:1.5;color:var(--ink-soft);margin:0} .micro{font-size:13px;line-height:1.5;color:var(--ink-soft);margin:10px 0 0} /* ---------- секции: ритм ровный, разделители — волосяные линии ---------- */ section{padding:40px 0;border-top:1px solid var(--line)} section.alt{background:var(--bg2)} .sec-head{margin:0 0 20px} .sec-head h2{margin:0 0 10px} /* ---------- шапка ---------- */ .site-head{background:var(--paper);border-bottom:1px solid var(--line)} .site-head .wrap{display:flex;align-items:center;justify-content:space-between; gap:12px;min-height:56px} .brand{display:flex;align-items:center;gap:9px;min-height:44px;font-weight:800; letter-spacing:.02em;text-decoration:none;color:var(--ink);font-size:15px} .brand .mark{display:inline-flex;align-items:center;justify-content:center; width:30px;height:30px;border-radius:8px;background:var(--accent);color:#fff; font-size:12px;font-weight:800;letter-spacing:.04em} .head-tel{display:flex;flex-direction:column;align-items:flex-end;gap:1px; text-decoration:none;color:var(--ink);min-height:44px;justify-content:center} .head-tel b{font-size:15px;font-weight:700;letter-spacing:.01em;white-space:nowrap} .head-tel span{font-size:11px;color:var(--ink-soft)} /* ---------- кнопки ---------- */ .btn{position:relative;display:inline-flex;align-items:center;justify-content:center; gap:8px;min-height:52px;padding:12px 22px;border:0;border-radius:var(--r); font-size:16px;font-weight:700;line-height:1.15;text-decoration:none;cursor:pointer; overflow:hidden;transition:background-color .18s linear,border-color .18s linear} .btn-primary{background:var(--accent);color:var(--on-accent); box-shadow:0 4px 0 var(--accent-dark),0 14px 26px -12px rgba(58,90,122,.35)} .btn-primary:hover{background:var(--accent2)} .btn-primary::after{content:"";position:absolute;top:0;left:-60%;width:38%;height:100%; background:linear-gradient(100deg,transparent,rgba(255,255,255,.34),transparent); transform:translateX(-120%);animation:shine 4.6s ease-in-out infinite} @keyframes shine{0%,72%{transform:translateX(-120%)}88%,100%{transform:translateX(420%)}} .btn-ghost{background:transparent;color:var(--accent-dark); border:1px solid var(--accent-line);box-shadow:none} .btn-ghost:hover{border-color:var(--accent)} .btn-block{display:flex;width:100%} @media (prefers-reduced-motion:reduce){ .btn-primary::after{display:none} *{animation-duration:.001ms !important;transition-duration:.001ms !important} } /* ---------- HERO: диагональный сплит двух нейтралей ---------- */ .hero{position:relative;padding:26px 0 34px;border-top:0; background:linear-gradient(104deg,var(--bg3) 0%,var(--bg3) 46%,var(--paper) 46.2%,var(--paper) 100%)} .hero .stamp{font-size:12px;color:var(--ink-soft);letter-spacing:.01em;margin:0 0 10px; padding-left:12px;border-left:2px solid var(--accent)} .hero h1{margin:0 0 12px;max-width:22ch} .hero .sub{max-width:66ch;margin-bottom:14px} @media (min-width:768px){.hero h1{max-width:none}} /* переключатель суммы — сегментированная лента (в