/* P112 · XREQUIEM — дизайн-напрям C «Дорога додому» (design/C/DIRECTION.md), редакція «м'якше» (27.09.2026).
   Мова навігації: маршрут і станції, але тихіше: теплий папір, туман, світла схема, м'які кути.
   Темні лише шапка, футер і нижня панель. Один блок токенів; бурштин — лише дзвінок і точка «дім».
   Мобільна версія першочергова: базові правила — телефон, ширші екрани — у @media нижче. */

/* ---------------------------------------------------------------- шрифти (самохостинг, OFL)
   Дисплей: Commissioner (Kostas Bartsokas, OFL) — м'який гротеск з ледь розширеними закінченнями, кирилиця рідна. */
@font-face{font-family:'Commissioner';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/Commissioner-500-cyrillic.woff2?v=b5efe0b81e) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/Commissioner-500-latin.woff2?v=ada65012ac) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Commissioner-600-cyrillic.woff2?v=ff41756658) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Commissioner-600-latin.woff2?v=ac708c4c7d) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/Commissioner-700-cyrillic.woff2?v=56b3fa3992) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Commissioner';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/Commissioner-700-latin.woff2?v=e75c846d4a) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/SourceSerif4-400-cyrillic.woff2?v=7f7df74248) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/SourceSerif4-400-latin.woff2?v=0d04bb72e5) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Source Serif 4';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/SourceSerif4-400i-cyrillic.woff2?v=e0284668b9) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Source Serif 4';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/SourceSerif4-400i-latin.woff2?v=3a126e3e6c) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Fira Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/FiraMono-500-cyrillic.woff2?v=fb110a64f0) format('woff2');unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:'Fira Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/FiraMono-500-latin.woff2?v=94d1526914) 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+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
/* latin-ext (28.09.2026, польська версія): ą ć ę ł ń ś ź ż та ін. — без цього піднабору вони малювалися б системним шрифтом
   посеред Commissioner / Source Serif. Google Fonts, той самий підбір символів, що й у латинських файлів вище; Commissioner —
   змінний шрифт, один файл на всі три ваги. Німецькі ä ö ü ß уже в основному латинському піднаборі. */
@font-face{font-family:'Commissioner';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/Commissioner-latin-ext.woff2?v=86f28cb70c) format('woff2');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:'Commissioner';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/Commissioner-latin-ext.woff2?v=86f28cb70c) format('woff2');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:'Commissioner';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/Commissioner-latin-ext.woff2?v=86f28cb70c) format('woff2');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:'Source Serif 4';font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/SourceSerif4-400-latin-ext.woff2?v=c2defeafce) format('woff2');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:'Source Serif 4';font-style:italic;font-weight:400;font-display:swap;src:url(fonts/SourceSerif4-400i-latin-ext.woff2?v=f5b9ee9961) format('woff2');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:'Fira Mono';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/FiraMono-500-latin-ext.woff2?v=4cd0eac811) format('woff2');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}

/* ---------------------------------------------------------------- токени */
:root{
  /* палітра — «ранок у дорозі»: теплий папір, туман із ледь зеленавим відтінком, світанково-сіра смуга,
     м'якша ніч лише на шапці/футері. Не кремовий шаблон і не холодна синява. */
  --night:#1E3342;      /* шапка, футер, нижня панель (було #102230) */
  --ink:#1F2E3A;        /* основний текст (11–13:1) */
  --ink-2:#2A4051;      /* панель на темному */
  --ink-3:#3B5466;      /* лінії на темному */
  --paper:#FBFAF8;      /* теплий майже-білий (не #FFF) */
  --mist:#F0F1ED;       /* туман: друге тло, ледь шавлієве */
  --dawn:#E4EAE8;       /* світанок: схема, смуга CTA, «Маршрут справи» */
  --line:#DEE1DB;
  --line-strong:#A3ACAE;
  --edge:#7A8589;       /* рамки кнопок і полів (≥3:1 на папері й тумані) */
  --stone:#56646D;      /* другорядний текст: 5,9:1 на папері, 5,4:1 на тумані, 5,1:1 на світанку */
  --body-2:#33424D;
  --on-ink:#F4F5F2;
  --on-ink-2:#B3C0C8;
  --amber:#EDB45C;      /* медовий бурштин: лише дзвінок і «дім»; темний текст на ньому 7,5:1 */
  --amber-hi:#F3C377;
  --amber-deep:#9A6A22; /* обідок точки «дім» на світлому */
  --amber-text:#7E5410; /* бурштиновий текст на світлому (5,6:1) */
  --ua-land:#F0E2C6;    /* Україна на підкладці-карті схеми: теплий пісочний */
  --ok-bg:#E8F3EC; --ok-ink:#1E4A2C;
  --err-bg:#FBEAEA; --err-ink:#7A1A1A;
  /* тіні — ледь помітні, теплі */
  --sh-1:0 1px 2px rgba(31,46,58,.04),0 6px 18px -10px rgba(31,46,58,.14);
  --sh-2:0 2px 4px rgba(31,46,58,.04),0 14px 34px -16px rgba(31,46,58,.20);
  /* шрифти */
  --f-disp:'Commissioner','Fira Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-text:'Source Serif 4',Georgia,'Times New Roman',serif;
  --f-mono:'Fira Mono',ui-monospace,Menlo,Consolas,monospace;
  /* шкала: 13 / 15 / 17–18 / 20–21 / 24–26 / 28→38 / 33→54 */
  --fs-xs:13px; --fs-s:15px; --fs-m:17px; --fs-l:21px; --fs-xl:25px; --fs-h2:28px; --fs-h1:33px;
  /* відступи й кути */
  --gut:16px; --sec:64px; --r:12px; --r-s:8px; --r-l:18px;
  --dock:64px;
  --focus:var(--ink);
}

/* ---------------------------------------------------------------- база */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:84px}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--paper);color:var(--ink);font:400 var(--fs-m)/1.55 var(--f-text);padding-bottom:calc(var(--dock) + env(safe-area-inset-bottom,0px));overflow-x:hidden;overflow-wrap:break-word}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
p{margin:0 0 14px}
ul,ol{margin:0 0 14px;padding-left:22px}
li{margin-bottom:6px}
strong,b{font-weight:600}
h1,h2,h3,h4{font-family:var(--f-disp);font-weight:600;line-height:1.18;margin:0 0 16px;letter-spacing:-.012em;text-wrap:balance;color:inherit}
h1{font-size:var(--fs-h1);line-height:1.12}
h2{font-size:var(--fs-h2)}
h3{font-size:var(--fs-l);font-weight:600;line-height:1.25;margin-bottom:8px;letter-spacing:-.005em}
small{font-size:.85em}
.nowrap{white-space:nowrap}
.ico,.ic{width:20px;height:20px;flex:0 0 auto;display:inline-block;vertical-align:middle}
.sr-only,.sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:8px;top:-60px;z-index:100;background:var(--amber);color:var(--ink);padding:10px 14px;font:600 16px var(--f-disp);border-radius:var(--r-s)}
.skip:focus{top:8px}
:focus-visible{outline:3px solid var(--focus);outline-offset:2px;border-radius:2px}
.hdr,.ftr,.sticky-bar{--focus:var(--amber)}
.wrap{max-width:1200px;margin:0 auto;padding:0 var(--gut)}
.mono{font-family:var(--f-mono);font-weight:500;letter-spacing:.02em}

/* ---------------------------------------------------------------- секції */
.section{padding:var(--sec) 0}
.section-alt{background:var(--mist)}
.section-alt + .section-alt{border-top:1px solid var(--line)}
/* дві білі секції поспіль або перший екран + біла секція: відступи не додаються (було 135–220px порожнечі, 28.09) */
.section:not(.section-alt) + .section:not(.section-alt){padding-top:0}
.page-hero + .section:not(.section-alt){padding-top:8px}
.section-tight{padding:34px 0}
.section > .wrap > p,.section > .wrap > ul,.section > .wrap > ol:not(.stations):not(.steps),
.section > .wrap > h3,.article-body > p,.article-body > ul,.article-body > ol,.article-body > h2,.article-body > h3{max-width:46rem}
/* великий номер у «Контактах» (.contact-phone) — не вступний абзац: інакше 0,2,2 перебивало його 33/42px на 18px (R3-CT-01) */
.section > .wrap > h2 + p:not(.contact-phone){font-size:18px;line-height:1.5}
.section h3{margin-top:30px}
.section h2 + h3,.section .wrap > h3:first-child{margin-top:0}
/* примітка — читабельний текст рівня основного (17px, тим самим шрифтом, що абзаци, темний колір): раніше 15px
   сірий напівжирний гротеск на сірій секції (--stone на --mist) читався як дрібний друк (29.09). Ліва риска лишає
   її приміткою, а не ще одним абзацом */
.note{font:400 var(--fs-m)/1.55 var(--f-text);color:var(--body-2);margin-top:16px;padding-left:14px;border-left:3px solid var(--line-strong)}
.note a{color:var(--ink);font-weight:600}
.lede{font-size:18px;line-height:1.5;max-width:40em}
.kicker{font:500 var(--fs-xs)/1.2 var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--stone);margin:0 0 12px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
.kicker .route{display:inline-block;width:64px;height:10px;position:relative;flex:0 0 auto}
.kicker .route::before{content:"";position:absolute;left:0;top:1px;width:8px;height:8px;border:1.2px solid currentColor;border-radius:50%}
.kicker .route::after{content:"";position:absolute;right:0;top:1px;width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber-deep)}
.kicker .route i{position:absolute;left:10px;right:10px;top:5px;border-top:1px dashed currentColor}
.more{display:inline-flex;align-items:center;gap:8px;font:600 17.5px var(--f-disp);text-decoration:none;border-bottom:1.5px solid var(--amber);padding:6px 0 3px}
.more:hover{border-color:var(--ink)}
/* «Детальніше … →» усередині тексту: суцільна amber-лінія без розривів під нижніми виносами (02.10); розмір і гарнітура — як у тексту, лінія — border на кожному рядку переносу */
.section p a.more,.section li a.more,.faq-list a.more,.article-body a.more,.note a.more{display:inline;gap:0;font:inherit;font-weight:600;padding:0 0 1px}

/* ---------------------------------------------------------------- кнопки */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 20px;border-radius:var(--r);font:600 17.5px/1.15 var(--f-disp);text-decoration:none;text-align:center;border:1.5px solid transparent;cursor:pointer;background:transparent;color:var(--ink);transition:background-color .15s,border-color .15s,color .15s}
.btn .ico{width:20px;height:20px}
.btn-block{display:flex;width:100%}
.btn-small{min-height:46px;padding:10px 16px;font-size:16px}
.btn-ink,.btn-primary{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.btn-ink:hover,.btn-primary:hover{background:var(--ink-2);border-color:var(--ink-2)}
.btn-line,.btn-outline,.btn-light{border-color:var(--edge);color:var(--ink);background:var(--paper)}
.btn-line:hover,.btn-outline:hover,.btn-light:hover{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
/* «світла контурна» — колись на темній смузі; смуга тепер «світанок», тож кнопка як .btn-line */
.btn-ghost-light{border-color:var(--edge);color:var(--ink);background:var(--paper)}
.btn-ghost-light:hover{border-color:var(--ink);background:var(--ink);color:var(--on-ink)}
.btn[disabled]{opacity:.6;cursor:wait}
/* дзвінок — єдина бурштинова кнопка; завжди з номером */
.btn-call{display:flex;align-items:center;gap:14px;width:100%;max-width:420px;min-height:64px;padding:8px 20px 8px 8px;border-radius:14px;background:var(--amber);color:var(--ink);text-decoration:none;box-shadow:0 1px 0 rgba(154,106,34,.18),0 10px 22px -12px rgba(190,128,40,.6);transition:background-color .15s,box-shadow .15s}
.btn-call:hover{background:var(--amber-hi);box-shadow:0 1px 0 rgba(154,106,34,.18),0 12px 26px -12px rgba(190,128,40,.7)}
.btn-call-ic{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--night);color:var(--amber);flex:0 0 auto}
.btn-call-ic .ico{width:22px;height:22px}
.btn-call-txt{display:flex;flex-direction:column;line-height:1.1;font-family:var(--f-disp);min-width:0}
.btn-call-txt small{font-size:13.5px;font-weight:500;letter-spacing:.01em;margin-bottom:2px}
.btn-call-txt b{font-size:23px;font-weight:700;letter-spacing:0;white-space:nowrap}
.btn-call-sm{min-height:56px}
.btn-call-sm .btn-call-ic{width:40px;height:40px}
.btn-call-sm .btn-call-txt b{font-size:20px}
/* групи дій */
.hero-act,.band-act,.owner-act,.urgent-act{display:flex;flex-direction:column;gap:10px;max-width:420px}
.hero-act > .btn,.band-act > .btn,.owner-act > .btn,.urgent-act > .btn{width:100%}
.hero-cta{display:flex;flex-direction:column;gap:10px;max-width:420px;margin:18px 0 12px}
.hero-cta > .btn{width:100%}
/* месенджери: однакові кнопки з рамкою, одноколірний значок і назва — без «веселки» */
.msg-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-width:420px;margin:0 0 12px}
.hero-act .msg-row,.band-act .msg-row,.owner-act .msg-row,.urgent-act .msg-row{margin:0}
/* один месенджер у ряду (EN «з України»: лише WhatsApp) — на всю ширину, як кнопки над і під ним (R4-CT-06) */
.msg-row:has(>.msg:only-child){grid-template-columns:minmax(0,1fr);max-width:none}
.msg{display:flex;align-items:center;justify-content:center;gap:7px;min-height:48px;padding:8px 6px;border:1px solid var(--line-strong);border-radius:var(--r);background:var(--paper);color:var(--ink);text-decoration:none;font:500 15.5px/1 var(--f-disp);white-space:nowrap}
.msg .ico{width:19px;height:19px}
.msg:hover{border-color:var(--ink);box-shadow:var(--sh-1)}
.ftr .msg{background:transparent;border-color:var(--ink-3);color:var(--on-ink)}
.ftr .msg:hover{border-color:var(--on-ink-2);box-shadow:none}
/* у смугах CTA месенджери стоять поруч із контурною кнопкою — одна рамка на обох: 1px, --edge (28.09) */
.band-act .msg,.owner-act .msg,.urgent-act .msg{border-color:var(--edge)}
.band-act .msg:hover,.owner-act .msg:hover,.urgent-act .msg:hover{border-color:var(--ink)}
.band-act > .btn-line,.band-act > .btn-ghost-light,.owner-act > .btn-line,.urgent-act > .btn-line{border-width:1px}

