/* Шрифти лежать у темі, не на Google Fonts: сторонній код давав 134 КБ
   і блокував відображення на 750 мс.
   Файли варіативні - один на всю родину замість трьох окремих ваг.
   Тільки latin і cyrillic, font-display:swap, щоб текст було видно одразу. */
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url('../fonts/jetbrains-vf-cyrillic-ext.woff2') format('woff2-variations');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url('../fonts/jetbrains-vf-cyrillic.woff2') format('woff2-variations');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url('../fonts/jetbrains-vf-latin-ext.woff2') format('woff2-variations');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:400 500;font-display:swap;src:url('../fonts/jetbrains-vf-latin.woff2') format('woff2-variations');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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500 800;font-display:swap;src:url('../fonts/manrope-vf-cyrillic-ext.woff2') format('woff2-variations');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500 800;font-display:swap;src:url('../fonts/manrope-vf-cyrillic.woff2') format('woff2-variations');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500 800;font-display:swap;src:url('../fonts/manrope-vf-latin-ext.woff2') format('woff2-variations');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Manrope';font-style:normal;font-weight:500 800;font-display:swap;src:url('../fonts/manrope-vf-latin.woff2') format('woff2-variations');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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Onest';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/onest-vf-cyrillic-ext.woff2') format('woff2-variations');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Onest';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/onest-vf-cyrillic.woff2') format('woff2-variations');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Onest';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/onest-vf-latin-ext.woff2') format('woff2-variations');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Onest';font-style:normal;font-weight:300 700;font-display:swap;src:url('../fonts/onest-vf-latin.woff2') format('woff2-variations');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+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}

:root{
  --bg:#F4F4F2; --bg-2:#EDEDEA; --card:#FFFFFF;
  --panel:#151A22; --panel-2:#1D242E;
  --ink:#12151B; --ink-2:#4C545F; --muted:#8B939E;
  --line:#E4E4E0; --line-2:#D2D2CC;
  --accent:#F84525; --accent-soft:#FFEDE9;
  --blue:#1A73E8; --blue-soft:#E8F0FE;
  --gold:#FFA000; --gold-soft:#FFF3DF;
  --ok:#1C7C4A; --ok-bg:#E7F4EC;
  --r-lg:22px; --r-md:14px; --r-sm:10px;
  --sh:0 1px 2px rgba(18,21,27,.04), 0 26px 54px -26px rgba(18,21,27,.26);
  --sh-sm:0 1px 2px rgba(18,21,27,.04), 0 10px 24px -14px rgba(18,21,27,.18);
  --sp:clamp(72px,7.5vw,116px);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--ink);
  font-family:'Onest',system-ui,sans-serif; font-size:16.5px; line-height:1.65;
  -webkit-font-smoothing:antialiased}
h1,h2,h3{font-family:'Manrope',system-ui,sans-serif; font-weight:800;
  line-height:1.1; letter-spacing:-.035em; margin:0}
a{color:inherit}
img{max-width:100%; height:auto; display:block}
.wrap{max-width:1280px; margin:0 auto; padding:0 26px}
.mono{font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.16em;
  text-transform:uppercase; color:var(--ink-2)}
.acc{color:var(--accent)}

/* ── шапка ── */
header{position:sticky; top:0; z-index:60; background:rgba(244,244,242,.9);
  backdrop-filter:blur(16px); border-bottom:1px solid var(--line)}
.bar{display:flex; align-items:center; gap:26px; height:70px}
.brand{display:flex; align-items:center; gap:11px; text-decoration:none}
.brand__m{width:34px; height:34px; border-radius:10px; background:var(--panel);
  flex-shrink:0; overflow:hidden}
.brand__m img{width:100%; height:100%; object-fit:cover}
.brand__n{display:flex; align-items:center; gap:9px}
.brand b{font-family:'Manrope',sans-serif; font-weight:700; font-size:15px; letter-spacing:-.025em}
.brand small{display:block; font-size:10.5px; letter-spacing:.06em; color:var(--muted)}
.tagpill{font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--t-ink,var(--blue)); background:var(--t-bg,var(--blue-soft));
  padding:3px 7px; border-radius:5px}
nav{display:flex; gap:20px; margin:0 auto}
nav a{font-size:15px; text-decoration:none; color:var(--ink-2); transition:.16s}
nav a:hover,nav a:focus-visible{color:var(--ink)}
.bar__end{display:flex; align-items:center; gap:10px}
.quick{display:flex; gap:4px}
.quick--mob{display:none}
.quick a{width:36px; height:36px; border-radius:9px; display:grid; place-items:center;
  color:var(--ink-2); transition:.16s}
.quick a:hover{background:var(--card); color:var(--ink); box-shadow:var(--sh-sm)}
/* плаваючий перемикач мов, як на mappersgeo.com */
.langbar{position:fixed; right:14px; bottom:14px; z-index:55; display:flex; gap:2px;
  background:var(--card); border:1px solid var(--line); border-radius:10px; padding:4px;
  box-shadow:0 2px 6px rgba(18,21,27,.16), 0 14px 30px -16px rgba(18,21,27,.4)}
.langbar a{padding:7px 12px; text-decoration:none; border-radius:7px; font-size:13px;
  font-weight:500; color:var(--ink-2); transition:.16s}
