/* ==========================================================================
   Пульс Страны - своя дизайн-система (xn--80avhfgfaif1ge.xn--p1ai)
   Отличается от скина фонда сознательно: другой шрифт, другая палитра,
   другая композиция. Общий src/common.css не используется.

   Правила:
   - шрифт Geist 400-600, без курсива и весов выше 700;
   - фон плоский: #ffffff и #f2f5f7, тёмные блоки только #1F1F1F;
   - один акцент - глубокий зелёный #14795f (насыщенность 71 %);
   - радиусы 8 / 12 / 16 / 24;
   - отступы из шкалы 4 8 12 16 24 32 40 48 64 80 96;
   - движение cubic-bezier(.22,1,.36,1), 500 / 300 мс.
   ========================================================================== */

@font-face{
  font-family:'Geist';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('/fonts/geist-cyrillic.woff2') format('woff2');
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;
}
@font-face{
  font-family:'Geist';
  font-style:normal;
  font-weight:400 600;
  font-display:swap;
  src:url('/fonts/geist-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
  --accent:#14795f;
  --accent-dark:#0f5c49;
  --accent-soft:#e4f2ec;
  --ink:#141414;
  --ink-2:#2f4038;
  --muted:#5f6f68;
  --line:#dde5e2;
  --bg:#f2f5f7;
  --bg-white:#ffffff;
  --bg-dark:#1F1F1F;
  --radius-s:8px;
  --radius:12px;
  --radius-m:16px;
  --radius-l:24px;
  --wrap:1160px;
  --ease:cubic-bezier(.22,1,.36,1);
  --font:'Geist','Segoe UI',system-ui,sans-serif;
  --sp:clamp(64px,7vw,96px);
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:88px}
body{
  margin:0;font-family:var(--font);color:var(--ink);background:var(--bg);
  font-size:17px;line-height:1.6;overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:600;line-height:1.08;letter-spacing:-.025em;text-wrap:balance}
p{margin:0 0 1em;text-wrap:pretty}
ul{margin:0;padding:0;list-style:none}

:where(a,button,summary,[tabindex]):focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.on-dark :where(a,button,summary):focus-visible{outline-color:#fff}

.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 24px}
.section{padding:var(--sp) 0}
.section--white{background:var(--bg-white)}
.section--dark{background:var(--bg-dark);color:#fff}
.section--dark h2,.section--dark h3{color:#fff}
.section--accent{background:var(--accent-soft)}

.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;
  color:var(--accent);margin-bottom:16px
}
.eyebrow::before{content:"";width:24px;height:1px;background:currentColor;display:block}
.section--dark .eyebrow{color:#7fd6b8}
.lead{font-size:18px;color:var(--muted);max-width:62ch}
.section--dark .lead{color:rgba(255,255,255,.72)}
.center{text-align:center}
.center .lead{margin-left:auto;margin-right:auto}
.center .eyebrow{justify-content:center}
.h2{font-size:clamp(26px,3.6vw,40px)}
.h3{font-size:clamp(19px,2.2vw,24px)}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:16px 28px;border-radius:var(--radius);
  font-family:inherit;font-weight:500;font-size:16px;line-height:1;
  border:1px solid transparent;cursor:pointer;white-space:nowrap;
  transition:background-color .3s var(--ease),color .3s var(--ease),
             border-color .3s var(--ease),box-shadow .3s var(--ease),transform .5s var(--ease)
}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--accent);color:#fff}
.btn--primary:hover{background:var(--accent-dark);box-shadow:0 10px 24px rgba(20,121,95,.24)}
.btn--ghost{border-color:rgba(255,255,255,.34);color:#fff}
.btn--ghost:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.6)}
.btn--dark{background:var(--ink);color:#fff}
.btn--dark:hover{background:#000}
.btn--light{background:#fff;color:var(--ink)}
.btn--light:hover{background:var(--accent-soft)}
.btn--outline{border-color:var(--line);color:var(--ink);background:transparent}
.btn--outline:hover{border-color:var(--ink)}
.btn--lg{padding:16px 32px;font-size:17px}
.btn--sm{padding:12px 16px;font-size:14px}

.link{display:inline-flex;align-items:center;gap:6px;font-weight:500;color:var(--accent);border-bottom:1px solid rgba(20,121,95,.35);padding-bottom:1px;transition:border-color .3s var(--ease)}
.link:hover{border-color:var(--accent)}
.on-dark .link{color:#7fd6b8;border-bottom-color:rgba(127,214,184,.4)}

/* ---------- header ---------- */
.hdr{position:sticky;top:0;z-index:60;background:rgba(242,245,247,.82);backdrop-filter:saturate(180%) blur(14px);transition:background-color .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease);border-bottom:1px solid transparent}
.hdr.is-stuck{background:rgba(255,255,255,.94);border-bottom-color:var(--line);box-shadow:0 1px 2px rgba(31,31,31,.05)}
.hdr__in{display:flex;align-items:center;gap:20px;min-height:76px}
.hdr__logo{display:flex;align-items:center;gap:12px;font-weight:600;font-size:19px;letter-spacing:-.02em}
.hdr__logo img{height:44px;width:auto}
.hdr__logo span{display:none}
@media(min-width:520px){.hdr__logo span{display:block}}
.hdr__nav{margin-left:auto;display:none;gap:2px}
.hdr__nav a{position:relative;padding:10px 14px;border-radius:var(--radius-s);font-weight:500;font-size:15px;color:var(--ink-2);transition:color .3s var(--ease),background-color .3s var(--ease)}
.hdr__nav a:hover{color:var(--ink);background:rgba(255,255,255,.7)}
.hdr__nav a.is-active{color:var(--accent)}
.hdr__nav a.is-active::after{content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--accent);border-radius:2px}
.hdr__cta{margin-left:8px;display:none}
@media(min-width:1060px){.hdr__nav{display:flex}.hdr__cta{display:inline-flex}}
.burger{margin-left:auto;width:48px;height:48px;border-radius:var(--radius-s);border:1px solid var(--line);background:#fff;display:grid;place-items:center;cursor:pointer;transition:background-color .3s var(--ease)}
.burger:hover{background:var(--accent-soft)}
.burger i{display:block;width:18px;height:2px;background:var(--ink);position:relative;transition:background-color .3s var(--ease)}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:18px;height:2px;background:var(--ink);transition:transform .5s var(--ease)}
.burger i::before{top:-6px}.burger i::after{top:6px}
.is-open .burger i{background:transparent}
.is-open .burger i::before{transform:translateY(6px) rotate(45deg)}
.is-open .burger i::after{transform:translateY(-6px) rotate(-45deg)}
@media(min-width:1060px){.burger{display:none}}

.mnav{position:fixed;inset:0;z-index:70;background:#fff;display:flex;flex-direction:column;padding:16px 24px 32px;overflow:auto;visibility:hidden;opacity:0;transition:opacity .3s var(--ease),visibility .3s}
.mnav.open{visibility:visible;opacity:1}
.mnav__top{display:flex;align-items:center;justify-content:space-between;padding:8px 0;margin-bottom:16px}
.mnav__top strong{font-size:16px}
.mnav__x{width:48px;height:48px;border-radius:var(--radius-s);border:1px solid var(--line);background:#fff;font-size:22px;cursor:pointer}
.mnav a{padding:16px 4px;font-size:20px;font-weight:500;border-bottom:1px solid var(--line);opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.mnav.open a{opacity:1;transform:none}
.mnav.open a:nth-child(2){transition-delay:.05s}
.mnav.open a:nth-child(3){transition-delay:.09s}
.mnav.open a:nth-child(4){transition-delay:.13s}
.mnav.open a:nth-child(5){transition-delay:.17s}
.mnav.open a:nth-child(6){transition-delay:.21s}
.mnav.open a:nth-child(7){transition-delay:.25s}
.mnav.open a:nth-child(8){transition-delay:.29s}
.mnav .btn{margin-top:24px;opacity:0;transform:translateY(12px);transition:opacity .5s var(--ease),transform .5s var(--ease)}
.mnav.open .btn{opacity:1;transform:none;transition-delay:.33s}

/* ---------- hero: панель + фото, а не полноэкранный фон ---------- */
.hero{background:var(--bg);padding:clamp(40px,5vw,64px) 0 var(--sp)}
.hero__in{display:grid;gap:32px;grid-template-columns:1fr;align-items:center}
@media(min-width:920px){.hero__in{grid-template-columns:1.02fr .98fr;gap:56px}}
.hero__text{background:var(--bg-dark);color:#fff;border-radius:var(--radius-l);padding:clamp(28px,4vw,56px)}
.hero__tag{
  display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:var(--radius-s);
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);
  font-size:13px;margin-bottom:24px
}
.hero__tag b{color:#7fd6b8;font-weight:500}
.hero h1{font-size:clamp(30px,4.4vw,50px);line-height:1.06;letter-spacing:-.03em;max-width:20ch}
.hero p{font-size:17px;color:rgba(255,255,255,.74);margin-top:20px;max-width:52ch}
.hero__acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.hero__phone{display:flex;flex-direction:column;gap:4px;margin-top:32px;padding-top:24px;border-top:1px solid rgba(255,255,255,.14)}
.hero__phone b{font-size:24px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.hero__phone small{color:rgba(255,255,255,.56);font-size:14px}
.hero__media{position:relative}
.hero__media img{width:100%;border-radius:var(--radius-l);aspect-ratio:4/3.1;object-fit:cover}
.hero__media figcaption{margin-top:12px;font-size:13px;color:var(--muted)}

/* линия пульса - разделитель */
.pulse{display:block;width:100%;height:32px;color:var(--accent);opacity:.5}

/* ---------- как это работает: горизонтальная шкала ---------- */
.track{position:relative;display:grid;gap:32px;grid-template-columns:1fr;margin-top:56px}
@media(min-width:760px){.track{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1040px){.track{grid-template-columns:repeat(4,1fr);gap:24px}}
.track::before{
  content:"";position:absolute;left:0;right:0;top:20px;height:1px;background:var(--line);display:none
}
@media(min-width:1040px){.track::before{display:block}}
.tstep{position:relative}
.tstep__n{
  width:40px;height:40px;border-radius:50%;background:var(--bg);border:1px solid var(--line);
  display:grid;place-items:center;font-size:15px;font-weight:600;color:var(--accent);
  position:relative;z-index:1;margin-bottom:20px;font-variant-numeric:tabular-nums
}
.section--white .tstep__n{background:#fff}
.section--accent .tstep__n{background:var(--bg-white)}
.tstep h3{font-size:18px;margin-bottom:8px}
.tstep p{color:var(--muted);font-size:15px;margin:0}

/* ---------- кому помогает: строки с крупным номером ---------- */
.who{display:grid;gap:0;margin-top:48px;border-top:1px solid var(--line)}
.who__row{
  display:grid;gap:8px 24px;grid-template-columns:1fr;
  padding:28px 0;border-bottom:1px solid var(--line);
  transition:background-color .3s var(--ease)
}
@media(min-width:760px){.who__row{grid-template-columns:56px 240px 1fr;align-items:baseline}}
.who__row:hover{background:rgba(255,255,255,.6)}
.who__i{font-size:13px;color:var(--accent);font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:.06em}
.who h3{font-size:19px}
.who p{color:var(--muted);font-size:16px;margin:0}

/* ---------- приложение ---------- */
.split{display:grid;gap:48px;align-items:center;grid-template-columns:1fr}
@media(min-width:900px){.split{grid-template-columns:1fr 1.05fr}.split--rev>.split__media{order:2}}
.split__media img{width:100%;border-radius:var(--radius-m)}
.split__media--frame{background:#fff;border-radius:var(--radius-l);padding:20px}
.split__media--frame img{border-radius:var(--radius)}
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.stores a{display:block;transition:transform .5s var(--ease),opacity .3s var(--ease)}
.stores a:hover{transform:translateY(-3px);opacity:.9}
.stores img{height:52px;width:auto}

.checks{display:grid;gap:12px;margin-top:24px}
.checks li{display:flex;gap:12px;align-items:flex-start;color:var(--ink-2);font-size:16px}
.checks li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-top:9px}

/* ---------- сравнение «у всех / с Пульсом» - таблица ---------- */
.cmp{display:none;width:100%;border-collapse:collapse;table-layout:fixed;margin-top:40px;background:var(--bg-white);border-radius:var(--radius-m);overflow:hidden}
@media(min-width:820px){.cmp{display:table}}
.cmp__head,.cmp__cell{padding:20px 24px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.cmp__head{width:auto;font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);font-weight:500;background:var(--bg-white)}
.cmp__head:first-child,.cmp__cell--topic{width:200px}
.cmp__head--good{color:var(--accent);background:var(--accent-soft)}
.cmp__cell{font-size:15px;color:var(--ink-2);font-weight:400}
.cmp__cell--topic{font-weight:600;color:var(--ink)}
.cmp__cell--good{background:rgba(228,242,236,.5)}
.cmp tr:last-child .cmp__cell{border-bottom:0}
.cards-mobile{display:grid;gap:24px;margin-top:32px}
@media(min-width:820px){.cards-mobile{display:none}}
.mini{background:#fff;border-radius:var(--radius-m);padding:24px}
.mini h3{font-size:18px;margin-bottom:16px}
.mini dl{display:grid;gap:16px;margin:0}
.mini dt{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.mini dd{margin:0;font-size:15px;color:var(--ink-2)}

/* ---------- как отправить заявку ---------- */
.twoup{display:grid;gap:32px;grid-template-columns:1fr;margin-top:48px}
@media(min-width:820px){.twoup{grid-template-columns:1fr 1fr}}
.stepcard{background:var(--bg-white);border-radius:var(--radius-m);overflow:hidden}
.stepcard img{width:100%;aspect-ratio:16/9;object-fit:cover}
.stepcard__b{padding:28px}
.stepcard__b h3{font-size:20px;margin-bottom:10px}
.stepcard__b p{color:var(--muted);font-size:16px;margin:0}
.stepcard__n{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:10px;font-weight:500}

/* ---------- пояснение простыми словами ---------- */
.plain{display:grid;gap:24px;margin-top:24px;max-width:70ch}
.plain p{font-size:17px;color:var(--ink-2)}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:24px}
.chip{padding:9px 16px;border-radius:var(--radius-s);background:var(--bg-white);border:1px solid var(--line);font-size:14px;font-weight:500;color:var(--ink-2);transition:background-color .3s var(--ease),border-color .3s var(--ease),color .3s var(--ease)}
.chip:hover{background:var(--accent);border-color:var(--accent);color:#fff}
.section--dark .chip{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.14);color:#fff}

/* ---------- вопросы: открытый список, без аккордеона ---------- */
.qa{display:grid;gap:2px;margin-top:44px;background:var(--line);border-radius:var(--radius-m);overflow:hidden}
.qa__item{background:var(--bg-white);padding:32px}
.qa__q{font-size:18px;font-weight:600;margin-bottom:10px;display:flex;gap:12px}
.qa__q span{color:var(--accent);font-variant-numeric:tabular-nums}
.qa__a{color:var(--muted);font-size:16px;margin:0;max-width:72ch}

/* ---------- блок поддержки ---------- */
.donate{background:var(--bg-dark);color:#fff;border-radius:var(--radius-l);padding:clamp(32px,5vw,64px)}
.donate h2{font-size:clamp(24px,3.4vw,36px);max-width:22ch}
.donate p{font-size:17px;color:rgba(255,255,255,.7);margin-top:16px;max-width:58ch}
.donate__acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}

/* ---------- контакты ---------- */
.contacts{display:grid;gap:2px;grid-template-columns:1fr;margin-top:44px;background:var(--line);border-radius:var(--radius-m);overflow:hidden}
@media(min-width:760px){.contacts{grid-template-columns:repeat(3,1fr)}}
.cbox{background:var(--bg-white);padding:28px}
.cbox h3{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:14px;font-weight:500}
.cbox a{display:block;font-weight:600;padding:4px 0;transition:color .3s var(--ease)}
.cbox a:hover{color:var(--accent)}
.cbox p{color:var(--ink-2);margin:0;font-size:15px}
.note{color:var(--muted);font-size:14px;margin:8px 0 0}

/* ---------- подвал ---------- */
.ftr{background:var(--bg-dark);color:rgba(255,255,255,.6);padding:80px 0 32px}
.ftr__grid{display:grid;gap:40px;grid-template-columns:1fr}
@media(min-width:760px){.ftr__grid{grid-template-columns:1.5fr 1fr 1fr}}
.ftr h4{color:#fff;font-size:13px;letter-spacing:.1em;text-transform:uppercase;margin-bottom:16px;font-weight:500}
.ftr a{display:block;padding:6px 0;color:rgba(255,255,255,.6);font-size:15px;transition:color .3s var(--ease)}
.ftr a:hover{color:#fff}
.ftr__brand{display:flex;align-items:center;gap:12px;color:#fff;font-weight:600;font-size:18px;margin-bottom:16px}
.ftr__brand img{height:40px;width:auto;background:#fff;border-radius:var(--radius-s);padding:4px}
.ftr__note{font-size:14px;line-height:1.6;max-width:42ch}
.ftr__soc{display:flex;gap:8px;margin-top:24px}
.ftr__soc a{width:44px;height:44px;border-radius:var(--radius-s);background:rgba(255,255,255,.08);display:grid;place-items:center;padding:0;font-size:13px}
.ftr__soc a:hover{background:var(--accent);color:#fff}
.ftr__bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:64px;padding-top:24px;font-size:13px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;color:rgba(255,255,255,.62)}
.ftr__bottom a{display:inline;padding:0;color:rgba(255,255,255,.7)}

/* появление при скролле */
.rv{opacity:0;transform:translateY(20px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.rv.in{opacity:1;transform:none}

@media(prefers-reduced-motion:reduce){
  .rv{opacity:1;transform:none;transition:none}
  html{scroll-behavior:auto}
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
}

.skip{position:absolute;left:-999px;top:0;background:#fff;padding:12px 16px;z-index:100;border-radius:0 0 var(--radius-s) 0}
.skip:focus{left:0;top:0}

.mt-16{margin-top:16px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-40{margin-top:40px}