/* ---------------------------------------------------------------- шапка */
.hdr{position:sticky;top:0;z-index:40;background:var(--night);color:var(--on-ink)}
.hdr-in{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:72px;padding-top:6px;padding-bottom:6px}
/* Бренд (28.09, варіант A «стос», design/header-2809/A-stacked; слово власника: «Xrequiem основна назва та лого
   повинні переважати за розміром Global Ritual Group»): рядок 1 — знак X + XREQUIEM (веде: найбільший, найсвітліший, 600);
   рядок 2 — «похоронне бюро · Global Ritual Group» (поручитель: дрібно, --on-ink-2). Бурштину в бренді немає,
   золотого логотипа GRG у шапці немає. Знак і слово масштабуються від одного font-size рядка 1; знак = 1,05em ≈ 1,5
   висоти великої літери, центрований по висоті великих літер (зсув .05em — метрика Commissioner). */
.brand{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;min-height:44px;text-decoration:none;color:var(--on-ink)}
.brand-xq{display:flex;align-items:center;gap:.34em;font:600 21px/1 var(--f-disp);letter-spacing:.06em;color:var(--on-ink);white-space:nowrap}
.brand-xq img{width:auto;height:1.05em;flex:0 0 auto;transform:translateY(.05em)}
/* Варіант B (28.09, слово власника «Варіант B», design/header-2809b/B.html): надрядок GLOBAL RITUAL GROUP (поручитель,
   дрібно, розріджено, бурштин) → XREQUIEM (веде) + міста праворуч від назви (з 600px) → рядок послуг.
   Рядок послуг росте з шириною: <600 — лише міста (замість послуг), 600–1279 — «Похоронне бюро · Міжнародна репатріація»,
   ≥1280 — ще й «· Власні домовини й атрибутика» (.bg-s3). Кеглі XREQUIEM 18/21/24/26/30 — як були. */
.brand-ov{display:block;margin-bottom:3px;font:600 9.5px/1 var(--f-disp);letter-spacing:.22em;text-transform:uppercase;color:var(--amber);white-space:nowrap}
.brand-row{display:flex;align-items:baseline;gap:12px;min-width:0}
.brand-cities{display:none;font:500 13px/1 var(--f-disp);color:var(--on-ink-2);white-space:nowrap}
.brand-group{display:block;margin-top:4px;font:500 11.5px/1.25 var(--f-disp);letter-spacing:.01em;color:var(--on-ink-2);white-space:nowrap}
.bg-serv,.bg-s3{display:none}
/* D77: «Вся Україна · будь-яке місто» — на вузьких телефонах (<390px) лише «Вся Україна», друга частина .bg-c2 з 390px; з 600px замість .bg-cities — .brand-cities */
.bg-c2{display:none}
@media (min-width:390px){.bg-c2{display:inline}}
.hdr-act{display:flex;align-items:center;gap:6px;flex:0 0 auto}
/* перемикач мови UA/EN: на телефоні коло 44px — як дзвінок і меню поруч (було 34 в полі 44 — нерівні проміжки,
   R3-CT-13); на комп'ютері — 42px, як кола месенджерів поруч (див. @media min-width:900px) */
.hdr-lang{position:relative;display:grid;place-items:center;width:44px;height:44px;border-radius:999px;font:600 13px/1 var(--f-disp);letter-spacing:.06em;text-indent:.06em;color:var(--on-ink-2);text-decoration:none}
.hdr-lang::before{content:"";position:absolute;inset:0;border:1px solid var(--ink-3);border-radius:inherit}
.hdr-lang:hover{color:var(--on-ink)}
.hdr-lang:hover::before{border-color:var(--on-ink-2)}
/* Перемикач мови UA/EN/PL/DE (28.09.2026). Дві мови — кола-посилання вище; три й більше — <details>: кнопка того самого розміру
   з кодом поточної мови (summary.hdr-lang) розкриває список рідних назв. Працює без JS (Enter/Пробіл на summary; app.js лише
   закриває список кліком поза ним і Esc). Меню — під колом, вирівняне праворуч: на 320px лишається в межах екрана. */
.hdr-lang-sw{position:relative}
.hdr-lang-sw>summary.hdr-lang{display:block;text-align:center;line-height:44px;list-style:none;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.hdr-lang-sw>summary.hdr-lang::-webkit-details-marker{display:none}
.hdr-lang-sw>summary.hdr-lang::marker{content:""}
.hdr-lang-sw[open]>summary.hdr-lang{color:var(--on-ink);background:var(--ink-2)}
.hdr-lang-sw[open]>summary.hdr-lang::before{border-color:var(--on-ink-2)}
.lang-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:176px;margin:0;padding:6px;list-style:none;background:var(--night);border:1px solid var(--ink-3);border-radius:14px;box-shadow:0 14px 32px -10px rgba(0,0,0,.45)}
.lang-menu li{margin:0}
.lang-menu a{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:0 14px;border-radius:9px;color:var(--on-ink);text-decoration:none;font:500 15.5px/1.2 var(--f-disp)}
.lang-menu a:hover{background:var(--ink-2)}
.lang-menu a b{font:600 12px/1 var(--f-disp);letter-spacing:.08em;color:var(--on-ink-2)}
.hdr-msgs,.hdr-form{display:none}
.hdr-call{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--amber);color:var(--ink);text-decoration:none}
.hdr-call:hover{background:var(--amber-hi)}
.hdr-call .ico{width:22px;height:22px}
.hdr-call-txt{display:none}
.burger{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--ink-2);color:var(--on-ink);border:0;cursor:pointer;padding:0}
.burger .ico{width:22px;height:22px}
.burger[aria-expanded="true"]{background:var(--ink-3)}
.nav{display:none;border-top:1px solid var(--ink-3)}
.nav.is-open{display:block;max-height:calc(100vh - 72px);overflow:auto;overscroll-behavior:contain}
.nav-list{list-style:none;margin:0;padding:6px 0 12px;display:flex;flex-direction:column}
.nav-list li{margin:0}
.nav-list a{display:block;padding:13px 0;font:500 18.5px/1.2 var(--f-disp);text-decoration:none;color:var(--on-ink);border-bottom:1px solid var(--ink-2)}
.nav-list a[aria-current]{color:var(--amber)}

/* ---------------------------------------------------------------- стрічка «жива компанія» */
.live{background:var(--mist);color:var(--ink);border-bottom:1px solid var(--line)}
.live-in{display:flex;align-items:center;gap:14px;padding-top:9px;padding-bottom:9px}
.live-t{display:none;margin:0;font:500 13px/1.2 var(--f-mono);color:var(--stone);white-space:nowrap;align-items:center;gap:8px}
.pulse{width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber-deep);display:inline-block}
.live-row{display:flex;gap:8px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:none;margin-right:calc(-1 * var(--gut));padding-right:var(--gut);-webkit-mask-image:linear-gradient(90deg,#000 86%,transparent);mask-image:linear-gradient(90deg,#000 86%,transparent);min-width:0}
.live-row::-webkit-scrollbar{display:none}
/* картка: значок ліворуч, число над підписом — вужча, тож на комп'ютері всі стають в один ряд */
.live-c{display:grid;grid-template-columns:auto auto;column-gap:8px;row-gap:1px;align-items:center;flex:0 0 auto;scroll-snap-align:start;padding:6px 14px 6px 12px;min-height:44px;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);text-decoration:none;color:var(--ink);box-shadow:0 1px 2px rgba(31,46,58,.04)}
.live-c .ico{width:18px;height:18px;grid-row:1 / 3}
.live-c b{font:600 15.5px/1.05 var(--f-disp)}
.live-c span{font:500 12px/1.15 var(--f-disp);color:var(--stone);white-space:nowrap}
.live-c:hover{border-color:var(--line-strong);box-shadow:var(--sh-1)}

/* ---------------------------------------------------------------- хлібні крихти */
.breadcrumbs{font:500 14px/1.3 var(--f-disp);color:var(--stone)}
.breadcrumbs ol{list-style:none;margin:0;padding:14px 0 0;display:flex;flex-wrap:wrap;gap:2px 0}
.breadcrumbs li{margin:0;display:flex;align-items:center}
.breadcrumbs li + li::before{content:"/";margin:0 8px;color:var(--line-strong)}
.breadcrumbs a{color:var(--stone);text-decoration:underline;text-decoration-color:var(--line-strong)}
.breadcrumbs li:last-child{color:var(--ink)}
/* телефон: крихти в один рядок, довга назва сторінки обрізається «…» (повна — у H1 одразу нижче), 28.09 */
@media (max-width:599px){
  .breadcrumbs ol{flex-wrap:nowrap}
  .breadcrumbs li{flex:0 0 auto}
  .breadcrumbs li:last-child{display:block;flex:0 1 auto;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
}

/* ---------------------------------------------------------------- перший екран: головна */
.hero{padding:26px 0 40px}
.hero h1{font-size:var(--fs-h1);margin-bottom:14px}
.hero .lede{margin-bottom:12px}
.hero-price{font:500 18px/1.3 var(--f-disp);margin:0 0 16px;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px}
.hero-price b{font-size:26px;font-weight:600;white-space:nowrap}
.hero-price span{color:var(--stone);font-weight:500;font-size:16px}
.trust,.trust-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:8px;font:500 15px/1.35 var(--f-disp);color:var(--stone)}
.trust li,.trust-list li{display:flex;gap:10px;align-items:baseline;margin:0}
.trust li::before,.trust-list li::before{content:"";flex:0 0 7px;height:7px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber-deep);transform:translateY(-1px)}
.hero-map{margin-top:30px}
/* перший екран головної (27.09): заголовок → фото автопарку → ціна й кнопки → коротка форма → схема.
   На телефоні .hero-map «розчиняється» (display:contents), щоб фото стало одразу під заголовком. */
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr)}
.hero-grid > .hero-map{display:contents}
.hero-head{order:1}
.hero-photo{order:2}
.hero-body{order:3}
.hero-form{order:4;margin-top:20px}
.hero-grid > .hero-map > .mapbox{order:5;margin-top:30px}
.hero-photo{position:relative;margin:2px 0 20px}
.hero-photo img{display:block;width:100%;height:auto;aspect-ratio:21/10;object-fit:cover;border-radius:var(--r-l);background:var(--mist)}
.hero-photo figcaption{margin-top:8px;font:500 13.5px/1.35 var(--f-disp);color:var(--stone)}