.langbar a:hover{background:var(--bg-2); color:var(--ink)}
.langbar a[aria-current]{background:var(--ink); color:#fff}
.btn{display:inline-flex; align-items:center; gap:9px; height:40px; padding:0 18px;
  font-size:14.5px; font-weight:500; text-decoration:none; border-radius:10px;
  border:1px solid var(--line-2); background:var(--card); color:var(--ink); transition:.16s}
.btn:hover{border-color:var(--ink)}
.btn--solid{background:var(--accent); border-color:var(--accent); color:#fff;
  box-shadow:0 8px 20px -10px rgba(248,69,37,.8)}
.btn--solid:hover{background:#e33a1c; border-color:#e33a1c}
.btn--dark{background:var(--ink); border-color:var(--ink); color:#fff}
.btn--dark:hover{background:#000; border-color:#000}
.btn--ghost{background:transparent; border-color:rgba(255,255,255,.28); color:#fff}
.btn--ghost:hover{background:#fff; color:var(--ink); border-color:#fff}
.btn--lg{height:48px; padding:0 22px; font-size:15.5px}

/* бургер і бічна панель */
.burger{display:none; width:42px; height:42px; border-radius:10px; border:1px solid var(--line-2);
  background:var(--card); align-items:center; justify-content:center; cursor:pointer; padding:0}
.burger span{display:block; width:18px; height:1.6px; background:var(--ink); border-radius:2px;
  position:relative}
.burger span::before,.burger span::after{content:""; position:absolute; left:0; width:18px;
  height:1.6px; background:var(--ink); border-radius:2px}
.burger span::before{top:-6px} .burger span::after{top:6px}
.scrim{position:fixed; inset:0; z-index:70; background:rgba(18,21,27,.45);
  backdrop-filter:blur(3px); opacity:0; pointer-events:none; transition:opacity .22s}
.scrim[data-open]{opacity:1; pointer-events:auto}
.drawer{position:fixed; top:0; right:0; bottom:0; width:min(88vw,340px); z-index:80;
  background:var(--bg); transform:translateX(100%); transition:transform .26s ease-out;
  display:flex; flex-direction:column; padding:18px 22px 26px; overflow-y:auto}
.drawer[data-open]{transform:none}
.drawer__top{display:flex; align-items:center; justify-content:space-between; margin-bottom:26px}
.drawer__close{width:42px; height:42px; border-radius:10px; border:1px solid var(--line-2);
  background:var(--card); cursor:pointer; display:grid; place-items:center; padding:0}
.drawer nav{display:flex; flex-direction:column; gap:0; margin:0}
.drawer nav a{font-size:19px; font-weight:500; color:var(--ink); padding:14px 0;
  border-bottom:1px solid var(--line)}
.drawer__cta{display:grid; gap:10px; margin-top:26px}
.drawer__cta .btn{justify-content:center}
.drawer__langs{display:flex; gap:6px; margin-top:22px}
.drawer__langs a{flex:1; text-align:center; padding:10px 0; border-radius:9px;
  border:1px solid var(--line); background:var(--card); font-size:14px; text-decoration:none}
.drawer__langs a[aria-current]{background:var(--ink); color:#fff; border-color:var(--ink)}
.quick--drawer{margin-top:18px; padding-top:22px; border-top:1px solid var(--line); gap:8px}
.quick--drawer a{width:44px; height:44px; background:var(--card); border:1px solid var(--line)}
body[data-lock]{overflow:hidden}


/* ── хіро ── */
.hero{padding:clamp(30px,3.4vw,44px) 0 0}
/* картка-профайл */
.hero{position:relative; padding:0 0 0}
/* темна смуга тягнеться на всю ширину екрана, картка лежить поверх неї */
.hero::before{content:""; position:absolute; left:0; right:0; top:0; height:340px;
  background:var(--panel)}
.profile{position:relative; margin-top:clamp(26px,3vw,40px); background:var(--card);
  border-radius:var(--r-lg); border-top-right-radius:0; box-shadow:var(--sh); overflow:hidden;
  display:grid; grid-template-columns:minmax(0,400px) minmax(0,1fr)}
.media{position:relative; background:#151419; min-height:470px; overflow:hidden}
.media__img{position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:bottom}

.ident{padding:clamp(30px,3.2vw,46px); display:flex; flex-direction:column; justify-content:center}
.ident__lat{margin:0; font-family:'JetBrains Mono',monospace; font-size:11px;
  letter-spacing:.2em; text-transform:uppercase; color:var(--muted)}
.ident h1{margin:10px 0 0; font-size:clamp(30px,3.6vw,46px)}

.ranks{list-style:none; margin:clamp(22px,2.4vw,30px) 0 0; padding:0; display:grid; gap:14px}
.ranks li{display:flex; align-items:center; gap:14px}
.ranks__ico{width:52px; height:52px; border-radius:14px; background:var(--bg-2);
  display:grid; place-items:center; flex-shrink:0}
.ranks__t b{display:block; font-family:'Manrope',sans-serif; font-weight:800;
  font-size:clamp(18px,1.8vw,23px); letter-spacing:-.03em; line-height:1.2}
.ranks__t span{display:block; margin-top:3px; font-size:15px; color:var(--muted)}
.ranks__t b.dia{color:var(--blue)}
.ranks__t b.gld{color:#C67C00}

.ident__act{display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-top:22px}
.social{display:flex; gap:4px}
.social a{width:38px; height:38px; border-radius:10px; display:grid; place-items:center;
  color:var(--ink-2); background:var(--bg-2); transition:.16s}
.social a:hover{background:var(--ink); color:#fff}

/* показники окремою смугою під карткою */
.numbers{margin:0 0 18px; background:var(--card); border-radius:var(--r-lg);
  box-shadow:var(--sh-sm); display:grid; grid-template-columns:repeat(4,1fr)}
.numbers div{padding:22px 26px 24px; border-left:1px solid var(--line)}
.numbers div:first-child{border-left:0}
.numbers b{display:block; font-family:'Manrope',sans-serif; font-weight:800;
  font-size:clamp(24px,2.4vw,32px); letter-spacing:-.045em; line-height:1}
.numbers span{display:block; margin-top:7px; font-size:13.5px; color:var(--muted)}

.cta{display:flex; flex-wrap:wrap; gap:10px; margin-top:24px}

/* ── загальні заголовки секцій ── */
section{padding:var(--sp) 0 0}
section:last-of-type{padding-bottom:var(--sp)}
.shead{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,430px); gap:44px;
  align-items:end; margin-bottom:42px}
.shead .mono{color:var(--accent); display:block; margin-bottom:12px}
.shead h2{font-size:clamp(28px,3.4vw,44px)}
.shead p{margin:0; color:var(--ink-2)}
.shead--solo{grid-template-columns:1fr}

/* ── статуси ── */
.cards{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.c{background:var(--card); border-radius:var(--r-lg); padding:26px 24px 22px;
  box-shadow:var(--sh-sm); display:flex; flex-direction:column;
  transition:transform .2s, box-shadow .2s}
.c:hover{transform:translateY(-3px); box-shadow:var(--sh)}
.c__ico{width:46px; height:46px; border-radius:13px; background:var(--bg-2);
  display:grid; place-items:center; color:var(--ink); margin-bottom:18px}
.c h3{font-family:'Onest',sans-serif; font-weight:600; font-size:19px;
  letter-spacing:-.02em; line-height:1.28}
.c p{margin:9px 0 0; color:var(--muted); font-size:14.5px; line-height:1.55}
.c__foot{display:flex; align-items:center; gap:10px; margin-top:auto; padding-top:20px}
.chip{display:inline-flex; align-items:center; gap:6px; border-radius:999px;
  padding:4px 11px; font-size:12px; font-weight:500; background:var(--ok-bg); color:var(--ok)}
.chip i{width:6px; height:6px; border-radius:50%; background:currentColor}
.chip--y{background:var(--bg-2); color:var(--ink-2); font-family:'JetBrains Mono',monospace;
  font-size:11px; letter-spacing:.06em}
.c__by{margin-left:auto; font-family:'JetBrains Mono',monospace; font-size:10px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--line-2)}
.c__ico--plain{background:#fff; border:1px solid var(--line)}
.c__ico img{width:72%; height:72%; object-fit:contain}
.c__icos{display:flex; gap:10px; margin-bottom:18px}
.c__icos .c__ico{margin-bottom:0}

/* кожна плитка у кольорі свого сервісу */
.c[class*="c--t"]{background:linear-gradient(168deg,var(--t-bg) 0%,var(--card) 58%);
  outline:1px solid var(--t-line)}
.c[class*="c--t"] .c__ico{background:#fff; border-color:var(--t-line)}
.c[class*="c--t"] h3{color:var(--t-ink)}
.c--t-blue  {--t-bg:#E8F0FE; --t-line:rgba(26,115,232,.24);  --t-ink:#1A73E8}
.c--t-gold  {--t-bg:#FFF4E0; --t-line:rgba(184,117,0,.26);   --t-ink:#B87500}
.c--t-silver{--t-bg:#F1F2F4; --t-line:rgba(94,104,116,.28);  --t-ink:#5E6874}
.c--t-green {--t-bg:#E7F4EC; --t-line:rgba(28,124,74,.26);   --t-ink:#1C7C4A}
.c--t-orange{--t-bg:#FFF0E2; --t-line:rgba(201,122,0,.28);   --t-ink:#C97A00}
.c--t-navy  {--t-bg:#E8EEF7; --t-line:rgba(0,53,128,.24);    --t-ink:#003580}
.rank{display:inline-block; margin-left:8px; vertical-align:middle;
  font-family:'JetBrains Mono',monospace; font-size:9px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--blue); background:var(--blue-soft);
  padding:3px 7px; border-radius:5px}

/* ── саміти: по станції на колонку, фото над і під лінією ── */
.trail{--grow:clamp(0px,4.6vw,62px);
  display:grid; grid-template-columns:repeat(var(--n,4),1fr); column-gap:clamp(14px,1.5vw,20px);
  grid-template-rows:auto 2px auto; padding-inline:var(--grow)}
.trail__line{grid-row:2; grid-column:1/-1; background:var(--line-2); align-self:stretch;
  margin-inline:calc(var(--grow) * -1)}
.st{grid-column:var(--col); position:relative; min-width:0; margin:0; display:flex;
  flex-direction:column}
.st--up{grid-row:1; justify-content:flex-end; padding-bottom:22px}
.st--down{grid-row:3; padding-top:22px}
.st img{width:calc(100% + var(--grow) * 2); max-width:none;
  margin-left:calc(var(--grow) * -1); aspect-ratio:4/3; object-fit:cover;
  border-radius:var(--r-md); box-shadow:var(--sh-sm)}
.st figcaption{display:flex; align-items:baseline; justify-content:center; gap:9px;
  padding:13px 0 0}
.st--down figcaption{padding:0 0 13px}
.st figcaption b{font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.12em;
  color:var(--accent); font-weight:500}
.st figcaption span{font-family:'Manrope',sans-serif; font-weight:700; font-size:18px;
  letter-spacing:-.03em}
/* штрих від підпису до лінії */
.st::before{content:""; position:absolute; left:50%; width:2px; height:22px;
  background:var(--line-2); transform:translateX(-1px)}
.st--up::before{bottom:0}
.st--down::before{top:0}
/* крапка на лінії */
.st::after{content:""; position:absolute; left:50%; width:13px; height:13px; border-radius:50%;
  background:var(--card); border:2px solid var(--line-2); transform:translateX(-50%); z-index:2}
.st--up::after{bottom:-7px}
.st--down::after{top:-7px}
.st:hover::after{background:var(--accent); border-color:var(--accent)}

.next{display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin-top:26px;
  border:1px dashed var(--line-2); border-radius:var(--r-md); padding:16px 22px}
.next__y{font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:.12em; color:var(--accent)}
.next b{font-family:'Manrope',sans-serif; font-weight:700; font-size:18px; letter-spacing:-.03em}
.next__soon{font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--accent); background:var(--accent-soft);
  padding:4px 8px; border-radius:5px}
.next__note{margin-left:auto; font-size:14.5px; color:var(--muted)}

/* ── агенція ── */
.agency{background:var(--panel); border-radius:var(--r-lg); overflow:hidden; color:#fff;
  position:relative}
.agency::before{content:""; position:absolute; right:-8%; top:-45%; width:46%; aspect-ratio:1;
  border-radius:50%; background:radial-gradient(circle, rgba(248,69,37,.28), transparent 66%)}
.agency__in{position:relative; z-index:2; display:grid;
  grid-template-columns:minmax(0,40%) minmax(0,1fr);
  gap:clamp(30px,4vw,60px); align-items:center; padding:clamp(34px,4vw,56px)}
.agency__logo img{width:100%; max-width:360px}
.agency__txt h2{font-family:'Onest',system-ui,sans-serif; font-weight:400;
  font-size:clamp(16.5px,1.6vw,19px); line-height:1.6; letter-spacing:0;
  color:#C3C8CE; max-width:46ch}
.agency__txt h2 b{color:#fff; font-weight:600}
.agency__txt p{margin:12px 0 0; font-size:15.5px; color:#8B939E; max-width:46ch}
.agency .numbers{position:relative; z-index:2; margin:0; background:transparent;
  border-radius:0; box-shadow:none; border-top:1px solid rgba(255,255,255,.1)}
.agency .numbers div{border-left:1px solid rgba(255,255,255,.1)}
.agency .numbers b{color:#fff}
.agency .numbers span{color:#8B939E}

/* ── youtube ── */
.yt-tag{display:inline-flex; align-items:center; gap:8px; background:#FF0000; color:#fff;
  border-radius:999px; padding:7px 15px 7px 12px; font-size:13px; font-weight:600;
  letter-spacing:-.01em; margin-bottom:14px}
.btn--yt{background:#FF0000; border-color:#FF0000; color:#fff;
  box-shadow:0 8px 20px -10px rgba(255,0,0,.8)}
.btn--yt:hover{background:#d90000; border-color:#d90000}
#youtube .shead .mono{color:#FF0000}
.yt{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.vid{background:var(--card); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm);
  transition:transform .2s}
.vid:hover{transform:translateY(-3px)}
.vid__thumb{aspect-ratio:16/9; background:var(--bg-2); border-bottom:1px solid var(--line);
  display:grid; place-items:center; position:relative; overflow:hidden}
.vid__thumb img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.vid__thumb::after{content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(18,21,27,.35), transparent 55%)}
.vid__play{position:relative; z-index:2}
.vid__play{width:62px; height:44px; border-radius:12px; background:#FF0000;
  display:grid; place-items:center; box-shadow:0 10px 24px -10px rgba(255,0,0,.9);
  transition:.16s}
.vid:hover .vid__play{transform:scale(1.06)}
.vid__b{padding:18px 20px 22px}
.vid__b b{display:block; font-weight:600; font-size:16px; line-height:1.35}
.vid__b span{display:block; margin-top:7px; font-size:13.5px; color:var(--muted)}

/* ── стрічка напрямків ── */
.tape{background:var(--card); border-radius:var(--r-lg); padding:clamp(26px,2.6vw,38px);
  box-shadow:var(--sh-sm); display:grid; grid-template-columns:minmax(0,1fr) auto;
  gap:30px; align-items:center}
.tape__pills{display:flex; flex-wrap:wrap; gap:7px; margin-top:16px}
.tape__pills span{border:1px solid var(--line-2); border-radius:999px; padding:2px 5px; font-size:12.5px}
/* пігулки на головній ведуть на свою вкладку сторінки «Експертність» */
.tape__pills a{border:1px solid var(--line-2); border-radius:999px; padding:5px 11px; font-size:13px;
  text-decoration:none; color:var(--ink); transition:.16s}
.tape__pills a:hover,.tape__pills a:focus-visible{border-color:var(--ink); background:var(--ink); color:#fff}
.tape p{margin:14px 0 0; color:var(--ink-2); max-width:52ch}

/* ── історія ── */
.path{display:grid; grid-template-columns:repeat(5,1fr); gap:0; margin-top:8px}
.path__i{padding:0 22px 0 0; position:relative}
.path__i::before{content:""; position:absolute; left:0; top:9px; width:100%; height:1px; background:var(--line-2)}
.path__i:last-child::before{background:linear-gradient(to right, var(--line-2), transparent)}
.path__d{width:11px; height:11px; border-radius:50%; background:var(--card);
  border:2px solid var(--line-2); position:relative; z-index:2; margin-bottom:22px}
.path__i--now .path__d{background:var(--accent); border-color:var(--accent);
  box-shadow:0 0 0 5px rgba(248,69,37,.14)}
.path__y{font-family:'JetBrains Mono',monospace; font-size:11.5px; letter-spacing:.13em;
  color:var(--accent); display:block; margin-bottom:8px}
.path__i b{display:block; font-family:'Manrope',sans-serif; font-weight:700; font-size:17px;
  letter-spacing:-.025em; line-height:1.25}
.path__i p{margin:8px 0 0; font-size:14.5px; color:var(--muted); line-height:1.55}

/* ── форма ── */
.form{max-width:760px; margin:0 auto; background:var(--card); border-radius:var(--r-lg);
  box-shadow:var(--sh); padding:clamp(26px,3vw,40px)}
.form__aside{background:var(--panel); color:#fff; padding:clamp(28px,3vw,40px);
  display:flex; flex-direction:column}
.form__aside h2{color:#fff; font-size:clamp(24px,2.5vw,32px)}
.form__aside p{margin:16px 0 0; color:#A7AEB8; font-size:15px}
.form__note{margin-top:auto; padding-top:26px; font-size:13.5px; color:#7F868F; line-height:1.6}
.form__main{padding:clamp(28px,3vw,40px)}
.fgrid{display:grid; grid-template-columns:repeat(2,1fr); gap:16px}
.f{display:block}
.f span:not(.iti span){display:block; font-size:13.5px; font-weight:500; margin-bottom:7px}
.f input,.f textarea,.f select{width:100%; border:1px solid var(--line-2); border-radius:10px;
  background:var(--bg); padding:12px 14px; font:inherit; font-size:15.5px; color:var(--ink);
  transition:.16s}
.f input:focus,.f textarea:focus,.f select:focus{outline:none; border-color:var(--ink);
  background:var(--card); box-shadow:0 0 0 4px rgba(18,21,27,.06)}
.f textarea{min-height:118px; resize:vertical}
.f--wide{grid-column:1/-1}
.form__send{display:flex; justify-content:center; margin-top:22px}
.form__send small{color:var(--muted); font-size:13px}

/* ── книга ── */
.bk{background:var(--card); border-radius:var(--r-lg); box-shadow:var(--sh-sm);
  display:grid; grid-template-columns:minmax(0,300px) minmax(0,1fr);
  gap:clamp(28px,3.4vw,52px); align-items:center; padding:clamp(28px,3.2vw,44px)}
.bk__cover img{width:100%; max-width:260px; border-radius:6px;
  box-shadow:0 2px 6px rgba(18,21,27,.14), 0 24px 44px -20px rgba(18,21,27,.5)}
.bk__txt h2{margin:12px 0 0; font-size:clamp(24px,2.8vw,36px); max-width:20ch}
.bk__txt p{margin:16px 0 0; color:var(--ink-2); max-width:56ch}
.bk__meta{list-style:none; margin:22px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:0 34px}
.bk__meta b{font-family:'Manrope',sans-serif; font-weight:800; font-size:22px;
  letter-spacing:-.04em; display:block}
.bk__meta span{font-family:'JetBrains Mono',monospace; font-size:9.5px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--muted)}

/* ── блог ── */
.posts{display:grid; grid-template-columns:repeat(3,1fr); gap:18px}
.post{background:var(--card); border-radius:var(--r-lg); overflow:hidden; box-shadow:var(--sh-sm);
  display:flex; flex-direction:column; transition:transform .2s}
.post:hover{transform:translateY(-3px)}
.post__thumb{aspect-ratio:16/10; background:var(--bg-2); overflow:hidden}
.post__thumb img{width:100%; height:100%; object-fit:cover; transition:transform .35s}
.post:hover .post__thumb img{transform:scale(1.04)}
.post__b{padding:20px 22px 24px; display:flex; flex-direction:column; flex:1}
.post__cat{font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.13em;
  text-transform:uppercase; color:var(--accent)}
.post h3{font-family:'Onest',sans-serif; font-weight:600; font-size:18px; letter-spacing:-.02em;
  line-height:1.35; margin-top:10px}
.post p{margin:9px 0 0; color:var(--muted); font-size:14.5px}
.post time{display:block; margin-top:auto; padding-top:18px; font-family:'JetBrains Mono',monospace;
  font-size:11px; color:var(--line-2); letter-spacing:.08em}

/* ── футер ── */
footer{background:var(--panel); color:#98A0AA; padding:clamp(34px,3.4vw,48px) 0 34px}
footer .donate .slogan{font-family:'Manrope',sans-serif; font-weight:800; letter-spacing:-.02em;
  font-size:26px; color:#fff; max-width:26ch; line-height:1.3; margin:0}
.donate{background:var(--panel-2); border-radius:var(--r-lg);
  padding:clamp(24px,2.6vw,34px); display:grid; grid-template-columns:minmax(0,1fr) auto;
  gap:clamp(24px,3vw,44px); align-items:center; border:1px solid rgba(255,255,255,.07)}
.donate__r{display:grid; gap:14px; justify-items:center}
.donate h3{color:#fff; font-family:'Manrope',sans-serif; font-weight:800;
  letter-spacing:-.03em; font-size:21px; line-height:1.2;
  text-align:center; margin:0}
.donate p{margin:11px 0 0; font-size:15px; max-width:56ch}
.donate__b{display:flex; flex-wrap:wrap; gap:10px; justify-content:center}
.fcol--two ul{grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:22px;
  justify-items:start}
.fcols{display:grid; grid-template-columns:minmax(0,1.4fr) repeat(2,minmax(0,1fr));
  gap:36px; margin-top:52px; padding-top:36px; border-top:1px solid rgba(255,255,255,.09)}
.fme{display:flex; gap:14px; align-items:flex-start}
.fme img{width:56px; height:56px; border-radius:12px; object-fit:cover;
  background:var(--panel-2)}
.fme b{color:#fff; display:block; font-family:'Manrope',sans-serif; letter-spacing:-.025em}
.fme span{font-size:13.5px; display:block; margin-top:4px}
.fcol h4{font-family:'Manrope',sans-serif; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; color:#fff; margin:0 0 14px; font-weight:700}
.fcol ul{list-style:none; margin:0; padding:0; display:grid; gap:9px}
.fcol a{text-decoration:none; font-size:15px}
.fcol a:hover{color:#fff}
.disclaimer{margin-top:40px; padding-top:26px; border-top:1px solid rgba(255,255,255,.09);
  font-size:13px; line-height:1.65; color:#727A84}
.disclaimer p{margin:0 0 8px}

/* ── шапка внутрішньої сторінки ── */
.phead{background:var(--panel); color:#fff; position:relative; overflow:hidden;
  padding:clamp(30px,3.6vw,52px) 0 clamp(34px,4vw,60px)}
.phead::before{content:""; position:absolute; right:-6%; top:-70%; width:40%; aspect-ratio:1;
  border-radius:50%; background:radial-gradient(circle, rgba(248,69,37,.26), transparent 66%)}
.phead .wrap{position:relative; z-index:2}
.phead h1{font-size:clamp(28px,4vw,52px); max-width:22ch}
.phead__lead{margin:16px 0 0; max-width:64ch; color:#C3C8CE;
  font-size:clamp(16px,1.5vw,18px)}
.phead .mono{color:#8B939E}

.crumbs{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 16px;
  font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.14em;
  text-transform:uppercase; color:#8B939E}
.crumbs a{text-decoration:none; transition:.16s}
.crumbs a:hover{color:#fff}
.crumbs b{color:#fff; font-weight:500}
.crumbs i{font-style:normal; opacity:.45}


/* ── текст статті і сторінки ── */
.entry{max-width:78ch; font-size:17.5px}
.entry > * + *{margin-top:1.15em}
.entry h2{font-size:clamp(23px,2.4vw,31px); margin-top:1.7em}
.entry h3{font-size:clamp(19px,1.9vw,24px); margin-top:1.4em}
.entry h4{font-family:'Manrope',sans-serif; font-weight:700; font-size:18px;
  letter-spacing:-.02em; margin:1.3em 0 0}
.entry p{margin:0}
.entry a{color:var(--accent); text-decoration:underline; text-underline-offset:3px}
.entry ul,.entry ol{margin:0; padding-left:1.25em; display:grid; gap:.45em}
.entry li::marker{color:var(--muted)}
.entry figure{margin:0}
.entry img{border-radius:var(--r-md)}
.entry figcaption{margin-top:9px; font-size:14px; color:var(--muted)}
.entry blockquote{margin:0; padding:16px 22px; background:var(--card);
  border-left:3px solid var(--accent); border-radius:0 var(--r-md) var(--r-md) 0}
.entry blockquote p{margin:0}
.entry hr{border:0; border-top:1px solid var(--line); margin:2em 0}
.entry table{width:100%; border-collapse:collapse; font-size:15.5px}
.entry th,.entry td{padding:10px 12px; border-bottom:1px solid var(--line); text-align:left}
.entry th{font-family:'Manrope',sans-serif; font-weight:700}
.entry code{font-family:'JetBrains Mono',monospace; font-size:.88em;
  background:var(--bg-2); padding:2px 6px; border-radius:6px}
.entry pre{overflow-x:auto; background:var(--panel); color:#E6E9ED; padding:18px;
  border-radius:var(--r-md); font-size:14px}
.entry pre code{background:none; padding:0; color:inherit}
.entry .wp-caption{max-width:100%}

/* ── стаття з колонкою збоку ── */
.art{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,300px);
  gap:clamp(26px,3.2vw,52px); align-items:start}
.aside{position:sticky; top:88px; display:grid; gap:16px}
.acard{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:22px}
.acard h4{font-family:'Manrope',sans-serif; font-size:13px; letter-spacing:.08em;
  text-transform:uppercase; color:var(--muted); margin:0 0 14px; font-weight:700}
.acard .btn{width:100%; justify-content:center}
.ame{display:flex; gap:13px; align-items:center; margin-bottom:16px}
.ame img{width:48px; height:48px; border-radius:50%; flex:0 0 48px}
.ame b{display:block; font-family:'Manrope',sans-serif; font-size:15.5px;
  letter-spacing:-.02em}
.ame span{display:block; font-size:13px; color:var(--muted); line-height:1.4}
.tagl{display:flex; flex-wrap:wrap; gap:7px}
.tagl a{font-size:13px; text-decoration:none; padding:4px 10px; border-radius:999px;
  border:1px solid var(--line-2); background:var(--bg); transition:.16s}
.tagl a:hover{border-color:var(--ink)}

/* ── список записів ── */
.post h3 a{text-decoration:none}
.post__thumb a{display:block}
.empty{padding:40px 0; color:var(--ink-2)}

.pager{display:flex; gap:8px; justify-content:center; margin-top:38px; flex-wrap:wrap}
.pager .page-numbers{display:inline-flex; align-items:center; justify-content:center;
  min-width:42px; height:42px; padding:0 12px; border-radius:10px;
  border:1px solid var(--line-2); background:var(--card); text-decoration:none;
  font-size:15px; transition:.16s}
.pager .page-numbers:hover{border-color:var(--ink)}
.pager .current{background:var(--ink); border-color:var(--ink); color:#fff}
.pager .dots{border-color:transparent; background:none}

.searchform{display:flex; gap:10px; max-width:520px}
.searchform input[type=search]{flex:1; min-width:0; height:48px; padding:0 16px;
  border-radius:10px; border:1px solid var(--line-2); background:var(--card);
  font:inherit; font-size:15.5px; color:var(--ink)}
.searchform input[type=search]:focus{outline:2px solid var(--accent); outline-offset:1px}
.phead .searchform input[type=search]{background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.2); color:#fff}
.phead .searchform input::placeholder{color:#8B939E}

/* ── сторінка «Експертність»: пігулки-фільтри і панель ── */
.filters{display:flex; flex-wrap:wrap; gap:8px; margin:clamp(26px,3vw,40px) 0 0}
.filters button{border:1px solid var(--line-2); background:var(--card); color:var(--ink);
  border-radius:999px; padding:8px 15px; font:inherit; font-size:14.5px; cursor:pointer;
  transition:.16s}
.filters button:hover{border-color:var(--ink)}
.filters button[aria-selected="true"]{background:var(--ink); border-color:var(--ink); color:#fff}

.panelbox{margin-top:22px; background:var(--card); border-radius:var(--r-lg);
  box-shadow:var(--sh-sm); padding:clamp(28px,3.2vw,44px); position:relative; min-height:340px;
  display:flex; flex-direction:column}
.pane[hidden]{display:none}
.pane h2{font-size:clamp(22px,2.4vw,30px); max-width:26ch}
.pane__tag{display:inline-block; margin-bottom:14px; font-family:'JetBrains Mono',monospace;
  font-size:9.5px; letter-spacing:.13em; text-transform:uppercase; color:var(--accent);
  background:var(--accent-soft); padding:4px 9px; border-radius:5px}
.pane ul{list-style:none; margin:22px 0 0; padding:0; display:grid; gap:11px; max-width:70ch}
.pane li{display:flex; gap:12px; align-items:flex-start; color:var(--ink-2)}
.pane li svg{flex-shrink:0; color:var(--accent); margin-top:5px}
.panelbox__foot{display:flex; justify-content:flex-end; margin-top:auto; padding-top:30px}
.pane__intro{margin:16px 0 0; max-width:70ch; color:var(--ink-2)}
.pane__note{margin:24px 0 0; max-width:70ch; padding:14px 18px; border-radius:var(--r-md);
  background:var(--bg); border:1px dashed var(--line-2); font-size:15px; color:var(--ink-2)}
.pane__accent{margin:28px 0 0; max-width:62ch; padding:2px 0 2px 18px; border-left:3px solid var(--accent);
  font-family:'Manrope',sans-serif; font-weight:700; font-size:clamp(17px,1.6vw,19.5px);
  line-height:1.45; letter-spacing:-.02em; color:var(--ink)}

/* ── попап форми ── */
.modal{position:fixed; z-index:80; left:50%; top:50%; transform:translate(-50%,-46%) scale(.98);
  width:min(94vw,560px); max-height:88vh; overflow-y:auto; background:var(--card);
  border-radius:var(--r-lg); box-shadow:var(--sh); padding:clamp(24px,3vw,36px);
  opacity:0; pointer-events:none; transition:opacity .2s, transform .2s}
.modal[data-open]{opacity:1; pointer-events:auto; transform:translate(-50%,-50%) scale(1)}
.modal[hidden]{display:none}
.modal__top{display:flex; align-items:flex-start; justify-content:space-between; gap:16px}
.modal h2{font-size:clamp(21px,2.2vw,27px)}
.modal__close{width:38px; height:38px; border-radius:10px; border:1px solid var(--line-2);
  background:var(--card); cursor:pointer; display:grid; place-items:center; flex-shrink:0;
  color:var(--ink)}

/* ── сторінка «Подяка експерту» ── */
.pay{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.5vw,20px);
  margin-top:26px}
.paycard{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px); display:flex; flex-direction:column; gap:12px;
  box-shadow:var(--sh-sm)}
.paycard__ico{width:46px; height:46px; border-radius:12px; background:var(--bg-2);
  display:grid; place-items:center; flex:0 0 46px}
.paycard__ico img{width:26px; height:26px; object-fit:contain}
.paycard h3{font-size:19px}
.paycard p{margin:0; font-size:15.5px; color:var(--ink-2); flex:1}
.paycard .btn{width:100%; justify-content:center; margin-top:4px}
/* картка з QR ділиться навпіл: зліва текст і кнопка, справа код */
.paycard--qr{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:clamp(16px,1.8vw,24px);
  align-items:start}
.paycard--qr .paycard__main{display:flex; flex-direction:column; gap:12px; min-width:0}
.paycard__main{display:contents}
.paycard--qr .paycard__main{display:flex}
.paycard__qr{position:relative; padding:6px; border-radius:12px; border:1px solid var(--line);
  background:#fff; cursor:zoom-in; line-height:0; flex:0 0 auto}
.paycard__qr img{width:124px; height:124px; border-radius:7px; object-fit:contain}
.paycard__zoom{position:absolute; right:6px; bottom:6px; width:26px; height:26px;
  display:grid; place-items:center; border-radius:7px; background:rgba(18,21,27,.72);
  color:#fff; transition:.16s}
.paycard__qr:hover .paycard__zoom{background:var(--accent)}

/* збільшений QR */
.zoom{position:fixed; inset:0; z-index:120; display:grid; place-items:center;
  background:rgba(12,14,18,.86); padding:24px; cursor:zoom-out}
.zoom img{max-width:min(420px,86vw); max-height:80vh; width:auto; height:auto;
  background:#fff; padding:14px; border-radius:var(--r-md)}
.zoom__close{position:absolute; top:18px; right:18px; width:42px; height:42px;
  display:grid; place-items:center; border:0; border-radius:12px; cursor:pointer;
  background:rgba(255,255,255,.14); color:#fff}
.paycard--crypto .wallet{display:flex; gap:8px; align-items:center;
  background:var(--bg-2); border-radius:10px; padding:9px 12px; overflow:hidden}
.wallet code{font-family:'JetBrains Mono',monospace; font-size:12.5px; overflow:hidden;
  text-overflow:ellipsis; white-space:nowrap; background:none; padding:0}
.wallet button{flex:0 0 auto; border:1px solid var(--line-2); background:var(--card);
  border-radius:8px; padding:6px 10px; font:inherit; font-size:12.5px; cursor:pointer;
  color:var(--ink); transition:.16s}
.wallet button:hover{border-color:var(--ink)}
.wallet button[data-done]{background:var(--ok-bg); border-color:var(--ok-bg); color:var(--ok)}

.paygroup{margin-top:clamp(26px,3vw,40px)}
.paygroup > .mono{display:block; margin-bottom:6px}

.help{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.5vw,20px);
  margin-top:26px}
.helpcard{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(20px,2.2vw,28px); display:flex; flex-direction:column; gap:12px}
.helpcard h3{font-size:18px}
.helpcard p{margin:0; font-size:15.5px; color:var(--ink-2); flex:1}
.helpcard .cta{gap:8px; justify-content:center}
.helpcard .btn{height:42px; padding:0 15px; font-size:14px}

.faq details{background:var(--card); border:1px solid var(--line); border-radius:var(--r-md);
  padding:16px 20px}
.faq details[open]{border-color:var(--line-2)}
.faq summary{cursor:pointer; list-style:none; font-family:'Manrope',sans-serif;
  font-weight:700; font-size:17px; letter-spacing:-.02em; display:flex; gap:12px;
  align-items:flex-start; justify-content:space-between}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:""; flex:0 0 14px; width:14px; height:14px; margin-top:4px;
  border-right:2px solid var(--muted); border-bottom:2px solid var(--muted);
  transform:rotate(45deg); transition:transform .18s}
.faq details[open] summary::after{transform:rotate(-135deg)}
.faq p{margin:12px 0 0; color:var(--ink-2)}

.wall{margin-top:26px}
.wall__note{border:1px dashed var(--line-2); border-radius:var(--r-md); padding:20px 24px;
  color:var(--muted); font-size:15px}

/* відео з блогу: Blogger віддає голий iframe, робимо його адаптивним */
.video{position:relative; margin:1.2em 0; border-radius:var(--r-md); overflow:hidden;
  background:var(--panel)}
.video::before{content:""; display:block; padding-top:56.25%}
.video iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.entry .video:first-child{margin-top:0}

/* ── стрічка попередження (російська версія) ── */
.warnbar{position:fixed; left:0; right:0; bottom:0; z-index:75;
  background:#C62828; color:#fff; padding:9px 0; font-size:14px; line-height:1.4;
  box-shadow:0 -6px 20px -12px rgba(18,21,27,.6)}
.warnbar .wrap{display:flex; align-items:center; justify-content:center; gap:11px;
  text-align:center}
.warnbar svg{flex:0 0 auto}
body.has-warnbar{padding-bottom:var(--warnbar,58px)}
body.has-warnbar .langbar{bottom:calc(var(--warnbar,58px) + 14px)}

/* ── перемикач рубрик ── */
.cats{display:flex; flex-wrap:wrap; gap:6px; justify-content:center; align-items:center;
  margin:0 0 clamp(26px,3vw,38px); background:var(--card); border:1px solid var(--line);
  border-radius:999px; padding:6px; width:fit-content; margin-inline:auto;
  max-width:100%; box-shadow:var(--sh-sm)}
.cats__i{display:inline-flex; align-items:center; height:38px; padding:0 17px;
  border-radius:999px; text-decoration:none; font-size:14.5px; color:var(--ink-2);
  white-space:nowrap; transition:.16s}
.cats__i:hover{background:var(--bg-2); color:var(--ink)}
.cats__i.is-on{background:var(--ink); color:#fff; height:46px; padding:0 22px;
  font-family:'Manrope',sans-serif; font-weight:700; font-size:16.5px;
  letter-spacing:-.02em}

/* ── низ картки запису ── */
.post__foot{display:flex; align-items:center; justify-content:space-between; gap:12px;
  margin-top:auto; padding-top:18px}
.post__foot time{margin:0; padding:0}
.post__more{display:inline-flex; align-items:center; gap:6px; text-decoration:none;
  font-size:14px; font-weight:500; color:var(--accent); transition:gap .16s}
.post__more:hover{gap:9px}

/* службовий текст для читалок: приїжджав зі стилями редактора, які ми вимкнули */
.screen-reader-text{position:absolute!important; width:1px; height:1px; margin:-1px;
  padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0}
.screen-reader-text:focus{position:static!important; width:auto; height:auto;
  margin:0; clip-path:none}

/* ── список «читати далі» з роздільником, що тане до країв ── */
.alist{display:grid}
.alist a{text-decoration:none; font-family:'Manrope',sans-serif; font-weight:600;
  font-size:15px; line-height:1.35; letter-spacing:-.02em; padding:13px 0;
  position:relative; transition:color .16s}
.alist a:first-child{padding-top:0}
.alist a:last-child{padding-bottom:0}
.alist a:hover{color:var(--accent)}
.alist a + a::before{content:""; position:absolute; left:0; right:0; top:0; height:1px;
  background:linear-gradient(90deg, transparent, var(--line-2) 22%, var(--line-2) 78%, transparent)}

/* ── FAQ: завжди останній блок сторінки, по центру ── */
.faq{display:grid; gap:10px; margin:0 auto; max-width:80ch; text-align:left}
#faq .shead--solo{justify-items:center}
#faq .shead--solo h2{max-width:24ch}

/* кнопка, для якої ще немає посилання */
.btn.is-off{opacity:.45; pointer-events:none; box-shadow:none}

/* ── відгуки спільноти ── */
.revs{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.5vw,20px)}
.rev{margin:0; background:var(--card); border:1px solid var(--line);
  border-radius:var(--r-lg); padding:clamp(20px,2.2vw,26px); display:flex;
  flex-direction:column; gap:14px; box-shadow:var(--sh-sm)}
.rev__top{display:grid; grid-template-columns:auto minmax(0,1fr); gap:4px 11px;
  align-items:center}
.rev__ava{width:40px; height:40px; border-radius:50%; grid-row:1/3;
  object-fit:cover; background:var(--bg-2); flex:0 0 40px}
.rev__ava--txt{display:grid; place-items:center; font-family:'Manrope',sans-serif;
  font-weight:800; font-size:15px; letter-spacing:-.02em; color:var(--ink-2);
  background:var(--bg-2)}
.rev__who{display:flex; flex-wrap:wrap; align-items:baseline; gap:6px; min-width:0}
.rev__who b{font-family:'Manrope',sans-serif; font-size:15px; letter-spacing:-.02em}
.rev__who span{font-size:12.5px; color:var(--muted)}
.rev__who i{font-style:normal; color:var(--line-2)}
.rev__stars{display:flex; gap:2px; grid-column:2}
.rev blockquote{margin:0; padding:0; border:0; background:none; font-size:15.5px;
  color:var(--ink-2); flex:1}
.rev__link{display:inline-flex; align-items:center; gap:6px; align-self:flex-start;
  padding-top:14px; margin-top:auto; border-top:1px solid var(--line); width:100%;
  text-decoration:none; font-size:13.5px; font-weight:500; color:var(--accent);
  transition:gap .16s}
.rev__link:hover{gap:9px}

/* ── сторінка книги ── */
.bk--page{align-items:start; grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:clamp(28px,3.6vw,58px)}
.bk--page .bk__cover{position:sticky; top:96px}
.bk--page .bk__cover img{width:100%; border-radius:var(--r-md); box-shadow:var(--sh)}
.bk__det{margin:22px 0 0; padding:18px 20px; background:var(--card);
  border:1px solid var(--line); border-radius:var(--r-md); display:grid;
  grid-template-columns:auto 1fr; gap:9px 14px; font-size:14px}
.bk__det dt{color:var(--muted)}
.bk__det dd{margin:0; text-align:right; font-weight:500}
.bk__quote{margin-top:24px; display:grid; gap:14px; font-size:17px; color:var(--ink-2)}
.bk__quote p{margin:0}
.bk__quote p:first-child{font-size:18.5px; color:var(--ink)}
.bk__fmts{display:flex; flex-wrap:wrap; gap:12px; margin-top:26px}
.fmt{display:flex; flex-direction:column; gap:3px; padding:14px 20px; min-width:150px;
  background:var(--card); border:1px solid var(--line-2); border-radius:var(--r-md);
  text-decoration:none; transition:.16s}
.fmt[href]:hover{border-color:var(--ink); transform:translateY(-2px)}
.fmt[aria-disabled]{opacity:.5}
.fmt__n{font-size:13.5px; color:var(--muted)}
.fmt__p{font-family:'Manrope',sans-serif; font-weight:800; font-size:20px;
  letter-spacing:-.03em}

/* ── мета статті: підписи зверху, значення під ними ── */
.ameta{display:flex; flex-wrap:wrap; gap:0 clamp(22px,3vw,44px); margin:22px 0 0}
.ameta > div{display:grid; gap:4px}
.ameta dt{font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--muted)}
.ameta dd{margin:0; font-size:14.5px; color:#C3C8CE}
.phead .ameta dd{color:#C3C8CE}

/* ── попередня і наступна стаття ── */
.pnav{display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(12px,1.4vw,18px); margin-top:clamp(34px,4vw,56px)}
.pnav__i{display:flex; flex-direction:column; gap:8px; padding:clamp(18px,2vw,24px);
  background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  text-decoration:none; box-shadow:var(--sh-sm); transition:.18s}
.pnav__i:hover{border-color:var(--ink); transform:translateY(-2px)}
.pnav__i--empty{background:none; border:0; box-shadow:none; pointer-events:none}
.pnav__i--next{align-items:flex-end; text-align:right}
.pnav__l{display:inline-flex; align-items:center; gap:7px;
  font-family:'JetBrains Mono',monospace; font-size:10px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--accent)}
.pnav__i b{font-family:'Manrope',sans-serif; font-weight:700; font-size:16.5px;
  line-height:1.3; letter-spacing:-.025em; color:var(--ink)}

/* перша картка безкоштовної підтримки: ютуб окремим рядком, решта під ним */
.helpcard .cta{flex-wrap:wrap; justify-content:center}
.helpcard .cta .btn{flex:0 0 auto}
.cta__row{flex:0 0 100%; display:flex; justify-content:center}
/* подяка: соцмережі значками в першій картці, YouTube окремо під картками */
.social--help{flex-wrap:wrap; justify-content:center; gap:8px}
.social--help a{width:42px; height:42px; border-radius:12px}
.help__after{display:flex; justify-content:center; margin-top:clamp(20px,2.4vw,30px)}

/* ── менторство ── */
.ment{display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,1.5vw,20px)}
.mentcard{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(22px,2.4vw,30px); box-shadow:var(--sh-sm); position:relative}
.mentcard__n{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em;
  color:var(--accent)}
.mentcard h3{font-family:'Manrope',sans-serif; font-weight:800; font-size:18.5px;
  letter-spacing:-.03em; line-height:1.25; margin:12px 0 0}
.mentcard p{margin:10px 0 0; font-size:15px; color:var(--ink-2)}

/* кнопка, притиснута до правого краю блоку */
.cta--end{justify-content:flex-end}

/* ── форма в попапі ── */
.pop .fgrid{display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px 18px; align-items:start}
.pop .f--wide{grid-column:1/-1}
.pop textarea{min-height:120px; resize:vertical}
.pop .wpcf7-form > p{margin:0}
.pop .btn[type="submit"],
.pop input[type="submit"]{margin:6px auto 0; display:flex}

/* CF7 ставить свій кружечок очікування поруч із кнопкою і зсуває її */
.wpcf7-spinner{position:absolute; margin:0; opacity:0}
.wpcf7-form.submitting .wpcf7-spinner{position:static; margin:0 0 0 10px; opacity:1}
.form__send{display:flex; justify-content:center; align-items:center; position:relative}

/* обкладинка як кнопка і вбудований плеєр на її місці */
button.vid__thumb{display:block; width:100%; padding:0; border:0; background:var(--bg-2);
  cursor:pointer; font:inherit; color:inherit}
.vid__frame{position:relative; aspect-ratio:16/9; background:#000;
  border-radius:var(--r-md) var(--r-md) 0 0; overflow:hidden}
.vid__frame iframe{position:absolute; inset:0; width:100%; height:100%; border:0}
.vid__b b a{text-decoration:none}
.vid__b b a:hover{color:var(--accent)}

/* поле опису в попапі не має розтягуватись на пів екрана і на десктопі */
.pop textarea{height:120px; min-height:88px; max-height:40vh}

/* кнопки майданчиків відгуків */
.btn--tp{background:#00B67A; border-color:#00B67A; color:#fff}
.btn--tp:hover{background:#009c69; border-color:#009c69}
.btn--fb{background:#1877F2; border-color:#1877F2; color:#fff}
.btn--fb:hover{background:#1465cf; border-color:#1465cf}

/* ── телефон з вибором країни (intl-tel-input) ── */
.f .iti{display:block; width:100%}
.f .iti input.iti__tel-input{width:100%}
.iti__country-selector{height:auto!important; border:1px solid var(--line-2)!important;
  border-radius:12px; box-shadow:var(--sh)!important; overflow:hidden; background:var(--card)}
.iti__country{font-size:15px}
.iti__search-input-wrapper{border-bottom-color:var(--line)}
/* у попапі список виноситься в body, над затемненням і самим попапом */
.iti--detached-country-selector{z-index:130}
/* поле пошуку всередині .f не має брати стиль полів форми, інакше текст
   налазить на значок лупи */
.f .iti__search-input,
.f .iti__search-input:focus{height:auto; border:0; border-radius:0; background:transparent;
  box-shadow:none; outline:none; font-size:15px; padding-top:11px; padding-bottom:11px;
  padding-left:calc(var(--iti-spacer-horizontal) + var(--iti-globe-icon-size) + var(--iti-spacer-horizontal));
  padding-right:calc(var(--iti-spacer-horizontal) + var(--iti-clear-icon-size) + var(--iti-spacer-horizontal))}

/* ── сторінка «Дякую за заявку» ── */
.phead--thx{text-align:center; padding:clamp(52px,6.4vw,100px) 0 clamp(56px,6.8vw,108px)}
.phead--thx::before{right:auto; left:50%; top:-55%; width:min(760px,90%); transform:translateX(-50%)}
.thx{max-width:780px; margin:0 auto; display:flex; flex-direction:column; align-items:center}
.thx__ico{width:76px; height:76px; border-radius:50%; display:grid; place-items:center;
  background:var(--accent); color:#fff; margin-bottom:28px;
  box-shadow:0 0 0 10px rgba(248,69,37,.14), 0 20px 44px -16px rgba(248,69,37,.85)}
.thx h1{margin-top:12px; font-size:clamp(30px,4.4vw,56px); max-width:18ch}
.thx .phead__lead{margin-left:auto; margin-right:auto}
.thx .cta{justify-content:center; margin-top:30px}
.thx-steps{list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(14px,1.5vw,20px)}
.thx-step{background:var(--card); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:clamp(22px,2.4vw,30px); box-shadow:var(--sh-sm)}
.thx-step__n{font-family:'JetBrains Mono',monospace; font-size:11px; letter-spacing:.14em;
  color:var(--accent)}
.thx-step h3{font-size:19px; letter-spacing:-.03em; line-height:1.25; margin-top:12px}
.thx-step p{margin:10px 0 0; font-size:15.5px; color:var(--ink-2)}
#meanwhile .help{margin-top:0}
.thx-card .cta{margin-top:6px; justify-content:flex-start}

/* ── адаптив ── */
.onlymob{display:none}

@media (max-width:1080px){
  .profile{grid-template-columns:minmax(0,330px) minmax(0,1fr)}
  .cards,.yt,.posts,.pay,.help,.revs,.ment{grid-template-columns:repeat(2,1fr)}
  .thx-steps{grid-template-columns:1fr}
  .path{grid-template-columns:repeat(2,1fr); gap:28px 0}
  .path__i::before{display:none}
}
/* на середніх екранах шапка тісна: прибираємо швидкі іконки */
@media (max-width:1180px){
  header .quick{display:none}
  nav{gap:15px}
  .bar{gap:18px}
}
@media (max-width:900px){
  /* хіро: фото по центру, дії теж */
  .media__img{width:90%; max-width:369px; left:50%; right:auto;
    transform:translateX(-50%); margin:0}
  .ident__act{justify-content:center}
  .cta{justify-content:center}
  .cta--end{justify-content:center}

  /* підвал: обидві колонки списків рівняються однаково */
  .fcols{text-align:center}
  .fcol ul{justify-items:center}
  .fcol--two ul{grid-template-columns:repeat(2,minmax(0,1fr)); justify-items:center}

  /* форми: поле опису не на пів екрана. CF7 ставить rows=10, тому задаємо
     саме height, а не min-height - інакше атрибут виграє */
  textarea{height:118px; min-height:118px}
  .pop textarea{height:104px; min-height:104px}
  .pop .fgrid{grid-template-columns:1fr}
  #path{display:none}
  header nav{display:none}
  .burger{display:flex}
  .bar{gap:14px; justify-content:space-around}
  .brand b{white-space:nowrap}
  .profile,.form{grid-template-columns:1fr}
  .media{min-height:520px}
  .media__img{width:78%; max-width:360px}
  .shead{grid-template-columns:1fr; gap:16px}
  .strip__in{grid-template-columns:repeat(2,1fr); gap:16px}
  .tape{grid-template-columns:1fr}
  .agency__in{grid-template-columns:1fr; gap:24px; text-align:center}
  .agency__logo img{max-width:230px; margin:0 auto}
  .agency__txt h2,.agency__txt p{margin-left:auto; margin-right:auto}
  .agency__in{padding:28px 22px}
  .onlypc{display:none}
  .onlymob{display:inline}
  .ag__act{justify-content:center; gap:9px; flex-wrap:nowrap}
  .ag__act .btn{height:42px; padding:0 15px; font-size:13px; white-space:nowrap}
  .bk{grid-template-columns:1fr; gap:24px; text-align:center}
  .bk--page .bk__cover{position:static}
  .bk--page .bk__cover img{max-width:240px; margin:0 auto}
  .bk__det dd{text-align:left}
  .bk__quote{text-align:left}
  .bk__fmts{justify-content:center}
  .bk__cover img{margin:0 auto; max-width:200px}
  .bk__txt h2{margin-left:auto; margin-right:auto}
  .bk__txt p{margin-left:auto; margin-right:auto}
  .bk__meta{justify-content:center}
  .bk .cta{justify-content:center}
  .trail{--grow:0px; grid-template-columns:repeat(2,1fr); grid-template-rows:none;
    gap:22px 14px; padding-inline:0}
  .trail__line{display:none}
  .st{grid-column:auto !important; grid-row:auto !important; padding:0 !important}
  .st::before,.st::after{display:none}
  .st--down{flex-direction:column-reverse}
  .st--down figcaption{padding:13px 0 0}
  .trail__band--bot .sq{flex-direction:column-reverse}
  .next{margin-top:22px}
  .next__note{margin-left:0; flex-basis:100%}
  .art{grid-template-columns:1fr}
  .panelbox__foot{justify-content:stretch}
  .panelbox__foot .btn{width:100%; justify-content:center}
  .aside{position:static}
  .entry{font-size:16.5px}
  .fcols{grid-template-columns:1fr; gap:30px; text-align:center}
  .fme{flex-direction:column; align-items:center; text-align:center}
  .fcol ul{grid-template-columns:repeat(2,1fr); gap:10px 18px}
  .donate{grid-template-columns:1fr}
  .numbers{grid-template-columns:repeat(2,1fr)}
  .numbers div{border-left:0; border-top:1px solid var(--line)}
  .numbers div:nth-child(-n+2){border-top:0}
  .numbers div:nth-child(2n){border-left:1px solid var(--line)}
  header .quick{display:none}
  header .quick--mob{display:flex; gap:0}
  header .quick--mob a{width:34px; height:34px; border-radius:9px}
  .langbar{left:0; right:0; bottom:0; border-radius:0; border-left:0; border-right:0;
    border-bottom:0; justify-content:center; padding:6px 4px}
  body.has-warnbar .langbar{bottom:var(--warnbar,74px)}
  body.has-warnbar{padding-bottom:calc(54px + var(--warnbar,74px))}
  .warnbar{font-size:13px; padding:10px 0}
  .warnbar .wrap{gap:9px; text-align:left}
  .langbar a{flex:0 0 auto; padding:9px 16px}
  body{padding-bottom:54px}
}
@media (max-width:640px){
  .bar__end .btn{display:none}
  .brand small,.tagpill{display:none}
  .cards,.yt,.posts,.fgrid,.pay,.help,.revs,.pnav,.ment{grid-template-columns:1fr}
  .thx-card .cta{justify-content:center}
  .paycard--qr{grid-template-columns:1fr; justify-items:center; text-align:center}
  .paycard--qr .paycard__main{align-items:center}
  .pnav__i--empty{display:none}
  .pnav__i--next{align-items:flex-start; text-align:left}
  .numbers div{padding:18px 18px 20px}
  .path{grid-template-columns:1fr; gap:24px}
  .media__img{width:90%; max-width:369px; left:50%; right:auto; transform:translateX(-50%)}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