/* схема «Дорога додому» */
.mapbox{background:radial-gradient(90% 70% at 76% 46%,#F3F6F4 0%,rgba(243,246,244,0) 70%),var(--dawn);color:var(--ink);padding:20px 16px 18px;margin:0;border-radius:var(--r-l)}
.mapbox-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:6px}
.mapbox-h h2{font-size:23px;margin:0;color:var(--ink)}
.mapbox-h .mono{font-size:12px;color:var(--stone);text-transform:uppercase;letter-spacing:.08em}
.legend{list-style:none;margin:10px 0 0;padding:12px 0 0;border-top:1px solid #D2DADB;display:flex;flex-wrap:wrap;gap:6px 18px;font:500 13.5px/1.3 var(--f-disp);color:var(--stone)}
.legend li{display:flex;align-items:center;gap:8px;margin:0}
.map-note{margin:8px 0 0;font-size:14.5px;line-height:1.5;color:var(--stone)}

/* ---------------------------------------------------------------- перший екран: решта сторінок */
.page-hero{padding:16px 0 42px}
.page-hero h1{font-size:var(--fs-h1);margin-bottom:14px}
.page-hero-txt > p:not(.kicker):not(.c-price),.page-hero .lede,.article-lead{font-size:18px;line-height:1.5;max-width:40em}
.page-hero-txt > p strong:first-child{font-family:var(--f-disp);font-weight:600;font-size:1.12em}
.page-hero .hero-act{margin-top:20px}
/* ліва колонка першого екрана — один правий край (R3-CT-03, 28.09): кнопка дзвінка, месенджери, коротка форма,
   ціна й лід — 560px, а не 420/560/720. На ≥900 у двоколонковому першому екрані (головна, .page-hero-grid)
   ширину тримає сама колонка — там обмеження знято (див. @media min-width:900px). */
.hero .hero-act,.page-hero .hero-act{max-width:560px}
.hero .hero-act > .btn-call,.hero .hero-act > .msg-row,.page-hero .hero-act > .btn-call,.page-hero .hero-act > .msg-row{max-width:none}
.page-hero .page-hero-txt > .c-price,.page-hero .page-hero-txt > p:not(.kicker){max-width:560px}
.page-hero-grid{display:grid;gap:30px}
.page-hero-photo{margin:0}
.page-hero-photo img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:var(--r-l)}
.page-hero .note{margin-top:18px}
.c-price{display:flex;flex-direction:column;gap:4px;margin:0 0 16px;padding:14px 0;border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line)}
.c-price b{font:600 42px/1.05 var(--f-disp);letter-spacing:-.015em;white-space:nowrap}
.c-price b small{font-size:21px;font-weight:500;color:var(--stone);margin-right:6px}
.c-price span{font:500 16px/1.35 var(--f-disp);color:var(--stone)}
/* «Маршрут справи» — темна панель станцій */
.leg{background:var(--dawn);color:var(--ink);border-radius:var(--r-l);padding:22px 20px}
.leg h2{font:500 15px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin:0 0 18px}
.leg ol{list-style:none;margin:0;padding:0}
.leg li{position:relative;padding:0 0 20px 34px;margin:0;font:500 14.5px/1.4 var(--f-disp)}
/* ^ шрифт li = шрифт сірих підрядків: інакше строка тіла (17px × 1.55) розсовувала їх до ~27px (R4-CT-04) */
.leg li::before{content:"";position:absolute;left:4px;top:5px;width:11px;height:11px;border:1.5px solid #6C7B83;border-radius:50%;background:var(--paper);z-index:1}
.leg li::after{content:"";position:absolute;left:9.5px;top:18px;bottom:-4px;border-left:1px dashed #8A9CA5}
.leg li:last-child{padding-bottom:0}
.leg li:last-child::after{display:none}
.leg li:last-child::before{background:var(--amber);border:0;box-shadow:0 0 0 1px var(--amber-deep),0 0 0 5px rgba(237,180,92,.22);width:15px;height:15px;left:2px;top:3px}
.leg b{display:block;font:600 17.5px/1.25 var(--f-disp);color:var(--ink)}
.leg span{font:500 14.5px/1.4 var(--f-disp);color:var(--stone)}
.leg .t{font-family:var(--f-mono);font-size:13px;color:var(--amber-text)}

/* ---------------------------------------------------------------- плитки країн («квиток») */
.tiles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0 22px}
.tile{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;background:#fff;box-shadow:var(--sh-1)}
.t-link{display:flex;flex-direction:column;gap:6px;padding:14px 12px 10px;text-decoration:none;flex:1 1 auto;color:var(--ink)}
.t-link:hover .t-name{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.t-top{display:flex;align-items:center;justify-content:space-between;min-height:18px}
.t-top img{height:17px;width:auto;border-radius:2px;box-shadow:0 0 0 1px rgba(16,34,48,.12)}
/* «Інші країни»: замість порожньої пунктирної рамки (читалась як биту картинку) — значок глобуса (28.09) */
.t-noflag{display:block;width:auto;height:17px;border:0;color:var(--stone)}
.t-noflag svg{display:block;width:17px;height:17px}
.t-code{font:500 12px var(--f-mono);color:var(--stone);letter-spacing:.06em}
.t-name{font:600 19px/1.15 var(--f-disp);letter-spacing:-.01em}
.t-stub{position:relative;display:block;height:14px;margin:2px 22px 2px 0}
.t-stub::before{content:"";position:absolute;left:0;top:3px;width:8px;height:8px;border:1.2px solid #6C7B83;border-radius:50%}
.t-stub i{position:absolute;left:10px;right:7px;top:7px;border-top:1px dashed #9AA6AA}
.t-stub::after{content:"";position:absolute;right:0;top:3px;width:8px;height:8px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber-deep)}
.t-stub em{position:absolute;right:-22px;top:0;font:500 11px/14px var(--f-mono);font-style:normal;color:var(--stone)}
.t-price{font:600 21px/1.15 var(--f-disp);white-space:nowrap;letter-spacing:-.01em}
.t-price small{font-size:15px;font-weight:500;color:var(--stone)}
.t-btn{display:flex;align-items:center;justify-content:center;min-height:46px;margin:0 8px 8px;padding:6px 8px;border-radius:10px;border:1px solid var(--edge);font:500 14.5px/1.15 var(--f-disp);text-decoration:none;text-align:center;color:var(--ink)}
.t-btn:hover,.t-btn-solid{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.t-btn-solid:hover{background:var(--ink-2)}
.tile-noprice{background:var(--mist);border-color:var(--mist);box-shadow:none}
.section-alt .tile-noprice{background:var(--paper);border-color:var(--line)}
/* останній ряд сітки країн не лишається напівпорожнім (R3-CT-02, 28.09): остання плитка тягнеться на решту ряду
   (38 плиток — 2 в останньому ряду на 3 і 4 колонках; 37 на «Інших країнах» — Молдова сама на будь-якій ширині)
   і стає «банером» у рядок, як .price-tile-wide: прапор і назва, маршрут до UA, кнопка праворуч.
   Колонки: <600 — 2, 600–899 — 3, ≥900 — 4 (див. @media нижче). */
@media (max-width:599px){
  .tiles>.tile:last-child:nth-child(2n+1):not(:first-child){grid-column:1/-1;flex-direction:row;align-items:center}
  .tiles>.tile:last-child:nth-child(2n+1):not(:first-child) > .t-link{flex:1 1 auto;min-width:0}
  .tiles>.tile:last-child:nth-child(2n+1):not(:first-child) > .t-btn{flex:0 0 auto;min-width:150px;margin:8px 10px 8px 0}
  .tiles>.tile:last-child:nth-child(2n+1):not(:first-child) .t-top{justify-content:flex-start;gap:10px}
}
@media (min-width:600px) and (max-width:899px){
  .tiles>.tile:last-child:nth-child(3n+1):not(:first-child){grid-column:1/-1}
  .tiles>.tile:last-child:nth-child(3n+2){grid-column:span 2}
  .tiles>.tile:last-child:is(:nth-child(3n+1):not(:first-child),:nth-child(3n+2)){flex-direction:row;align-items:center}
  .tiles>.tile:last-child:is(:nth-child(3n+1):not(:first-child),:nth-child(3n+2)) > .t-link{flex:1 1 auto;min-width:0}
  .tiles>.tile:last-child:is(:nth-child(3n+1):not(:first-child),:nth-child(3n+2)) > .t-btn{flex:0 0 auto;min-width:180px;margin:8px 12px}
  .tiles>.tile:last-child:is(:nth-child(3n+1):not(:first-child),:nth-child(3n+2)) .t-top{justify-content:flex-start;gap:10px}
}
@media (min-width:900px){
  .tiles:not(.tiles-out)>.tile:last-child:nth-child(4n+1):not(:first-child){grid-column:1/-1}
  .tiles:not(.tiles-out)>.tile:last-child:nth-child(4n+2){grid-column:span 3}
  .tiles:not(.tiles-out)>.tile:last-child:nth-child(4n+3){grid-column:span 2}
  .tiles:not(.tiles-out)>.tile:last-child:is(:nth-child(4n+1):not(:first-child),:nth-child(4n+2),:nth-child(4n+3)){flex-direction:row;align-items:center}
  .tiles:not(.tiles-out)>.tile:last-child:is(:nth-child(4n+1):not(:first-child),:nth-child(4n+2),:nth-child(4n+3)) > .t-link{flex:1 1 auto;min-width:0}
  .tiles:not(.tiles-out)>.tile:last-child:is(:nth-child(4n+1):not(:first-child),:nth-child(4n+2),:nth-child(4n+3)) > .t-btn{flex:0 0 auto;min-width:180px;margin:8px 16px}
  .tiles:not(.tiles-out)>.tile:last-child:is(:nth-child(4n+1):not(:first-child),:nth-child(4n+2),:nth-child(4n+3)) .t-top{justify-content:flex-start;gap:10px}
}
/* старі плитки в тексті сторінок (div/a.price-tile): той самий «квиток», компактний */
.price-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0 22px}
.price-tile{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding:14px 12px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);text-decoration:none;box-shadow:var(--sh-1)}
.price-tile img{height:17px;width:auto;border-radius:2px;box-shadow:0 0 0 1px rgba(16,34,48,.12)}
a.price-tile:hover{border-color:var(--line-strong);box-shadow:var(--sh-2)}
a.price-tile:hover .pt-country{text-decoration:underline;text-underline-offset:3px}
.pt-country{font:600 18.5px/1.2 var(--f-disp)}
.pt-price{font:600 20.5px/1.15 var(--f-disp)}
.pt-price:empty{display:none}
.pt-cta{font:500 15px/1.25 var(--f-disp);color:var(--ink);border-bottom:1.5px solid var(--amber);margin-top:auto;padding-top:4px}
.pt-cta-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:6px 14px;border:0;border-radius:10px;background:var(--ink);color:var(--on-ink);text-decoration:none}
.pt-cta-btn:hover{background:var(--ink-2)}
.price-tile-wide,.price-tile-urn{background:var(--mist);border-color:var(--mist);box-shadow:none}
.section-alt .price-tile-wide,.section-alt .price-tile-urn{background:var(--paper);border-color:var(--line)}
/* пара плиток «тіло + урна»: дві рівні колонки, ціни на одній лінії — ціна притиснута донизу плитки (28.09) */
.price-pair,.price-grid.price-pair{display:grid;gap:12px;grid-template-columns:repeat(2,minmax(0,1fr));max-width:46rem}
.price-tile > .pt-price:last-child,.price-tile > .pt-cta:last-child{margin-top:auto}
.price-pair .price-tile-urn,.section-alt .price-pair .price-tile-urn{background:#fff;border-color:var(--line);box-shadow:var(--sh-1)}
/* назви в парі — на одній висоті (R3-CT-04, 28.09): прапор стоїть у рядку назви країни (всередині .pt-country,
   build.py render_pricepair), а не окремим рядком над нею — «Тіло з Польщі» була на ~22px нижче за «Урна з прахом».
   Відступ прапор→назва — рівно 8px (R3-CT-04, коло 3): render_pricepair ставить прапор без пробілу після нього (у .nowrap
   разом із першим словом), тож відступ дає лише margin. На сторінках із ручною розміткою (moldova, yehypet: прапор —
   прямий нащадок .pt-country, після нього пробіл) прапор плаває ліворуч: пробіл на початку рядка браузер прибирає,
   тож і там рівно 8px — з пробілом у розмітці чи без. margin-top:3px — та сама висота, що й у рядковому прапорі.
   Ціна чи кнопка — донизу плитки (margin-top:auto). */
.pt-country img{display:inline-block;height:17px;width:auto;vertical-align:-2px;margin-right:8px}
.pt-country > img{float:left;margin-top:3px}
.price-pair .price-tile{padding:16px 18px}
@media (max-width:389px){.price-pair .price-tile{padding:16px 14px}}
/* пара без ціни тіла в тексті (Молдова, Єгипет, «Інші країни»; EN — Moldova, Egypt, Other countries): ліворуч кнопка
   «Дізнатись ціну», праворуч ціна урни. Обидві плитки — одна будова: підпис угорі, знизу ряд однакової висоти 44px
   (кнопка на всю ширину плитки, ціна посередині ряду по вертикалі). Тож кнопка й рядок ціни стоять на одній лінії, а плитки
   однакової висоти — і на 390, де прапор з назвою переноситься на два рядки, і на 320, де кнопка може стати у два рядки (29.09) */
.price-pair:has(.pt-cta-btn) .price-tile > .pt-cta-btn,
.price-pair:has(.pt-cta-btn) .price-tile > .pt-price:not(:empty){box-sizing:border-box;min-height:44px}
.price-pair:has(.pt-cta-btn) .price-tile > .pt-cta-btn{align-self:stretch;text-align:center}
.price-pair:has(.pt-cta-btn) .price-tile > .pt-price:not(:empty){display:flex;align-items:center}
/* широка плитка («Інші країни» наприкінці сітки на сторінках послуг) — справді на весь ряд, кнопка праворуч */
.price-tile-wide{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px}
.price-tile-wide .pt-cta{margin-top:0;padding-top:0}
.price-tile-wide .pt-cta-btn{padding-top:6px}

/* ---------------------------------------------------------------- смуги CTA */
.band{background:var(--dawn);color:var(--ink);padding:14px 0 44px}
.band-route{position:relative;height:22px;margin:0 0 30px}
.band-route::before{content:"";position:absolute;left:0;top:14px;width:11px;height:11px;border:1.2px solid #6C7B83;border-radius:50%;background:var(--paper)}
.band-route i{position:absolute;left:16px;right:20px;top:19.5px;border-top:1px dashed #8A9CA5}
.band-route::after{content:"";position:absolute;right:0;top:12px;width:15px;height:15px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 1px var(--amber-deep),0 0 0 6px rgba(237,180,92,.22)}
.cta-title{font:600 27px/1.2 var(--f-disp);letter-spacing:-.012em;margin:0 0 10px;text-wrap:balance}
.cta-sub{margin:0 0 22px;color:var(--stone)}
/* смуга CTA — «світанок», не «туман»: поруч із .section-alt вона не зливається в один блок (28.09) */
.band-light{background:var(--dawn);color:var(--ink)}
.band-light .cta-sub{color:var(--stone)}
.section-alt + .band-light,.band-light + .section-alt{border-top:1px solid var(--line)}
/* смуга власника (світла) */
.owner{padding:48px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.owner-in{display:grid;grid-template-columns:72px minmax(0,1fr);gap:14px 16px;align-items:center}
.owner-img{width:72px;height:72px;object-fit:cover;border-radius:50%}
.owner .cta-title{font-size:24px;margin-bottom:6px}
.owner .cta-sub{margin:0;color:var(--stone)}
.owner-act{grid-column:1/-1;margin-top:6px}
/* «Якщо це сталося щойно» */
.urgent-band{background:var(--mist);padding:48px 0}
.urgent-title{font:600 var(--fs-h2)/1.18 var(--f-disp);letter-spacing:-.012em;margin:0 0 18px}
.urgent-steps{list-style:none;margin:0 0 20px;padding:0;display:grid;gap:12px;counter-reset:u}
.urgent-steps li{position:relative;margin:0;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px 16px 16px 52px;counter-increment:u;box-shadow:var(--sh-1)}
.urgent-steps li::before{content:counter(u);position:absolute;left:14px;top:14px;width:26px;height:26px;border:1.5px solid var(--edge);border-radius:50%;display:grid;place-items:center;font:500 13.5px/1 var(--f-mono)}
.urgent-steps strong{display:block;font:600 18.5px/1.3 var(--f-disp);margin-bottom:4px}

/* ---------------------------------------------------------------- станції маршруту («Як ми працюємо») */
.stations{list-style:none;margin:24px 0 20px;padding:0;position:relative}
.stations li{position:relative;padding:0 0 26px 40px;margin:0}
.stations li::before{content:"";position:absolute;left:5px;top:6px;width:12px;height:12px;border:1.5px solid var(--edge);border-radius:50%;background:var(--paper);z-index:1}
.stations li::after{content:"";position:absolute;left:10.5px;top:20px;bottom:-6px;border-left:1px dashed var(--line-strong)}
.stations li:last-child{padding-bottom:0}
.stations li:last-child::after{display:none}
.stations li:last-child::before{background:var(--amber);border:0;box-shadow:0 0 0 1px var(--amber-deep),0 0 0 5px rgba(237,180,92,.2);width:16px;height:16px;left:3px;top:4px}
.st-k{display:block;font:500 12px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin-bottom:3px}
.st-k:empty{display:none}
.stations h3{margin:0 0 4px;font-size:21px}
.stations p{margin:0;color:var(--body-2)}
.section-alt .stations li::before{background:var(--mist)}
.section-alt .stations li:last-child::before{background:var(--amber)}
/* ті самі станції для довгих нумерованих списків у тексті сторінок (завжди вертикально) */
.steps{list-style:none;margin:20px 0 22px;padding:0;counter-reset:st;max-width:46rem}
.steps li{position:relative;padding:0 0 20px 44px;margin:0;counter-increment:st}
.steps li::before{content:counter(st);position:absolute;left:0;top:0;width:28px;height:28px;border:1.5px solid var(--edge);border-radius:50%;background:var(--paper);display:grid;place-items:center;font:500 13px/1 var(--f-mono);z-index:1}
.steps li::after{content:"";position:absolute;left:13.5px;top:30px;bottom:-2px;border-left:1px dashed var(--line-strong)}
.steps li:last-child{padding-bottom:0}
.steps li:last-child::after{display:none}
.steps li:last-child::before{background:var(--amber);border-color:var(--amber-deep);border-width:1px}
.section-alt .steps li::before{background:var(--mist)}
.section-alt .steps li:last-child::before{background:var(--amber)}
.steps li strong:first-child{font-family:var(--f-disp);font-weight:600;font-size:1.05em}
/* «Перші години» (Що робити): останній крок — застереження «Нічого не підписуйте поспіхом», бурштинова точка «прибули»
   тягнула око до нього. Він — звичайний крок, а бурштин (колір дзвінка) — на кроці «Зателефонуйте нам» (R3-CT-18) */
#pershi-hodyny .steps li:last-child::before{background:var(--paper);border-color:var(--edge);border-width:1.5px}
#pershi-hodyny.section-alt .steps li:last-child::before{background:var(--mist)}
#pershi-hodyny .steps li:nth-child(2):not(:last-child)::before{background:var(--amber);border-color:var(--amber-deep);border-width:1px}
.steps h3{margin:0 0 4px}
.steps p{margin:0}

/* ---------------------------------------------------------------- списки, документи, картки */
.check-list,.inc{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:10px}
.check-list li,.inc li{position:relative;padding-left:28px;margin:0}
.check-list li::before,.inc li::before{content:"";position:absolute;left:3px;top:.42em;width:12px;height:7px;border-left:1.5px solid var(--ink);border-bottom:1.5px solid var(--ink);transform:rotate(-45deg)}
/* «чого не робити» — той самий список, але маркер × (28.09): галочка під заборонами читалась як «робіть» */
.dont-list{list-style:none;padding:0;margin:0 0 16px;display:grid;gap:10px}
.dont-list li{position:relative;padding-left:28px;margin:0}
.dont-list li::before,.dont-list li::after{content:"";position:absolute;left:3px;top:.72em;width:12px;border-top:1.5px solid var(--err-ink);transform:rotate(45deg)}
.dont-list li::after{transform:rotate(-45deg)}
.doc-cols{display:grid;gap:22px;margin:20px 0}
.doc-col h3{font-size:20px;padding-bottom:10px;border-bottom:1px solid var(--line-strong);margin:0 0 14px}
.doc-col h3:not(:first-child){margin-top:24px}
.doc-col ul{margin:0;padding:0;list-style:none;display:grid;gap:10px}
.doc-col ul + p{margin-top:14px}
.doc-col li{padding-left:18px;position:relative;margin:0}
.doc-col li::before{content:"";position:absolute;left:0;top:.62em;width:7px;height:7px;border:1.2px solid var(--stone);border-radius:50%}
.service-grid{display:grid;gap:22px;margin:20px 0}
.service-card{border-top:1px solid var(--line-strong);padding-top:14px}
.service-card h3{margin:0 0 6px;font-size:21px}
.service-card h3 a{text-decoration:none}
.service-card h3 a::after{content:" →";color:var(--stone)}
.service-card h3 a:hover{text-decoration:underline}
/* картка-посилання цілком (<a class="service-card">, розділи «Питань»): без підкреслення всього тексту, «→» як у
   картках з посиланням у заголовку; при наведенні підкреслюється лише заголовок (R3-CT-11) */
a.service-card{text-decoration:none;color:inherit}
a.service-card h3::after{content:" →";color:var(--stone)}
a.service-card:hover h3{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
a.service-card p{color:var(--body-2)}
.service-card p{margin:0 0 8px}
.service-card p:last-child{margin:0}
.service-card .btn{margin-top:10px}
/* кнопки карток одного ряду — на одній лінії, хоч би якої довжини був текст (28.09) */
.service-card{display:flex;flex-direction:column;align-items:flex-start}
.service-card > *{max-width:100%}
.service-card > .btn:last-child{margin-top:auto}
.service-card > p:has(+ .btn:last-child){margin-bottom:18px}
.company-grid{display:grid;gap:16px;margin:20px 0}
.company-card{border:1px solid var(--line);border-radius:14px;padding:20px;background:#fff;box-shadow:var(--sh-1)}
.company-card h3{margin:0 0 4px}
.company-city{font:500 13px var(--f-mono);color:var(--stone);letter-spacing:.04em;text-transform:uppercase;margin:0 0 8px}
/* {{ualist}}: перелік міст України за областями (D84, 06.10.2026) */
.ua-index ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 16px;padding:0;margin:0 0 18px}
.ua-index a{text-decoration:underline;text-underline-offset:3px}
.ua-note{color:var(--stone);margin:0 0 22px}
.ua-regions{columns:1}
.ua-region{break-inside:avoid;margin:0 0 22px;scroll-margin-top:90px}
.ua-region h3{margin:0 0 6px}
.ua-cities{margin:0;line-height:1.75}
.ua-centre{font-weight:700}
.ua-centres{margin:0 0 14px;line-height:1.75}
.ua-list .ua-cities{margin:0;padding:0 0 18px;line-height:1.75}
@media (min-width:760px){.ua-regions{columns:2;column-gap:44px}}
@media (min-width:1100px){.ua-regions{columns:3}}
.company-card .btn{margin-top:6px}
/* кнопки карток групи — на одній лінії, внизу картки (R3-CT-05, 28.09): «Подзвонити» й «Сайт …» стояли на трьох висотах.
   XREQUIEM — провідна картка на весь ряд; решта четверо — один ряд лише на ≥1100, 2×2 на 600–1099 (без порожньої
   клітинки): на 900–1060 картка в ряду з чотирьох ~200px і «Сайт afterlife.com.ua» ламалась на два рядки (R3-CT-05, коло 3). */
.company-card{display:flex;flex-direction:column;align-items:flex-start}
.company-card > *{max-width:100%}
.company-card p:last-of-type{margin-bottom:14px}
.company-card .btn{margin-top:auto}
.company-grid > .company-card:first-child{grid-column:1/-1}
.founder-block{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;align-items:start;margin-top:18px}
.founder-photo-img{width:96px;height:96px;object-fit:cover;border-radius:var(--r-l)}
.founder-info h3{margin:0 0 6px;font-size:24px}
.founder-info .btn{margin:6px 6px 0 0}
/* текст власника — тієї ж міри, що й решта тексту, а не ~130 знаків у рядку (R3-CT-08) */
.founder-info{max-width:46rem}
@media (max-width:599px){
  /* телефон: кнопки власника — однакової ширини, одна під одною (28.09) */
  .founder-info .btn{display:flex;width:100%;justify-content:center;margin:8px 0 0}
  /* телефон (R3-CT-08): фото 72px і ім'я з роллю — у шапці блоку, цитата, текст і кнопки — на всю ширину від краю
     сторінки (раніше все стискалось у ~246px праворуч від фото, під фото лишалась порожня смуга) */
  .founder-block{grid-template-columns:72px minmax(0,1fr);column-gap:14px;row-gap:0}
  .founder-info{display:contents}
  .founder-photo-img{width:72px;height:72px;grid-row:1/3;grid-column:1}
  .founder-info>h3{grid-column:2;grid-row:1;align-self:end;margin:0 0 2px;font-size:22px}
  .founder-info>.person-role{grid-column:2;grid-row:2;align-self:start;margin:0}
  .founder-block:not(:has(.person-role)) .founder-info>h3{grid-row:1/3;align-self:center;margin:0}
  .founder-info>:not(h3):not(.person-role){grid-column:1/-1}
  .founder-info>h3+:not(.person-role),.founder-info>.person-role+*{margin-top:16px}
}
.founder-quote{font-style:italic;font-size:19px;line-height:1.55}
.person-role{font:500 14px var(--f-mono);color:var(--stone);margin:0 0 10px;letter-spacing:.02em}
.team-figure{margin:22px 0}
.team-figure img{width:100%;max-width:46rem;aspect-ratio:4/3;object-fit:cover;object-position:50% 30%;border-radius:var(--r-l)}
/* логотип GRG на «Про нас» — знак, а не фото: у рамці 4:3 на 760px це був екран чорного (R3-CT-07). Правило за src — без класу в HTML.
   Пропорція — як у файлу (width/height 1280×737): голе auto давало 0px висоти до завантаження lazy-картинки й зсув ~184px */
.team-figure img[src*="/grg-logo."]{max-width:320px;aspect-ratio:1280/737;object-fit:contain;border-radius:var(--r)}
.team-figure figcaption{font:500 14px/1.4 var(--f-disp);color:var(--stone);margin-top:8px}

/* ---------------------------------------------------------------- текст статті, таблиці */
.article-body h2{margin-top:6px}
.article-body h3{margin-top:26px}
/* кілька H2 в одному .article-body: наступний H2 відступає від тексту над ним більше, ніж H3 (було 6 проти 26 —
   ієрархію перевернуто, довгі сторінки читались суцільною стіною), R3-CT-09;
   .article-body буває і на .wrap (статті), і на самій секції (політика конфіденційності) */
.article-body > h2:not(:first-child),.article-body > .wrap > h2:not(:first-child){margin-top:56px}
@media (max-width:699px){
  .article-body > h2:not(:first-child),.article-body > .wrap > h2:not(:first-child){margin-top:44px}
}
.article-body blockquote{margin:20px 0;padding:4px 0 4px 18px;border-left:2px solid var(--line-strong);font-style:italic}
/* підкреслення — лише звичайним текстовим посиланням; кнопки, чипи месенджерів, телефони з класом — без (28.09) */
.article-body a:not([class]),.section p a:not([class]),.section li a:not([class]),.faq-list a:not([class]){text-decoration:underline;text-decoration-skip-ink:none}
/* номер телефону в тексті не рветься «+380 77 882 77 / 77»; кнопки з класом (.btn-call) — не чіпаємо (28.09) */
.section p a[href^="tel:"]:not([class]),.section li a[href^="tel:"]:not([class]),.article-body a[href^="tel:"]:not([class]),.faq-list a[href^="tel:"]:not([class]),.form-success a[href^="tel:"]{white-space:nowrap}
.section .related li a,.article-body .related li a{text-decoration:none}
.section .related li a:hover,.article-body .related li a:hover{text-decoration:underline}
.table-wrap{overflow-x:auto;margin:18px 0;border-top:1px solid var(--line-strong);-webkit-overflow-scrolling:touch;max-width:46rem}
table{width:100%;border-collapse:collapse;font:400 16px/1.4 var(--f-disp)}
th,td{text-align:left;padding:12px 10px 12px 0;border-bottom:1px solid var(--line);vertical-align:top}
th{font:500 12.5px var(--f-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--stone)}
/* nowrap лише для колонки цін: у таблицях документів і вимог остання колонка — текст, він має переноситись (28.09) */
.price-table td:not(:first-child){font-weight:600;font-size:18px;white-space:nowrap}
@media (max-width:599px){.price-table td:not(:first-child){font-size:16px}.price-table th{white-space:normal}}   /* 14.10.2026: друга колонка ціни — урна цієї країни */
@media (max-width:599px){
  /* телефон: таблиці документів уміщаються без горизонтальної прокрутки; довгі іншомовні назви органів
     («Bezirkshauptmannschaft») переносяться — крім першої колонки з назвою країни (28.09) */
  .table-wrap table{font-size:15px}
  th,td{padding-right:8px}
  .table-wrap th:last-child,.table-wrap td:last-child{padding-right:0}
  /* X5 (15.10): таблиці статей і оглядів (не .table-cards і не .price-table) мають читабельні колонки: усі, крім першої
     (назва країни), — від 128 px. Що не вміщається у ширину екрана, прокручується всередині .table-wrap
     (overflow-x:auto); сама сторінка вбік не їде. Було: 3–4 колонки по ~75–100 px, текст у 6–12 рядків */
  .table-wrap table:not(.table-cards):not(.price-table) th:not(:first-child),
  .table-wrap table:not(.table-cards):not(.price-table) td:not(:first-child){min-width:128px}
  /* слова в клітинках — цілі: власні назви («Bratislava», «Копенгаген») не рвуться посеред слова. Раніше тут стояло
     overflow-wrap:anywhere: воно знижує мінімальну ширину колонки до однієї літери, і автоматична розкладка
     віддавала вузьку колонку «Посольство» лише кілька літер. break-word не чіпає мінімальну ширину — колонка не вужча
     за своє найдовше слово, а слово довше за рядок (зрідка) переноситься лише як крайній випадок (28.09, 29.09) */
  .table-wrap td:not(:first-child){overflow-wrap:break-word}
  /* іншомовні назви в <span lang="de|nl|…"> переносимо за словником своєї мови, з дефісом, на будь-якому телефоні —
     «Sterbeurkund|e» без дефіса виглядало як збій; overflow-wrap вище лишається запасом, якщо словника немає (28.09) */
  .table-wrap td:not(:first-child) [lang]{-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:14 7 7}
  /* таблиці документів (.table-cards, data-label у кожній клітинці) — картками: три колонки по ~110px давали
     клітинки на 6–8 рядків (R3-CT-17). Перша клітинка — заголовок картки, решта — «ПІДПИС — текст».
     Горизонтальної прокрутки й далі немає; переноси [lang] вище діють і тут */
  .table-cards,.table-cards tbody{display:block;width:100%}
  .table-cards thead{display:none}
  .table-cards tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}
  .table-cards td{display:block;border:0;padding:3px 0}
  .table-cards td:first-child{font:600 18px/1.3 var(--f-disp);padding-bottom:6px}
  .table-cards td:not(:first-child)[data-label]::before{content:attr(data-label) " — ";font:500 12.5px var(--f-mono);letter-spacing:.04em;color:var(--stone);text-transform:uppercase}
}
@media (max-width:389px){
  /* 320–389: у вузьких колонках довгі українські слова («муніципалітет» на 360) не вміщаються — переносимо за
     складами з дефісом, лише слова від 12 літер (10–11 — це власні назви «Bratislava», «Копенгаген»: їх не ріжемо);
     з 390 слова вміщаються, там зайвих дефісів не додаємо (28.09, 29.09) */
  .table-wrap td:not(:first-child){-webkit-hyphens:auto;hyphens:auto;hyphenate-limit-chars:12 4 4}
}
.row-urn td{background:var(--mist)}
.section-alt .row-urn td{background:var(--paper)}
.row-urn td:first-child{padding-left:10px}

/* ---------------------------------------------------------------- FAQ */
.faq-list{margin:20px 0;border-top:1px solid var(--line-strong);max-width:46rem} /* одна міра колонки з текстом — 46rem (R3-CT-10) */
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{list-style:none;position:relative;display:block;padding:18px 40px 18px 0;cursor:pointer;font:500 18.5px/1.35 var(--f-disp)}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary::before,.faq-list summary::after{content:"";position:absolute;right:6px;top:50%;width:15px;border-top:1.5px solid var(--ink);transition:transform .2s}
.faq-list summary::after{transform:rotate(90deg)}
.faq-list details[open] summary::after{transform:rotate(0)}
.faq-list summary:hover{text-decoration:underline;text-underline-offset:3px}
.faq-list details > p,.faq-list details > div{padding:0 0 18px;margin:0;max-width:44em}
.faq-list + .faq-list{margin-top:-21px;border-top:0}

/* ---------------------------------------------------------------- галерея, фото */
.gallery-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:18px 0}
.gallery-grid figure{margin:0}
.gallery-grid img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--r)}
/* фургони групи (квадрат 1024) у вузьких рамках (3:4 галереї, 4:5 першого екрана) — кадр зміщено праворуч, щоб
   лишились задня частина й напис GRG. Одне джерело на весь сайт, не лише галерея (R3-CT-16; CC-04 28.09).
   van-street: фургон ≈77% ширини кадру при вікні 75% — 85% ділить недостачу порівну між бампером і задніми фарами;
   van-sunset: фургон ≈95% ширини — 72% тримає напис і корму, жертвує частиною передка */
img[src*="/van-sunset."]{object-position:72% 50%}
img[src*="/van-street."]{object-position:85% 50%}
.gallery-grid figcaption{font:500 14px/1.35 var(--f-disp);color:var(--stone);margin-top:6px}
/* кількість колонок — за кількістю фото, щоб не лишалось «сиріт» і порожніх клітинок (28.09):
   рівно 3 фото — 3 в ряд (на телефоні — 1 широке + 2, див. нижче); рівно 2 — 2 в ряд, не на всю ширину */
.gallery-grid:has(>figure:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.gallery-grid:has(>figure:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr));max-width:46rem}
@media (max-width:599px){
  /* непарне останнє фото (5, 7…) — на всю ширину ряду, горизонтальне */
  .gallery-grid>figure:last-child:nth-child(odd):not(:nth-child(3)):not(:first-child){grid-column:1/-1}
  .gallery-grid>figure:last-child:nth-child(odd):not(:nth-child(3)):not(:first-child) img{aspect-ratio:16/10}
  /* рівно 3 фото на телефоні: три в ряд давали колонки ~90–115 px і підписи на 5–6 рядків — тож перше фото на всю
     ширину, горизонтальне, під ним два; без «сироти» і без дрібних колонок (28.09) */
  .gallery-grid:has(>figure:nth-child(3):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-grid:has(>figure:nth-child(3):last-child)>figure:first-child{grid-column:1/-1}
  .gallery-grid:has(>figure:nth-child(3):last-child)>figure:first-child img{aspect-ratio:16/10}
}

/* ---------------------------------------------------------------- соцмережі, TikTok */
.social-grid{display:grid;gap:10px;margin:18px 0}
.social-card{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:var(--ink);text-decoration:none;box-shadow:var(--sh-1)}
.social-card:hover{border-color:var(--line-strong);box-shadow:var(--sh-2)}
.social-avatar{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:0 0 auto}
.social-avatar-ico{display:grid;place-items:center;background:var(--mist)}
.social-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.social-name{display:flex;align-items:center;gap:6px;font:600 17px/1.2 var(--f-disp)}
.social-name .ico{width:16px;height:16px}
.social-handle{font:500 13px var(--f-mono);color:var(--stone);overflow:hidden;text-overflow:ellipsis}
.social-meta{font:500 14.5px/1.3 var(--f-disp);color:var(--stone)}
.tiktok-feed{margin:18px 0 24px}
.tiktok-feed h3{margin:0 0 4px}
.tiktok-feed .tiktok-embed{margin:12px 0 0;max-width:780px;min-width:288px;min-height:200px}
.tiktok-stub{margin:12px 0 0;max-width:780px;padding:14px 16px;border:1px solid var(--line);border-radius:14px;background:var(--mist)}
.tiktok-stub p{margin:0 0 6px}
.tiktok-stub p:last-child{margin-bottom:0}
.tiktok-stub-btn{background:none;border:0;padding:6px 0;font:inherit;color:inherit;text-decoration:underline;cursor:pointer;min-height:36px}
.tiktok-feed [hidden]{display:none}

/* ---------------------------------------------------------------- контакти й карта */
.contact-phone{font:600 33px/1.15 var(--f-disp);letter-spacing:-.01em;margin:0 0 8px}
.contact-phone a,.section p.contact-phone a{text-decoration:none;white-space:nowrap}
.contact-messengers{color:var(--stone)}
.address-main{font:500 19px/1.35 var(--f-disp);margin:18px 0 4px}
.office-kyiv{color:var(--stone);margin-top:14px}
.map-toggle{margin-top:6px}
.map-holder{margin-top:12px;border:1px solid var(--line);border-radius:var(--r-l);overflow:hidden;max-width:46rem}
.map-holder iframe{display:block;width:100%;height:300px;border:0}

/* ---------------------------------------------------------------- «Читайте також» */
.related{border-top:1px solid var(--line-strong);padding-top:16px;max-width:46rem}
.related h3{font:500 13px/1.2 var(--f-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--stone);margin:0 0 6px}
.related ul{list-style:none;margin:0;padding:0}
.related li{margin:0;border-bottom:1px solid var(--line)}
.related a{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;font:500 18px/1.3 var(--f-disp);text-decoration:none}
.related a .ico{width:18px;height:18px;color:var(--stone);transition:transform .15s}
.related a:hover{text-decoration:underline;text-underline-offset:3px}
.related a:hover .ico{transform:translateX(3px);color:var(--ink)}

/* ---------------------------------------------------------------- форма */
.form-block{display:flex;flex-direction:column;gap:20px;max-width:560px;margin-top:12px}
.lead-form{background:#fff;border:1px solid var(--line);border-radius:var(--r-l);padding:22px 18px;box-shadow:var(--sh-2)}
.section-alt .lead-form{border-color:var(--line)}
.field{margin-bottom:14px}
.field label{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font:500 16px/1.25 var(--f-disp);margin-bottom:7px}
.field label span{font-weight:500;color:var(--stone);font-size:14px}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:12px 14px;font:400 17px/1.3 var(--f-text);color:var(--ink);background:var(--paper);border:1px solid var(--edge);border-radius:10px;transition:border-color .15s,box-shadow .15s}
.field select{appearance:none;-webkit-appearance:none;padding-right:40px;background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 14px) 50%;background-size:6px 6px;background-repeat:no-repeat}
.field textarea{min-height:96px;resize:vertical}
.field input::placeholder,.field textarea::placeholder{color:#6E7A7F}
.field input:focus,.field select:focus,.field textarea:focus{outline:2px solid var(--ink);outline-offset:1px;border-color:var(--ink);box-shadow:0 0 0 5px rgba(31,46,58,.08)}
.field input[aria-invalid="true"]{border-color:var(--err-ink)}
.field-error{display:block;min-height:0;margin-top:4px;font:500 14px/1.3 var(--f-disp);color:var(--err-ink)}
.field-error:empty{display:none}
.hp-field{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.form-error{background:var(--err-bg);color:var(--err-ink);padding:12px 14px;border-radius:10px;font:500 15px/1.4 var(--f-disp)}
.form-note{font-size:14.5px;color:var(--stone);margin:12px 0 0;line-height:1.4}
.form-consent{font-size:13.5px;color:var(--stone);margin:6px 0 0;line-height:1.4}
.form-success{background:var(--ok-bg);color:var(--ok-ink);border-radius:var(--r-l);padding:18px 16px;font:500 17px/1.45 var(--f-disp)}
.form-success p{margin:0}
.form-success:focus{outline:3px solid var(--ink);outline-offset:2px}
.form-urgent{order:-1}
.form-alt{font:500 16px var(--f-disp);margin:0 0 8px}

/* ---------------------------------------------------------------- футер */
.ftr{background:var(--night);color:var(--on-ink-2);padding:52px 0 26px;font-size:16px}
.ftr-top{display:grid;gap:28px}
.ftr-k{font:500 13px var(--f-mono);text-transform:uppercase;letter-spacing:.08em;margin:0 0 4px}
.ftr-phone{display:inline-block;font:600 33px/1.15 var(--f-disp);letter-spacing:-.01em;color:var(--amber);text-decoration:none;white-space:nowrap}
.ftr-phone:hover{color:var(--amber-hi)}
.ftr-phone-ua{margin:6px 0 0;font-size:15px;color:inherit;opacity:.85}.ftr-phone-ua a{color:inherit;white-space:nowrap}
.ftr-small{margin:6px 0 14px;font-size:15px}
.ftr h3{color:var(--on-ink);font-size:17.5px;font-weight:600;margin:0 0 12px}
.ftr p{margin:0 0 8px}
.footer-list{list-style:none;margin:0;padding:0;display:grid;gap:2px}
.footer-list li{margin:0}
.footer-list a{display:inline-flex;align-items:center;gap:8px;min-height:36px;color:var(--on-ink);text-decoration:none;border-bottom:1px solid transparent}
.footer-list a:hover{border-bottom-color:var(--on-ink-2)}
.ftr-soc .ico{width:17px;height:17px}
.footer-bottom{margin-top:32px;padding-top:16px;border-top:1px solid var(--ink-3);display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px;font-size:14px}
.footer-bottom a,.footer-consent-btn{color:var(--on-ink-2)}
.footer-consent-btn{background:none;border:0;padding:6px 0;font:inherit;text-decoration:underline;cursor:pointer;min-height:36px}
.footer-consent-btn:hover,.footer-bottom a:hover{color:var(--on-ink)}
/* політика й cookie — одна пара, «Налаштування cookie» не переноситься сам на новий рядок (28.09) */
.ftr-legal{display:inline-flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.ftr-legal > *{white-space:nowrap}

/* ---------------------------------------------------------------- нижня панель (телефон) */
.sticky-bar{position:fixed;left:0;right:0;bottom:0;z-index:50;display:flex;gap:6px;padding:6px 8px calc(6px + env(safe-area-inset-bottom,0px));background:var(--night);border-top:1px solid var(--ink-3);align-items:center}
.sticky-call{flex:1 1 auto;display:flex;align-items:center;justify-content:center;gap:10px;min-height:52px;border-radius:var(--r);background:var(--amber);color:var(--ink);text-decoration:none;font:600 17.5px/1 var(--f-disp);white-space:nowrap}
.sticky-call .ico{width:21px;height:21px}
.sticky-ico{flex:0 0 52px;display:grid;place-items:center;min-height:52px;border-radius:50%;color:var(--on-ink);border:1px solid var(--ink-3)}
.sticky-ico .ico{width:22px;height:22px}

/* ---------------------------------------------------------------- згода на cookie */
.consent{position:fixed;left:8px;right:8px;bottom:calc(var(--dock) + 8px + env(safe-area-inset-bottom,0px));z-index:45;display:flex;align-items:center;gap:10px;padding:8px 8px 8px 12px;background:#fff;color:var(--ink);border:1px solid var(--line);border-radius:14px;box-shadow:0 12px 32px -10px rgba(31,46,58,.26);font:500 13.5px/1.3 var(--f-disp)}
.consent[hidden],.consent.is-suspended{display:none}
.consent-text{margin:0;flex:1 1 auto;min-width:0}
.consent-text a{color:var(--ink)}
.consent-actions{display:flex;gap:6px;flex:0 0 auto}
.consent-btn{min-height:40px;padding:6px 10px;border-radius:10px;border:1px solid var(--edge);background:var(--paper);font:500 14px var(--f-disp);color:var(--ink);cursor:pointer}
.consent-btn-primary{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
.consent-btn:hover{border-color:var(--ink)}

/* ---------------------------------------------------------------- дуже вузькі екрани (320) */
@media (max-width:359px){
  :root{--gut:14px;--fs-h1:29px;--fs-h2:25px}
  .hdr-in{gap:8px}
  .hdr-act{gap:5px}
  .brand-xq{font-size:18px}
  .brand-ov{font-size:9px;letter-spacing:.18em}
  .btn-call{gap:10px;padding-right:12px}
  .btn-call-txt b{font-size:20px}
  .msg{font-size:13.5px;gap:4px;padding:8px 3px}
  .msg .ico{width:16px;height:16px}
  .ftr-phone,.contact-phone{font-size:28px}
  .sticky-ico{flex-basis:46px;min-height:46px}
  .sticky-call{font-size:15px;gap:6px;padding:0 8px}
  .hero{padding-top:20px}
  .hero h1{font-size:28px;margin-bottom:12px}
  .hero .lede{font-size:16.5px;line-height:1.5}
  .t-name{font-size:17px}
  .t-price{font-size:18.5px}
  .c-price b{font-size:36px}
  .consent{flex-wrap:wrap}
  .consent-actions{width:100%}
  .consent-btn{flex:1}
  /* переноси з дефісом у таблицях на 320 — див. @media (max-width:389px) біля .table-wrap */
}

/* ---------------------------------------------------------------- планшет */
@media (min-width:600px){
  .brand-cities{display:inline}
  .bg-cities{display:none}
  .bg-serv{display:inline}
  .tiles,.price-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .gallery-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .gallery-grid:has(>figure:nth-child(3n):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
  .social-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .company-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .service-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px}
  .doc-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}
  .urgent-steps{grid-template-columns:repeat(3,minmax(0,1fr))}
  .live-t{display:flex}
  .ftr-top{grid-template-columns:repeat(3,minmax(0,1fr))}
  .ftr-call{grid-column:1/-1}
  .page-hero-photo img{aspect-ratio:3/2}
}
@media (min-width:600px) and (max-width:899px){
  .brand-xq{font-size:24px}
  .brand-group{font-size:12.5px;margin-top:4px}
  .brand-ov{font-size:10px}
  /* планшет: у сітці з 2 колонок непарне останнє фото чи картка — на весь ряд, без порожньої клітинки */
  .gallery-grid>figure:last-child:nth-child(odd):not(:nth-child(3n)):not(:first-child){grid-column:1/-1}
  .gallery-grid>figure:last-child:nth-child(odd):not(:nth-child(3n)):not(:first-child) img{aspect-ratio:16/10}
  /* соцмережі: непарна остання картка — тієї ж ширини, що й решта, по центру ряду (не на весь ряд) */
  .social-grid>:last-child:nth-child(odd):not(:first-child){grid-column:1/-1;justify-self:center;width:calc((100% - 10px) / 2)}
  /* те саме для карток послуг і третьої колонки документів (R3-CT-12) */
  .service-grid>:last-child:nth-child(odd):not(:first-child){grid-column:1/-1}
  .doc-cols>.doc-col:nth-child(3):last-child{grid-column:1/-1}
}

/* ---------------------------------------------------------------- комп'ютер */
@media (min-width:900px){
  :root{--gut:32px;--dock:0px;--sec:96px;--fs-h2:38px;--fs-h1:50px}
  body{font-size:18px}
  html{scroll-padding-top:136px}
  .sticky-bar{display:none}
  .consent{left:auto;right:24px;bottom:24px;max-width:440px}
  /* шапка */
  .hdr-in{min-height:76px}
  .brand-xq{font-size:30px}
  .brand-group{font-size:13.5px;margin-top:5px;color:var(--on-ink)}
  .brand-ov{font-size:11px;margin-bottom:5px}
  .hdr-act{gap:8px}
  .hdr-lang{width:42px;height:42px}
  .hdr-lang-sw>summary.hdr-lang{line-height:42px}
  .hdr-msgs{display:flex;gap:4px;padding-right:6px;margin-right:4px;border-right:1px solid var(--ink-3)}
  .hdr-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;color:var(--on-ink-2)}
  .hdr-ico:hover{color:var(--on-ink);background:var(--ink-2)}
  .hdr-form{display:inline-flex;align-items:center;min-height:52px;padding:0 18px;border:1px solid var(--ink-3);border-radius:999px;font:500 15.5px var(--f-disp);text-decoration:none;color:var(--on-ink);white-space:nowrap}
  .hdr-form:hover{border-color:var(--on-ink-2)}
  .hdr-call{width:auto;height:52px;display:flex;align-items:center;gap:10px;padding:0 20px 0 14px;border-radius:999px}
  .hdr-call-txt{display:flex;flex-direction:column;font-family:var(--f-disp);line-height:1.05}
  .hdr-call-txt b{font-size:19px;font-weight:700;white-space:nowrap}
  .hdr-call-txt small{font-size:12.5px;font-weight:500}
  .burger{display:none}
  .nav{display:block}
  .nav-list{flex-direction:row;flex-wrap:wrap;gap:0 4px;padding:0}
  .nav-list a{padding:11px 12px;font-size:16px;border:0;color:var(--on-ink-2);border-bottom:2px solid transparent}
  .nav-list a:hover{color:var(--on-ink)}
  .nav-list a[aria-current]{color:var(--on-ink);border-bottom-color:var(--amber)}
  .nav-list li:first-child a{padding-left:0}
  .live-in{padding-top:10px;padding-bottom:10px}
  .live-row{margin-right:0;padding-right:0;-webkit-mask-image:none;mask-image:none;overflow:visible;flex-wrap:wrap;gap:6px}
  .live-c{padding:5px 10px 5px 8px;column-gap:7px}
  .live-c span{font-size:11.5px}
  .live-t{font-size:12px;letter-spacing:0}
  /* головна */
  .hero{padding:48px 0 80px}
  .hero-grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);grid-template-rows:auto auto auto 1fr;grid-template-areas:"head map" "body map" "form map" "form map";gap:0 56px;align-items:start}
  .hero-txt,.hero-head{padding-top:8px}
  .hero-head{grid-area:head}
  .hero-body{grid-area:body}
  .hero-form{grid-area:form;margin-top:24px}
  /* обидві колонки — своєї природної висоти, від верху сітки. Розтягування (R3-CT-14) давало порожню смугу до 90px
     у картці форми (1150–1199) і ~120px повітря довкола карти (900–1000) — R4-CT-11, 28.09 */
  .hero-grid > .hero-form{align-self:start}
  .hero-grid > .hero-map{grid-area:map;align-self:start;display:flex;flex-direction:column;gap:18px}
  .hero-grid > .hero-map > .mapbox{margin-top:0}
  .hero-photo{margin:0}
  .hero-photo img{aspect-ratio:21/8}
  /* підпис фото — під фото, як на телефоні: плашкою поверх він лежав на кузові й передньому колесі (R3-CT-15) */
  .hero h1{font-size:52px;letter-spacing:-.02em;line-height:1.1}
  .hero .lede{font-size:20px}
  .hero-map{margin-top:0}
  .mapbox{margin:0;border-radius:22px;padding:28px 32px 24px}
  .mapbox-h h2{font-size:26px}
  /* решта сторінок */
  .page-hero{padding:24px 0 80px}
  .page-hero h1{font-size:var(--fs-h1);letter-spacing:-.02em;line-height:1.1}
  .page-hero-grid{grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:start}
  .page-hero-photo img{aspect-ratio:4/5;max-height:560px}
  .c-price b{font-size:54px}
  .leg{padding:30px 30px 28px;margin-top:8px;border-radius:22px}
  /* двоколонковий перший екран: кнопки, форма, ціна й лід доходять до краю колонки — один правий край (R3-CT-03);
     в одноколонковому (питання, ціни, статті) лишається 560px — інакше кнопки розтяглися б на 1136px */
  .hero .hero-act,.page-hero-grid .hero-act,.page-hero-grid .rf-block,
  .page-hero-grid .page-hero-txt > .c-price,.page-hero-grid .page-hero-txt > p:not(.kicker){max-width:none}
  .page-hero .leg{position:sticky;top:136px}
  .tiles{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
  /* «з України за кордон»: 6 плиток — два повні ряди по 3; правило «сироти» вище їх не чіпає (R4-CT-03) */
  .tiles.tiles-out{grid-template-columns:repeat(3,minmax(0,1fr))}
  .price-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
  .t-link{padding:18px 16px 12px}
  .t-name{font-size:21px}
  .t-price{font-size:24px}
  .t-btn{margin:0 12px 12px}
  /* смуги */
  .band{padding-bottom:72px}
  .band-in{display:grid;grid-template-columns:minmax(0,1fr) 420px;gap:0 64px;align-items:center}
  .band-route{grid-column:1/-1;margin-bottom:48px}
  .cta-title{font-size:36px}
  .band .cta-sub{font-size:19px;margin:0}
  .owner{padding:64px 0}
  .owner-in{grid-template-columns:96px minmax(0,1fr) 420px;gap:0 28px}
  .owner-img{width:96px;height:96px}
  .owner-act{grid-column:auto;margin:0}
  .owner .cta-title{font-size:30px}
  .urgent-band{padding:72px 0}
  /* дії — та сама сітка на 3 колонки, що й кроки над ними: однакова висота (64px) і спільні краї (28.09) */
  .urgent-act{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:none;align-items:stretch}
  .urgent-act .btn-call{width:100%;max-width:none}
  .urgent-act .msg-row{max-width:none}
  .urgent-act .msg,.urgent-act > .btn-line{min-height:64px}
  .urgent-act > .btn{width:100%}
  /* месенджерам тут дістається третина ширини (85–118px): значок над підписом, інакше «WhatsApp» вилазив за рамку на 900–1060 (28.09) */
  .urgent-act .msg{flex-direction:column;gap:5px;padding:8px 4px}
  /* станції горизонтально */
  .stations{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:28px;margin-top:40px}
  .stations li{padding:34px 0 0 0}
  .stations li::before{left:0;top:0}
  .stations li::after{left:18px;right:-28px;top:7px;bottom:auto;border-left:0;border-top:1px dashed var(--line-strong)}
  .stations li:last-child::before{left:0;top:-2px}
  /* інше */
  /* картки послуг і соцмереж — сітка на 6 доріжок, картка займає 2 (ті самі 3 колонки); якщо карток 2, 4 чи 5 —
     останній ряд ділиться навпіл (по 3), без дірки й без розтягнутої вліво картки (R3-CT-12, 28.09) */
  .service-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:36px 32px}
  .service-grid>*,.social-grid>*{grid-column:span 2}
  .service-grid:has(>:nth-child(2):last-child)>*,.service-grid:has(>:nth-child(4):last-child)>*,
  .social-grid:has(>:nth-child(2):last-child)>*,.social-grid:has(>:nth-child(4):last-child)>*,
  .service-grid>:nth-last-child(2):nth-child(3n+1),.service-grid>:last-child:nth-child(3n+2){grid-column:span 3}
  .service-grid>:last-child:nth-child(3n+1):not(:first-child):not(:nth-child(4)){grid-column:1/-1}
  /* соцмережі: картки завжди однієї ширини (29.09). П'ять карток — 3 + 2: двоє нижніх не розтягуються на по 3 доріжки
     (виглядали ширшими за верхні), а стоять під верхнім рядом по центру, на тих самих 2 доріжках. Той самий принцип
     для 7 і 8 (3+3+1, 3+3+2) — на першій вільній доріжці по центру, а не на весь ряд */
  .social-grid:has(>:nth-child(5):last-child)>:nth-child(4),
  .social-grid:has(>:nth-child(8):last-child)>:nth-child(7){grid-column:2/span 2}
  .social-grid:has(>:nth-child(5):last-child)>:nth-child(5),
  .social-grid:has(>:nth-child(8):last-child)>:nth-child(8){grid-column:4/span 2}
  .social-grid:has(>:nth-child(7):last-child)>:nth-child(7){grid-column:3/span 2}
  .doc-cols{grid-template-columns:repeat(2,minmax(0,1fr));gap:48px}
  /* три колонки документів (напр. «Що робити»: «Від консульства України» стояла сама) — три рівні колонки */
  .doc-cols:has(>.doc-col:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
  .gallery-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
  /* 4 в ряд за замовчуванням; 3 — коли фото кратні 3, але не 4 (6, 9, 15); кратні 4 (8, 12) — знову 4 */
  .gallery-grid:has(>figure:nth-child(3n):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
  .gallery-grid:has(>figure:nth-child(4n):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}
  .social-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
  .founder-block{grid-template-columns:160px minmax(0,1fr);gap:28px}
  .founder-photo-img{width:160px;height:160px}
  /* фото Олега Карпи — 100×100 у файлі: не розтягуємо в 1,6 раза (R4-CT-10) */
  .founder-photo-img[src*="oleg-karpa"]{width:100px;height:100px}
  .founder-block:has(img[src*="oleg-karpa"]){grid-template-columns:100px minmax(0,1fr)}
  .contact-phone{font-size:42px}
  /* форма: текст ліворуч, картка праворуч (лише секція заявки) */
  .lead-form{padding:32px}
  /* ряди: кілька auto під текст ліворуч + 1fr наприкінці — висота картки форми йде в останній ряд,
     а не розтягує проміжки між заголовком і абзацами */
  #zayavka > .wrap:has(> .form-block){display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-rows:repeat(6,auto) 1fr;column-gap:64px;align-items:start}
  #zayavka > .wrap:has(> .form-block) > *{grid-column:1}
  #zayavka > .wrap:has(> .form-block) > .form-block{display:contents}
  #zayavka > .wrap:has(> .form-block) .lead-form,#zayavka > .wrap:has(> .form-block) .form-success{grid-column:2;grid-row:1 / -1;align-self:start}
  #zayavka > .wrap:has(> .form-block) .form-urgent{grid-column:1;order:0;margin-top:8px}
  /* без блоку «Терміново?» ліворуч лишаються лише заголовок і рядок тексту — ставимо їх по центру висоти картки
     форми (порожні 1fr зверху й знизу), а не вгорі з ~500px порожнечі під ними (R3-CT-19) */
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)){grid-template-rows:1fr repeat(5,auto) 1fr}
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)) > :nth-child(1){grid-row:2}
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)) > :nth-child(2){grid-row:3}
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)) > :nth-child(3){grid-row:4}
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)) > :nth-child(4){grid-row:5}
  #zayavka > .wrap:has(> .form-block):not(:has(.form-urgent)) > :nth-child(5){grid-row:6}
  /* футер */
  .ftr-top{grid-template-columns:1.3fr 1fr 1fr;gap:36px}
  .ftr-call{display:grid;grid-template-columns:auto minmax(0,420px);grid-template-rows:auto auto auto;column-gap:48px;align-items:end;padding-bottom:28px;border-bottom:1px solid var(--ink-3)}
  .ftr-call .ftr-k,.ftr-call .ftr-phone,.ftr-call .ftr-small{grid-column:1}
  .ftr-call .msg-row{grid-column:2;grid-row:1 / 4;align-self:center;margin:0;width:100%}
  .ftr-phone{font-size:42px}
}
@media (min-width:1100px){
  /* компанії групи — чотири в ряд лише тут: вужче кнопка «Сайт …» не влазить в один рядок (R3-CT-05) */
  .company-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (min-width:1200px){
  .live-in{gap:14px}
}
@media (max-width:1199px) and (min-width:900px){
  /* 900–1199: 52px H1 займав 4 рядки, ліва колонка першого екрана виходила на ~200px нижче схеми (R3-CT-14).
     Сходинка двома кроками: 42px до 1099, 48px на 1100–1199 — з 42px там ліва колонка ставала нижчою за схему
     і розтягнута картка форми мала порожню смугу до 91px під текстом згоди (R3-CT-14, коло 3) */
  .hero h1{font-size:42px}
  .urgent-act .msg{font-size:14px}
  .live-t{display:none}
  .hdr-form{display:none}
  .brand-xq{font-size:26px}
  .brand-group{font-size:12.5px;margin-top:4px}
  .brand-ov{font-size:10px;margin-bottom:4px}
}
@media (min-width:900px) and (max-width:959px){
  /* 900–959: у колонці ~325px і 42px H1 ставав у 4 рядки («в Україну» окремо) — ліва колонка на ~250px вища за схему */
  .hero h1{font-size:38px}
}
@media (min-width:1100px) and (max-width:1199px){
  .hero h1{font-size:48px}
}
@media (min-width:900px) and (max-width:1199px){
  /* коли ліва колонка вища (900–1100, EN ширше), зайву висоту правої колонки ділять фото й схема: фото росте
     від 21:8 до власної пропорції кадру 1024×540 (не далі — інакше обрізало б фургон з боків), решта — довкола
     карти. Раніше вся різниця йшла в схему: карта «плавала» з ~130px порожнечі зверху й знизу (R3-CT-14, коло 3).
     figure і picture «розчиняються» (display:contents): рости має сама картинка — як flex-елемент колонки вона впирається
     в max-height, і решту висоти забирає схема; ріст самої figure лишав би порожнечу між фото й підписом. */
  .hero-grid > .hero-map{container-type:inline-size}
  .hero-grid > .hero-map > .hero-photo,.hero-grid > .hero-map > .hero-photo > picture{display:contents}
  /* <source> інакше стає порожнім flex-елементом і додає ще один gap 18px над фото (вибір webp від display не залежить) */
  .hero-grid > .hero-map > .hero-photo source{display:none}
  .hero-grid > .hero-map > .hero-photo img{flex:1 1 auto;min-height:0;max-height:calc((100vw - 2 * var(--gut) - 56px) * .3076);max-height:52.7cqw}
  /* колонка має gap 18px — підпис лишається на 8px під фото, як і раніше */
  .hero-grid > .hero-map > .hero-photo figcaption{margin-top:-10px}
}


/* ---------------------------------------------------------------- відгуки (D97, B4, 10.10.2026)
   Смуга «оцінка + кількість + кнопка» — на всіх 5 головних; картки з текстами — лише на uk-головній (partials/reviews.html).
   Лише токени сайту. Зірки — --amber-text (яскравий --amber зарезервовано під дзвінок і дім). */
/* ---------- Варіант 1 · «Смуга довіри» (без цитат) ---------- */
.rv-strip{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;padding:18px 20px;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1)}
.rv-strip .rv-score{font:700 var(--fs-h1)/1 var(--f-disp);color:var(--ink)}
.rv-strip .rv-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
.rv-strip .rv-src{font:500 var(--fs-s)/1.3 var(--f-disp);color:var(--stone)}
.rv-strip .btn{margin-left:auto}
@media (max-width:560px){.rv-strip .btn{margin-left:0;width:100%}}

/* ---------- спільне: зірки ---------- */
.rv-stars{display:inline-flex;gap:2px;color:var(--amber-text);line-height:0}
.rv-stars svg{width:20px;height:20px;fill:currentColor}

/* ---------- Варіант 2 · «Картки відгуків» ---------- */
.rv-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:8px 16px;margin-bottom:22px}
.rv-head h2{margin:0}
.rv-head .rv-sum{display:inline-flex;align-items:center;gap:10px;font:600 var(--fs-m)/1.2 var(--f-disp);color:var(--ink)}
.rv-grid{display:grid;gap:16px;grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}
.rv-card{display:flex;flex-direction:column;gap:12px;margin:0;padding:20px;background:var(--paper);
  border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--sh-1)}
.rv-card blockquote{margin:0;font:400 var(--fs-m)/1.55 var(--f-text);color:var(--body-2);
  white-space:pre-line}
.rv-card figcaption{margin-top:auto;display:flex;flex-direction:column;gap:2px;font:500 var(--fs-s)/1.3 var(--f-disp);color:var(--ink)}
.rv-card figcaption span{font-weight:400;font-size:var(--fs-xs);color:var(--stone)}
.rv-foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:20px}
.rv-foot .rv-note{font:400 var(--fs-xs)/1.4 var(--f-disp);color:var(--stone)}

/* ---------------------------------------------------------------- рух і друк */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition:none!important;animation:none!important;scroll-behavior:auto!important}
}
@media print{
  .hdr,.live,.sticky-bar,.consent,.band,.owner,.urgent-act,.form-block,.ftr .msg-row{display:none!important}
  body{padding:0;font-size:12pt}
}


/* ---------------------------------------------------------------- коротка форма «Звідки — Куди — Телефон» (27.09) */
.rf-block{max-width:560px}
.lead-form.route-form{padding:18px 16px 14px;border-color:var(--line-strong)}
.rf-title{margin:0 0 12px;display:flex;flex-direction:column;gap:2px}
.rf-title b{font:600 20px/1.2 var(--f-disp);color:var(--ink)}
.rf-title span{font:500 15px/1.35 var(--f-disp);color:var(--stone)}
.rf-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 10px}
.rf-grid .field{margin-bottom:10px}
.rf-phone,.rf-submit{grid-column:1/-1}
/* 320px: «Країна, місто» / «Country, city» не вміщались у пів ширини (94px на 110px тексту) — поля одне під одним (28.09) */
@media (max-width:359px){
  .rf-grid{grid-template-columns:minmax(0,1fr)}
}
.rf-submit{width:100%;min-height:54px}
.rf-note{margin:10px 0 0;font:500 12.5px/1.35 var(--f-disp);color:var(--stone)}
.rf-note a{color:var(--stone)}
.route-form .form-error{margin:0 0 10px}
.page-hero .rf-block{margin-top:18px}
.page-hero-form .rf-block{margin-top:0}

/* ---------------------------------------------------------------- смуга фактів довіри (27.09) */
.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper)}
.ts-list{list-style:none;margin:0;padding:20px 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 16px}
.ts-list li{margin:0;display:flex;flex-direction:column;gap:3px;padding-left:12px;border-left:2px solid var(--amber)}
.ts-list b{font:600 19px/1.15 var(--f-disp);color:var(--ink)}
.ts-list span{font:500 14px/1.3 var(--f-disp);color:var(--stone)}
@media (max-width:899px){
  /* непарна кількість фактів: останній на весь ряд, а не сам у півряду (R4-CT-05) */
  .ts-list li:last-child:nth-child(odd){grid-column:1/-1}
}

/* ---------------------------------------------------------------- «Передзвоніть мені» (27.09) */
.hdr-form .ico{width:18px;height:18px;margin-right:8px}
/* «Заявка» у нижній панелі — значок форми з підписом, щоб не плутати з «Подзвонити» (28.09) */
.sticky-cb{border-color:var(--amber);color:var(--amber);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;border-radius:var(--r);padding:0 2px}
.sticky-cb .ico{width:19px;height:19px}
.sticky-lbl{font:600 10.5px/1 var(--f-disp);letter-spacing:0;white-space:nowrap}
.cb-dialog{padding:0;border:0;border-radius:18px;width:calc(100% - 32px);max-width:420px;background:#fff;color:var(--ink);box-shadow:0 24px 64px -16px rgba(16,34,48,.45)}
.cb-dialog::backdrop{background:rgba(16,34,48,.55)}
.cb-in{position:relative;padding:26px 22px 20px}
.cb-in h2{font-size:26px;margin:0 0 6px;padding-right:44px}
.cb-sub{margin:0 0 16px;color:var(--body-2);font-size:16px;line-height:1.45}
.lead-form.cb-form{border:0;box-shadow:none;padding:0;background:transparent}
.cb-close{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;border:0;background:var(--mist);color:var(--ink);font:400 26px/1 var(--f-disp);cursor:pointer}
.cb-close:hover{background:var(--dawn)}
@media (max-width:429px){
  .sc-247{display:none}
  .sticky-ico{flex-basis:48px;min-height:48px}
}
/* 320–374px: п'ять кнопок панелі мають уміститись (на 320 Telegram виїжджав за край екрана на ~34px,
   на 360 — упирався в край), 28.09 */
@media (max-width:374px){
  .sticky-bar{gap:4px;padding-left:6px;padding-right:6px}
  .sticky-ico{flex-basis:44px;min-height:46px}
  .sticky-call{font-size:14.5px;gap:5px;padding:0 6px;min-width:0}
  .sticky-call .ico{width:18px;height:18px}
  .sticky-lbl{font-size:10px}
}
@media (min-width:900px){
  .trust-strip .ts-list{grid-template-columns:repeat(6,minmax(0,1fr));padding:26px 0;gap:20px}
  /* 5 фактів (сторінки «з України» — без «N країн з цінами»): 5 колонок, без порожньої шостої (R4-CT-05) */
  .trust-strip .ts-list:has(>li:nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}
  .lead-form.route-form{padding:22px 22px 18px}
  .ts-list b{font-size:20px}
  .ts-list span{font-size:15px}
}
@media (min-width:900px) and (max-width:1199px){
  /* 900–1199: шоста частина рядка вужча за «виробництво» 20px — слово рвалося «виробництв|о»; тут три колонки
     у два ряди (28.09) */
  .trust-strip .ts-list,.trust-strip .ts-list:has(>li:nth-child(5):last-child){grid-template-columns:repeat(3,minmax(0,1fr));gap:20px 28px}
}

/* ---------------------------------------------------------------- «Команда»: три ролі з фото (28.09) */
.team-roles{list-style:none;margin:20px 0 32px;padding:0;display:grid;gap:14px}
.team-roles li{display:grid;grid-template-columns:38% minmax(0,1fr);gap:14px;align-items:center;margin:0}
.team-roles picture,.team-roles img{display:block;width:100%}
.team-roles img{height:auto;aspect-ratio:4/3;object-fit:cover;border-radius:var(--r)}
.team-roles p{margin:0;display:flex;flex-direction:column;gap:4px}
.team-roles b{font:600 18px/1.25 var(--f-disp);color:var(--ink)}
.team-roles span{font:500 15px/1.4 var(--f-disp);color:var(--stone)}
@media (min-width:900px){
  .team-roles{grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
  /* фото зверху, підпис одразу під ним: зайва висота ряду — вниз картки, а не в ряд фото (R3-CT-06; ролі починались на 1008/1042/1032) */
  .team-roles li{grid-template-columns:minmax(0,1fr);grid-template-rows:auto 1fr;align-content:start;align-items:start}
  .team-roles b{font-size:20px}
}

/* ---- Карта «Дорога додому» v8 (07.10, D89; render_routemap у build.py, геометрія — src/routemap_geom.py) ----
   Візуальна мова «v4» власника — карти, що зараз на живому /xq/ (3c30b406; qa/map-v7/owner-ref-v4-lines.png), дослівно:
   море — тло картки (--dawn зі світлом .mapbox), суходіл — сірий напівпрозорий (stone 16 %), кордони — тонкі лінії кольору
   паперу, Україна — теплий пісочний; від кожної країни — тонка сіра плавна дуга #8A9CA5 (0,85 одиниці на viewBox 528,5 → 1,6
   на 1000), білі кружки країн з сірим обідком, коди країн моноширинним шрифтом з обведенням кольору тла; ціль — ОДНА
   бурштинова точка з ореолом у центрі України й підписом «Україна» (D89; міст на карті немає — D82). Переліт далекої країни —
   та сама дуга пунктиром (у v4 — .mfar, пунктир 2 3 → 4 5). Розміри — в одиницях карти (у SVG px CSS = одиниця viewBox), тож
   масштабуються з картою, як у v4. Кеглі підписів — за шириною САМОЇ карти (@container), а не вікна; мінімум на екрані
   ≈ 11 px (аудиторія 45–70): повний режим 520–599 px — .mk 21,5 (розкладка рахується для нього: routemap_geom.CODE_FONT),
   600–739 — 19, ≥ 740 — 16; вузька карта (< 520 px; routemap_geom.COMPACT_W) — окрема розкладка: .mkc/.mtc 31 (< 360 px —
   40: routemap_geom.CODE_FONT_COMPACT), більші точки, частина підписів і список країн під картою (.map-list). Змінили кеглі
   чи шрифт — node tools/measure_map_font.js, збірка (перерахує src/data/routemap_layout.json), tests/check_routemap*. */
.mapbox{container-type:inline-size}
.rmap{width:100%;height:auto;display:block;overflow:hidden;--air-da:4 5}
.rmap .m-land{fill:var(--stone);fill-opacity:.16}
.rmap .m-ua{fill:var(--ua-land)}
.rmap .m-bd{fill:none;stroke:var(--paper);stroke-width:1.5px;stroke-linejoin:round;stroke-linecap:round}
.rmap .m-lines path{fill:none;stroke:#8A9CA5;stroke-width:1.6px;stroke-linecap:round;opacity:.8}
.rmap .m-lines .air{stroke-dasharray:var(--air-da);stroke-linecap:butt}
.rmap .m-lead{fill:none;stroke:#6C7B83;stroke-width:1.1px}
.rmap .mc{r:6.4px;fill:var(--paper);stroke:#6C7B83;stroke-width:2.3px}
.rmap .mhit{r:15px;fill:transparent;stroke:none}
.rmap .m-halo{r:22.7px;fill:rgba(237,180,92,.16);stroke:var(--amber);stroke-width:1.9px;opacity:.9}
.rmap .m-home{r:11.4px;fill:var(--amber)}
.rmap text{paint-order:stroke;stroke-linejoin:round}
.rmap .mk,.rmap .mkc{font:500 21.5px var(--f-mono);fill:var(--stone);letter-spacing:.04em;stroke:#E8EDEB;stroke-width:5.7px}
.rmap .mt,.rmap .mtc{font:500 24px var(--f-mono);fill:var(--ink);letter-spacing:.04em;stroke:var(--ua-land);stroke-width:5.7px}
.rmap .mkc,.rmap .mtc{display:none}
.rmap .mlink{cursor:pointer;text-decoration:none}
.rmap .mlink:hover :is(.mk,.mkc),.rmap .mlink:focus-visible :is(.mk,.mkc){fill:var(--amber-text)}
.rmap .mlink:hover .mc,.rmap .mlink:focus-visible .mc{fill:var(--amber);stroke:var(--amber-deep)}
.rmap .mlink:focus-visible{outline:none}
.rmap .mlink:focus-visible .mhit{stroke:var(--amber-deep);stroke-width:1.5px;fill:rgba(237,180,92,.14)}
@container (min-width:600px){
  .rmap .mk{font-size:19px}.rmap .mt{font-size:21px}
}
@container (min-width:740px){
  .rmap .mk{font-size:16px}.rmap .mt{font-size:18px}
}
/* вузька карта (телефон; вікна 900–1024 px, де карта — у правій колонці): своя розкладка — більші підписи (частина; далекі —
   де вміщаються), більші точки й зони дотику; під картою — список усіх країн (він же рівноцінна заміна дрібним точкам,
   WCAG 2.5.8). Товщина ліній — та сама на екрані, що й на широкій карті (≈ 0,9 px) */
@container (max-width:519.98px){
  .rmap .mk,.rmap .mt,.rmap .m-lead{display:none}
  .rmap .mkc,.rmap .mtc{display:inline}
  .rmap .mkc,.rmap .mtc{font-size:31px;stroke-width:8px}
  .rmap .mc{r:9px;stroke-width:3px}
  .rmap .mhit{r:30px}
  .rmap .m-halo{r:28px;stroke-width:2.6px}
  .rmap .m-home{r:15px}
  .rmap .m-lines path{stroke-width:2.6px}
  .rmap .m-bd{stroke-width:2px}
  .rmap{--air-da:7 8}
}
@container (max-width:359.98px){
  .rmap .mkc,.rmap .mtc{font-size:40px}
  .rmap .m-lines path{stroke-width:3px}
  .rmap{--air-da:8 9}
}
/* поява ліній: дуги «пролягають» від країни до цілі (--d — затримка, --t — тривалість, рахує build.py: довгі починають
   раніше, тож усі приходять разом); app.js додає .anim, коли карта входить в екран; без JS чи з reduced-motion — одразу
   кінцевий стан. Пунктир перельоту (.air) не «пролягає» (пунктир і поява тримаються на тому самому stroke-dasharray), а
   проявляється */
@media (prefers-reduced-motion:no-preference){
  .rmap.anim .m-lines path{stroke-dasharray:1 1;stroke-dashoffset:1}
  .rmap.anim.in .m-lines path{animation:m-draw var(--t,1s) ease-out forwards;animation-delay:var(--d,0s)}
  .rmap.anim .m-lines .air{stroke-dasharray:var(--air-da);stroke-dashoffset:0;opacity:0}
  .rmap.anim.in .m-lines .air{animation:m-fade var(--t,1s) ease-out forwards;animation-delay:var(--d,0s)}
}
@keyframes m-draw{to{stroke-dashoffset:0}}
@keyframes m-fade{to{opacity:.8}}
@media (forced-colors:active){
  .rmap .m-lines path{stroke:CanvasText}
  .rmap .mc{fill:Canvas;stroke:CanvasText}
}
.lg-dot{width:10px;height:10px;border-radius:50%;border:1.2px solid #6C7B83;background:var(--paper);flex:none}
.lg-ua{width:16px;height:11px;border-radius:3px;background:var(--ua-land);flex:none}
.lg-line{width:22px;height:0;border-top:1.5px solid #8A9CA5;flex:none}
/* далекі країни: пунктир перельоту (рядок легенди «літаком до аеропорту поруч з Україною, далі нашим автомобілем») */
.lg-air{width:22px;height:0;border-top:1.5px dashed #8A9CA5;flex:none}
.legend .lg-far{align-items:flex-start}.lg-far .lg-air{margin-top:9px}
/* головне про Україну — першим рядком і помітніше (devil-1 06.10: на вузькій карті «будь-яке місто» губилось серед дрібниць) */
.legend .lg-ua-row{flex-basis:100%;color:var(--ink);font-weight:600;font-size:14.5px}
/* «доставляємо в будь-яке місто України» — посилання на перелік міст (D84) */
.legend .lg-cities{color:inherit;text-decoration:underline;text-decoration-color:#C99C58;text-underline-offset:3px;text-decoration-thickness:1.5px}
.legend .lg-cities:hover,.legend .lg-cities:focus-visible{color:var(--amber-text)}
.map-list{display:none;list-style:none;margin:6px 0 0;padding:0;flex-wrap:wrap;gap:0 16px;font:500 14.5px/1.3 var(--f-disp)}
.map-list li{margin:0;padding:0;display:inline-flex;align-items:center}
.map-list a{display:inline-block;padding:6px 0;color:var(--ink);text-decoration:underline;text-decoration-color:#B9C3C5;text-underline-offset:3px}
.map-list a:hover,.map-list a:focus-visible{color:var(--amber-text);text-decoration-color:var(--amber-deep)}
.map-list-h{display:none}
@container (max-width:519.98px){.map-list{display:flex}.map-list-h{display:block;margin:14px 0 0;font:600 14.5px/1.3 var(--f-disp);color:var(--ink)}}

/* ---------------------------------------------------------------- код країни біля телефону (28.09) */
/* Слово власника 28.09: клієнт сам обирає код країни, щоб ми не гадали, куди дзвонити. Вибір коду й
   поле номера — один контрол: спільна рамка, 52px, без переповнення на 320px (поле номера стискається).
   Без JS видно сам <select> (підпис «+48 Польща» обрізає ширина); з JS (клас pc-js від app.js) видно
   лише «+48» (span.pc-show), а прозорий нативний <select> лежить поверх і відкриває повний список. */
.phone-row{display:flex;align-items:stretch;width:100%;min-width:0}
.phone-row > input{flex:1 1 auto;min-width:0;width:auto;border-top-left-radius:0;border-bottom-left-radius:0}
.phone-row > input:focus{position:relative;z-index:1}
.pc{position:relative;flex:0 0 96px;display:flex;min-width:0}
.field .pc select{width:100%;min-width:0;padding:12px 26px 12px 12px;border-right:0;border-top-right-radius:0;border-bottom-right-radius:0;background-position:calc(100% - 16px) 50%,calc(100% - 10px) 50%;white-space:nowrap;overflow:hidden;text-overflow:clip}
.pc-show{display:none}
.pc.pc-js .pc-show{display:flex;align-items:center;width:100%;min-height:52px;padding:0 26px 0 12px;font:400 17px/1.3 var(--f-text);color:var(--ink);white-space:nowrap;overflow:hidden;background-color:var(--paper);background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 16px) 50%,calc(100% - 10px) 50%;background-size:6px 6px;background-repeat:no-repeat;border:1px solid var(--edge);border-right:0;border-radius:10px 0 0 10px}
.field .pc.pc-js select{position:absolute;top:0;left:0;z-index:2;width:100%;height:100%;min-height:0;margin:0;opacity:0;cursor:pointer}
.pc.pc-js:focus-within{z-index:1}
.pc.pc-js:focus-within .pc-show{outline:2px solid var(--ink);outline-offset:1px;border-color:var(--ink);box-shadow:0 0 0 5px rgba(31,46,58,.08)}
/* невірний номер — червона рамка на всьому контролі, і на коді країни теж (seed-4, 28.09) */
.phone-row:has(input[aria-invalid="true"]) select,.phone-row:has(input[aria-invalid="true"]) .pc-show{border-color:var(--err-ink)}

/* ---------------------------------------------------------------- P116 Х1 · «з України за кордон» (T_OUT)
   Факти з джерелами ({{facts}}, {{fact}}), «Про сторінку» ({{about}}), блок ціни без чисел ({{outprice}}),
   плитки «UA → країна» ({{outcountries}}), рядок зворотного напрямку ({{reverse}}). Токени — ті самі. */
.facts{list-style:none;margin:16px 0 8px;padding:0;display:grid;gap:10px}
.facts .fact{position:relative;padding:12px 14px 12px 34px;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);line-height:1.5}
.facts .fact::before{content:"";position:absolute;left:14px;top:20px;width:8px;height:8px;border:1.2px solid var(--stone);border-radius:50%}
.fact-src{font:500 var(--fs-xs)/1.3 var(--f-mono);color:var(--stone);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere;white-space:normal}
.facts .fact-src{display:inline-block;margin-left:4px}
.fact-src-w{white-space:normal}
.section-alt .facts .fact{background:var(--paper)}
.about-page{margin:32px 0 0;padding:18px 0 12px;max-width:46rem;border-top:1px solid var(--line-strong);font-size:var(--fs-s);color:var(--body-2)}
.about-page h2{font-size:var(--fs-l);margin-bottom:8px}
.about-page p{margin:0 0 8px}
.about-meta,.about-src-h{font:500 var(--fs-xs)/1.4 var(--f-mono);color:var(--stone);letter-spacing:.02em}
.about-src{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:6px 14px}
.about-src a{font:500 var(--fs-xs)/1.4 var(--f-mono);color:var(--ink);overflow-wrap:anywhere}
.about-src-d{font:500 var(--fs-xs)/1.4 var(--f-mono);color:var(--stone)}
.out-price{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin:16px 0;padding:16px;background:var(--dawn);border-radius:var(--r)}
.out-price p{margin:0;flex:1 1 260px;font:500 var(--fs-m)/1.4 var(--f-disp)}
.reverse-link{margin:16px 0}
.reverse-link a{display:inline-flex;align-items:center;gap:8px;font:600 var(--fs-m)/1.3 var(--f-disp);text-decoration:none;border-bottom:1.5px solid var(--amber);padding-bottom:3px}
.reverse-link .ico{width:18px;height:18px;flex:0 0 auto}
/* плитка «з України»: дім (бурштин) — на початку лінії, країна — в кінці */
.t-stub-out::before{left:auto;right:0;border-color:#6C7B83}
.t-stub-out::after{left:0;right:auto}
.t-stub-out i{left:10px;right:10px}
/* мітка «UA» — біля бурштинового (лівого) кінця, дзеркально до плиток «в Україну» (R4-CT-03) */
.t-stub-out{margin:2px 0 2px 22px}
.t-stub-out em{right:auto;left:-22px}
.kicker-out .route::before{left:auto;right:0}
.kicker-out .route::after{left:0;right:auto}

@media (min-width:1280px){
  .bg-s3{display:inline}
}
/* Меню в один рядок на 900–1199 (28.09): з пунктом «З України за кордон» 11 пунктів переносились у другий рядок
   («Питання · Статті · Контакти» окремо). 1100–1199 — дрібніше й щільніше; 900–1099 — ще й без «Головна» (її робить логотип). */
@media (min-width:1100px) and (max-width:1199px){
  .nav-list a{padding:11px 9px;font-size:15.5px}
}
@media (min-width:900px) and (max-width:1099px){
  .nav-list a{padding:11px 7px;font-size:14.5px}
  .nav-list li:first-child{display:none}
  .nav-list li:nth-child(2) a{padding-left:0}
}
/* 900–999: у кнопках месенджерів першого екрана «WhatsApp» майже торкався країв (коло 4) */
@media (min-width:900px) and (max-width:999px){
  .msg{gap:5px;padding:8px 4px;font-size:14.5px}
}
/* довгий термін у таблиці — переноситься цілим словом, без дефіса посередині (коло 4: «Todesbe-scheinigung» на 390) */
.nohy{hyphens:none;-webkit-hyphens:none}
/* 900–1149: колонки першого екрана головної закінчувались на різній висоті (до ~160px порожнечі під картою). Карта
   тягнеться до висоти колонки з формою, вміст карти — по центру своєї рамки; форма лишається своєї висоти (R4-CT-11) */
@media (min-width:900px) and (max-width:1149px){
  .hero-grid > .hero-map{align-self:stretch}
  .hero-grid > .hero-map > .mapbox{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center}
}

/* ---------------------------------------------------------------- «Оновлено» під хлібними крихтами (P122, K5/K6) */
.updated-row .wrap{padding-top:6px}
.updated{margin:0;font:500 13px/1.3 var(--f-disp);color:var(--stone)}

/* L2 13.10 (слово власника «норм. Заливай»): картка відгуків на фото першого екрана, лише uk-головна.
   Цитати — дослівні уривки з reviews.json (B4), без позначки data-review: сторожі міряють цитати повністю. */
.hero-photo.has-rvq figcaption{display:none}
.rv-q{position:relative;z-index:2;margin:-48px 14px 0 auto;max-width:323px;background:var(--paper);color:var(--ink);border-radius:14px;box-shadow:0 12px 30px rgba(16,34,48,.22);padding:14px 17px 12px;border-left:4px solid var(--amber)}
.rv-q-h{display:flex;align-items:center;gap:8px;font:600 11px/1 var(--f-disp);color:var(--stone)}
.rv-q-h b{font-size:19px;color:var(--night)}
.rv-q-s{color:var(--amber);letter-spacing:1px;font-size:13px}
.rv-q-t{display:grid;margin-top:8px}
.rv-q-i{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .6s,visibility .6s}
.rv-q-i.on{opacity:1;visibility:visible}
.rv-q-i blockquote{margin:0;font:italic 400 14.5px/1.4 var(--f-text)}
.rv-q-a{display:block;margin-top:5px;font:600 11px/1.2 var(--f-disp);color:var(--amber-text)}
.rv-q-f{display:flex;align-items:center;justify-content:space-between;margin-top:7px}
.rv-q-d{display:flex;gap:5px}.rv-q-d i{width:6px;height:6px;border-radius:50%;background:#d6d2c8}.rv-q-d i.on{background:var(--amber)}
.rv-q-f a{font:600 11px/1 var(--f-disp);color:var(--night)}
@media (max-width:700px){.rv-q{margin:-34px auto 0;width:85%;max-width:none;box-sizing:border-box}.rv-q-i blockquote{font-size:13.6px}}
@media (prefers-reduced-motion:reduce){.rv-q-i{transition:none}}

/* №144 (15.10.2026): смуга-ілюстрація Nano Banana одразу після першого екрана (19 сторінок × мови). Без підпису:
   alt описує сцену, не «наше фото». Широка — 21:9 на ПК, 16:9 на телефоні; вертикальна/квадратна — до 440 px по центру. */
.illus-band{margin:clamp(16px,3vw,32px) 0}
.illus-band img{display:block;width:100%;height:auto;border-radius:var(--r-l);object-fit:cover}
.illus-wide img{aspect-ratio:21/9}
@media (max-width:640px){.illus-wide img{aspect-ratio:16/9}}
.illus-tall{max-width:440px;margin-left:auto;margin-right:auto}
.illus-tall img{aspect-ratio:4/5}