@charset "UTF-8";
/* Apostilo — стили сайта. Вынесены из index.html 05.09.2026. Tailwind подключается CDN-скриптом в index.html, здесь только свой CSS. */

:root{
 /* Палитра вынесена в переменные – меняется в одном месте.
 Нейтральный серый каркас + один тёплый акцент в двух тонах.
 page #F1F1EF – фон · sand #E5E5E1 – крупные блоки · white – карточки ·
 ink #1F2120 – текст и тёмные плашки · graphite #2E3130 – футер ·
 terra #EFB01F – жёлтый акцент действия (кнопки и плашки, текст на нём тёмный) ·
 ochre – алиас terra, отдельного оттенка охры нет. */
 --c-page:#F1F1EF; --c-graphite:#2E3130;
 --c-paper:#FFFFFF; --c-sand:#E5E5E1; --c-ink:#1F2120;
 --c-blue:#E5E5E1; --c-bluedp:#2E3130;
 --c-terra:#EFB01F; --c-ochre:#EFB01F; --c-moss:#2E3130;
 --c-red:#9AA0A0;

 /* Шапка – единый набор параметров стекла для всех страниц и всех частей плашки:
 фон, размытие, тень, скругление. Менять только здесь. */
 /* прозрачность плашки шапки: светлая 36%, тёмная 22% (20.09.2026) */
 --hdr-bg:rgba(255,255,255,.64);
 --hdr-bg-dark:rgba(46,49,48,.78);
 --hdr-blur:blur(7px);
 --hdr-shadow:0 1px 2px -1px rgba(31,33,32,.10), 0 8px 12px -8px rgba(31,33,32,.16);
 --hdr-shadow-dark:0 1px 2px -1px rgba(0,0,0,.25), 0 8px 12px -8px rgba(0,0,0,.35);
 --hdr-r:16px;
 --hdr-gap:6px;
}
@media (min-width:768px){ :root{ --hdr-r:20px; } }
html{ scroll-behavior:smooth; }
html{ background:var(--c-graphite); }
body{ background:var(--c-page); color:var(--c-ink); -webkit-font-smoothing:antialiased; }
/* ничего белого под футером */
footer#stopka{ margin-bottom:0; }
#step-modal[hidden], #step-data[hidden]{ display:none !important; }
section[id]{ scroll-margin-top:88px; }
/* 27.09.2026: от 1150px шапка не прячется и кончается на ~108px – кикер раздела и вопрос FAQ не уходят под неё */
@media (min-width:1150px){ section[id]{ scroll-margin-top:124px; } }
#faq details[id]{ scroll-margin-top:124px; }
/* класса нет в собранном tailwind.css. Мера в px – одна для лида 20px и абзаца 17px (56ch давала им разные края).
   С 1024px в .gt-card меры нет: абзацы, сноска и кнопка – один блок в 7 колонок, как утверждено 26.09.2026 (Go Tabular) */
.max-w-\[56ch\]{ max-width:625px; }
@media (min-width:1024px){ .gt-card .max-w-\[56ch\]{ max-width:none; } }
.price-num{ display:inline-block; font-variant-numeric:tabular-nums;
 font-feature-settings:"tnum" 1, "liga" 1, "clig" 1, "calt" 1; text-align:right; }
.price-hit{ cursor:default; }
.slab-price .price-hit{ font-family:inherit; text-transform:none; letter-spacing:normal;
 font-size:inherit; color:inherit; }
.faq-price .price-hit{ color:inherit; }

/* Логотип: «Apo» – 700, «stilo» – 600, точка – 900 акцентная */
.logo{ font-family:'Fira Sans',sans-serif; letter-spacing:-0.04em; line-height:1; display:inline-flex; }
.logo b:nth-child(1),
.logo b:nth-child(2),
.logo b:nth-child(3){font-weight:700; }
.logo b:nth-child(4),
.logo b:nth-child(5),
.logo b:nth-child(6),
.logo b:nth-child(7),
.logo b:nth-child(8){font-weight:600; }
/* точка – по центру высоты текста, а не на базовой линии */
/* Жёлтый знак-акцент. Символ ✦ есть не во всех шрифтах – рисуется системным,
   поэтому кегль и высота вынесены в переменные: подгонять здесь, в одном месте. */
.logo{ --logo-mark-size:.62em; --logo-mark-y:.02em; }
.logo b:nth-child(9){ font-weight:900; color:var(--c-terra); display:inline-block;
 font-size:var(--logo-mark-size); margin-left:.10em;
 transform:translateY(var(--logo-mark-y)); }
/* точка логотипа пульсирует при наведении */
.logo:hover b:nth-child(9){ animation:logoDotPulse 2.4s ease-in-out infinite; }
@keyframes logoDotPulse{
  0%   { transform:translateY(var(--logo-mark-y)) scale(1) }
  50%  { transform:translateY(var(--logo-mark-y)) scale(1.24) }
  100% { transform:translateY(var(--logo-mark-y)) scale(1) }
}
@media (prefers-reduced-motion:reduce){ .logo:hover b:nth-child(9){ animation:none } }

/* в тёмном футере точка – светлый тон акцента */
.footer-tone .logo b:nth-child(9){ color:var(--c-ochre); }

/* Логотип в шапке: при загрузке на 36% крупнее, плавно ужимается по мере прокрутки */
.logo-brand{ transform-origin:left center;
 transform:translateX(18px) scale(var(--logo-scale,1.36));
 will-change:transform; transition:color .25s ease; }
/* над тёмным блоком логотип светлеет, точка сохраняет акцент */
.logo-brand.on-dark{ color:var(--c-paper); }
.logo-brand.on-dark b:nth-child(9){ color:var(--c-terra); }

/* Пункты меню: цвет не меняется, выбранный отмечает белая плашка */
.navlink{ position:relative; z-index:1; display:inline-block; transition:color .25s ease; }
/* курсивная копия выталкивает прямое начертание снизу */
.nl-swap{ display:inline-grid; overflow:hidden; }
/* анимация только на входе: при отведении курсора всё возвращается мгновенно */
.nl-swap > span{ grid-area:1 / 1; white-space:nowrap; transition:none; }
.nl-b{ font-style:normal; font-weight:inherit; letter-spacing:inherit; opacity:0; transform:translateY(105%); }
/* Пункты меню – по правилам футера: обычное начертание, при наведении полужирное,
   выталкивание копии снизу отключено. Кегль не меняется. */
header .navlink{ font-weight:400; transition:color .25s ease; }
header .navlink:hover, header .navlink:focus-visible{ font-weight:700; }
/* «Zamów» (и его переводы, .navlink--cta) всегда полужирный;
   при наведении меняется только само слово: Zamów → Wycena, Заказать → Оценка и т.д. */
header .navlink[data-quote], header .navlink--cta{ font-weight:700; }
header .navlink[data-quote]:hover, header .navlink[data-quote]:focus-visible,
header .navlink--cta:hover, header .navlink--cta:focus-visible{ font-weight:700; }
/* при наведении показываем вторую копию слова: у «Zamów» это «Wycena» */
header .navlink:hover .nl-a, header .navlink:focus-visible .nl-a{ visibility:hidden; }
header .navlink:hover .nl-b, header .navlink:focus-visible .nl-b{ visibility:visible; opacity:1; }
header .navlink .nl-swap{ overflow:visible; }
header .navlink .nl-b{ font-weight:700; visibility:hidden; opacity:0; transform:none; }
/* «Zamów wycenę»: при наведении под пунктом проявляется плашка */
header .navlink--plate{ font-weight:700; }
header .navlink--plate .nl-plate{ position:relative; z-index:1; display:inline-block; white-space:nowrap; }
header .navlink--plate .nl-plate::before{ content:''; position:absolute; z-index:-1;
 inset:-11px -14px;  /* высота плашки +18% (20.09.2026) */
 /* заливки нет: плашку рисует только внутренняя тень (20.09.2026) */
 background:transparent;
 /* скругление фиксированное 12px; тень внутренняя – плашка выглядит вдавленной (20.09.2026) */
 border-radius:12px;
 box-shadow:inset 0 2px 4px rgba(31,33,32,.15), inset 0 12px 14px -8px rgba(31,33,32,.23);
 /* простое появление; длительность в базовом правиле работает на уход – 0.36с,
    появление задано в правиле :hover – 0.6с (20.09.2026) */
 opacity:0; transition:opacity .36s ease; }
/* над тёмным блоком тень чисто чёрная и заметно плотнее – чернильная там терялась
   (та же логика, что у --hdr-shadow-dark у самой шапки) */
header .navlink--plate.on-dark .nl-plate::before{
 box-shadow:inset 0 2px 5px rgba(0,0,0,.62), inset 0 10px 16px -8px rgba(0,0,0,.85); }
header .navlink--plate:hover .nl-plate::before,
header .navlink--plate:focus-visible .nl-plate::before{ opacity:1; transition:opacity .6s ease; }
/* пока открыта панель «Wycena», плашка остаётся видимой независимо от курсора –
   пункт выглядит нажатым всё время, что форма на экране (20.09.2026) */
html.qd-open header .navlink--plate .nl-plate::before{ opacity:1; }
/* плашка полупрозрачная и повторяет тон фона, поэтому цвет текста не меняем:
   над светлой шапкой он чернильный, над тёмной – белый, как у остальных пунктов
   (раньше плашка была жёлтой и требовала чернильного текста в обоих случаях) */


/* Пункты меню выросли: «Zamów wycenę» вместо «Zamów», «Kontakt» вместо «Gdzie», и то же
   в переводах («Заказать оценку», «Замовити оцінку»). Самый длинный ряд – русский, ему нужно
   602px, и до ~1150px он в строку не входит. В этой полосе показываем бургер, как на планшете,
   чтобы не жать кегль и поля (20.09.2026). */
@media (min-width:1024px) and (max-width:1149px){
 #nav-main{ display:none !important; }
 #burger{ display:flex !important; }
}

/* номер телефона и переключатель языков – то же правило начертания */
header .wa-btn, header .lang-switch{ font-weight:400;
 transition:color .25s ease, background-color .25s ease, font-weight .25s ease; }
/* номер телефона – обычное начертание, в том числе при наведении */
header .wa-btn, header .wa-btn:hover, header .wa-btn:focus-visible{ font-weight:400; }
/* переключатель языка при раскрытом списке остаётся обычного начертания */
header .lang-switch, header .lang-switch:hover,
header .lang-switch:focus-visible{ font-weight:400; }
header .lang-switch .nl-swap{ overflow:visible; }
header .lang-switch .nl-b{ font-weight:700; visibility:hidden; opacity:0; transform:none; }
@media (prefers-reduced-motion:reduce){ .nl-swap > span{ transition:none; transform:none } }
/* над тёмным блоком пункты меню светлеют */
.navlink.on-dark{ color:var(--c-paper); }

/* Шапка: одна ровная стеклянная плашка на весь ряд. Части (логотип, меню, язык)
   остались только разметкой – фон, размытие и тень рисует общий слой .hdr-row::before,
   тень вынесена в ::after. Перетяжек на стыках нет (13.09.2026). */
.hdr-row{ position:relative; isolation:isolate; }
.hdr-row::before, .hdr-row::after{ content:''; position:absolute; inset:0;
 border-radius:var(--hdr-r); pointer-events:none; }
.hdr-row::after{ z-index:1; box-shadow:var(--hdr-shadow); transition:box-shadow .25s ease; }
.hdr-row.on-dark::after{ box-shadow:var(--hdr-shadow-dark); }
.hdr-row::before{ z-index:2; background:var(--hdr-bg);
 -webkit-backdrop-filter:var(--hdr-blur); backdrop-filter:var(--hdr-blur);
 transition:background-color .25s ease; }
.hdr-row.on-dark::before{ background:var(--hdr-bg-dark); }
/* содержимое частей – поверх стекла */
.hdr-glass { z-index:3; }
/* Логотип увеличен скриптом до 1.36 на верху страницы (transform не меняет габарит),
   поэтому правое поле плашки растёт на --logo-extra – его считает app.js вместе с --logo-scale. */
/* Поля слева и справа от логотипа равны (до стыка плашек): логотип сдвинут transform'ом на 18px
   вправо, поэтому слева видимое поле = padding-left + 18px; справа столько же и ещё 12px по просьбе
   владельца (07.09.2026), чтобы стык плашек стоял чуть правее. */
.hdr-seg--logo{ --hdr-pad:1.25rem; padding-left:var(--hdr-pad);
 padding-right:calc(var(--hdr-pad) + 18px + 12px + var(--logo-extra,0px)); }
/* Ширина логотипа зафиксирована скриптом (--logo-w): при наведении буквы меняются на знаки
   других алфавитов и слово становится шире или уже – плашка при этом не дышит. */
.hdr-seg--logo .logo-brand{ width:var(--logo-w,auto); }
@media (min-width:640px){ .hdr-seg--logo{ --hdr-pad:2rem; } }
.hdr-seg--menu{ flex:1 1 auto; min-width:0; }
/* отступ от «Zamów» до стыка плашек – всегда 42px: 10px здесь + 32px поле плашки.
   Задан в styles.css, а не утилитой Tailwind: сборка статичная и новых классов в ней нет. */
.nav-main{ margin-right:10px; transition:gap .55s cubic-bezier(.2,.7,.25,1); }

/* Переключатель языка в шапке */
.lang-switch{ border:0; background:none; padding:6px 0; color:var(--c-ink); cursor:pointer;
 line-height:1; transition:opacity .2s ease; }
.lang-switch{ min-width:104px; text-align:center; }   /* ширина фиксирована – смена языка не двигает меню */
/* шеврон сообщает, что у кнопки есть продолжение (аудит меню 11.09.2026); при раскрытии переворачивается */
.lang-switch{ display:inline-flex; align-items:center; justify-content:center; gap:7px; }
.ls-chev{ flex:0 0 auto; transition:transform .18s ease; }
.lang-switch[aria-expanded="true"] .ls-chev{ transform:rotate(180deg); }
.lang-switch .nl-swap{ justify-items:center; }
.lang-switch.on-dark{ color:var(--c-paper); }
.lang-switch:focus-visible{ outline:2px solid var(--c-ink); outline-offset:3px; }
.lang-switch .ls-now{ display:inline-block; font-style:normal; font-weight:inherit;
 transition:opacity .18s ease, transform .18s ease; }
.lang-switch.is-changing .ls-now{ opacity:0; transform:translateY(-5px); }

/* Выпадающий список языков (переделан 12.09.2026 по аудиту меню).
   Единственное состояние – aria-expanded на кнопке: список открывается по клику, Enter, Space
   и стрелке вниз, закрывается по Escape, клику мимо и уходу фокуса. Наведение открывает его
   только при мыши (matchMedia hover:hover в app.js), на тач-устройствах работает тап.
   Список позиционируется от плашки языка (.lang-wrap без position), поэтому его правый край
   совпадает с полем плашки на всех ширинах, а не с серединой кнопки. */
.lang-wrap{ position:static; }
/* Список без собственной плашки: вниз расширяется сама плашка языка –
   продолжение рисует отдельный слой ::after, высоту (--lang-h) задаёт app.js
   по фактической высоте списка, так что ничего в шапке не сдвигается. */
.hdr-seg--lang{ position:relative; }
/* до lg меню скрыто, поэтому средняя плашка пустая – убираем её,
   а языковая занимает освободившееся место, как было до разделения */
@media (max-width:1023px){
  .hdr-seg--menu{ display:none; }
  .hdr-seg--lang{ flex:1 1 auto; justify-content:flex-end; }
  /* На узких экранах двум плашкам не хватало ширины и правая уезжала за край экрана.
     Поля ужаты до минимума: у логотипа справа ровно столько же, сколько видно слева
     (поле + сдвиг логотипа на 18px), десктопная добавка +12px здесь не нужна. */
  .hdr-seg--logo{ --hdr-pad:1rem; padding-right:calc(var(--hdr-pad) + 18px); }
  .hdr-seg--lang{ padding-left:12px; padding-right:12px; }
}
@media (max-width:400px){
  .hdr-seg--logo{ --hdr-pad:.75rem; }
  .hdr-seg--lang{ padding-left:8px; padding-right:8px; }
}
/* На совсем узких экранах (320–359px) ширины не хватает даже так: ужимаем логотип,
   надпись языка и кнопку меню. Ellipsis – страховка: если название языка окажется
   ещё длиннее, оно обрежется, но плашка не уедет за край экрана. */
@media (max-width:359px){
  .hdr-seg--logo .logo-brand{ font-size:24px; }
  .hdr-seg--lang{ min-width:0; }
  .hdr-seg--lang .lang-wrap, .hdr-seg--lang .lang-switch{ min-width:0; }
  .hdr-seg--lang .lang-switch{ font-size:15px; }
  .hdr-seg--lang .ls-now{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  #burger{ width:40px; }
}
/* Список языков – отдельная плашка под рядом, через тот же зазор --hdr-gap, что и
   мобильное меню. Приклеить её к ряду встык нельзя: это ещё одно размытие своей
   рамкой, и на стыке была бы горизонтальная полоса – ровно та же причина, по которой
   стекло в ряду рисует один слой. Высоту (--lang-h) задаёт app.js по высоте списка. */
.hdr-seg--lang::after{ content:''; position:absolute; left:0; right:0;
 top:calc(100% + var(--hdr-gap)); height:var(--lang-h, 0px);
 background:var(--hdr-bg); border-radius:var(--hdr-r); z-index:-1;
 transition:height .28s cubic-bezier(.2,.7,.25,1); }
.hdr-seg--lang.on-dark::after{ background:var(--hdr-bg-dark); }
/* Тень и размытие – только у раскрытого: у закрытого высота 0, но тень рисовалась бы полосой. */
.hdr-seg--lang:has(#lang-switch[aria-expanded="true"])::after{
 -webkit-backdrop-filter:var(--hdr-blur); backdrop-filter:var(--hdr-blur);
 box-shadow:var(--hdr-shadow); }
.hdr-seg--lang.on-dark:has(#lang-switch[aria-expanded="true"])::after{ box-shadow:var(--hdr-shadow-dark); }
/* список ложится под низ плашки. До lg плашка широкая (в ней ещё бургер), поэтому список
   центрируется под кнопкой языка: её середину относительно плашки (--lang-x) считает app.js.
   На десктопе плашка узкая (144px, ширина задана кнопкой) – список прижат к ней справа. */
.lang-pop{ position:absolute; top:100%; left:var(--lang-x, 50%); right:auto; transform:translate(-50%, calc(var(--hdr-gap) - 6px));
 min-width:0; padding:8px 0; margin:0; z-index:60;
 display:flex; flex-direction:column; gap:0; background:transparent; border-radius:0;
 opacity:0; visibility:hidden; pointer-events:none;
 transition:opacity .2s ease, transform .2s ease, visibility 0s linear .2s; }
/* на десктопе плашка языка узкая (144px): список с полями строк 21px (+27 %, 12.09.2026) центрируем в ней */
@media (min-width:1024px){ .lang-pop{ left:auto; right:10px; transform:translateY(calc(var(--hdr-gap) - 6px)); } }
/* невидимый «мостик» от кнопки до списка: курсор проходит по нему и список не закрывается */
.lang-pop::before{ content:""; position:absolute; left:0; right:0; bottom:100%; height:34px; }
.lang-switch[aria-expanded="true"] + .lang-pop{
 opacity:1; visibility:visible; pointer-events:auto;
 transform:translate(-50%, var(--hdr-gap)); transition-delay:0s; }
@media (min-width:1024px){ .lang-switch[aria-expanded="true"] + .lang-pop{ transform:translateY(var(--hdr-gap)); } }
/* Пункт – строка на всю ширину списка, текст по центру, 37px высотой (тач-цель; 12.09.2026 отступы чуть меньше).
   При наведении подсвечивается строка целиком, начертание не меняется – жирным стоит только текущий. */
.lang-opt{ display:flex; align-items:center; justify-content:center; width:100%; box-sizing:border-box;
 border:0; background:none; cursor:pointer; text-align:center; text-decoration:none;
 padding:9px 21px; border-radius:8px; font-size:16px; font-weight:400; line-height:1.2;
 white-space:nowrap; color:inherit; transition:background-color .15s ease; }
.lang-opt:hover{ background:rgba(31,33,32,.07); }
.lang-opt:focus-visible{ outline:2px solid currentColor; outline-offset:-2px; }
/* текущий язык в списке не показываем – он стоит на кнопке над списком (решение 12.09.2026) */
.lang-opt.is-current, .lang-opt[aria-current="true"]{ display:none; }
@media (prefers-reduced-motion:reduce){
  .lang-pop, .ls-chev, .hdr-seg--lang::after, .lang-opt{ transition:none; }
}
/* пока список раскрыт, название языка в шапке полужирное – как пункт меню при наведении */
header .lang-switch[aria-expanded="true"]{ font-weight:700; }
/* инверсия цвета, как у пунктов меню: над тёмным блоком список светлеет */
.lang-pop{ color:var(--c-ink); }
.lang-switch.on-dark + .lang-pop, .hdr-glass.on-dark .lang-pop{ color:var(--c-paper); }
.hdr-glass.on-dark .lang-opt:hover{ background:rgba(255,255,255,.14); }

/* ===== Мобильное меню (переделано 21.09.2026) =====
   Что было не так:
   1. Прокрутку запирали через overflow:hidden сразу на html и body. Тогда body сам становится контейнером
      прокрутки, липкая шапка «прилипает» уже к нему и возвращается в начало документа: стоило открыть меню
      не с самого верха страницы – шапка и меню пропадали с экрана, а страница при этом не крутилась.
      Теперь overflow только на body (как у панели wyceny): он уходит на окно, body контейнером не становится.
   2. Панель стояла в потоке внутри шапки и сдвигала страницу вниз на свою высоту. Теперь она лежит поверх
      страницы (absolute под рядом шапки), как список языков.
   3. На 1024–1149px бургер виден, а панель гасил .lg:hidden – кнопка не делала ничего (iPad в горизонтали).
      Видимость панели теперь задаётся здесь, по тому же порогу, что и бургер, и состоянию html.menu-open.
   4. Внизу стояла контурная «Napisz na WhatsApp». Вместо неё – общая группа .cta-btns:
      WhatsApp · Telegram · «Zamów wycenę», пункт «Zamów wycenę» из списка ушёл в главную кнопку.
   Состояние одно – html.menu-open (ставит app.js); открытие и закрытие – как у списка языков. */
html.menu-open body{ overflow:hidden; }
/* у окна с обычной полосой прокрутки страница не прыгает вбок, когда полоса пропадает */
html.menu-open{ scrollbar-gutter:stable; }
/* подложка: приглушает страницу (тот же чернильный тон, что под панелью wyceny, но слабее – .4 против .55),
   ловит нажатие мимо панели (закрывает меню и не отдаёт его ссылке под пальцем) и не даёт тянуть страницу.
   Без неё жёлтая кнопка hero под панелью читалась как ещё одна кнопка меню.
   Элемент создаёт app.js; слой – между страницей и шапкой (z-50) */
.mn-backdrop{ position:fixed; inset:0; z-index:49; background:rgba(31,33,32,.4); touch-action:none;
 -webkit-tap-highlight-color:transparent; opacity:0; visibility:hidden;
 transition:opacity .2s ease, visibility 0s linear .2s; }
html.menu-open .mn-backdrop{ opacity:1; visibility:visible; transition-delay:0s; }
@media (prefers-reduced-motion:reduce){ .mn-backdrop{ transition:none; } }
/* ряд шапки на время меню – того же плотного стекла, что панель: над приглушённой страницей
   обычное стекло .64 серело бы рядом с почти белой панелью */
/* с 23.09.2026 открытое меню того же прозрачного стекла, что шапка и пилюля (Грег: «прозрачный фон под всей
   площадью выпавшего меню и всегда прозрачный»); раньше плотное .94 */
/* плавающие элементы выше шапки (z-60) на время меню убираем, иначе лягут поверх панели */
html.menu-open .to-top, html.menu-open .cn-dock{ opacity:0 !important; visibility:hidden; pointer-events:none; }

#mobile-nav{ display:none; }
/* Единая плашка (21.09.2026, вечер). Грег: «я бы сделал плашку с выпаданием вниз всей плашки, и она не отдельна».
   Раньше панель меню была отдельной плашкой под рядом шапки (зазор --hdr-gap, свои фон, размытие и тень).
   Теперь вниз растёт сам стеклянный слой ряда: .hdr-row::before (фон + размытие) и ::after (тень) опускают нижний
   край на высоту панели (--mn-h ставит app.js на #top при открытии). Слой один – значит, нет ни шва между двумя
   размытиями, ни второй тени; скругление одно на всю плашку. Сама панель прозрачная, стоит встык под рядом и
   раскрывается обрезкой clip-path в том же темпе, что растёт плашка, – текст не вылезает за её нижний край. */
@media (max-width:1149px){
  .hdr-row::before{ transition:background-color .25s ease, bottom .34s cubic-bezier(.2,.7,.25,1); }
  .hdr-row::after{ transition:box-shadow .25s ease, bottom .34s cubic-bezier(.2,.7,.25,1); }
  html.menu-open .hdr-row::before, html.menu-open .hdr-row::after{ bottom:calc(-1 * var(--mn-h, 0px)); }

  #mobile-nav{ --mn-top:90px; --mn-inset:34px; --mn-fs:26px; --mn-pad:13px;
    display:block; position:absolute; z-index:1; left:.75rem; right:.75rem;
    /* под рядом: место шапки в потоке – по пилюле (59px), развёрнутый ряд выше на (--row-h − 50px) */
    top:calc(100% + (var(--row-h, 50px) - 50px) * (1 - var(--hp, 0)));
    margin-top:0; border-top:0; border-radius:0 0 var(--hdr-r) var(--hdr-r);
    max-height:calc(100vh - var(--mn-top) - 12px); overflow-y:auto; overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    background:none; box-shadow:none;
    opacity:0; visibility:hidden; pointer-events:none;
    /* по бокам панель обрезана по текущей ширине стекла: из пилюли стекло расширяется за --hp (поля ряда
       --ps × --hp), и без этой обрезки слова и кнопки появлялись за его краями раньше фона (Грег, 24.09.2026).
       Обрезка идёт за --hp кадр в кадр, поэтому своей анимации у неё нет */
    -webkit-clip-path:inset(0 calc(var(--ps, 0px) * var(--hp, 0)) 0 calc(var(--ps, 0px) * var(--hp, 0)));
    clip-path:inset(0 calc(var(--ps, 0px) * var(--hp, 0)) 0 calc(var(--ps, 0px) * var(--hp, 0)));
    /* закрытие: сначала содержимое уезжает вверх вместе с плашкой (.mn-in), потом панель гаснет */
    transition:opacity 0s linear .3s, visibility 0s linear .3s; }
  html.menu-open #mobile-nav{ opacity:1; visibility:visible; pointer-events:auto; transition:opacity 0s, visibility 0s; }
  /* сверху вниз содержимое раскрывается обрезкой в том же темпе, что растёт плашка */
  /* по бокам запас −40px: обрезка только сверху вниз, выступы (крайние слова строки языков) не срезаются */
  #mobile-nav .mn-in{ -webkit-clip-path:inset(0 -40px 100% -40px); clip-path:inset(0 -40px 100% -40px);
    transition:clip-path .3s cubic-bezier(.2,.7,.25,1), -webkit-clip-path .3s cubic-bezier(.2,.7,.25,1); }
  html.menu-open #mobile-nav .mn-in{ -webkit-clip-path:inset(0 -40px 0 -40px); clip-path:inset(0 -40px 0 -40px);
    transition:clip-path .34s cubic-bezier(.2,.7,.25,1), -webkit-clip-path .34s cubic-bezier(.2,.7,.25,1); }
  /* низкий экран (iPhone SE, панели Safari раскрыты): кегль и поля строк ужимаются, чтобы кнопки
     оставались на экране без прокрутки панели */
  @supports (height:100dvh){
    #mobile-nav{ max-height:calc(100dvh - var(--mn-top) - 12px);
      --mn-fs:clamp(22px, 3.7dvh, 26px); --mn-pad:clamp(9px, 1.75dvh, 13px); }
  }
}
/* левый край ссылок стоит по левому краю логотипа (поле плашки + сдвиг логотипа на 18px) */
@media (max-width:400px){ #mobile-nav{ --mn-inset:30px; } }
/* от 640px поля шапки 20px – панель ровно под рядом; от 768px ряд выше (90px) */
@media (min-width:640px) and (max-width:1149px){ #mobile-nav{ left:1.25rem; right:1.25rem; } }
@media (min-width:768px) and (max-width:1149px){ #mobile-nav{ --mn-top:108px; } }
@media (min-width:1024px) and (max-width:1149px){ #mobile-nav{ --mn-inset:50px; } }
@media (prefers-reduced-motion:reduce){
  #mobile-nav, html.menu-open #mobile-nav, #mobile-nav .mn-in, html.menu-open #mobile-nav .mn-in,
  .hdr-row::before, .hdr-row::after{ transition:none; }
}

.mn-in{ padding:0 var(--mn-inset) 22px; }
.mn-list{ display:flex; flex-direction:column; }
.mn-link{ display:block; padding:var(--mn-pad) 0; font-size:var(--mn-fs); font-weight:700; line-height:1.15;
 letter-spacing:-.035em; color:var(--c-ink); border-bottom:1px solid rgba(31,33,32,.1);
 -webkit-tap-highlight-color:transparent; transition:opacity .15s ease; }
.mn-link:last-child{ border-bottom:0; }
.mn-link:active{ opacity:.5; }
.mn-link:focus-visible{ outline:2px solid currentColor; outline-offset:-2px; border-radius:6px; }
/* кнопки: главная «Zamów wycenę» во всю ширину, под ней мессенджеры пополам (порядок – просьба Грега 21.09.2026:
   «кнопка Zamów wycenę и потом WhatsApp, Telegram»; в hero порядок прежний – мессенджеры, затем главная) */
#mobile-nav .mn-cta{ --cg:10px; margin-top:14px; display:grid; grid-template-columns:1fr 1fr; gap:var(--cg); width:100%; }
#mobile-nav .mn-cta .cta-btn--main{ grid-column:1 / -1; }
/* Способы связи по задачам (Грег, 23.09.2026): форма – прислать фото документов, звонок – услышать человека
   перед заказом, мессенджеры – вопросы. Без значков (Грег: «страшные иконки»). Главная кнопка – самая широкая
   и по цвету, и по размеру; кнопка телефона шириной по номеру; WhatsApp и Telegram всегда поровну.
   На телефоне: форма во всю ширину, под ней часы и телефон, ниже мессенджеры пополам */
/* часы – отдельной мелкой белой плашкой перед кнопкой телефона (Грег, 24.09.2026: «время работы на отдельной
   мелкой плашке, белой… отдельно от пилюли звонка»); пара стоит одной ячейкой .mn-call */
#mobile-nav .mn-call{ grid-column:1 / -1; justify-self:start; display:flex; align-items:center; gap:10px; min-width:0; }
#mobile-nav .mn-tel{ padding-left:1.2em; padding-right:1.2em; }
#mobile-nav .mn-hrs{ font-size:13px; font-weight:600; letter-spacing:-.01em; line-height:1; white-space:nowrap;
  padding:6px 9px; border-radius:8px; background:var(--c-paper); color:rgba(31,33,32,.6); }
/* «7:00–21:00» полностью (Грег, 23.09.2026: «7–21 непонятно, как 7/24»); уже 360px ряду 236px – плашка,
   номер и поля кнопки мельче */
@media (max-width:359px){
  #mobile-nav .mn-call{ gap:8px; }
  #mobile-nav .mn-tel{ font-size:16px; padding-left:.85em; padding-right:.85em; }
  #mobile-nav .mn-hrs{ font-size:12px; padding:5px 7px; }
}
/* широкая плашка (планшет, узкое окно, телефон лёжа): список в две колонки, кнопки двумя рядами по две –
   лист во всю ширину шапки с одной колонкой слева выглядел бы пустым, а лёжа не помещался бы по высоте */
@media (min-width:560px) and (max-width:1149px){
  /* колонки (Грег, 21.09.2026; 09.10.2026 «Gdzie załatwić» и «Częste pytania» из меню сняты, пунктов четыре):
     слева Apostille, Tłumaczenia, справа Cennik, Kontakt. Порядок в разметке прежний (на телефоне список
     идёт одним столбцом в нём же), места в сетке заданы явно */
  .mn-list{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(2, auto); column-gap:3rem; }
  .mn-link:nth-child(1){ grid-area:1 / 1; }
  .mn-link:nth-child(2){ grid-area:2 / 1; border-bottom:0; }
  .mn-link:nth-child(3){ grid-area:1 / 2; }
  .mn-link:nth-child(4){ grid-area:2 / 2; }
  #mobile-nav .mn-cta{ margin-top:16px; }
}
/* Кнопки в два ряда – от 700px и на телефоне лёжа: сверху телефон и главная справа (Грег, 23.09.2026: «главная
   кнопка справа»), снизу мессенджеры. Главная заходит за середину ряда – занимает всё, что оставил телефон
   (Грег, 24.09.2026: «чтобы кроме цвета имела больше веса»); мессенджеры строго поровну. Три колонки:
   [телефон по содержимому][остаток][ровно половина ряда] – WhatsApp = 1-я + 2-я, Telegram = 3-я, главная = 2-я + 3-я.
   На 560–699px в портрете – как на телефоне: главная во всю ширину, под ней телефон, ниже мессенджеры пополам. */
@media (min-width:700px) and (max-width:1149px), (max-height:520px) and (min-width:560px) and (max-width:699px){
  #mobile-nav .mn-cta{ grid-template-columns:max-content minmax(0,1fr) calc((100% - var(--cg)) / 2); }
  #mobile-nav .mn-cta .mn-call{ grid-area:1 / 1 / 2 / 2; }
  #mobile-nav .mn-cta .cta-btn--main{ grid-area:1 / 2 / 2 / 4; }
  #mobile-nav .mn-cta a[href*="wa.me"]{ grid-area:2 / 1 / 3 / 3; }
  #mobile-nav .mn-cta a[href*="t.me"]{ grid-area:2 / 3 / 3 / 4; }
}
@media (max-height:520px) and (min-width:560px) and (max-width:1149px){
  #mobile-nav{ --mn-fs:22px; --mn-pad:9px; }
  #mobile-nav .mn-cta{ margin-top:10px; --cg:8px; }
  /* два ряда кнопок (с телефоном, 23.09.2026) на 667 × 375 уходили за край на 11px – кнопки ниже на 7px */
  #mobile-nav .mn-cta .cta-btn{ padding-top:.6em; padding-bottom:.6em; }
  .mn-in{ padding-bottom:14px; }
}
/* телефон лёжа (560–699px, окно ниже 520px): раскладка планшета (выше), поля кнопок уже, у мессенджеров
   без стрелки */
@media (max-height:520px) and (min-width:560px) and (max-width:699px){
  #mobile-nav .mn-cta .cta-btn, #mobile-nav .mn-cta .cta-btn:not(.cta-btn--main),
  #mobile-nav .mn-cta .cta-btn:not(.cta-btn--main):hover, #mobile-nav .mn-cta .cta-btn:not(.cta-btn--main):focus-visible{
    padding-left:.9em; padding-right:.9em; }
  #mobile-nav .mn-cta .cta-btn:not(.cta-btn--main) .cta-mark{ display:none; }
}

/* над тёмным блоком шапка темнеет – панель вместе с ней; кнопки по схеме .bg-ink */
header:has(.hdr-row.on-dark) #mobile-nav a:not(.cta-btn){ color:var(--c-paper); border-color:rgba(255,255,255,.14); }
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn{ background:var(--c-paper); }
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn:hover,
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn:focus-visible{ background:var(--c-terra); }
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn:focus-visible{ outline-color:var(--c-paper); }
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn--main{ background:var(--c-terra); }
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn--main:hover,
header:has(.hdr-row.on-dark) #mobile-nav .cta-btn--main:focus-visible{ background:var(--c-paper); color:var(--c-ink); }
#burger span{ transition:transform .2s ease, background-color .25s ease; }
#burger[aria-expanded="true"] span:first-child{ transform:translateY(3.5px) rotate(45deg); }
#burger[aria-expanded="true"] span:last-child{ transform:translateY(-3.5px) rotate(-45deg); }
@media (prefers-reduced-motion:reduce){ #burger span{ transition:none; } }
/* Бургер при наведении на закрытую шапку складывается в стрелку вниз – меню раскроется вниз (Грег, 30.09.2026; стенд
   docs/menu-desk/, вариант 118). Только там, где есть мышь (с 30.09.2026 бургер есть и на компьютере); открытое меню – крестик */
@media (hover:hover) and (pointer:fine){
  html:not(.menu-open) #top .hdr-row:hover #burger span:first-child{ transform:translate(-4px, 4.5px) rotate(40deg) scaleX(.5); }
  html:not(.menu-open) #top .hdr-row:hover #burger span:last-child{ transform:translate(4px, -2.5px) rotate(-40deg) scaleX(.5); }
}

/* Кнопка WhatsApp: по умолчанию только логотип, подпись выезжает при наведении */
.wa-btn{ padding:5px; background:transparent; color:var(--c-ink);
 border:1px solid var(--c-terra); border-radius:12px;
 transition:background-color .3s ease, color .3s ease, padding .38s cubic-bezier(.2,.7,.25,1); }
.wa-btn:hover, .wa-btn:focus-visible{ background:var(--c-terra); color:var(--c-ink); padding:5px 0 5px 18px; }
.wa-ico{ display:block; width:31.5px; height:31.5px; flex:0 0 auto; }
.wa-label{ display:grid; grid-template-columns:0fr; opacity:0;
 transition:grid-template-columns .42s cubic-bezier(.2,.7,.25,1), opacity .3s ease; }
.wa-label > span{ overflow:hidden; white-space:nowrap; padding:0 15px 0 15px; }
.wa-btn:hover .wa-label, .wa-btn:focus-visible .wa-label{ grid-template-columns:1fr; opacity:1; }
@media (prefers-reduced-motion:reduce){ .wa-label{ transition:opacity .2s ease } }

/* «Dla kogo tłumaczymy»: карточка = заголовок → список в один столбец.
 display:flex обязателен: у <button> содержимое по умолчанию центрируется по вертикали,
   из-за этого в растянутой ячейке заголовок уезжал на середину. */
.soft-cell{ position:relative; }
.tl-cell{ display:flex; flex-direction:column; align-items:stretch; container-type:inline-size; }
.tl-title{ display:flex; align-items:center; line-height:1.12; }
.tl-title .chip-mark--arrow > span{ padding-left:3px; }
/* место под стрелку зарезервировано всегда: иначе на hover она раздвигает
   заголовок, тот переносится на вторую строку и вся карточка прыгает */
.tl-title .chip-mark{ grid-template-columns:1fr; opacity:0; transform:translateX(-5px);
 transition:opacity .28s ease, transform .38s cubic-bezier(.2,.7,.25,1); }
.tl-cell:hover .tl-title .chip-mark,
.tl-cell:focus-visible .tl-title .chip-mark{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .tl-title .chip-mark{ transition:opacity .2s ease } }
/* линеек нет: заголовок и список разделяет только отступ */
.tl-list{ display:flex; flex-direction:column; gap:7px; margin-top:17px;
 font-size:15.5px; font-weight:500; line-height:1.3; letter-spacing:-.005em;
 color:rgba(31,33,32,.62); }
@media (max-width:639px){
  .tl-list{ font-size:15px; gap:6px; margin-top:15px; }
}
/* Узкая карточка (две колонки, но экран средний): заголовок мельче.
   Считаем по ширине самой карточки (container query), а не по ширине окна –
   иначе «Urząd Wojewódzki» переносится на вторую строку и списки в ряду
   начинаются на разной высоте. */
@container (max-width:224px){
  .tl-cell .tl-title{ font-size:20px; }
  .tl-list{ font-size:15px; }
}
@container (max-width:190px){
  .tl-cell .tl-title{ font-size:17.5px; }
}

/* Заголовок с чёрной плашкой, перемещающейся за курсором */
.plate-head{ position:relative; }
/* все три слова – одинаковые боксы, поэтому плашка везде садится точно */
.plate-head .pw{ display:inline-block; position:relative; z-index:1; line-height:1;
 padding:.26em .46em .34em; margin-left:-.46em; transition:color .3s ease; }
.plate-head .pw.is-on{ color:var(--c-paper); }
.plate-bg{ position:absolute; left:0; top:0; width:0; height:0; z-index:0; border-radius:9px;
 background:var(--c-ink); opacity:0; pointer-events:none;
 transition:left .42s cubic-bezier(.22,.7,.24,1), top .42s cubic-bezier(.22,.7,.24,1),
 width .42s cubic-bezier(.22,.7,.24,1), height .42s cubic-bezier(.22,.7,.24,1),
 opacity .3s ease; }
.plate-head.is-ready .plate-bg{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .plate-bg{ transition:opacity .3s ease } }

/* Пояснение под заголовком блока 2 */
.pw-hot{ cursor:pointer; }
.pw-hot:focus-visible{ outline:2px solid var(--c-ink); outline-offset:4px; }
.tl-def{ display:block; }
.tl-def-in{ display:grid; padding-top:22px; }
.tl-def-panel{ grid-area:1 / 1; opacity:0; visibility:hidden;
 transition:opacity .32s ease, visibility 0s linear .32s; }
.tl-def-panel.is-open{ opacity:1; visibility:visible; transition:opacity .4s ease .06s; }
.tl-def-name{ font-size:19px; font-weight:700; letter-spacing:-.01em; }
.tl-def-text{ margin-top:8px; font-size:16.5px; line-height:1.6; color:rgba(31,33,32,.72); max-width:46ch; }
@media (prefers-reduced-motion:reduce){ .tl-def, .tl-def-panel{ transition:none } }

/* Подмена слова на плашке: слово всегда выталкивается снизу вверх.
   Наведение ничего не меняет – только курсор, показывающий, что можно кликнуть. */
.plate.swap, .swap{ display:inline-grid; overflow:hidden; vertical-align:top; cursor:pointer; }
.swap > span{ grid-area:1 / 1; white-space:nowrap; opacity:0; }
.swap > span.is-on{ opacity:1; }
.swap > span.go-out{ animation:sw-out .58s cubic-bezier(.2,.72,.24,1) both; }
.swap > span.go-in { animation:sw-in .58s cubic-bezier(.2,.72,.24,1) both; }
@keyframes sw-out{ from{ opacity:1; transform:translateY(0) } to{ opacity:0; transform:translateY(-92%) } }
@keyframes sw-in { from{ opacity:0; transform:translateY(92%) } to{ opacity:1; transform:translateY(0) } }
@media (prefers-reduced-motion:reduce){
  .swap > span.go-out, .swap > span.go-in{ animation:none }
}

/* Последняя строка заголовка – мельче */
/* block, а не inline-block: иначе строка получает строчный бокс родителя (96px × .92)
   и под «i zdalnie» появляется пустая полоса ~40px */
.hero-sub{ display:block; width:max-content; max-width:100%;
 background:var(--c-terra); color:var(--c-ink);
 font-size:.44em; line-height:.9; letter-spacing:-.01em;
 margin-top:.12em; margin-left:.22em; padding-bottom:.04em; }
/* появляется через 3 с с выездом справа */
.hero-sub-in{ opacity:0; transform:translateX(1.4em);
 transition:opacity 1.2s ease, transform 1.6s cubic-bezier(.14,.8,.24,1); }
.hero-sub-in.is-in{ opacity:1; transform:none; }
@media (prefers-reduced-motion:reduce){ .hero-sub-in{ opacity:1; transform:none; transition:none } }

/* Геометрия в hero: перенесена в правую колонку */
.hero-langs{ width:100%; }
/* Выезд строки справа с выравниванием по левому краю */
.no-x{ overflow-x:clip; }
/* До появления строка сдвинута вправо на 1.1em: в заголовках это вылезало за окно
   и давало горизонтальную прокрутку (на 698px – 28px). Секция «Jak działamy» уже
   обрезана классом .no-x, остальные заголовки обрезаем здесь (20.09.2026) */
h1:has(.slide-in), h2:has(.slide-in), h3:has(.slide-in){ overflow-x:clip; }
.slide-in{ display:inline-block; opacity:0; transform:translateX(1.1em);
 transition:opacity 1.25s ease, transform 1.7s cubic-bezier(.12,.72,.2,1); }
.slide-in.is-in{ opacity:1; transform:none; }
/* слова появляются по очереди, спокойно */
.slide-words .slide-in:nth-child(2){ transition-delay:.42s; }
.slide-words .slide-in:nth-child(3){ transition-delay:.84s; }
.slide-in.sd-2{ transition-delay:.72s; }
.slide-in.sd-3{ transition-delay:.84s; }
@media (prefers-reduced-motion:reduce){ .slide-in{ opacity:1; transform:none; transition:none } }

/* Футер: спокойный нейтральный графит вместо глубокого чёрного */
.footer-tone{ background:var(--c-graphite); overflow:hidden; }
/* верхний отступ футера уменьшен на 15%: 4rem/5rem → 3.4rem/4.25rem */
@media (min-width:768px){ footer#stopka{ padding-top:1rem !important; } }
.footer-link{ color:rgba(255,255,255,.72); transition:color .25s ease; }
.footer-link:hover{ color:var(--c-paper); }

/* Колонки, перенесённые из футера в блок 24/7 */
.fl-cols{ display:grid; grid-template-columns:1fr; gap:2.75rem 2rem;
 margin-top:4rem; padding-top:2.5rem;
 border-top:1px solid rgba(255,255,255,.16); }
.footer-tone .fl-cols{ margin-top:0; padding-top:0; border-top:none;
 /* меню опущено вниз; может заходить на декоративный логотип */
 position:relative; z-index:2;
 /* меню поднято вверх; на габариты футера не влияет */
 transform:translateY(21%); }
@media (min-width:640px){ .fl-cols{ grid-template-columns:repeat(3,1fr); gap:2rem; } }
/* левый край колонок футера – в одной оси с «/ Usługa» в секциях */
.footer-tone .fl-cols{ padding-left:1.75rem; }
@media (min-width:640px){ .footer-tone .fl-cols{ padding-left:3rem; } }
@media (min-width:1024px){ .footer-tone .fl-cols{ padding-left:3.5rem; } }
/* единый кикер разделов: «/ Название», всегда вверху блока */
.kicker{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif;
 text-transform:uppercase; letter-spacing:.22em; font-size:12px;
 font-weight:600; line-height:1; margin:0 0 1.5rem; color:var(--c-ink); }
.kicker--light{ color:var(--c-ochre); }
.fl-h{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.2em; font-size:12px; color:rgba(255,255,255,.45);
 /* тонкая линия-волосок под заголовком колонки – на 55% короче колонки */
 position:relative; padding-bottom:.55rem; margin-bottom:.9rem; }
.fl-h::after{ content:""; position:absolute; left:0; bottom:0;
 width:45%; height:1px; background:rgba(255,255,255,.14); }
.fl-list{ display:flex; flex-direction:column; align-items:flex-start; gap:.18rem; }
.fl-note{ margin-top:1.6rem; font-size:16px; line-height:1.6; color:rgba(255,255,255,.7); }
.fl-note strong{ color:var(--c-paper); font-weight:600; }
.fl-note .fl-soft{ color:rgba(255,255,255,.45); }
/* Пункт: обычное начертание – тонкое, при наведении – прежнее полужирное.
   Эффект выталкивания копии снизу временно отключён. */
.fl-link{ display:inline-flex; align-items:center; gap:10px;
 font-size:17px; font-weight:400; line-height:1.35;
 color:rgba(255,255,255,.78);
 transition:color .25s ease; }
.fl-link:hover, .fl-link:focus-visible{ font-weight:600; }
.fl-link svg{ width:16px; height:16px; flex:0 0 auto; }
/* ширина ячейки держится по «жирной» копии – при наведении текст не прыгает */
.fl-link .nl-swap{ display:inline-grid; overflow:visible; }
.fl-link .nl-swap > span{ grid-area:1 / 1; white-space:nowrap; transition:none; }
.fl-link .nl-b{ font-weight:600; visibility:hidden; opacity:0; transform:none; }

/* Колонка «Gdzie działamy» в футере – три смысловых блока вместо одного абзаца */
.fl-where{ display:flex; flex-direction:column; gap:.75rem; }

/* «Gdzie działamy» внутри тёмного блока Informacje kontaktowe */
.k-where{ margin-top:2.6rem; display:grid; gap:1.5rem; }
@media (min-width:640px){ .k-where{ grid-template-columns:1fr 1fr; gap:2rem; } }
.k-where-item{ display:flex; flex-direction:column; gap:.35rem;
 padding-top:.9rem; border-top:2px solid rgba(255,255,255,.2); }
.k-where-h{ font-weight:700; font-size:19px; letter-spacing:-.01em; }
.k-where-t{ font-size:15.5px; line-height:1.5; color:rgba(255,255,255,.6); }
.k-where-link{ display:inline-flex; align-items:center; gap:10px; margin-top:1.5rem;
 font-weight:600; font-size:17px; color:var(--c-ochre);
 transition:color .25s ease; }
.k-where-link:hover, .k-where-link:focus-visible{ color:var(--c-paper); }
.k-where-link svg{ width:16px; height:16px; flex:0 0 auto; transition:transform .25s cubic-bezier(.2,.7,.25,1); }
.k-where-link:hover svg, .k-where-link:focus-visible svg{ transform:translateX(4px); }
@media (prefers-reduced-motion:reduce){ .k-where-link svg{ transition:none; } }
/* В CTA-ряду hero подстраниц ссылка стоит сразу за кнопкой: общий margin-top:1.5rem опускал её текст
   на 12px ниже текста кнопки. Только от 640px, где ряд горизонтальный; на телефоне кнопка и ссылка
   идут друг под другом, и этот отступ там нужен – расстояние остаётся прежним */
@media (min-width:640px){ .btn + .k-where-link{ margin-top:0; } }
.fl-where .fl-w-item{ display:flex; flex-direction:column; gap:.12rem; }
.fl-where .fl-w-item .fl-soft{ font-size:15px; line-height:1.5; }
.fl-where .fl-w-link{ margin-top:.1rem; }

/* Секция #gdzie – тёмная плита в стиле hero-плиты (.slab) */
.gdz-cell + .gdz-cell{ border-top:1px solid rgba(255,255,255,.15); }
@media (min-width:1024px){
  .gdz-cell + .gdz-cell{ border-top:0; border-left:1px solid rgba(255,255,255,.15); }
}
.gdz-full{ margin-top:.75rem; font-size:15.5px; line-height:1.5;
 color:rgba(255,255,255,.6); max-width:38ch; }
/* обе колонки: блок адреса стартует на одной высоте */
@media (min-width:1024px){ .gdz-full{ min-height:3em; } }
.gdz-meta{ margin-top:1.7rem; display:grid; gap:.95rem; }
.gdz-meta > div{ display:grid; grid-template-columns:minmax(0,9.5ch) 1fr;
 gap:1.1rem; align-items:baseline; }
@media (max-width:479px){
  .gdz-meta > div{ grid-template-columns:1fr; gap:.2rem; }
}
/* Две карточки урядов делят общие строки (subgrid): подпись, заголовок, описание, четыре строки
   таблицы, «Jakie dokumenty…», список. Раньше высоты совпадали только потому, что тексты были
   подогнаны по две строки; теперь строки выровнены при любой длине текста (21.09.2026).
   9 = число детей .gdz-cell с учётом четырёх строк dl; добавляешь строку в dl – правь оба span.
   Только от 1024px: ниже карточки идут друг под другом, выравнивать нечего. */
@media (min-width:1024px){
  @supports (grid-template-rows:subgrid){
    .gdz-cell{ display:grid; grid-template-rows:subgrid; grid-row:span 9; }
    .gdz-meta{ grid-template-rows:subgrid; grid-row:span 4; }
  }
}
.gdz-meta dt{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.14em; font-size:11px; font-weight:700; color:rgba(255,255,255,.45); }
.gdz-meta dd{ margin:0; font-size:16px; line-height:1.45; }
.gdz-fee{ font-weight:700; color:var(--c-ochre); font-variant-numeric:tabular-nums; }
.gdz-docs-h{ position:relative; margin-top:2rem; padding-top:1.1rem;
 font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.14em; font-size:12px; font-weight:700; color:rgba(255,255,255,.55); }
.gdz-docs-h::before{ content:""; position:absolute; left:0; top:0;
 width:34px; height:2px; background:rgba(255,255,255,.28); }
.gdz-docs{ margin-top:.95rem; display:grid; gap:.8rem; }
.gdz-docs li{ font-size:15.5px; line-height:1.5; color:rgba(255,255,255,.6); }
.gdz-docs li b{ color:var(--c-paper); font-weight:700; }
.gdz-note{ margin-top:2px; padding:1.35rem 1rem 1.5rem;
 border-top:1px solid rgba(255,255,255,.15); }
@media (min-width:640px){ .gdz-note{ padding:1.5rem 1.5rem 1.6rem; } }
.gdz-note p{ font-size:16px; line-height:1.6; color:rgba(255,255,255,.65); max-width:78ch; }
.gdz-note p b{ color:var(--c-paper); font-weight:700; }

/* Светлый вариант плиты (.gdz--light) – /kontakt/: MSZ и Sąd на светло-серой плашке bg-sand с радиусом 26px,
   как «Cena i termin» на /tlumaczenia-przysiegle/ (21.09.2026: на чёрной плите мелкий серый текст не читался).
   Класса .slab у светлой плиты нет намеренно – наблюдатель шапки считает .slab тёмной зоной и красит меню в белый.
   Основной текст 17px, как в остальных светлых плашках; строки таблицы разделены тонкой линией, как в .faq-price;
   сумма сбора чёрная – охра на сером не читается. Тёмная плита на /apostille/ и /tlumaczenia-przysiegle/ не меняется. */
.gdz--light .gdz-cell + .gdz-cell{ margin-top:2.25rem; padding-top:2.25rem; border-top:1px solid rgba(31,33,32,.15); }
@media (min-width:1024px){
  .gdz--light .gdz-cell{ padding-right:3rem; }
  .gdz--light .gdz-cell + .gdz-cell{ margin-top:0; padding:0 0 0 3rem; border-top:0; border-left:1px solid rgba(31,33,32,.15); }
}
.gdz--light .slab-kicker{ font-size:12px; color:rgba(31,33,32,.7); }
.gdz--light .gdz-full{ font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); max-width:40ch; }
.gdz--light .gdz-meta{ gap:.85rem; }
.gdz--light .gdz-meta > div{ padding-top:.85rem; border-top:1px solid rgba(31,33,32,.12); }
.gdz--light .gdz-meta dt{ font-size:12px; color:rgba(31,33,32,.7); }
.gdz--light .gdz-meta dd{ font-size:17px; line-height:1.5; }
.gdz--light .gdz-fee{ color:inherit; }
.gdz--light .gdz-docs-h{ color:rgba(31,33,32,.7); }
.gdz--light .gdz-docs-h::before{ background:rgba(31,33,32,.3); }
.gdz--light .gdz-docs li{ font-size:17px; color:rgba(31,33,32,.75); }
.gdz--light .gdz-docs li b{ color:var(--c-ink); }
.gdz--light .gdz-note{ margin-top:2.5rem; padding:1.6rem 0 0; border-top-color:rgba(31,33,32,.15); }
.gdz--light .gdz-note p{ font-size:17px; color:rgba(31,33,32,.75); }
.gdz--light .gdz-note p b{ color:var(--c-ink); }
/* Две колонки, справа оба суда одной карточкой (.gdz--duo, /kontakt/ PL): структуры колонок разные,
   поэтому общие строки (subgrid выше) здесь отключены. Внутри судебной карточки: сверху общее для обоих
   судов (часы двумя строками, сбор с одним описанием), ниже два блока .gdz-court одинакового строения.
   Жирных разделительных линий нет (Грег, 21.09.2026: «толстые разделительные линии убрать») – блоки
   разводят воздух и двухстрочный заголовок: название суда жирным, «lewy / prawy brzeg Wisły» – лёгким курсивом. */
/* между карточками в разметке стоит тезис .gdz-key, поэтому вторая карточка – через «~», а не «+» */
.gdz--duo .gdz-cell ~ .gdz-cell{ margin-top:2.75rem; padding-top:2.75rem; border-top:1px solid rgba(31,33,32,.15); }
/* Тезис на жёлтой вставке (terra) внутри песочной карточки – тот же приём, что блок «Osobiście» выше на странице
   (Грег, 22.09.2026, выбрал из трёх вариантов). Текст чернильный, серые 75% внутри жёлтого не читаются – все 100%. */
.gdz--duo .gdz-key{ margin-top:2.75rem; padding:1.6rem 1.5rem 1.7rem; border-radius:18px; background:var(--c-terra); color:var(--c-ink); }
/* Пиктограмма Грега (здание с рукопожатием) в правом верхнем углу вставки, как знаки в карточках урядов;
   заголовок получает отступ справа, чтобы не заходить под неё. */
.gdz--duo .gdz-key{ position:relative; }
.gdz-key-ico{ position:absolute; top:1.5rem; right:1.5rem; width:40px; height:auto; pointer-events:none; opacity:.85; }
.gdz--duo .gdz-key .gdz-key-t{ padding-right:56px; }
@media (min-width:640px){ .gdz-key-ico{ width:50px; } .gdz--duo .gdz-key .gdz-key-t{ padding-right:70px; } }
@media (min-width:1024px){ .gdz-key-ico{ top:1.9rem; right:2rem; } }
.gdz--duo .gdz-key .gdz-key-s{ color:inherit; }
@media (min-width:1024px){
  .gdz--duo .gdz-cell{ display:block; grid-row:auto; }
  .gdz--duo .gdz-meta{ grid-template-rows:none; grid-row:auto; }
  /* правая карточка (суды) выше левой: она занимает все три строки сетки, а под MSZ встают тезис .gdz-key
     и .gdz-aside – примечание о порядке и источники; низ .gdz-aside совпадает с низом правой колонки */
  .gdz--duo .gdz-grid{ grid-template-rows:auto auto 1fr; }
  .gdz--duo .gdz-cell ~ .gdz-cell{ grid-column:2; grid-row:1 / span 3; margin-top:0; padding:0 0 0 3rem;
    border-top:0; border-left:1px solid rgba(31,33,32,.15); }
  .gdz--duo .gdz-key{ grid-column:1; grid-row:2; margin:3.25rem 3rem 0 0; padding:1.9rem 2rem 2.1rem; }
  .gdz--duo .gdz-aside{ grid-column:1; grid-row:3; align-self:end; padding-right:3rem; }
}
/* на телефоне .gdz-aside идёт после обеих карточек */
.gdz--duo .gdz-aside{ margin-top:2.75rem; }
.gdz--duo .gdz-aside .gdz-note{ margin-top:0; }
/* общее для обоих судов – под описанием карточки: подпись «W obu sądach tak samo», часы и сбор */
.gdz-sub{ margin-top:1.9rem; font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.16em; font-size:12px; font-weight:700; color:rgba(31,33,32,.6); }
.gdz-meta--shared{ margin-top:.9rem; }
/* часы – не в строчку: день слева, время жирным, цифры равной ширины. Кегль – как у остального текста строк (17px):
   сначала время стояло 21px и на телефоне сравнялось с заголовком карточки (22px) – Грег, 22.09.2026: «время работы
   размером с заголовок». Акцент здесь даёт вес, а не размер; размером выделяются только заголовки. */
.gdz-hours{ display:grid; gap:.1rem; }
.gdz-hr{ display:grid; grid-template-columns:6.5ch 1fr; align-items:baseline; }
/* День и часы – одним цветом и почти одним весом: серый день на сером фоне читался плохо, а 700 рядом с ним бил контрастом. */
.gdz-hr-d{ color:inherit; }
.gdz-hr b{ font-weight:600; font-variant-numeric:tabular-nums; }
/* MSZ: «Przyjęcia», а не «Godziny urzędowania» – часов приёма министерство не публикует, приём только на
   зарезервированную в e-Konsulat минуту. Подано той же сеткой, что часы судов: «pn.–pt. · tylko z rezerwacją»,
   ниже пояснение обычным текстом (Грег, 22.09.2026: «чёткие так же, и потом описание»). */
.gdz-hr-s{ margin-top:.35rem; }
/* Строка сбора в карточках урядов (/kontakt/): сумма – смысловой узел, подана как цена в /cennik/ v2:
   «60,- zł» 24/28px weight 800, за ней на той же строке единица кикером «/ dokument»; ниже обычным текстом –
   как платить, отдельной строкой жирным то, что ловит людей у окна: кассы в уряде нет.
   Терракотовая полоса под цифрами была и снята (Грег, 22.09.2026: «убрать маркер»). */
.gdz-fee-dd{ display:grid; gap:.3rem; }
.gdz-fee-l{ display:flex; align-items:baseline; gap:.6em; margin:0 0 .3rem; line-height:1.1; }
/* Кегль – ступенью ниже заголовка карточки (22px до 768px, 28px от 768px) и выше текста строк (17px):
   20px и 22px. Копия кегля из ценника (24/28) оказывалась крупнее заголовка – Грег, 22.09.2026. */
.gdz-fee-l .gdz-fee{ font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--c-ink);
 white-space:nowrap; font-variant-numeric:tabular-nums; }
@media (min-width:768px){ .gdz-fee-l .gdz-fee{ font-size:22px; } }
.gdz-fee-k{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.1em; font-size:12px; font-weight:500; color:rgba(31,33,32,.6); white-space:nowrap; }
/* Пояснение под суммой и под «Rezerwacja» – тем же цветом, что остальные значения таблицы (100% ink):
   при 75% внутри одной строки dl стояли два серых, и блок пестрил (Грег, 22.09.2026: «в каждом своя степень серого»).
   Правило блока: подписи (dt, кикеры, «brzeg Wisły») – 60%, описательные абзацы вне таблицы – 75%, таблица – 100%. */
.gdz-fee-s{ display:block; font-size:16px; line-height:1.45; color:inherit; }
.gdz-fee-s b{ font-weight:700; }
.gdz-courts{ margin-top:2.8rem; display:grid; gap:2.8rem; }
/* название суда – ступенью ниже заголовка карточки на любой ширине: заголовок 22px до 768px и 28px от 768px,
   название – 19px и 24px (фиксированные 24px на телефоне оказывались крупнее заголовка карточки) */
.gdz-court-h{ font-size:19px; font-weight:800; letter-spacing:-.03em; line-height:1.12; }
@media (min-width:768px){ .gdz-court-h{ font-size:24px; line-height:1.08; } }
/* Знак в углу карточки урядов – пиктограммы Грега (22.09.2026: документы с печатью для MSZ, глобус с молотком для судов)
   вместо логотипа MSZ и герба: чужие знаки на коммерческом сайте – риск, см. разговор 22.09.2026.
   Чернильные, 40px на телефоне, 50px от 640px; контент рядом получает отступ справа. */
.gdz--crest .gdz-cell{ position:relative; }
.gdz-crest{ position:absolute; top:0; right:0; width:40px; height:auto; pointer-events:none; opacity:.85; }
/* Карточка судов до 1024px идёт второй: у неё свой отступ сверху и линия – знак опускаем под них. */
.gdz--crest .gdz-cell ~ .gdz-cell .gdz-crest{ top:2.75rem; }
@media (min-width:1024px){ .gdz--crest .gdz-cell ~ .gdz-cell .gdz-crest{ top:0; } }
@media (min-width:640px){ .gdz-crest{ width:50px; } }
/* герб заканчивается внутри h3 – описанию .gdz-full правый отступ не нужен (22.09.2026: на 320 текст жался в 190px) */
.gdz--crest .gdz-cell :is(.slab-kicker, h3){ padding-right:62px; }
@media (min-width:640px){ .gdz--crest .gdz-cell :is(.slab-kicker, h3){ padding-right:76px; } }
/* От 1024px карточка MSZ упирается справа в линию колонки: знак отступает от неё на те же 3rem,
   что у карточки судов слева. */
@media (min-width:1024px){ .gdz--crest .gdz-cell:first-child .gdz-crest{ right:3rem; }
  .gdz--crest .gdz-cell:first-child :is(.slab-kicker, h3){ padding-right:calc(3rem + 76px); }
  .gdz--crest .gdz-cell:first-child .gdz-full{ padding-right:0; } }
.gdz-br{ display:none; }
@media (min-width:380px){ .gdz-br{ display:inline; } }
.gdz-court-side{ display:block; margin-top:.22em; font-weight:600; font-style:italic; font-size:14px; color:color-mix(in srgb, var(--c-ink) 60%, transparent); }
@media (min-width:768px){ .gdz-court-side{ font-size:17px; } }
.gdz-court .gdz-meta{ margin-top:1.1rem; }
/* Главный тезис плашки – «Opłaty urzędowe są już wliczone w nasze ceny»: самый крупный текст внутри плашки,
   пара «чёрное / лёгкий курсив», как в заголовках разделов, но начертания при прокрутке НЕ меняются –
   класс .h2-swap снят по просьбе Грега (21.09.2026: «не меняй начертаний при прокрутке»).
   Части стоят отдельными строками (block + <br> в разметке) – смена веса не меняет число строк и высоту.
   Раньше тезис стоял 15px серым в сноске, ссылка на прайс терялась (Грег, 21.09.2026). */
/* Тезис – заголовок того же уровня, что «MSZ» и «Sądy Okręgowe» в карточках: 22px до 768px, 28px от 768px,
   weight 700. Раньше 28–38px weight 900 – Грег, 22.09.2026: «почему такое конское, все заголовки одинаковые». */
.gdz-key-t{ font-size:22px; line-height:1.05; font-weight:700; letter-spacing:-.045em; }
.gdz-key-t .h2-a, .gdz-key-t .h2-b{ display:block; }
/* Вторая, курсивная строка тезиса – ступенью меньше первой (Грег, 22.09.2026): светлый курсив того же кегля
   выглядел шире жирной строки и спорил с ней. */
.gdz-key-t .h2-b{ font-size:.86em; margin-top:.05em; }
@media (min-width:768px){ .gdz-key-t{ font-size:28px; } }
.gdz-key-s{ margin-top:1rem; font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); max-width:40ch; }
/* ссылка-стрелка тезиса – строчная: при переносе текста на узком экране стрелка идёт за последним словом,
   а не уезжает к правому краю, как у inline-flex */
/* Абзац тезиса по образцу Apple: жирный вывод, дальше обычным пояснение в том же абзаце (Грег, 22.09.2026).
   Под ним одна ссылка-стрелка «przyjazd a zlecenie»; прайс ушёл в подвал плиты на её прежнее место (Грег, 22.09.2026). */
.gdz-key-s b{ font-weight:700; }
.gdz-key-more{ margin-top:.9rem; font-size:17px; line-height:1.4; }
.gdz-key-more .k-where-link{ display:inline; margin-top:0; }
.gdz-key-more .k-where-link svg{ display:inline-block; vertical-align:-.1em; margin-left:.5em; }
/* источники: тот же кегль 17px, ссылки чернильные полужирные с подчёркиванием – как ссылки в абзацах страницы */
/* Источники – подвал плиты «Gdzie»: общая линия на всю ширину; от 1024px слева фраза про часы (до 60ch),
   справа столбик «Źródła» со ссылками по строке. Первая версия – всё по правому краю в одну строку –
   Грег, 22.09.2026: «плохо и не читаемо». Кегль 17px как у текста плиты. */
.gdz-src{ margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid rgba(31,33,32,.15);
 display:grid; gap:1.2rem; font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); }
.gdz-src-p{ max-width:60ch; }
.gdz-src-h{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.16em; font-size:12px; font-weight:700; line-height:1.3; color:rgba(31,33,32,.6); }
.gdz-src-list{ margin-top:.45rem; display:grid; gap:.3rem; }
.gdz-src-list a{ color:var(--c-ink); font-weight:600; text-decoration:underline; text-decoration-thickness:1.5px;
 text-underline-offset:3px; }
@media (min-width:1024px){
  .gdz-src{ grid-template-columns:1fr auto; gap:3rem; align-items:start; }
  .gdz-src-box{ text-align:right; }
}

/* Футер: только крупный логотип и строка копирайта */
/* overflow не задаём: верх букв не срезается, а низ по-прежнему
   обрезает сам футер (.footer-tone{overflow:hidden; }) */
.footer-mark{ display:block; width:100%; color:var(--c-paper);
 position:relative; z-index:0;
 /* декоративный логотип наезжает на колонки контактов (margin-top -5.6rem)
 и перехватывал клики по последней ссылке – e-mail. Кликов не ловим. */
 pointer-events:none;
 /* --fm-gap – расстояние от колонок навигации до логотипа */
 /* -108px вместо -90px: футер ниже исходного, просвет над нижней строкой ~160px */
 --fm-gap:calc(-5.6rem - 108px); margin-top:var(--fm-gap);
 /* логотип опущен так, что уходит за нижний край окна на 0.22em;
 --fm-drop считается в скрипте (fit) */
 margin-bottom:0; top:var(--fm-drop, 0px);
 /* отступы от краёв окна: 36px, на мобильных – 12px */
 padding-left:12px; padding-right:12px; }
@media (min-width:640px){ .footer-mark{ padding-left:36px; padding-right:36px; } }
.footer-mark .logo{ opacity:.025; letter-spacing:-0.055em; line-height:.92;
 /* отступы срезаны – в футере меньше пустоты */
 padding:.04em 0 .04em;
 font-size:var(--fm-size, 24.6vw); white-space:nowrap; }
.footer-mark .logo b:nth-child(9){ color:var(--c-terra); }
/* нижняя строка футера: плашка убрана, логотип не перекрывается */
.footer-bar{ position:relative; z-index:1; background:transparent;
 padding-top:0; padding-bottom:6px; }
/* нижняя строка футера выровнена по левому краю колонок навигации */
.footer-bar-inner{ max-width:1320px; margin-left:auto; margin-right:auto;
 padding-left:calc(1.25rem + 1.75rem); padding-right:1.25rem; }
@media (min-width:640px){ .footer-bar-inner{ padding-left:calc(2rem + 3rem); padding-right:2rem; } }
@media (min-width:1024px){ .footer-bar-inner{ padding-left:calc(2rem + 3.5rem); } }

/* Блок 24/7 – левая колонка: прилипает примерно к середине высоты плашки.
   --s247-top      – на сколько отступить сверху в момент «замирания»
   --s247-bottom   – запас снизу, чтобы колонка отлипла до конца секции */
.s247-grid{ --s247-top: 22vh; }
.s247-col{ --s247-bottom: 4rem; }
/* правая колонка начинается там, где текст замирает */
@media (min-width:1024px){ .s247-aside{ margin-top: var(--s247-top); } }
/* нижняя строка блока: текст слева, юридические аккордеоны справа – по одной оси с сеткой выше */
.s247-bottom{ margin-top:3rem; }
@media (min-width:1024px){ .s247-bottom{ margin-top:5rem; } }
.s247-bottom .s247-foot{ margin-top:0; }
@media (min-width:1024px){
  .s247-col{
 position: sticky;
 top: var(--s247-top);
 align-self: start;
 margin-bottom: var(--s247-bottom);
  }
}
@media (prefers-reduced-motion:reduce){ .s247-col{ position:static } }

/* Блок 24/7: живой статус работы */
/* Юридические аккордеоны: во всю ширину блока, линейки и кегль как у FAQ, только на тёмном */
.ws-legal{ margin-top:3rem; border-top:1px solid rgba(255,255,255,.2); }
@media (min-width:1024px){ .ws-legal{ margin-top:4rem; } }
.ws-legal-item{ border:0; border-bottom:1px solid rgba(255,255,255,.2); }
.ws-legal summary{ cursor:pointer; list-style:none; }
.ws-legal summary::-webkit-details-marker{ display:none; }
/* плавное раскрытие – как у «godziny pracy» */
.legal-wrap{ display:grid; grid-template-rows:0fr; opacity:0;
 --ws-open:1.05s; --ws-close:.8s;
 transition:grid-template-rows var(--ws-close) cubic-bezier(.2,.7,.25,1),
 opacity calc(var(--ws-close) * .7) ease,
 margin-bottom var(--ws-close) cubic-bezier(.2,.7,.25,1);
 margin-top:0; margin-bottom:0; }
.legal-wrap > *{ overflow:hidden; min-height:0; margin-top:0; }
.ws-legal-item.is-open .legal-wrap{ grid-template-rows:1fr; opacity:1; margin-bottom:1.5rem;
 transition:grid-template-rows var(--ws-open) cubic-bezier(.16,.84,.3,1),
 opacity calc(var(--ws-open) * .8) ease,
 margin-bottom var(--ws-open) cubic-bezier(.16,.84,.3,1); }
@media (prefers-reduced-motion:reduce){ .legal-wrap{ transition:none } }
.human-note{ display:flex; gap:14px; align-items:flex-start; padding-top:20px;
 font-size:16px; line-height:1.55; color:rgba(255,255,255,.7); }
.human-note b{ color:var(--c-paper); font-weight:700; }
.human-mark{ flex:0 0 auto; width:34px; height:34px; border-radius:999px;
 border:1px solid rgba(255,255,255,.3); display:flex; align-items:center;
 justify-content:center; color:var(--c-paper); }
.human-mark svg{ width:19px; height:19px; }

/* Блок 24/7 – без плашки: крупные часы, крупный график, календарь свят */
/* блок начинается от двоеточия часов: половина ширины + подгонка --ws-meta-nudge */
.ws-meta{ --ws-meta-nudge:-.18em;
 margin-left:50%; width:max-content;
 /* блок начинается от середины колонки, поэтому его предел – оставшаяся половина,
    а не вся ширина: при max-width:100% строка часового пояса вылезала за колонку
    и давала горизонтальную прокрутку страницы на узких экранах (20.09.2026) */
 max-width:50%;
 transform:translateX(var(--ws-meta-nudge)); }
/* статус скрыт вместе с графиком и проявляется при наведении */
.ws-top{ opacity:0; transform:translateY(-4px);
 transition:opacity .3s ease, transform .3s ease;
 margin-top:14px; display:flex; align-items:center; justify-content:flex-start; gap:11px;
 font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.2em; font-size:12px; font-weight:700; color:rgba(255,255,255,.62); }
.ws-dot{ width:10px; height:10px; border-radius:50%; flex:0 0 auto; background:var(--c-ochre); }
.ws.is-open .ws-dot{ background:var(--c-ochre); animation:ws-pulse 2.4s ease-out infinite; }
.ws.is-closed .ws-dot{ background:rgba(255,255,255,.38); animation:none; }
@keyframes ws-pulse{
  0%{ box-shadow:0 0 0 0 rgba(209,246,79,.55) }
  70%{ box-shadow:0 0 0 10px rgba(209,246,79,0) }
  100%{ box-shadow:0 0 0 0 rgba(209,246,79,0) }
}
/* часы: +40% к кеглю, по центру колонки (в одной оси с календарём),
   --ws-clock-track – разрядка между цифрами */
.ws-clock{ margin-top:12px; display:flex; align-items:baseline; justify-content:flex-end;
 gap:0; text-align:right;
 --ws-clock-track:-.045em;
 font-size:var(--ws-clock-size); font-weight:900; line-height:.88;
 letter-spacing:var(--ws-clock-track); font-variant-numeric:tabular-nums;
 color:var(--c-paper); }
/* секунды слегка наезжают на последнюю цифру минут – --ws-sec-lap */
.ws-clock .ws-sec{ font-size:.34em; font-weight:900; letter-spacing:.04em; color:var(--c-ochre);
 --ws-sec-lap:-.14em; margin-left:var(--ws-sec-lap); position:relative; z-index:1; }
/* дата и часы в общей колонке по ширине часов – дата равняется по их правому краю */
.ws-timeblock{ --ws-clock-size:clamp(81px,10.1vw,123px);
 --ws-date-pad:.54; /* доля ширины часов, которую занимают секунды */
 width:max-content; max-width:100%; margin-left:auto; margin-right:0; }
/* дата набрана так же, как заголовок календаря (.cal-title) */
.ws-date{ margin-bottom:10px; text-align:right;
 padding-right:calc(var(--ws-clock-size) * var(--ws-date-pad));
 font-size:21px; font-weight:800; letter-spacing:-.02em;
 color:var(--c-paper); }

/* строка часового пояса под часами */
.ws-tz{ margin-top:10px; display:flex; flex-wrap:wrap; justify-content:flex-start;
 align-items:center; column-gap:10px; row-gap:4px;
 font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.18em; font-size:12px; font-weight:700;
 color:rgba(255,255,255,.55); }
.ws-tz > span + span{ margin-left:10px; }
.ws-tz-off{ color:var(--c-ochre); }
.ws-tz-dst{ position:relative; padding-left:12px; }
.ws-tz-dst::before{ content:''; position:absolute; left:0; top:50%; width:4px; height:4px;
 margin-top:-2px; border-radius:50%; background:rgba(255,255,255,.35); }

/* часы работы: скрыты, раскрываются при наведении на часы */
/* область наведения шире самих часов примерно на 40% –
   --ws-hit-y / --ws-hit-x задают, насколько она выступает за края */
.ws-clockbox{ outline:none; --ws-hit-y:1.6rem; --ws-hit-x:2rem;
 padding:var(--ws-hit-y) var(--ws-hit-x);
 margin:calc(var(--ws-hit-y) * -1) calc(var(--ws-hit-x) * -1);
 border-radius:20px; }
/* на узких экранах поле страницы 20px, и боковой вынос области наведения (32px) вылезал
   за край окна – прокрутка вправо на 12px. Там, где мыши нет, вынос по горизонтали не нужен. */
@media (max-width:639px){ .ws-clockbox{ --ws-hit-x:0rem; } }
/* --ws-open – скорость раскрытия, --ws-close – скорость сворачивания */
.ws-hours-wrap{ display:grid; grid-template-rows:0fr; opacity:0;
 --ws-open:1.05s; --ws-close:.8s;
 transition:grid-template-rows var(--ws-close) cubic-bezier(.2,.7,.25,1),
 opacity calc(var(--ws-close) * .7) ease,
 margin-top var(--ws-close) cubic-bezier(.2,.7,.25,1);
 margin-top:0; }
.ws-hours-wrap > *{ overflow:hidden; min-height:0; }
.ws-clockbox.is-open .ws-top{ opacity:1; transform:none; }
.ws-clockbox.is-open .ws-hours-wrap{ grid-template-rows:1fr; opacity:1; margin-top:8px;
 transition:grid-template-rows var(--ws-open) cubic-bezier(.16,.84,.3,1),
 opacity calc(var(--ws-open) * .8) ease,
 margin-bottom var(--ws-open) cubic-bezier(.16,.84,.3,1); }
@media (prefers-reduced-motion:reduce){
  .ws-hours-wrap{ transition:none }
}
@media (hover:none){
  .ws-hours-wrap{ grid-template-rows:1fr; opacity:1; margin-top:8px; }
  .ws-top{ opacity:1; transform:none; }
}

.ws-msg{ margin-top:16px; font-size:15.5px; line-height:1.5; color:rgba(255,255,255,.62);
 /* строка не влезала в колонку при nowrap и тянула горизонтальную прокрутку всей страницы
    на экранах до ~1200px; теперь переносится, на широких остаётся одной строкой (20.09.2026) */
 text-wrap:balance; }
.ws-hours{ margin-top:18px; display:flex; flex-direction:column; list-style:none; padding:0; }
.ws-hours li{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
 padding:10px 0;
 font-size:19px; font-weight:600; color:rgba(255,255,255,.52); }
.ws-hours li > span:last-child{ font-size:27px; font-weight:800; letter-spacing:-.025em;
 color:var(--c-paper); }
/* названия дней – белым, пояснения справа – серым */
.ws-hours li > span:first-child{ color:var(--c-paper); }
.ws-hours .ws-soft{ color:rgba(255,255,255,.34) !important; }
.ws-hours .ws-off{ color:rgba(255,255,255,.34) !important; }
.ws-hours li.is-now > span{ color:var(--c-ochre) !important; }
.ws-cta{ margin-top:26px; display:inline-flex; align-items:center; gap:0;
 background:var(--c-ink); color:var(--c-ochre); border:2px solid var(--c-ochre);
 border-radius:12px; padding:16px 22px; font-size:16px; font-weight:700;
 transition:background-color .25s ease, color .25s ease; }
.ws-cta:hover, .ws-cta:focus-visible{ background:var(--c-ochre); color:var(--c-ink); }
/* стрелка выезжает только при наведении — общий приём для всех CTA-кнопок (.btn-mark в HTML) */
.ws-cta-mark, .btn-mark{ display:inline-grid; grid-template-columns:0fr; opacity:0;
 transition:grid-template-columns .38s cubic-bezier(.2,.7,.25,1), opacity .28s ease; }
.ws-cta-mark > span, .btn-mark > span{ overflow:hidden; display:flex; align-items:center; padding-left:9px; }
.ws-cta:hover .ws-cta-mark, .ws-cta:focus-visible .ws-cta-mark,
:is(a,button):hover > .btn-mark, :is(a,button):focus-visible > .btn-mark{ grid-template-columns:1fr; opacity:1; }
@media (prefers-reduced-motion:reduce){ .ws-cta-mark, .btn-mark{ transition:opacity .2s ease } }

/* ===== Кнопки =====
   Фон – цвет секции (прозрачный), обводка акцентом, текст наследует цвет контекста
   и при наведении не меняется. Наведение: сплошная заливка охрой, текст – чернила
   (на светлых секциях он и так чернильный, меняется только на тёмных).
   Стрелка: у кнопок с .btn-mark выезжает сама разметка, у остальных – ::after. */
.btn{ background-color:transparent; color:inherit;
 border:2px solid var(--c-terra); border-radius:12px;
 transition:background-color .3s ease, border-color .3s ease; }
.btn:hover, .btn:focus-visible{ background-color:var(--c-terra); color:var(--c-ink); }
/* Кнопка на жёлтой плашке (.bg-terra): обводка охрой сливалась с фоном, и кнопка выглядела как просто текст
   (/kontakt/, /apostille-ukraina/, главная). Здесь обводка чернильная, наведение – заливка чернилами, текст белый. */
.bg-terra .btn{ border-color:var(--c-ink); }
.bg-terra .btn:hover, .bg-terra .btn:focus-visible{ background-color:var(--c-ink); color:var(--c-paper); }

/* Вариант .btn--pop: инверсия обычной кнопки.
   В покое – сплошная заливка охрой без обводки; при наведении заливка уплывает
   вниз по диагонали (приём с mammothmurals.com: 3D-разворот слоя + translateY),
   а следом проявляется обводка. Стрелка видна всегда, не только на наведении. */
.btn--pop{ position:relative; overflow:clip; isolation:isolate; perspective:600px;
 background-color:transparent; color:var(--c-ink); border-color:transparent;
 transition:border-color .3s ease .18s, color .3s ease; }
.btn--pop::before{ content:''; position:absolute; inset:-1px; z-index:-1; border-radius:inherit;
 background:var(--c-terra); transform-style:preserve-3d; transform-origin:0 100%;
 transform:none; transition:transform .5s cubic-bezier(.2,.7,.25,1); }
.btn--pop:hover, .btn--pop:focus-visible{ background-color:transparent; color:inherit;
 border-color:var(--c-terra); }
.btn--pop:hover::before, .btn--pop:focus-visible::before{
 transform:rotateX(28deg) rotateY(28deg) rotate(10deg) translateY(105%); }
/* стрелка у этой кнопки раскрыта постоянно */
.btn--pop > .btn-mark{ grid-template-columns:1fr; opacity:1; }
/* на жёлтой плашке (.bg-terra) заливка чернильная, текст белый; наведение – обводка и текст чернилами */
.bg-terra .btn--pop{ color:var(--c-paper); border-color:transparent; }
.bg-terra .btn--pop::before{ background:var(--c-ink); }
.bg-terra .btn--pop:hover, .bg-terra .btn--pop:focus-visible{ background-color:transparent; color:var(--c-ink); border-color:var(--c-ink); }
@media (prefers-reduced-motion:reduce){
  .btn--pop::before{ transition:opacity .2s ease; transform:none; }
  .btn--pop:hover::before{ opacity:0; } }

.btn:not(:has(.btn-mark))::after{
 content:''; display:inline-block; flex:0 0 auto; width:0; opacity:0;
 height:1.05em; background:currentColor; vertical-align:-.12em;
 -webkit-mask:var(--chev) no-repeat center / contain;
 mask:var(--chev) no-repeat center / contain;
 --chev:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 4l8 8-8 8' fill='none' stroke='%23000' stroke-width='3.4'/%3E%3C/svg%3E");
 transition:width .38s cubic-bezier(.2,.7,.25,1), margin-left .38s cubic-bezier(.2,.7,.25,1), opacity .28s ease; }
.btn:not(:has(.btn-mark)):hover::after,
.btn:not(:has(.btn-mark)):focus-visible::after{ width:1.05em; margin-left:9px; opacity:1; }
@media (prefers-reduced-motion:reduce){
  .btn:not(:has(.btn-mark))::after{ transition:opacity .2s ease; width:1.05em; margin-left:9px; opacity:0; }
  .btn:not(:has(.btn-mark)):hover::after{ opacity:1; } }

/* Календарь: красным обведены дни, когда urzędy nie pracują */
.cal{ position:relative; margin-top:30px; padding-top:24px; }
.cal-head{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.cal-title{ font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--c-paper);
 text-transform:capitalize; }
.cal-nav{ margin-left:auto; display:flex; gap:4px; }
.cal-btn{ width:34px; height:34px; border:0; background:none; padding:0; cursor:pointer;
 color:rgba(255,255,255,.55); display:flex; align-items:center; justify-content:center;
 transition:color .2s ease; }
.cal-btn:hover{ color:var(--c-ochre); }
.cal-btn:focus-visible{ outline:2px solid var(--c-ochre); outline-offset:2px; }
.cal-btn svg{ width:15px; height:15px; }
.cal-btn.is-prev svg{ transform:rotate(180deg); }
.cal-grid{ display:grid; grid-template-columns:repeat(7,1fr); }
/* календарь не растягивается: на планшете и в узком окне (560–1023px) колонка одна, и сетка расходилась
   до 137px на день. Потолок 495px – ширина календаря на главной от 1440px, её Грег назвал образцом
   (21.09.2026: «нельзя растягивать даты календаря… как был, стабильно такой»). Блок окон встречи под
   календарём держит ту же ширину, чтобы колонка не ломалась */
.cal-head, .cal-grid, .cal-book{ max-width:495px; }
.cal-wd{ font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.12em; font-size:11px; font-weight:700; text-align:center;
 padding-bottom:8px; color:rgba(255,255,255,.36); }
.cal-cell{ height:42px; display:flex; align-items:center; justify-content:center;
 font-size:16px; font-weight:600; color:rgba(255,255,255,.8); }
.cal-cell.is-weekend{ color:rgba(255,255,255,.34); }
.cal-cell.is-today{ color:var(--c-ochre); font-weight:800; }
.cal-hol{ appearance:none; background:none; font:inherit; color:var(--c-paper);
 cursor:default; width:36px; height:36px; border-radius:999px; padding:0;
 border:2px solid var(--c-red); display:flex; align-items:center; justify-content:center;
 transition:background-color .2s ease, color .2s ease; }
.cal-hol:hover, .cal-hol:focus-visible{ background:var(--c-red); color:var(--c-ink); outline:none; }
.cal-cell.is-today .cal-hol{ color:var(--c-ochre); }
.cal-tip{ position:absolute; z-index:6; transform:translate(-50%,-100%);
 width:max-content; max-width:min(360px, 100%); text-align:center; pointer-events:none;
 background:var(--c-paper); color:var(--c-ink); border-radius:14px; padding:12px 18px;
 font-size:16px; font-weight:700; line-height:1.3; letter-spacing:-.01em;
 box-shadow:0 16px 40px rgba(31,33,32,.45);
 opacity:0; transition:opacity .18s ease; }
.cal-tip.is-on{ opacity:1; }
.cal-note{ margin-top:14px; display:flex; align-items:center; gap:9px;
 font-size:16px; line-height:1.45; color:rgba(255,255,255,.55); }
.cal-note i{ flex:0 0 auto; width:13px; height:13px; border-radius:999px;
 border:2px solid var(--c-red); }
/* Запись на встречу (#cal[data-book]): рабочий день – кнопка того же размера, что кружок
   праздника; вид сетки не меняется, пока на день не навели или его не выбрали */
.cal-day{ appearance:none; -webkit-appearance:none; background:none; font:inherit; color:inherit;
 cursor:pointer; width:36px; height:36px; border-radius:999px; padding:0; margin:0;
 border:2px solid transparent; display:flex; align-items:center; justify-content:center;
 -webkit-tap-highlight-color:transparent;
 transition:background-color .2s ease, border-color .2s ease, color .2s ease; }
.cal-day:focus-visible{ border-color:var(--c-ochre); outline:none; }
@media (hover:hover){ .cal-day:hover{ border-color:var(--c-ochre); } }
/* доступные дни видны сразу: светлая подложка, как серые плитки у sakib.design */
[data-book] .cal-day{ background:rgba(255,255,255,.1); color:var(--c-paper); }
/* прошедшие будни гаснут, чтобы не спорить с доступными, но остаются светлее выходных –
   сб и вс сохраняют свой серый (.34) во всей сетке */
[data-book] .cal-cell.is-past{ color:rgba(255,255,255,.58); }
[data-book] .cal-cell.is-past.is-weekend{ color:rgba(255,255,255,.34); }
[data-book] .cal-cell.is-past .cal-hol{ color:inherit; }
/* прошедший день на наведение не отвечает (крестик на месте числа Грег убрал 21.09.2026) */
[data-book] .cal-cell.is-past{ cursor:default; }
@media (hover:hover){ [data-book] .cal-cell .cal-day:hover{ background:rgba(255,255,255,.18); } }
/* дни соседних месяцев: недоступные – самые тусклые, доступные – с обычной подложкой */
[data-book] .cal-cell.is-out{ color:rgba(255,255,255,.22); }
[data-book] .cal-cell.is-out.is-past:not(.is-weekend){ color:rgba(255,255,255,.3); }
/* сегодня (Грег, 21.09.2026): серый кружок, как у остальных доступных дней, цифра охристая, под ней охристая
   точка. Точка стоит на ячейке, а не на кнопке: так она есть и в воскресенье, и в праздник, и в календаре
   главной, где кнопок нет. Стоит после .is-out: сегодня бывает и среди дней соседнего месяца */
.cal-cell.is-today{ position:relative; }
.cal-cell.is-today::after{ content:''; position:absolute; left:50%; bottom:6px; width:5px; height:5px;
 margin-left:-2.5px; border-radius:999px; background:var(--c-ochre); pointer-events:none; }
[data-book] .cal-cell.is-today, [data-book] .cal-cell.is-today .cal-day{ color:var(--c-ochre); }
[data-book] .cal-day.is-on, [data-book] .cal-cell .cal-day.is-on,
[data-book] .cal-cell.is-today .cal-day.is-on{ background:var(--c-ochre);
 border-color:var(--c-ochre); color:var(--c-ink); font-weight:800; }
/* выбранное «сегодня» залито охрой – точка на нём чернильная */
.cal-cell.is-today:has(.cal-day.is-on)::after{ background:var(--c-ink); }
.cal-book{ margin-top:18px; }
/* параметры встречи: осталось только место. Выбор часового пояса снят 21.09.2026 (меню – в docs/dropdown-menu.md),
   переключатель «Rano · Południe · Wieczór» (.cal-seg) – тоже: он дублировал окна под календарём */
.cal-opts{ display:flex; flex-direction:column; gap:10px; margin-bottom:16px; }
.cal-opt{ position:relative; display:flex; align-items:center; gap:12px; min-width:0; }
.cal-opt-ic{ flex:0 0 auto; width:20px; height:20px; color:rgba(255,255,255,.55); }
/* место встречи – строка, а не переключатель: вариант «Telefon» убран, выбирать не из чего;
   кегль 16px / 600, как был у снятой строки часового пояса */
.cal-place{ min-height:40px; }
.cal-place-name{ min-width:0; font-size:16px; font-weight:600; line-height:1.25; color:var(--c-paper); }
.cal-book-hint{ font-size:16px; line-height:1.45; color:rgba(255,255,255,.55); }
.cal-book.is-open .cal-book-hint{ display:none; }
/* сетка времени раскрывается тем же приёмом, что часы работы (.ws-hours-wrap) */
.cal-slots-wrap{ display:grid; grid-template-rows:0fr; opacity:0; visibility:hidden;
 transition:grid-template-rows .6s cubic-bezier(.16,.84,.3,1), opacity .4s ease, visibility 0s .6s; }
.cal-slots-wrap > *{ overflow:hidden; min-height:0; }
.cal-book.is-open .cal-slots-wrap{ grid-template-rows:1fr; opacity:1; visibility:visible;
 transition:grid-template-rows .6s cubic-bezier(.16,.84,.3,1), opacity .4s ease, visibility 0s; }
.cal-slots-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px;
 padding-top:6px; margin-bottom:12px; }
.cal-slots-date{ font-size:20px; font-weight:800; letter-spacing:-.02em; color:var(--c-paper); }
.cal-slots-date::first-letter{ text-transform:uppercase; }
.cal-slots-tz{ font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.18em; font-size:12px; font-weight:700; color:rgba(255,255,255,.55);
 text-align:right; }
/* окна встречи «Rano · 9:00–10:00»: три строки, слева время дня, справа часы
   (до 21.09.2026 здесь была сетка точного времени с шагом 30 мин – Грег заменил её тремя окнами) */
.cal-slots{ display:grid; grid-template-columns:minmax(0,1fr); gap:6px; padding:2px; }
.cal-slot{ appearance:none; -webkit-appearance:none; font:inherit; margin:0; padding:0 16px;
 display:flex; align-items:center; justify-content:space-between; gap:12px; width:100%;
 height:52px; border-radius:12px; cursor:pointer; background:none; text-align:left;
 border:1px solid rgba(255,255,255,.18); color:rgba(255,255,255,.8);
 font-size:17px; font-weight:600; -webkit-tap-highlight-color:transparent;
 transition:background-color .2s ease, border-color .2s ease, color .2s ease; }
.cal-slot-time{ flex:0 0 auto; white-space:nowrap; font-variant-numeric:tabular-nums; }
.cal-slot:focus-visible{ border-color:var(--c-ochre); outline:none; }
@media (hover:hover){ .cal-slot:hover{ border-color:var(--c-ochre); color:var(--c-paper); } }
/* выбранное окно – охристая рамка, а не заливка: сплошная жёлтая строка прямо над жёлтой кнопкой
   записи читалась как вторая кнопка */
.cal-slot.is-on{ background:rgba(255,255,255,.1); border-color:var(--c-ochre);
 box-shadow:inset 0 0 0 1px var(--c-ochre); color:var(--c-paper); font-weight:800; }
.cal-slot.is-on .cal-slot-time{ color:var(--c-ochre); }
/* окно, на которое сегодня уже не успеть */
.cal-slot:disabled{ cursor:default; color:rgba(255,255,255,.3); }
.cal-slot:disabled{ border-color:rgba(255,255,255,.1); }   /* часы не зачёркиваем: «ужасно выглядит» (Грег, 21.09.2026) – окно просто серое и не нажимается */
/* широкая зона (планшет, телефон в горизонтали, две колонки у 1280px): строка во всю ширину разносила
   название и часы по разным краям – там три окна встают в ряд, часы под названием.
   Меряется сама зона, а не окно: на языковых страницах календарь стоит в другой сетке */
.cal-slots-wrap > *{ container-type:inline-size; }
@container (min-width:480px){
  .cal-slots{ grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; }
  .cal-slot{ flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; height:74px; }
  .cal-slot-name{ font-size:15px; }
}
/* кнопка записи – основная кнопка сайта (.btn.btn--pop ставит app.js): здесь только раскладка */
.cal-go{ margin:14px 2px 0; display:flex; align-items:center; justify-content:center;
 text-align:center; padding:18px 24px; font-weight:600; line-height:1.3; }
.cal-go[hidden]{ display:none; }
.cal-go-time{ white-space:nowrap; }
.cal-book-note{ margin-top:12px; padding-bottom:4px; font-size:16px; line-height:1.45;
 color:rgba(255,255,255,.55); }
@media (prefers-reduced-motion:reduce){ .cal-slots-wrap{ transition:none; } }
@media (prefers-reduced-motion:reduce){ .ws .ws-dot{ animation:none !important } }

/* Языки: текстом, самоназвание наезжает сверху */
.lang-chip{ position:relative; z-index:1; cursor:default; background:transparent;
 display:inline-flex; align-items:center; min-height:38px;
 transition:color .3s ease, background-color .3s ease; }
/* акцентное подчёркивание едет за курсором по списку языков */
.lang-bg{ position:absolute; left:0; top:0; width:0; height:0; z-index:0;
 background:transparent; border-bottom:3px solid var(--c-terra);
 opacity:0; pointer-events:none;
 transition:left .42s cubic-bezier(.22,.7,.24,1), top .42s cubic-bezier(.22,.7,.24,1),
 width .42s cubic-bezier(.22,.7,.24,1), height .42s cubic-bezier(.22,.7,.24,1),
 opacity .3s ease; }
.is-ready > .lang-bg{ opacity:1; }
/* смена колонки: полоска не летит через всю ширину, а гаснет и зажигается на месте */
.lang-bg.is-jump{ transition:opacity .16s ease; opacity:0; }
.lang-bg.no-anim{ transition:none; }
@media (prefers-reduced-motion:reduce){ .lang-bg{ transition:opacity .3s ease } }

.chip-mark{ display:inline-grid; vertical-align:middle; grid-template-columns:0fr; opacity:0;
 transition:grid-template-columns .38s cubic-bezier(.2,.7,.25,1), opacity .28s ease; }
.chip-mark > span{ overflow:hidden; padding-left:8px; color:inherit; font-weight:600; }
.chip-mark--arrow > span{ display:flex; align-items:center; padding-left:9px; }
.chip-chev{ display:block; width:1.05em; height:1.05em; }
.btn-chev{ display:block; width:1.15em; height:1.15em; flex:0 0 auto; }
/* На телефоне у сетки из 12 колонок с общим gap-8 межколоночные отступы (11 x 32px)
   съедали всю ширину: колонки сжимались в 0, а блоки col-span-12 вылезали за карточку
   и тянули страницу вправо. По вертикали отступ сохраняется (20.09.2026). */
@media (max-width:639px){ .grid.grid-cols-12{ column-gap:0; } }

/* сетка языков подгоняется по ширине текста, а не по всей полосе секции */
.lang-grid{ display:inline-grid;
 /* max-content не даёт колонкам сжиматься: на телефоне пара длинных названий вылезала
    за край и тянула страницу вправо на 7px. minmax(0,max-content) сохраняет подгонку
    по тексту и разрешает перенос, когда места нет (20.09.2026) */
 grid-template-columns:repeat(2, minmax(0, max-content)); max-width:100%;
 justify-items:start; margin:0; padding:0; list-style:none; }
/* Две жёсткие колонки не помещались на узких экранах: названия языков не переносятся,
   колонки сжимались до 100px, а чипы вылезали за край и растягивали страницу
   (на 320px – на 35px, замер с телефона 20.09.2026). На телефоне – обычный перенос
   строк: сколько чипов влезло в ряд, столько и стоит, ничего не выходит за край. */
@media (max-width:639px){
 .lang-grid{ display:flex; flex-wrap:wrap; }
 .lang-chip{ min-width:0; max-width:100%; }
}
.lang-chip--accent{ display:flex; align-items:center; justify-content:center; text-align:center;
 color:var(--c-ink); }
.lang-chip--accent .chip-mark > span{ color:var(--c-terra); }
.lang-chip--accent:hover{ color:var(--c-terra); }
.lang-chip--accent:hover .chip-mark > span{ color:var(--c-ink); }
.lang-chip:hover .chip-mark,
.tl-cell:hover .chip-mark,
.price-card:hover .chip-mark{ grid-template-columns:1fr; opacity:1; }

/* мини-блок с ценой */
.price-card{ transition:background-color .3s ease; }
.price-card:hover{ background:var(--c-terra); color:var(--c-ink); }
.price-card:hover span{ color:var(--c-ink); }
@media (prefers-reduced-motion:reduce){ .chip-mark{ transition:opacity .2s ease } }

/* Название языка на нём самом: наезжает сверху и выталкивает польское */
.lang-swap{ display:inline-grid; overflow:hidden; }
.lang-swap > span{ grid-area:1 / 1; justify-self:start; white-space:nowrap;
 transition:opacity .3s ease, transform .48s cubic-bezier(.2,.72,.24,1); }
.ls-b{ opacity:0; transform:translateY(-105%); font-style:italic; }
@media (hover:hover){
  .lang-chip:hover .ls-a,
  .lang-switch:hover .ls-a{ opacity:0; transform:translateY(105%); }
  .lang-chip:hover .ls-b,
  .lang-switch:hover .ls-b{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion:reduce){ .lang-swap > span{ transition:opacity .2s ease; transform:none } }

/* Языки в hero: стрелка стоит на месте, список сам едет вверх, края растворяются */
.lang-ticker{ position:relative; display:inline-flex; padding-left:62px; }
.lang-t-view{ cursor:pointer; }
/* цвет не меняется: стрелка всегда жёлтая, язык всегда чёрный */
/* инверсия: курсивом все языки, кроме того, что стоит напротив стрелки */
.lang-t-item{ font-style:italic; }
.lang-t-item.is-active{ font-style:normal; }
.lang-t-arrow{ position:absolute; left:0; top:50%; width:42px; height:42px;
 transform:translateY(-50%); display:flex; align-items:center;
 color:var(--c-terra); opacity:0; transition:opacity .5s ease; }
.lang-t-arrow .chip-chev{ width:100%; height:100%; transform-origin:35% 50%; }
a.lang-t-arrow{ cursor:pointer; -webkit-tap-highlight-color:transparent;
 transition:color .25s ease; }
a.lang-t-arrow:hover, a.lang-t-arrow:focus-visible{ color:var(--c-terra); }
a.lang-t-arrow:hover .chip-chev{ animation-play-state:paused; transform:translateX(7px) scale(1.14); opacity:1; }
a.lang-t-arrow:focus-visible{ outline:2px solid var(--c-ink); outline-offset:4px; border-radius:4px; }
.lang-ticker.is-live .lang-t-arrow{ opacity:1; }
/* стрелка «живая»: лёгкий ход вправо-влево + мягкая пульсация */
.lang-ticker.is-live .chip-chev{ animation:langArrowNudge 2.4s ease-in-out infinite; }

/* ===== стрелка «наверх»: справа, отступ 81px, пульсация как у языковой =====
   Слой – ПОД шапкой (#top, z-50) и подложкой меню (z-49): в конце страницы стрелка поднимается вместе с концом
   контента и в невысоком окне доезжает до плашки шапки – раньше (z-60) она ложилась поверх плашки, под бургером.
   Грег, 22.09.2026: «стрелка должна быть под плашкой всегда и везде». Выше 49 не поднимать. */
.to-top{ position:fixed; z-index:40;
 /* привязка к правому краю контентной сетки (max-w-site 1320px) */
 /* сдвинута на 15% ближе к правому краю */
 right:max(17px, calc(((100vw - 1320px) / 2 - 24px) * .85)); bottom:64px;
 width:30px; height:30px; display:flex; align-items:center; justify-content:center;
 color:var(--c-ink); -webkit-tap-highlight-color:transparent;   /* чернильная (Грег, 11.10.2026: «шеврон вверх чёрным»); была охрой */
 opacity:0; visibility:hidden; transform:translateY(7px);
 /* исчезает на 30% медленнее, чем появляется (Грег, 23.09.2026) */
 transition:opacity .585s ease, transform .585s ease, visibility .585s; }
/* над тёмным блоком (его определяет app.js для всплывающей кнопки, она стоит прямо под стрелкой) стрелка светлая – иначе пропала бы */
body:has(.m-dock.on-dark) .to-top{ color:var(--c-paper); }
.to-top.is-live{ opacity:1; visibility:visible; transform:none;
 transition:opacity .45s ease, transform .45s ease, visibility .45s; }
.to-top .chip-chev{ width:100%; height:100%; transform-origin:50% 65%;
 transform:rotate(-90deg); }
.to-top.is-live .chip-chev{ animation:toTopNudge 2.8s ease-in-out infinite; }
@keyframes toTopNudge{
  0%   { transform:rotate(-90deg) translateX(0) scale(1); opacity:1 }
  50%  { transform:rotate(-90deg) translateX(5px) scale(1.14); opacity:1 }
  100% { transform:rotate(-90deg) translateX(0) scale(1); opacity:1 }
}
.to-top:hover .chip-chev, .to-top:focus-visible .chip-chev{
 animation-play-state:paused; transform:rotate(-90deg) translateX(7px) scale(1.14); }
.to-top:focus-visible{ outline:2px solid var(--c-ink); outline-offset:4px; border-radius:4px; }
/* отступ снизу был 100px, чтобы стрелка не наезжала на плавающую кнопку WhatsApp;
   кнопку убрали 20.09.2026, стрелка опущена к краю */
@media (max-width:640px){ .to-top{ right:12px; bottom:28px; } }
/* на телефоне и тач-экранах стрелка меньше (Грег, 21.09.2026: «стрелку в мобильной версии бы сделал меньше»):
   30px вместо 42px; область нажатия остаётся 46px за счёт псевдоэлемента */
/* Грег, 23.09.2026: «везде такую стрелочку вверх, как и на моб версии» – 30px на всех ширинах;
   область нажатия 46px за счёт псевдоэлемента */
.to-top::after{ content:''; position:absolute; inset:-8px; }
@media (prefers-reduced-motion:reduce){ .to-top .chip-chev{ animation:none } }
@keyframes langArrowNudge{
  0%   { transform:translateX(0) scale(1); opacity:1 }
  50%  { transform:translateX(5px) scale(1.24); opacity:1 }
  100% { transform:translateX(0) scale(1); opacity:1 }
}
@media (prefers-reduced-motion:reduce){
  .lang-ticker.is-live .chip-chev{ animation:none }
}
.lang-t-view{ position:relative; overflow:hidden; height:5.1em;
 -webkit-mask-image:linear-gradient(to bottom, rgba(31,33,32,0) 0%, rgba(31,33,32,.18) 18%, rgba(31,33,32,.62) 34%, #000 50%, rgba(31,33,32,.62) 66%, rgba(31,33,32,.18) 82%, rgba(31,33,32,0) 100%);
 mask-image:linear-gradient(to bottom, rgba(31,33,32,0) 0%, rgba(31,33,32,.18) 18%, rgba(31,33,32,.62) 34%, #000 50%, rgba(31,33,32,.62) 66%, rgba(31,33,32,.18) 82%, rgba(31,33,32,0) 100%); }
.lang-t-list{ display:flex; flex-direction:column; margin:0; padding:0; list-style:none;
 will-change:transform; transition:transform .8s cubic-bezier(.22,.72,.2,1); }
.lang-t-list.no-anim{ transition:none; }
.lang-t-item{ color:rgba(31,33,32,.5); line-height:1.22; white-space:nowrap;
 display:flex; align-items:center; box-sizing:border-box;
 transition:color .6s ease, opacity .6s ease; }
.lang-t-item.is-active{ color:var(--c-ink); }
@media (prefers-reduced-motion:reduce){
  .lang-t-list{ transition:none }
.lang-t-item{ transition:none }
}

/* Карточки шагов + окно с описанием процесса */
/* высота всех 4 карточек одинакова – растягиваются по самой высокой в строке (grid stretch) */
.step-card{ position:relative; cursor:pointer; }
/* цвета карточек: тёмная → серая → акцентная, без градиентов */
.step-card--1{ background:var(--c-graphite); }
.step-card--2{ background:var(--c-sand); }
.step-card--3{ background:var(--c-terra); }
.step-card--w{ background:var(--c-paper); }
.step-num--2{ color:var(--c-ink); }
.step-krok{ display:block; margin-bottom:8px; opacity:.75; }

/* карточки появляются по очереди, очень плавно */
.rise{ opacity:0; }
.rise.is-in{ animation:rise-in 1.8s cubic-bezier(.16,.84,.3,1) both; }
.steps .rise.is-in:nth-child(2){ animation-delay:.42s; }
.steps .rise.is-in:nth-child(3){ animation-delay:.84s; }
.steps .rise.is-in:nth-child(4){ animation-delay:1.26s; }
.rise.rise-done{ animation:none !important; opacity:1; }
@keyframes rise-in{ from{ opacity:0; transform:translateY(34px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){ .rise{ opacity:1 }
.rise.is-in{ animation:none } }

/* при наведении карточка чуть увеличивается – текст не переверстывается */
.step-card{ transition:transform .4s cubic-bezier(.2,.7,.25,1); will-change:transform; }
@media (hover:hover){
  .step-card:hover{ transform:scale(1.04); z-index:2; }
  .step-card:hover .step-go{ transform:translateX(4px); }
}
/* стрелка – острая «птичка», без скруглений */
.step-go{ flex:0 0 auto; border:0; background:none; padding:0; color:inherit; cursor:pointer;
 display:flex; align-items:center; justify-content:center;
 transition:transform .25s cubic-bezier(.2,.7,.25,1), opacity .2s ease; }
.step-arrow{ display:block; width:34px; height:34px; }
.step-go:hover{ transform:translateX(4px); opacity:.7; }
.step-go:focus-visible{ outline:2px solid currentColor; outline-offset:4px; }

.step-modal{ position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center;
 padding:16px; }
.step-modal[hidden]{ display:none; }
.step-modal-backdrop{ position:absolute; inset:0; background:rgba(31,33,32,.55);
 backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px);
 opacity:0; transition:opacity .3s ease; }
.step-modal.is-open .step-modal-backdrop{ opacity:1; }
.step-modal-card{ position:relative; z-index:1; width:min(940px,100%); max-height:88vh; max-height:88dvh; overflow:auto;
 background:#FFFFFF; color:var(--c-ink); border-radius:26px; padding:42px 44px 46px;
 box-shadow:0 40px 90px rgba(31,33,32,.3);
 opacity:0; transform:translateY(16px) scale(.985);
 transition:opacity .3s ease, transform .38s cubic-bezier(.2,.7,.25,1); }
.step-modal.is-open .step-modal-card{ opacity:1; transform:none; }
.step-modal-close{ position:absolute; top:18px; right:20px; width:42px; height:42px; border:0; background:none;
 color:var(--c-ink); cursor:pointer; display:flex; align-items:center; justify-content:center;
 transition:opacity .2s ease; }
.step-modal-close:hover{ opacity:.6; }
.step-modal-kicker{ font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.2em; font-size:12px; color:var(--c-ink); }
.step-modal-title{ margin-top:10px; font-size:34px; font-weight:800; letter-spacing:-.02em; line-height:1.05;
 padding-right:48px; }
.step-lead{ margin-top:16px; font-size:17px; font-weight:500; line-height:1.6; color:rgba(31,33,32,.75);
 max-width:70ch; }

.scheme{ margin-top:28px; display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }
.scheme-item{ margin:0; }
.scheme-art{ position:relative; border-radius:16px; overflow:hidden; background:var(--c-sand); }
.scheme-svg{ display:block; width:100%; height:auto; }
.scheme-badge{ position:absolute; right:10px; bottom:10px; width:28px; height:28px; border-radius:999px;
 display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:700;
 color:#fff; }
.scheme-badge.is-ok{ background:var(--c-terra); color:var(--c-ink); }
.scheme-badge.is-bad{ background:var(--c-ink); color:#fff; }
.scheme-item figcaption{ margin-top:10px; font-size:15px; line-height:1.5; color:rgba(31,33,32,.7); }
.scheme-item figcaption b{ color:var(--c-ink); font-weight:600; }

.flow{ margin-top:26px; display:flex; flex-direction:column; gap:14px; list-style:none; margin-left:0; padding-left:0; }
.flow li{ display:grid; grid-template-columns:38px 1fr; gap:4px 16px; align-items:start;
 padding-bottom:14px; border-bottom:1px solid rgba(31,33,32,.12);
 font-size:15.5px; line-height:1.55; color:rgba(31,33,32,.72); }
.flow li:last-child{ border-bottom:0; padding-bottom:0; }
.flow-dot{ grid-row:span 2; width:38px; height:38px; border-radius:999px; background:var(--c-ink);
 color:var(--c-paper); display:flex; align-items:center; justify-content:center;
 font-weight:700; font-size:16px; }
.flow li b{ font-size:17px; font-weight:700; color:var(--c-ink); }

.opts{ margin-top:26px; display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.opt{ background:rgba(31,33,32,.045); border-radius:18px; padding:20px 20px 22px; }
.opt-ico{ width:26px; height:26px; color:var(--c-ink); display:block; margin-bottom:12px; }
.opt b{ display:block; font-size:17px; font-weight:700; margin-bottom:6px; }
.opt span{ font-size:15px; line-height:1.5; color:rgba(31,33,32,.7); }

.faq-price{ list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.faq-price li{ display:flex; align-items:baseline; justify-content:space-between; gap:16px;
 padding-bottom:9px; border-bottom:1px solid rgba(31,33,32,.12); max-width:52ch; }
.faq-price li:last-child{ border-bottom:0; }
.faq-price span{ color:rgba(31,33,32,.65); }
.faq-price b{ font-weight:700; color:var(--c-ink); white-space:nowrap; }

.rules{ margin-top:24px; padding:18px 0 0; border-top:1px solid rgba(31,33,32,.12);
 display:flex; flex-direction:column; gap:9px; list-style:none; }
.rules li{ position:relative; padding-left:22px; font-size:15.5px; font-weight:500; line-height:1.5;
 color:rgba(31,33,32,.75); }
.rules li::before{ content:""; position:absolute; left:4px; top:.62em; width:6px; height:6px;
 border-radius:50%; background:currentColor; }

@media (max-width:720px){
  /* dvh: в Safari на iPhone 92vh выше видимой части окна, пока адресная строка развёрнута – окно срезалось сверху и снизу */
  .step-modal-card{ padding:30px 22px 34px; border-radius:20px; max-height:92vh; max-height:92dvh; }
  .step-modal-title{ font-size:26px; }
  .scheme{ grid-template-columns:1fr; }
  .opts{ grid-template-columns:1fr; }
}
@media (prefers-reduced-motion:reduce){
  .step-card, .step-go, .step-modal-card, .step-modal-backdrop{ transition:none !important; }
}

/* Окно с подробным описанием – раскрывается по клику на всю таблицу */
.tl-cell{ appearance:none; border:0; font:inherit; color:inherit; cursor:pointer; width:100%; }
.tl-cell:focus-visible{ outline:2px solid var(--c-ink); outline-offset:-4px; }
.tl-pop{
 position:absolute; z-index:30; box-sizing:border-box; display:flex; flex-direction:column;
 background:#FFFFFF; color:var(--c-ink);
 border:1px solid rgba(31,33,32,.12); border-radius:22px;
 box-shadow:0 30px 70px rgba(31,33,32,.22), 0 3px 10px rgba(31,33,32,.08);
 padding:38px 40px 34px;
 opacity:0; transform:scale(.975); transform-origin:center;
 transition:opacity .26s ease, transform .3s cubic-bezier(.2,.7,.25,1);
 pointer-events:none;
}
.tl-pop[hidden]{ display:none; }
.tl-pop.is-open{ opacity:1; transform:none; pointer-events:auto; }
.tl-pop-title{ font-size:30px; font-weight:700; letter-spacing:-.02em; line-height:1.1; padding-right:44px; }
.tl-lead{ font-size:17px; font-weight:500; line-height:1.55; color:rgba(31,33,32,.78); margin-top:14px; max-width:56ch; }
.tl-pop ul{ margin-top:20px; display:flex; flex-direction:column; gap:11px; }
.tl-pop li{ position:relative; padding-left:22px; font-size:16.5px; font-weight:500; line-height:1.45; color:rgba(31,33,32,.82); }
.tl-pop li::before{ content:""; position:absolute; left:4px; top:.62em; width:6px; height:6px; border-radius:50%;
 background:currentColor; }
.tl-meta{ margin-top:auto; padding-top:18px; border-top:1px solid rgba(31,33,32,.12);
 font-size:14.5px; font-weight:500; line-height:1.5; color:rgba(31,33,32,.66); }
.tl-pop-body{ display:flex; flex-direction:column; flex:1 1 auto; }
.tl-close{ position:absolute; top:14px; right:16px; width:42px; height:42px; border:0;
 background:none; color:var(--c-ink); cursor:pointer;
 display:flex; align-items:center; justify-content:center; transition:opacity .2s ease; }
.tl-close .chev{ color:inherit; }
.tl-close:hover{ opacity:.6; }
@media (max-width:640px){
  .tl-pop{ padding:26px 22px 24px; }
  .tl-pop-title{ font-size:24px; }
  .tl-lead{ font-size:15.5px; }
  .tl-pop li{ font-size:15px; }
}
@media (prefers-reduced-motion:reduce){ .tl-pop{ transition:opacity .15s ease; transform:none } }

/* Едущая белая подсветка в списке институтов (тёмный фон) */
.soft-row{ position:relative; z-index:1; }
/* разделители остаются в границах текста, плашка при этом идёт до краёв блока */
.soft-row:not(:last-child)::after{ content:""; position:absolute; left:20px; right:20px; bottom:0;
 height:1px; background:rgba(255,255,255,.15); }
@media (min-width:640px){ .soft-row:not(:last-child)::after{ left:36px; right:36px } }
@media (min-width:1024px){ .soft-row:not(:last-child)::after{ left:20px; right:44px } }
.row-bg{ position:absolute; left:0; top:0; width:0; height:0; z-index:0; border-radius:14px;
 background:rgba(255,255,255,.23); opacity:0; pointer-events:none;
 transition:left .42s cubic-bezier(.22,.7,.24,1), top .42s cubic-bezier(.22,.7,.24,1),
 width .42s cubic-bezier(.22,.7,.24,1), height .42s cubic-bezier(.22,.7,.24,1),
 opacity .3s ease; }
.is-ready > .row-bg{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .row-bg{ transition:opacity .3s ease } }

/* Плита с институтами: подсветка на всю высоту, едет за курсором */
.slab-cell{ position:relative; z-index:1; width:100%; appearance:none; border:0; background:none;
 font:inherit; color:inherit; cursor:pointer; }
.slab-cell:focus-visible{ outline:2px solid var(--c-ochre); outline-offset:-6px; }
.slab-kicker{ transition:color .3s ease; }
.slab-cell.is-active .slab-kicker{ color:var(--c-ochre); }
.slab-bg{ position:absolute; left:0; top:0; width:0; height:0; z-index:0; border-radius:12px;
 background:rgba(255,255,255,.23); opacity:0; pointer-events:none;
 transition:left .42s cubic-bezier(.22,.7,.24,1), top .42s cubic-bezier(.22,.7,.24,1),
 width .42s cubic-bezier(.22,.7,.24,1), height .42s cubic-bezier(.22,.7,.24,1),
 opacity .3s ease; }
.slab-grid.is-ready .slab-bg{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .slab-bg{ transition:opacity .3s ease } }

/* Описание под плитой: место зарезервировано всегда, тексты сменяются */
.slab-collapse{ display:grid; grid-template-rows:1fr;
 transition:grid-template-rows .45s cubic-bezier(.22,.7,.24,1); }
.slab-collapse.is-closed{ grid-template-rows:0fr; }
.slab-collapse-clip{ overflow:hidden; }
.slab-panels{ position:relative; display:grid; margin-top:6px; padding-top:22px;
 border-top:1px solid rgba(255,255,255,.15); }
.slab-close{ position:absolute; top:18px; right:16px; z-index:2; width:42px; height:42px; border:0;
 background:none; color:var(--c-paper); cursor:pointer;
 display:flex; align-items:center; justify-content:center; transition:opacity .2s ease; }
.slab-close:hover{ opacity:.6; }
.slab-panel{ grid-area:1 / 1; opacity:0; visibility:hidden;
 transition:opacity .32s ease, visibility 0s linear .32s; }
.slab-panel.is-open{ opacity:1; visibility:visible; transition:opacity .38s ease; }
.slab-panel-in{ padding-bottom:26px; }
/* короткое отчёркивание вместо линии во всю ширину */
.slab-price{ position:relative; margin-top:18px; padding-top:16px;
 display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.slab-price::before{ content:""; position:absolute; left:0; top:0;
 width:34px; height:2px; background:rgba(255,255,255,.28); }
/* подпись слева – только прямой span-ярлык, не обёртка цены и не .price-num */
.slab-price > span:not(.price-hit){ font-family:'Fira Sans Condensed',sans-serif; text-transform:uppercase;
 letter-spacing:.14em; font-size:12px; font-weight:700; color:rgba(255,255,255,.55); }
/* цифра внутри цены – тем же кеглем и цветом, что и весь <b> */
.slab-price .price-hit .price-num{ font:inherit; color:inherit;
 letter-spacing:inherit; text-transform:none; }
.slab-price b{ font-size:22px; font-weight:700; color:var(--c-ochre); letter-spacing:-.01em; }
@media (prefers-reduced-motion:reduce){ .slab-panel{ transition:none } }

/* Плашка-заголовок в hero – Sacramento */
.plate{ display:inline-block; background:var(--c-ink); color:var(--c-paper);
 padding:.18em .55em .28em; line-height:1; }

/* Плиты – без наклона, строго по сетке */
.slab, .slab-r{ transform:none; }

.hairline{ border-top:1px solid rgba(31,33,32,.18); }
.hairline-light{ border-top:1px solid rgba(255,255,255,.22); }

/* Крупные цифры шагов */
.step-num{ font-weight:900; letter-spacing:-.06em; line-height:.8; }

/* Бегущая строка */
@keyframes ticker{ from{transform:translateX(0)} to{transform:translateX(-50%)} }
/* Safari на iPhone не всегда обрезает анимированный (translateX) слой одним overflow:hidden –
   лента шириной ~7400px протекала наружу и растягивала страницу вбок. Своя область отрисовки
   у полосы (contain + свой слой) гарантирует обрезку на всех движках (20.09.2026) */
.ticker-bar{ position:relative; isolation:isolate; contain:paint; transform:translateZ(0); }
.ticker-track{ display:flex; width:max-content; animation:ticker 58s linear infinite;
 will-change:transform; }
.ticker-dot{ font-size:10px; line-height:1; position:relative; top:-2px; color:inherit; }
@media (prefers-reduced-motion:reduce){ .ticker-track{ animation:none } html{scroll-behavior:auto} }

/* Формы */
.field{ width:100%; background:transparent; border:0; border-bottom:1px solid rgba(255,255,255,.35);
 padding:.85rem 0; color:var(--c-paper); font-size:1.05rem; outline:none; transition:border-color .2s; }
.field::placeholder{ color:rgba(255,255,255,.45); }
.field:focus{ border-color:var(--c-ochre); }
select.field option{ background:#1F2120; color:#FFFFFF; }
.file-input-hidden{ position:absolute; width:1px; height:1px; padding:0; margin:-1px;
 overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.field-file{ padding-top:.55rem; padding-bottom:.55rem; }
.file-btn{ flex:0 0 auto; background:transparent; color:inherit; border-radius:12px;
 border:1px solid var(--c-terra);
 padding:.5rem 1.1rem; font-weight:600; cursor:pointer; font-family:inherit;
 transition:background-color .25s ease, color .25s ease; }
.file-btn:hover{ background:var(--c-terra); color:var(--c-ink); }
.file-input-hidden:focus-visible + .field-file .file-btn{ outline:2px solid var(--c-ochre); outline-offset:2px; }
.file-name{ min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
 font-size:14px; opacity:.6; }

details > summary{ cursor:pointer; list-style:none; }
details > summary::-webkit-details-marker{ display:none; }

/* Единый «плюс» на всём сайте: тот же вес, что у заголовков */
.chev{ display:inline-block; font-size:30px; font-weight:600; line-height:1;
 color:var(--c-ink); transition:transform .25s ease; }
.chev--x{ transform:rotate(45deg); }
details[open] .chev{ transform:rotate(45deg); }
.ws-legal-item .chev{ transform:rotate(0deg); }
.ws-legal-item.is-open .chev{ transform:rotate(45deg); }

/* Плашки не сплошные, а слегка прозрачные с размытием фона и мягкой тенью
   (приём с yummygum.com): контент под шапкой чуть просвечивает, плашка
   отрывается от страницы. Тень только вниз, с отрицательным spread: плашки стоят
   вплотную, и любой боковой разлёт залил бы выемку между их скруглениями –
   три плашки слились бы в одну. */
.hdr-glass{ position:relative; }
/* Полоски бургера сверстаны утилитой bg-ink, поэтому над тёмным блоком
   их нужно перекрасить отдельно – вместе с текстом шапки. */
.hdr-glass.on-dark #burger span{ background:var(--c-paper); }

/* ===== Страница /kontakt/ ===== */
/* H1 подстраниц: ограничение ширины строки (утилита max-w-[22ch] в сборке Tailwind отсутствует) */
.h1-page{ max-width:22ch; }
/* Заголовки из двух строк (страницы прайса): 22ch рвёт вторую строку на три,
   поэтому для них отдельный, более широкий лимит – общий .h1-page не трогаем. */
.h1-wide{ max-width:34ch; }
/* Хвост заголовка «w Warszawie»: отдельная строка с небольшим отступом слева.
   Отступ в em, поэтому одинаково выглядит на всех кеглях и ширинах экрана
   и не зависит от того, как переносится строка выше. */
.h1-out{ display:block; text-align:left; padding-left:1em; }
/* выезд справа – тот же приём, что у «Cztery proste kroki» на главной;
   .slide-in делает элемент inline-block, поэтому возвращаем блочность */
.h1-out.slide-in{ display:block; }
/* Вводный абзац прайса: ширина подобрана так, чтобы первая строка кончалась
   на «550 zł,» и дальше текст переносился сам – без жёстких <br>, которые
   на узком экране рвали бы строки где попало. Замер при 24px: строка до «550 zł,» = 32.4em, следующее слово «Tłumaczenia»
   упирается в 38.4em; 36em – самое узкое значение в этом окне, при котором
   «gotówka.» ещё помещается в четвёртую строку. */
.lead-lines{ max-width:36em; }

/* CTA под текстовым блоком – по центру колонки. */
.btn-center{ display:flex; width:fit-content; margin-left:auto; margin-right:auto; }
/* Цена во вводном абзаце: маркер основного цвета, как у кикера. Появляются
   по очереди, в темпе чтения (~200 слов в минуту), с учётом времени на заголовок:
   задержка каждого задана инлайном через --d. */
.mark{ background-image:linear-gradient(var(--c-terra),var(--c-terra));
 background-repeat:no-repeat; background-position:0 88%; background-size:0 .42em;
 white-space:nowrap;
 animation:mark-in .15s cubic-bezier(.2,.7,.25,1) var(--d,0s) forwards; }
@keyframes mark-in{ to{ background-size:100% .42em; } }
@media (prefers-reduced-motion:reduce){
  .mark{ animation:none; background-size:100% .42em; } }

/* Каналы связи – четыре карточки на тёмной плите */
.kt-channels{ display:grid; gap:1.25rem; list-style:none; margin:0; padding:0; }
@media (min-width:640px){ .kt-channels{ grid-template-columns:1fr 1fr; gap:1.5rem 2rem; } }
.kt-ch{ display:flex; flex-direction:column; gap:.3rem; padding-top:.9rem;
 border-top:2px solid rgba(255,255,255,.2); }
.kt-ch-h{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.16em; font-size:12px; font-weight:600; color:rgba(255,255,255,.55); }
.kt-ch-v{ font-weight:700; font-size:24px; letter-spacing:-.02em; line-height:1.15;
 color:var(--c-ochre); text-decoration:none; transition:color .25s ease; word-break:break-word; }
.kt-ch-v:hover, .kt-ch-v:focus-visible{ color:var(--c-paper); }
.kt-ch-t{ font-size:15.5px; line-height:1.5; color:rgba(255,255,255,.6); max-width:36ch; }

/* Жёлтая плашка «Osobiście» (/kontakt/ #odbior) на телефоне: поля страницы 20px + поля плашки 28px сжимали текст
   в столбец 224px на экране 320px, и плашка вытягивалась на 1,65 экрана (Грег, 21.09.2026: «очень растянут по высоте
   из-за отступов»). Уже 640px плашка выходит на 10px за колонку страницы (до края экрана остаётся 10px), поля 20px,
   радиус чуть меньше – столбец текста 260px; зазор между двумя группами текста 26px вместо 32px. */
@media (max-width:639px){
  .ob-plate{ margin-left:-10px; margin-right:-10px; padding:24px 20px 22px; border-radius:22px; }
  .ob-grid{ row-gap:1.6rem; }
}

/* Пять шагов заказа – нумерованный список */
.kt-steps-list{ margin:1.5rem 0 0; padding:0; list-style:none; counter-reset:kt; display:grid; gap:1rem; max-width:70ch; }
.kt-steps-list li{ position:relative; padding-left:3.2rem; font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); }
.kt-steps-list li b{ color:var(--c-ink); font-weight:700; }
.kt-steps-list li::before{ counter-increment:kt; content:counter(kt, decimal-leading-zero);
 position:absolute; left:0; top:.1em; font-family:'Fira Sans Condensed','Fira Sans',sans-serif;
 font-weight:700; font-size:20px; letter-spacing:-.02em; color:var(--c-terra); }
/* Ссылка-стрелка k-where-link на светлом фоне (анонс «Gdzie» на главной) */
.k-where-link--dark{ color:var(--c-ink); }
.k-where-link--dark:hover, .k-where-link--dark:focus-visible{ color:var(--c-ink); }
/* стрелка того же чернильного цвета, что и текст (Грег, 21.09.2026: «стрелочка тоже чёрная») – охрой её не красить */
/* Hero /kontakt/: ссылка-стрелка стоит над кнопками и привязана к абзацу, кнопки – после воздуха */
.hero-more{ margin-top:.7rem; line-height:1.3; }
.hero-more .k-where-link{ margin-top:0; }
.hero-cta{ margin-top:2.75rem; }
@media (min-width:768px){ .hero-cta{ margin-top:3.25rem; } }

/* Тёмный блок «Kontakt i odbiór dokumentów» на /kontakt/ (.kt, 21.09.2026): три группы с заголовками –
   как связаться · когда отвечаем · запись на встречу. Раньше левая колонка кончалась рано, правая была
   сдвинута вниз на 22vh и тянулась вдвое дальше. Главная (.s247-*) и языковые копии этими правилами не задеты.
   Подписи – 17px и светлее прежних 15,5px / .6: на чёрном мелкий серый текст не читается. */
.kt-row{ margin-top:3rem; padding-top:2.6rem; border-top:1px solid rgba(255,255,255,.2); }
@media (min-width:1024px){ .kt-row{ margin-top:4.5rem; padding-top:3.5rem; } }
.kt-row--split{ display:grid; gap:3.5rem; }
@media (min-width:1024px){ .kt-row--split{ grid-template-columns:7fr 5fr; gap:4rem; } }
.kt-h{ margin-bottom:1.6rem; }
.kt-text{ font-size:17px; line-height:1.6; color:rgba(255,255,255,.75); max-width:46ch; }
.kt .kt-ch-t{ font-size:17px; line-height:1.5; color:rgba(255,255,255,.75); max-width:34ch; }
.kt-actions{ margin-top:2.4rem; display:flex; flex-direction:column; align-items:flex-start; gap:1rem; }
@media (min-width:640px){ .kt-actions{ flex-direction:row; align-items:stretch; gap:1.5rem; } }
.kt-actions .k-where-link{ margin-top:0; }
/* Группа 1 (24.09.2026): «Dokumenty – przez formularz» сверху, «Pytania – porozmawiajmy» под ней, разведены линией и воздухом */
.kt-doc .kt-h{ margin-bottom:1rem; }
.kt-doc .kt-actions{ margin-top:1.8rem; }
.kt-talk{ margin-top:3rem; padding-top:2.4rem; border-top:1px solid rgba(255,255,255,.2); }
/* статус и сообщение видны всегда – на этой странице их не нужно «открывать» наведением */
.kt .ws-top{ opacity:1; transform:none; margin-top:0; font-size:13px; color:rgba(255,255,255,.8); }
.kt .ws-msg{ margin-top:.7rem; font-size:17px; color:rgba(255,255,255,.75); text-wrap:pretty; }
.kt .ws-hours{ margin-top:1.6rem; border-top:1px solid rgba(255,255,255,.2); }
.kt .ws-hours li{ padding:13px 0; border-bottom:1px solid rgba(255,255,255,.2); }
/* шапка блока: заголовок слева, часы справа, низ часов – на одной линии с последней строкой заголовка */
.kt-top{ display:grid; gap:2.5rem; }
@media (min-width:1024px){ .kt-top{ grid-template-columns:minmax(0,1fr) auto; gap:3rem; align-items:end; } }
.kt .ws-clockbox{ padding:0; margin:0; }
/* «po uzgodnieniu» и «nieczynne» были .34 – на чёрном не читались */
.kt .ws-hours .ws-soft, .kt .ws-hours .ws-off{ color:rgba(255,255,255,.55) !important; }
.ws-hours li.ws-note{ display:block; font-size:17px; line-height:1.45; font-weight:400; color:rgba(255,255,255,.86); border-bottom:0; padding-bottom:0; }
/* запись на встречу: параметры · календарь · время.
   До 1024px зоны идут друг под другом; 1024–1279px – две колонки (параметры | календарь и время под ним):
   в три колонки на такой ширине кнопки времени не помещались; от 1280px – три зоны в ряд. */
.kt-cal{ margin-top:0; padding-top:0; display:grid; grid-template-columns:minmax(0,1fr); gap:2.6rem; }
.kt-cal .cal-opts{ margin:1.8rem 0 0; }
.kt-cal .cal-book{ margin-top:0; }
@media (min-width:1024px){
  .kt-cal{ grid-template-columns:1fr 1fr; gap:0 3.5rem; align-items:start; }
  .kt-cal-intro{ grid-column:1; grid-row:1 / span 2; }
  .kt-cal-main, .kt-cal-side{ grid-column:2; padding-left:3.5rem; border-left:1px solid rgba(255,255,255,.2); }
  .kt-cal-side{ padding-top:2.6rem; }   /* зазор между календарём и временем – внутри колонки, чтобы вертикаль не рвалась */
}
@media (min-width:1280px){
  .kt-cal{ grid-template-columns:4fr 4.6fr 3.4fr; gap:0 3.5rem; }
  .kt-cal-intro{ grid-row:auto; }
  .kt-cal-main{ grid-column:2; min-height:100%; }
  .kt-cal-side{ grid-column:3; min-height:100%; padding-top:0; }
  .kt-cal .cal-book-hint{ padding-top:3.1rem; }
  .kt-cal .cal-slots-head{ padding-top:0; min-height:34px; margin-bottom:14px; }
}
.kt .cal-note, .kt .cal-book-hint, .kt .cal-book-note{ font-size:17px; color:rgba(255,255,255,.7); }
/* дата выбранного дня и подпись часового пояса – друг под другом: в узкой зоне в одну строку они рвались */
.kt-cal .cal-slots-head{ flex-direction:column; align-items:flex-start; gap:6px; }
.kt-cal .cal-slots-tz{ text-align:left; }
/* стрелка основной кнопки не должна сжиматься, когда подпись переносится на две строки */
.cal-go .btn-mark{ flex:0 0 auto; }
.cal-go .btn-mark > span{ overflow:visible; }
/* /kontakt/ (PL): календарь – на две трети блока, окна встречи – в левой колонке (Грег, 04.10.2026: на снимке стрелкой перенёс правую
   колонку со временем под «Śródmieście, centrum Warszawy», «а правую часть колонки отдать под календарь, который на 2/3»).
   Модификатор .kt-cal--wide стоит в разметке PL; ua/ru/en – прежние три колонки. От 1024px (уже – зоны друг под другом, как было):
   слева вступление, место встречи и под ними дата, окна и кнопка записи; справа, за вертикальной линией, – календарь во всю ширину
   двух третей. Потолок 495px («нельзя растягивать даты календаря», 21.09) на этой странице снят этой же просьбой: сетка растёт вместе
   с колонкой, а с ней – ячейки, кружки дней и цифры (--cd – диаметр кружка, --ch – высота ячейки, считаются от ширины колонки), иначе
   кружки 36px терялись бы в ячейках по 106px. Заголовок месяца – уровнем заголовка левой колонки (26px): цифры (до 22px) меньше
   заголовка и больше текста. Строки сетки – auto 1fr: лишняя высота календаря уходит под окна, а не между вступлением и окнами. */
@media (min-width:1024px){
  .kt-cal--wide{ grid-template-columns:minmax(0,1fr) minmax(0,2fr); grid-template-rows:auto 1fr; }
  .kt-cal--wide .kt-cal-intro{ grid-column:1; grid-row:1; }
  .kt-cal--wide .kt-cal-side{ grid-column:1; grid-row:2; min-height:0; padding:28px 0 0; border-left:0; }
  .kt-cal--wide .kt-cal-main{ grid-column:2; grid-row:1 / span 2; align-self:stretch; min-height:0; container-type:inline-size; }
  .kt-cal--wide .cal-book-hint{ padding-top:0; }
  .kt-cal--wide .cal-head, .kt-cal--wide .cal-grid{ max-width:none; }
  .kt-cal--wide .cal-head{ margin-bottom:18px; }
  .kt-cal--wide .cal-title{ font-size:26px; }
  .kt-cal--wide .cal-grid{ --cd:clamp(38px, 7.2cqw, 56px); --ch:clamp(46px, 9.2cqw, 72px); }
  .kt-cal--wide .cal-wd{ padding-bottom:12px; }
  .kt-cal--wide .cal-cell{ height:var(--ch); font-size:clamp(16px, 2.85cqw, 22px); }
  .kt-cal--wide .cal-day, .kt-cal--wide .cal-hol{ width:var(--cd); height:var(--cd); }
  /* точка «сегодня» – на том же месте внутри кружка, что и в малом календаре, и растёт вместе с ним */
  .kt-cal--wide .cal-cell.is-today::after{ bottom:calc((var(--ch) - var(--cd)) / 2 + var(--cd) * .083); width:calc(var(--cd) * .14); height:calc(var(--cd) * .14);
    margin-left:calc(var(--cd) * -.07); }
  .kt-cal--wide .cal-note{ margin-top:18px; }
}

/* ===== Группа кнопок действия (.cta-btns): WhatsApp · Telegram · «Zamów wycenę» (21.09.2026) =====
   Форма – как у кнопок WhatsApp / Telegram в панели wyceny (.qd-msgr a): скругление 12px, Fira Sans 17px / 600
   без капса, поля .8em, зазор между кнопками 10px, стрелка 1.15em. Первый вариант был плашками в духе /cennik/
   (6px, узкий капс, зазор 3px) – Грег: «сделай кнопками, а то похоже на плашки. Цветовую гамму не меняй, сейчас круто».
   Цвета (не менять): светлый фон – мессенджеры серые #D0D0CB, при наведении белые; главная жёлтая, при наведении чернильная.
   Тёмный (.bg-ink) – мессенджеры белые → жёлтые, главная жёлтая → белая. Жёлтый (.bg-terra) – мессенджеры белые, главная чернильная.
   Стрелка: у главной видна всегда; у мессенджеров выезжает при наведении, ширина кнопки при этом не меняется
   (место под стрелку в покое отдано боковым полям – тот же приём, что в панели); на телефоне стрелки видны всегда. */
.cta-btns{ display:flex; flex-wrap:wrap; gap:10px; }
.cta-btn{ display:inline-flex; align-items:center; justify-content:center; gap:0;
 font-size:17px; font-weight:600; line-height:1; letter-spacing:.005em; white-space:nowrap;
 padding:.8em 1.35em .8em 1.5em; border-radius:12px; cursor:pointer; text-decoration:none;
 background:#D0D0CB; color:var(--c-ink);
 transition:background-color .3s ease, color .3s ease, padding .38s cubic-bezier(.2,.7,.25,1); }
.cta-btn:hover, .cta-btn:focus-visible{ background:var(--c-paper); }
.cta-btn:focus-visible{ outline:2px solid var(--c-ink); outline-offset:2px; }
.cta-mark{ display:block; flex:0 0 auto; overflow:hidden; width:1.15em; margin-left:9px;
 transition:width .38s cubic-bezier(.2,.7,.25,1), margin-left .38s cubic-bezier(.2,.7,.25,1), opacity .28s ease; }
.cta-mark svg{ width:1.15em; height:1.15em; display:block; margin:-.1em 0; transition:transform .3s ease; }
.cta-btn--main{ background:var(--c-terra); }
.cta-btn--main:hover, .cta-btn--main:focus-visible{ background:var(--c-ink); color:var(--c-paper); }
.cta-btn--main:hover .cta-mark svg, .cta-btn--main:focus-visible .cta-mark svg{ transform:translateX(3px); }
@media (hover:hover) and (pointer:fine){
  .cta-btn:not(.cta-btn--main){ padding:.8em calc(1.5em + (1.15em + 9px) / 2); }
  .cta-btn:not(.cta-btn--main) .cta-mark{ width:0; margin-left:0; opacity:0; }
  .cta-btn:not(.cta-btn--main):hover, .cta-btn:not(.cta-btn--main):focus-visible{ padding-left:1.5em; padding-right:1.5em; }
  .cta-btn:not(.cta-btn--main):hover .cta-mark, .cta-btn:not(.cta-btn--main):focus-visible .cta-mark{ width:1.15em; margin-left:9px; opacity:1; }
}
/* на тёмном фоне */
.bg-ink .cta-btn{ background:var(--c-paper); }
.bg-ink .cta-btn:hover, .bg-ink .cta-btn:focus-visible{ background:var(--c-terra); }
.bg-ink .cta-btn:focus-visible{ outline-color:var(--c-paper); }
.bg-ink .cta-btn--main{ background:var(--c-terra); }
.bg-ink .cta-btn--main:hover, .bg-ink .cta-btn--main:focus-visible{ background:var(--c-paper); color:var(--c-ink); }
/* на жёлтой карточке */
.bg-terra .cta-btn{ background:var(--c-paper); }
.bg-terra .cta-btn:hover, .bg-terra .cta-btn:focus-visible{ background:var(--c-ink); color:var(--c-paper); }
.bg-terra .cta-btn--main{ background:var(--c-ink); color:var(--c-paper); }
.bg-terra .cta-btn--main:hover, .bg-terra .cta-btn--main:focus-visible{ background:var(--c-paper); color:var(--c-ink); }
/* телефон: мессенджеры пополам, главная кнопка во всю ширину */
@media (max-width:479px){
  .cta-btns{ display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .cta-btn--main{ grid-column:1 / -1; }
  .cta-btns > .cta-btn:only-child{ grid-column:1 / -1; }
  /* кнопка занимает всю ячейку, боковые поля нужны только как минимум: иначе «WhatsApp ›» не влезает в половину экрана 320px */
  .cta-btn, .cta-btn:not(.cta-btn--main), .cta-btn:not(.cta-btn--main):hover, .cta-btn:not(.cta-btn--main):focus-visible{ padding:.95em .7em; }
}
@media (max-width:359px){ .cta-btn:not(.cta-btn--main) .cta-mark{ display:none; } }
@media (prefers-reduced-motion:reduce){ .cta-btn, .cta-mark, .cta-mark svg{ transition:none; } }
/* ряд в hero: кнопки и ссылка-стрелка на одной линии, по левому краю текста (как чипы на /cennik/) */
.cta-line{ display:flex; flex-wrap:wrap; align-items:center; gap:1.1rem 1.75rem; }
.cta-line .k-where-link{ margin-top:0; }
/* призыв под плашкой с урядами */
.gdz-cta{ margin-top:2.5rem; display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:1.4rem 2.5rem; }
.gdz-cta-t{ font-size:21px; line-height:1.35; font-weight:700; letter-spacing:-.01em; max-width:34ch; }
@media (min-width:768px){ .gdz-cta-t{ font-size:24px; } }

/* ===== Страница /apostille/ ===== */
/* Две текстовые колонки */
.ap-cols{ display:grid; gap:1.5rem; max-width:120ch; }
@media (min-width:1024px){ .ap-cols{ grid-template-columns:1fr 1fr; gap:3rem; } }
/* Три урядa на тёмной плите – как .gdz, но в три колонки */
.ap3{ display:grid; grid-template-columns:1fr; }
.ap3-cell + .ap3-cell{ border-top:1px solid rgba(255,255,255,.15); }
.ap3-cell .gdz-full{ max-width:none; }
@media (min-width:1024px){
  .ap3{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  .ap3-cell + .ap3-cell{ border-top:0; border-left:1px solid rgba(255,255,255,.15); }
  .ap3-cell .gdz-full{ min-height:3em; }
}
.ap3-cell .ap-desc{ margin-top:1rem; font-size:15.5px; line-height:1.55; color:rgba(255,255,255,.65); }
/* Типы документов – карточки */
.ap-docs{ display:grid; gap:1.25rem; }
@media (min-width:640px){ .ap-docs{ grid-template-columns:1fr 1fr; gap:1.5rem 2.5rem; } }
@media (min-width:1024px){ .ap-docs{ grid-template-columns:repeat(3, minmax(0,1fr)); } }
.ap-doc{ padding-top:1rem; border-top:2px solid rgba(31,33,32,.15); }
.ap-doc h3{ font-size:20px; font-weight:700; letter-spacing:-.01em; line-height:1.2; }
.ap-doc p{ margin-top:.5rem; font-size:15.5px; line-height:1.55; color:rgba(31,33,32,.72); }
/* 04.10.2026 (аналитика 02.10, В6): текст карточек – основной, 17px; только PL, ua/ru/en – при общем проходе */
html[lang="pl"] .ap-doc p{ font-size:17px; }

/* ===== Страница /cennik/ ===== */
.cn-groups{ display:grid; gap:2.5rem; }
@media (min-width:1024px){ .cn-groups{ grid-template-columns:1fr 1fr; gap:3rem 4rem; } }
.cn-razem{ margin-top:2.5rem; }
/* «Ile zapłacę za…» стоит вне сетки .cn-groups и тянется на всю ширину:
   вводный абзац ограничен той же мерой, что у FAQ, список – в две колонки,
   как соседние группы; границы строк выравниваются по строкам сетки. */
.cn-razem .cn-group-t{ max-width:70ch; }
@media (min-width:1024px){
  .cn-razem{ margin-top:3rem; }
  .cn-razem .cn-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:4rem; }
}
.cn-incl{ margin-top:2.5rem; }
.cn-plain{ margin:1rem 0 0; padding:0; list-style:none; border-top:2px solid rgba(31,33,32,.15); }
.cn-plain li{ padding:.75rem 0; border-bottom:1px solid rgba(31,33,32,.12); font-size:15px; line-height:1.5; }
.cn-send{ margin:0; padding-left:1.1rem; font-size:15px; line-height:1.5; color:rgba(31,33,32,.8); }
.cn-send li{ margin:.25rem 0; }
.cn-group-h{ font-size:24px; font-weight:800; letter-spacing:-.02em; line-height:1.1; }
.cn-group-t{ margin-top:.4rem; font-size:15px; line-height:1.5; color:rgba(31,33,32,.6); }
.cn-list{ margin:1rem 0 0; padding:0; list-style:none; border-top:2px solid rgba(31,33,32,.15); }
.cn-list li{ display:flex; align-items:flex-start; justify-content:space-between; gap:1.5rem;
 padding:1rem 0; border-bottom:1px solid rgba(31,33,32,.12); }
.cn-name{ display:flex; flex-direction:column; gap:.2rem; font-size:17px; font-weight:600; letter-spacing:-.01em; line-height:1.3; }
.cn-name small{ font-size:14px; font-weight:400; line-height:1.45; color:rgba(31,33,32,.6); max-width:44ch; }
.cn-price{ display:flex; flex-direction:column; align-items:flex-end; text-align:right; flex:0 0 auto; }
.cn-price b, .cn-price .price-hit b{ font-size:19px; font-weight:700; white-space:nowrap; letter-spacing:-.01em; }
.cn-price small{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase; letter-spacing:.12em;
 font-size:11px; color:rgba(31,33,32,.5); margin-top:.15rem; white-space:nowrap; }
/* Маркер под ценой: вырастает снизу вверх при наведении на строку.
   У строк без числа (wycena) это единственный эффект, у остальных – вместе с накруткой. */
.cn-list li > .cn-price > b,
.cn-list li > .cn-price > .price-hit > b{ --c-mark:#F2E23A;
 background-image:linear-gradient(var(--c-mark),var(--c-mark));
 background-repeat:no-repeat; background-position:0 90%; background-size:100% 0;
 transition:background-size .5s cubic-bezier(.4,.65,.35,1); }
.cn-list li:hover > .cn-price > b,
.cn-list li:hover > .cn-price > .price-hit > b{ background-size:100% .46em; }

/* ===== /cennik/ v2 (пока только PL, класс cn-v2 на секции #ceny) =====
   Крупнее кегль, группы лестницей (л/п/л/п), строка = сетка областей:
   название | цена, под названием описание, формула суммы и плашки. */
/* Заголовок «Ile kosztuje…»: sm:text-[62px] в статичной сборке Tailwind нет,
   поэтому кегль задаём здесь. 57px = 44px + 30 % (11.09.2026). */
.cn-v2 .h2-swap, .cn-faq .h2-swap{ font-size:57px; }
/* Кнопки-якоря в потоке (оба списка: под заголовком и после сноски): серые плашки,
   при наведении белые. Подсветки текущего раздела здесь нет – она только в доке. */
.cn-v2 .cn-nav{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-start;
 margin-top:2rem; }
.cn-nav a, .cn-dock a{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.12em; font-size:13px; font-weight:700; line-height:1; padding:.75em 1em .8em;
 border-radius:6px; color:var(--c-ink); text-decoration:none;
 position:relative; overflow:clip; isolation:isolate;
 transition:background-color .25s ease, color .25s ease; }
.cn-v2 .cn-nav a{ background:#D0D0CB; }
.cn-v2 .cn-nav a:hover, .cn-v2 .cn-nav a:focus-visible{ background:var(--c-paper); }
/* повтор списка после сноски – отдельным блоком под сеткой групп */
.cn-v2 .cn-nav--end{ margin-top:2.25rem; }

/* Отдельное плавающее меню внизу окна – клон якорей, который app.js создаёт и показывает
   при прокрутке; у подвала останавливается над ним. Со списком в потоке не связано.
   Как у butter.video/product: одна белая плашка по центру, кнопки внутри прозрачные –
   между ними не просвечивает текст страницы. Узкое окно – плашка листается вбок. */
.cn-dock{ position:fixed; left:50%; bottom:24px; z-index:60;
 display:flex; flex-wrap:nowrap; gap:2px; align-items:center;
 width:max-content; max-width:calc(100% - 2.5rem);
 padding:6px; border-radius:12px; background:var(--c-paper);
 box-shadow:0 1px 2px rgba(31,33,32,.06), 0 8px 24px rgba(31,33,32,.08);
 overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:none;
 pointer-events:none; opacity:0; transform:translate(-50%,12px);
 transition:opacity .3s ease, transform .3s ease; }
.cn-dock::-webkit-scrollbar{ display:none; }
@media (min-width:640px){ .cn-dock{ max-width:calc(100% - 4rem); } }
.cn-dock.is-on{ opacity:1; transform:translate(-50%,0); pointer-events:auto; }
.cn-dock a{ background:transparent; white-space:nowrap; flex:none; }
.cn-dock a:hover, .cn-dock a:focus-visible{ background:#EDEDEA; }
@media (max-width:639px){ .cn-dock{ display:none; } }
/* текущий раздел – мягкий серый, как плашки условий в прайсе (.cn-pill) */
.cn-dock a.is-here{ background:var(--c-sand); }
/* 03.10.2026 (Грег): «давай якоря влево по верхней плашке меню выставим, а кнопка не будет мешать». От 1150px плитка якорей
   стоит не по центру, а слева – левый край по левому краю плашки шапки (ряд #top: 1354px минус поля 1.25rem); справа, по правому
   краю плашки, – всплывающая «Ekspresowa wycena» (.m-dock), она на /cennik/ больше не уступает якорям (app.js). Середины плитки
   и кнопки – на одной линии (высоту ставит app.js). Ширина плитки – до кнопки (её 322px + зазор). Уже 1150px – как было, по центру. */
@media (min-width:1150px){
  .cn-dock{ left:calc(max(0px, (100% - 1354px) / 2) + 1.25rem); transform:translate(0,12px);
    max-width:calc(min(100%, 1354px) - 2.5rem - 350px); }
  .cn-dock.is-on{ transform:none; }
}
@media (prefers-reduced-motion:reduce){ .cn-dock{ transition:none; } }

/* Статусная строка: две плашки рядом со скруглением 6px – серый ярлык и жёлтая с текстом,
   по ширине содержимого, без растяжки на всю строку */
.cn-v2 .cn-status{ display:flex; flex-wrap:wrap; align-items:center; gap:3px; margin-top:2rem;
 font-size:14px; font-weight:600; line-height:1.3; }
.cn-v2 .cn-status b{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase; letter-spacing:.14em;
 font-size:13px; font-weight:700; background:#D0D0CB; color:var(--c-ink); padding:.7em 1em .75em; border-radius:6px; }
/* месяц с заглавной, хотя в UPDATED он строчный (правится скриптом cennik-date.py) */
.cn-v2 .cn-status .cennik-updated{ text-transform:capitalize; }
.cn-v2 .cn-status > span{ flex:1 1 auto; background:var(--c-terra); color:var(--c-ink); padding:.55em .9em .6em; border-radius:6px; }
/* Плашка тянется по ширине лида в шапке (.lead-lines: 36em при 20/24px) */
.cn-v2 .cn-status{ max-width:720px; }
@media (min-width:640px){ .cn-v2 .cn-status{ max-width:864px; } }

/* Заголовок раздела: начертания меняются местами при прокрутке (мгновенно, шрифт статичный).
   Класс is-swap ставит app.js, когда верх заголовка поднимается выше 55% высоты окна; ниже – снимает. */
.h2-swap.is-swap .h2-a{ font-weight:300; font-style:italic; }
.h2-swap.is-swap .h2-b{ font-weight:900; font-style:normal; }

.cn-v2 .cn-groups{ display:grid; gap:3.5rem; margin-top:3rem; }
.cn-v2 .cn-incl{ margin-top:0; gap:2.5rem; }
.cn-v2 .cn-razem{ margin-top:0; }
@media (min-width:1024px){
  .cn-v2 .cn-groups{ grid-template-columns:repeat(12,1fr); column-gap:2rem; row-gap:5.5rem; margin-top:4rem; }
  .cn-v2 .cn-groups > .cn-l{ grid-column:1 / span 8; }
  .cn-v2 .cn-groups > .cn-r{ grid-column:5 / span 8; }
  .cn-v2 .cn-groups > .cn-full{ grid-column:1 / -1; }
  .cn-v2 .cn-incl{ grid-template-columns:1fr 1fr; column-gap:4rem; row-gap:0; margin-top:0; }
  .cn-v2 .cn-razem{ margin-top:0; }
  .cn-v2 .cn-razem .cn-list{ column-gap:3rem; }
}

/* Заголовки групп и лиды */
.cn-v2 .cn-group-h{ font-size:32px; font-weight:700; letter-spacing:-.025em; }
@media (min-width:640px){ .cn-v2 .cn-group-h{ font-size:36px; } }
/* «Ile zapłacę za…?» – заголовок раздела, кегль как у «Ile kosztuje…». */
.cn-v2 .cn-group-h.h2-swap{ font-size:57px; font-weight:900; letter-spacing:-.04em; line-height:.95; }
.cn-v2 .cn-group-t{ margin-top:.6rem; font-size:17px; font-weight:500; line-height:1.5; color:rgba(31,33,32,.65); max-width:60ch; }
.cn-v2 .cn-note{ margin-top:1.25rem; font-size:16px; font-weight:500; line-height:1.55; color:rgba(31,33,32,.6); max-width:70ch; }

/* Строка прайса */
/* Линия под заголовком группы: серая 1px, как остальные хэйрлайны, поверх неё жёлтая от --q до --p (обе 0..1, из app.js) */
.cn-v2 .cn-list, .cn-v2 .cn-plain{ position:relative; border-top-width:1px; }
.cn-v2 .cn-list::before, .cn-v2 .cn-plain::before{ content:""; position:absolute; top:-1px; height:1px;
 left:calc(var(--q,0) * 100%); width:calc((var(--p,0) - var(--q,0)) * 100%); background:var(--c-terra); }
.cn-v2 .cn-list{ margin-top:1.5rem; }
.cn-v2 .cn-list li{ display:grid; grid-template-columns:minmax(0,1fr) auto; gap:0 1.25rem; align-items:start;
 grid-template-areas:"name price" "desc desc" "sum sum" "meta meta"; padding:1.25rem 0; }
@media (min-width:640px){
  .cn-v2 .cn-list li{ gap:0 2rem; grid-template-areas:"name price" "desc price" "sum price" "meta price"; }
}
.cn-v2 .cn-name{ grid-area:name; font-size:21px; font-weight:700; line-height:1.25; }
@media (min-width:640px){ .cn-v2 .cn-name{ font-size:22px; } }
.cn-v2 .cn-desc, .cn-v2 .cn-name small{ font-size:16px; font-weight:500; line-height:1.45; color:rgba(31,33,32,.65); max-width:48ch; }
.cn-v2 .cn-desc{ grid-area:desc; display:block; margin-top:.3rem; }
.cn-v2 .cn-name small{ margin-top:.1rem; }

/* Маркер под ценой при наведении – фирменная terra, а не лимонный #F2E23A из базового правила */
.cn-v2 .cn-list li > .cn-price > .price-hit > b{ --c-mark:var(--c-terra); }
/* Цена прижата к низу строки, единица над ней как кикер: «/ DOKUMENT» сверху, «260,- zł» под ней,
   низ цены на одной линии с плашками. На телефоне цена в первой строке рядом с названием – как было. */
.cn-v2 .cn-price{ grid-area:price; }
@media (min-width:640px){
  .cn-v2 .cn-price{ align-self:end; flex-direction:column-reverse; padding-bottom:.1rem; }
  .cn-v2 .cn-price small{ margin:0 0 .35rem; }
}
.cn-v2 .cn-price b, .cn-v2 .cn-price .price-hit b{ font-size:24px; font-weight:800; letter-spacing:-.02em; }
@media (min-width:640px){ .cn-v2 .cn-price b, .cn-v2 .cn-price .price-hit b{ font-size:28px; } }
.cn-v2 .cn-price small{ font-size:12px; font-weight:500; letter-spacing:.1em; color:rgba(31,33,32,.6); margin-top:.25rem; }
/* Значение без числа (wycena, w cenie) – плашка вместо жирного текста */
.cn-v2 .cn-price > b{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 font-size:12.5px; font-weight:700; letter-spacing:.1em; line-height:1.2; padding:.45em .75em .5em;
 border:0; border-radius:6px; background-color:var(--c-sand); color:var(--c-ink); margin-top:.35em;
 background-image:linear-gradient(var(--c-mark),var(--c-mark)); background-repeat:no-repeat;
 background-position:0 100%; background-size:100% 0;
 transition:background-size .5s cubic-bezier(.4,.65,.35,1); }
/* цвет заливки – фирменный terra; селектор длиннее базового правила с лимонным #F2E23A,
   иначе оно перебивает по специфичности */
.cn-v2 .cn-list li > .cn-price > b{ --c-mark:var(--c-terra); }
/* при наведении на строку заливка вырастает снизу вверх */
.cn-v2 .cn-list li:hover > .cn-price > b{ background-size:100% 100%; }
/* Одинокий прочерк (odbiór osobisty) – без плашки */
.cn-v2 .cn-price > b:only-child{ padding:0; background:none; background-image:none; font:inherit; font-size:24px; font-weight:800; margin-top:0; }

/* Формула суммы в «Ile zapłacę za…» */
.cn-v2 .cn-sum{ grid-area:sum; display:block; margin-top:.5rem;
 font-size:16px; font-weight:500; line-height:1.5; font-style:italic; color:rgba(31,33,32,.8); max-width:52ch; }
.cn-v2 .cn-sum > i{ font-style:normal; font-weight:700; color:var(--c-ink); margin:0 .35em; }

/* Плашки: срок – залитая, условия – контурные */
.cn-v2 .cn-meta{ grid-area:meta; display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.75rem; }
.cn-v2 .cn-term, .cn-v2 .cn-tags{ display:contents; }
.cn-v2 .cn-pill{ display:inline-block; font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.1em; font-size:12.5px; font-weight:700; line-height:1.2; padding:.45em .75em .5em;
 border-radius:6px; background:var(--c-sand); color:var(--c-ink); white-space:nowrap; transition:background-color .25s ease; }
/* срок – серый темнее условий; при наведении на строку подсвечивается белым, у всех строк */
.cn-v2 .cn-term .cn-pill{ background:#D0D0CB; color:var(--c-ink); }
.cn-v2 .cn-list li:hover .cn-term .cn-pill{ background:var(--c-paper); }
/* несколько плашек срока загораются по очереди, шаг 420 мс; гаснут все сразу */
.cn-v2 .cn-list li:hover .cn-term .cn-pill:nth-child(2){ transition-delay:.42s; }
.cn-v2 .cn-list li:hover .cn-term .cn-pill:nth-child(3){ transition-delay:.84s; }
@media (max-width:379px){ .cn-v2 .cn-pill{ white-space:normal; } }

/* «W cenie» с галочкой, «Poza ceną» с плюсом */
.cn-v2 .cn-plain{ margin-top:1.25rem; }
.cn-v2 .cn-plain li{ position:relative; padding:.85rem 0 .85rem 1.7rem; font-size:17px; font-weight:500; line-height:1.5; }
/* Маркер в покое – глиф: «W cenie» – галочка, «Poza ceną» – та же стрелка-шеврон, что у кнопок (.btn-chev);
   при наведении на строку глиф сменяется залитым кружком terra */
.cn-v2 .cn-plain li{ text-wrap:pretty; }
.cn-v2 .cn-plain li::before, .cn-v2 .cn-plain li::after{ content:""; position:absolute; left:0; top:1.15rem;
 width:14px; height:14px; transition:opacity .25s ease; }
.cn-v2 .cn-plain li::before{ background:var(--c-terra); border-radius:50%; left:3px; top:calc(1.15rem + 3px); width:8px; height:8px; opacity:0; }
.cn-v2 .cn-plain li::after{ background-repeat:no-repeat; background-size:contain; background-position:center; }
.cn-v2 .cn-plain--in li::after{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M4 12.5l5.5 5.5L20 7' fill='none' stroke='%23EFB01F' stroke-width='3.8' stroke-linecap='butt' stroke-linejoin='miter'/></svg>"); }
.cn-v2 .cn-plain--out li::after{ background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8 4l8 8-8 8' fill='none' stroke='%23EFB01F' stroke-width='3.8' stroke-linecap='butt' stroke-linejoin='miter'/></svg>"); }
.cn-v2 .cn-plain li:hover::before{ opacity:1; }
.cn-v2 .cn-plain li:hover::after{ opacity:0; }

/* Сноска */
.cn-v2 .cn-foot p{ font-size:16px; font-weight:500; line-height:1.6; color:rgba(31,33,32,.65); max-width:70ch; }
.cn-v2 .cn-foot p + p{ margin-top:.6rem; }
/* первая строка сноски – тёмная, в тон заголовкам */
.cn-v2 .cn-foot p:first-child{ color:var(--c-ink); font-weight:600; }
.cn-v2 .cn-foot a{ text-decoration:underline; text-underline-offset:3px; }

/* ===== Блок wyceny на /cennik/ (класс wy-v2 на секции): светлая форма вместо тёмной ===== */
.wy-v2 .field{ border-bottom-color:rgba(31,33,32,.25); color:var(--c-ink); }
.wy-v2 .field::placeholder{ color:rgba(31,33,32,.4); }
.wy-v2 .field:focus{ border-bottom-color:var(--c-terra); border-bottom-width:2px; padding-bottom:calc(.85rem - 1px); }
.wy-v2 select.field option{ background:var(--c-paper); color:var(--c-ink); }
.wy-v2 select.field{ cursor:pointer; }
.wy-v2 label:not(.qd-urgent):not(.qd-acc-head){ color:rgba(31,33,32,.55) !important; }
.wy-v2 label[for="consent"]{ color:rgba(31,33,32,.7) !important; font-weight:500; }
.wy-v2 label[for="consent"] a:hover{ color:var(--c-ink); }
.wy-v2 #quote-form p{ color:rgba(31,33,32,.5); font-weight:500; }
.qd .wy-v2 #quote-form p, .qd .wy-v2 form.quote-form p{ font-weight:400; }
.wy-v2 #form-status{ color:var(--c-ink); font-weight:600; }
.wy-v2 #consent{ accent-color:var(--c-terra); }
.wy-v2 .file-btn{ border-radius:6px; font-weight:700; font-family:'Fira Sans Condensed','Fira Sans',sans-serif;
 text-transform:uppercase; letter-spacing:.1em; font-size:12.5px; padding:.6rem 1rem; background:var(--c-sand); border-color:transparent; }
.wy-v2 .file-btn:hover{ background:var(--c-terra); }
.wy-v2 .file-name{ opacity:.55; font-weight:500; }
/* кнопки: главная залита terra (btn--pop, как на главной), вторая – контурная */
.wy-v2 .btn{ border-radius:6px; }
.wy-v2 .btn:not(.btn--pop){ border-color:rgba(31,33,32,.25); }
.wy-v2 .btn:not(.btn--pop):hover, .wy-v2 .btn:not(.btn--pop):focus-visible{ background-color:var(--c-sand); border-color:transparent; color:var(--c-ink); }
/* левая колонка: список «co wysłać» с кружками terra, при наведении – квадрат */
.wy-v2 .cn-send{ list-style:none; padding:0; font-size:16px; font-weight:500; color:rgba(31,33,32,.75); }
.wy-v2 .cn-send li{ position:relative; padding-left:1.4rem; margin:.35rem 0; }
.wy-v2 .cn-send li::before{ content:""; position:absolute; left:0; top:.55em; width:9px; height:9px;
 background:var(--c-terra); border-radius:50%; transition:border-radius .25s ease; }
.wy-v2 .cn-send li:hover::before{ border-radius:0; }
/* мини-прайс слева: маркер под ценой – terra, подписи тяжелее */
.wy-v2 .hairline .price-hit b{ --c-mark:var(--c-terra); background-image:linear-gradient(var(--c-mark),var(--c-mark));
 background-repeat:no-repeat; background-position:0 90%; background-size:100% 0; transition:background-size .5s cubic-bezier(.4,.65,.35,1); }
.wy-v2 .hairline .flex:hover .price-hit b{ background-size:100% .46em; }
.wy-v2 .hairline > .flex > span:first-child{ font-weight:700; }
.wy-v2 .hairline .text-\[13px\], .wy-v2 .text-ink\/45{ font-weight:500; }

@media print{
  .cn-v2 .cn-nav{ display:none; }
  .cn-v2 .cn-groups{ display:block; }
  .cn-v2 .cn-group{ margin-top:2rem; break-inside:avoid; }
}
@media (prefers-reduced-motion:reduce){ .cn-list li > .cn-price > b,
  .cn-list li > .cn-price > .price-hit > b{ transition:none; } }

/* ===== Страница /apostille-ukraina/ ===== */
/* Таблица сроков: случай · срок · пояснение */
.ua-terms{ border-top:2px solid rgba(31,33,32,.15); }
.ua-term{ display:grid; gap:.35rem 1.5rem; padding:1rem 0; border-bottom:1px solid rgba(31,33,32,.12); }
@media (min-width:768px){ .ua-term{ grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,2fr); align-items:baseline; } }
.ua-term-h{ display:flex; flex-direction:column; gap:.15rem; font-size:17px; font-weight:600; letter-spacing:-.01em; line-height:1.3; }
.ua-term-h small{ font-size:14px; font-weight:400; color:rgba(31,33,32,.6); }
/* срок – чернильный, не охра (21.09.2026): охра на светлом фоне давала контраст 1.7 : 1, на телефоне
   главная цифра страницы не читалась. Охра остаётся заливкой и маркером, текстом – только на тёмном */
.ua-term-v{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; font-weight:700; font-size:22px; letter-spacing:-.01em; color:var(--c-ink); white-space:nowrap; }
.ua-term-t{ font-size:15px; line-height:1.5; color:rgba(31,33,32,.65); }

/* ===== Панель «Ekspresowa wycena»: выезжает снизу по кнопке «Wyceń dokument» =====
   Ширина – по контентной сетке (max-w-site 1320px), верхние углы скруглены.
   Над панелью по центру – пульсирующая стрелка сайта, повёрнутая вниз, жёлтая на белом кружке;
   при наведении она превращается в крестик и закрывает панель. */
#quote-drawer[hidden]{ display:none !important; }
.qd{ position:fixed; inset:0; z-index:110; display:flex; align-items:flex-end; justify-content:center; }
.qd-backdrop{ position:absolute; inset:0; background:rgba(31,33,32,.55);
 opacity:0; transition:opacity .35s ease; }
.qd.is-open .qd-backdrop{ opacity:1; }
.qd-wrap{ position:relative; z-index:1; width:100%; max-width:1320px;
 display:flex; flex-direction:column; align-items:flex-end;
 transform:translateY(100%); transition:transform .5s cubic-bezier(.2,.7,.25,1); }
.qd.is-open .qd-wrap{ transform:none; }
/* Обёртка выше панели на высоту кнопки-стрелки (66px) и на всю её ширину – на десктопе это
   ровно полоса шапки. Сама она клики не ловит: они проходят на подложку и закрывают панель;
   стрелка и панель остаются кликабельными (11.09.2026). */
.qd-wrap{ pointer-events:none; }
.qd-wrap > *{ pointer-events:auto; }
.qd-shell{ width:100%; max-height:88vh; background:var(--c-paper);
 border-radius:26px 26px 0 0; overflow:hidden; }
/* карточка занимает панель целиком: серая колонка от левого края и на всю высоту */
.qd-scroll{ max-height:88vh; overflow:auto; -webkit-overflow-scrolling:touch;
 /* прокрутка панели не перескакивает на страницу, когда дошла до края (21.09.2026) */
 overscroll-behavior:contain; }
/* у карточки внутри панели снимаем overflow-hidden: он делает её собственным контейнером
   прокрутки и ломает sticky у шапки левой колонки */
.qd-scroll > div{ border-radius:0; min-height:100%; overflow:visible; }
.qd-scroll > div > .grid{ min-height:88vh; align-items:stretch; }
/* Высота панели – от видимой части окна (21.09.2026). В Safari на iPhone 1vh считается от окна
   со свёрнутой адресной строкой: пока строка развёрнута, 88vh ≈ вся видимая высота, панель упиралась
   в верх экрана, а кнопка закрытия (56 + 10px над панелью) уезжала за его край. dvh следует за
   реальной высотой; второе ограничение держит место под кнопку и на низком экране (телефон лёжа). */
@supports (height:100dvh){
  .qd-shell, .qd-scroll{ max-height:min(88dvh, calc(100dvh - 72px)); }
  .qd-scroll > div > .grid{ min-height:min(88dvh, calc(100dvh - 72px)); }
}
/* Правая колонка начинается на уровне абзаца «Wypełnij formularz…» – ниже заголовка:
   3 строки h2 (56px × 0.94) + кикер ≈ 11.5rem поверх собственного padding колонки */
/* С 11.09.2026 форма начинается с верха панели, под собственным заголовком «Zamów wycenę» –
   верхние поля обеих колонок равны (p-14), без смещения на высоту h2. */
/* Шапка левой колонки («/ Wycena» + «Ekspresowa wycena dokumentu») закреплена:
   видна всё время, пока листаешь содержимое панели */
/* top = верхний padding колонки (p-7 / sm:p-12 / lg:p-14), чтобы при закреплении
   блок остался ровно на своём месте, без микросдвига */
.qd-scroll .qd-head{ position:sticky; top:1.75rem; z-index:2; background:var(--c-sand);
 padding:0 0 .75rem; }
@media (min-width:640px){ .qd-scroll .qd-head{ top:3rem; } }
@media (min-width:1024px){
  /* на десктопе закрепляется вся левая колонка: прокрутка правой её не двигает */
  .qd-scroll .qd-head{ position:static; background:none; padding:0; }
  .qd-scroll .qd-left{ position:sticky; top:3.5rem; }
}
/* срок ответа под заголовком */
.qd-eta{ display:flex; align-items:center; gap:.6rem; margin-top:1rem;
 font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.12em; font-size:12px; font-weight:600; color:rgba(31,33,32,.6); }
.qd-eta b{ font-size:13px; font-weight:700; letter-spacing:.1em; color:var(--c-ink);
 background:var(--c-terra); border-radius:6px; padding:.45em .75em .5em; }

/* ===== Панель wyceny: крупнее и яснее (вариант 11.09.2026). Только панель (.qd),
   встроенная форма wy-v2 на ua/ru/en не затронута. ===== */
.qd .wy-v2 .qd-eta{ font-size:14px; }
.qd .wy-v2 .qd-eta b{ font-size:15px; }
/* зазор между плашками – как в строке статуса на /cennik/ (.cn-status, 3px) */
.qd .wy-v2 .qd-eta{ gap:3px; margin-top:1.75rem; flex-wrap:wrap; }
/* плашки не ломаются внутри: на узком экране слоган целиком переносится под «15 min» */
.qd .wy-v2 .qd-eta b, .qd .wy-v2 .qd-eta span{ white-space:nowrap; }
/* слоган рядом с «15 min» – на белой плашке той же формы, что и жёлтая */
.qd .wy-v2 .qd-eta span{ align-self:stretch; min-height:37px; box-sizing:border-box; display:flex; align-items:center; background:var(--c-paper); color:var(--c-ink); border-radius:6px; padding:0 .75em; }
/* обещание – единственный текст колонки под заголовком, крупно (14.09.2026) */
.qd .wy-v2 .qd-lead{ font-size:24px; line-height:1.3; letter-spacing:-.01em; color:var(--c-ink); max-width:none; }
.qd .wy-v2 .qd-lead b{ font-weight:600; color:var(--c-ink); }
/* вторая строка под обещанием – тише, светлый курсив как во второй половине заголовков */
.qd .wy-v2 .qd-human { font-weight:400; }
.qd .wy-v2 .qd-sub{ font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.14em; font-size:13px; font-weight:700; color:rgba(31,33,32,.6); }
.qd .wy-v2 .cn-send{ font-size:17px; color:rgba(31,33,32,.85); }
.qd .wy-v2 .cn-send li{ margin:.45rem 0; }
/* заголовок формы */
/* на десктопе заголовок формы на уровне «Ekspresowa», а не кикера */
@media (min-width:1024px){ .qd .wy-v2 .qd-formhead:first-child{ margin-top:2.25rem; } }
.qd .wy-v2 .qd-formhead{ margin-bottom:1.4rem; font-size:26px; font-weight:800; letter-spacing:-.02em; line-height:1.1; color:var(--c-ink); }
/* заголовок над формой – легче и серее, чтобы не спорил с «Ekspresowa» слева */
.qd .wy-v2 .qd-formhead--light{ color:var(--c-ink); text-align:center; }
/* смена начертаний как в заголовках сайта: плотное + светлый курсив */
.qd .wy-v2 .qd-fh-a{ font-weight:800; }
.qd .wy-v2 .qd-fh-b{ font-weight:300; font-style:italic; }
.qd .wy-v2 .qd-formsub{ font-size:16px; line-height:1.5; color:rgba(31,33,32,.65); font-weight:500; margin:.6rem 0 1.6rem; max-width:46ch; }
/* подписи полей – тот же лёгкий серый{ display:block; font-family:'Fira Sans Condensed','Fira Sans',sans-serif; text-transform:uppercase;
 letter-spacing:.14em; font-size:13px; font-weight:700; line-height:1.3; margin:0 0 .6rem; color:rgba(31,33,32,.7) !important; }
/* поля в рамке вместо линии снизу */
.qd .wy-v2 .field{ font-size:17px; line-height:1.3; border:1px solid rgba(31,33,32,.3); border-radius:8px;
 padding:.8rem 1rem; background:var(--c-paper); }
.qd .wy-v2 .field:focus{ border-color:var(--c-terra); border-width:2px; padding:calc(.8rem - 1px) calc(1rem - 1px); box-shadow:none; }
.qd .wy-v2 select.field{ padding-right:2.4rem; }
.qd .wy-v2 .quote-form > * + *{ margin-top:1.6rem; }
/* блок телефона отстоит от дропзоны дальше остальных (+24%) */
.qd .wy-v2 .qd-legal a, .qd .wy-v2 .qd-legal .qd-linkbtn{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
/* документ – первое и главное поле: вся рамка кликабельна (label for=file), кнопка terra,
   после выбора файла рамка становится сплошной, имя файла – в строке */
.qd .wy-v2 .qd-drop{ display:flex; flex-direction:column; align-items:center; text-align:center; gap:.9rem; cursor:pointer; margin:0 auto; border:2px dashed rgba(31,33,32,.38); border-radius:10px; transition:border-color .2s ease, background-color .2s ease; }
.qd .wy-v2 .qd-drop:hover, .qd .wy-v2 .qd-drop.is-over{ background:rgba(31,33,32,.05); }

.qd .wy-v2 .file-input-hidden:focus-visible + .qd-drop{ outline:2px solid var(--c-terra); outline-offset:3px; }
/* вариант D (14.09.2026): чёрный кружок «+» и надпись; вся рамка – один клик (label for=file) */
.qd .wy-v2 .qd-drop-row{ display:flex; align-items:center; justify-content:center; }
/* подпись центрирована по надписи, а не по всей строке с кружком, и прижата к ней */
.qd .wy-v2 .qd-plus{ flex:none; border-radius:50%; }
.qd .wy-v2 .qd-drop:hover .qd-plus, .qd .wy-v2 .qd-drop.is-over .qd-plus{ background:#D0D0CB; }
.qd .wy-v2 .qd-drop.is-filled .file-name{ color:var(--c-ink); }
/* «przeciągnij» – только там, где есть мышь; на телефоне тянуть нечего */
@media (hover:hover) and (pointer:fine){ .qd .wy-v2 .qd-drop-drag{ display:block; } }
/* ссылка-действие отдельной строкой под подписью, по центру */
/* «wolę odpowiedź mailem» – кнопка в виде ссылки, показывает поле e-mail под телефоном */
.qd .wy-v2 .qd-linkbtn{ background:none; border:0; padding:0; margin:0; font:inherit; font-size:14px; cursor:pointer;
 text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
/* «Wolę odpowiedź mailem» – стрелка вниз как у переключателя языка (.ls-chev): поле раскроется ниже */
.qd .wy-v2 .qd-linkbtn--chev{ display:inline-flex; align-items:center; gap:7px; text-decoration:none; }
.qd .wy-v2 .qd-linkbtn--chev span{ text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.qd .wy-v2 .qd-chev{ flex:none; transition:transform .18s ease; }
.qd .wy-v2 .qd-linkbtn--chev[aria-expanded="true"] .qd-chev{ transform:rotate(180deg); }
/* поля контактов уже дропзоны – короткий ввод не должен растягиваться на всю колонку */
/* ширина по содержимому: номер телефона короткий, e-mail длиннее; на узком экране не шире колонки */
.qd .wy-v2 .quote-form input.field{ width:100%; margin:0 auto; }
.qd .wy-v2 .quote-form input[type="tel"].field{ max-width:15rem; }
.qd .wy-v2 .quote-form input[type="email"].field{ max-width:20rem; }
/* чипы «czego dotyczy sprawa»: чекбоксы в виде таблеток, без набора текста (14.09.2026) */
/* правая колонка панели – всё по центру (14.09.2026) */
.qd .wy-v2 .quote-form{ text-align:center; } .qd .wy-v2 .quote-form .qd-legal,
.qd .wy-v2 .quote-form .qd-status{ text-align:center; }
.qd .wy-v2 .quote-form #phone, .qd .wy-v2 .quote-form [id^="phone"], .qd .wy-v2 .quote-form [id^="email"]{ text-align:center; }
.qd .wy-v2 .quote-form textarea.field{ text-align:left; }
.qd .wy-v2 .qd-submit{ display:inline-flex; margin:0 auto; }
.qd .wy-v2 .qd-msg{ flex:1 0 100%; }
.qd .wy-v2 textarea.field{ resize:vertical; min-height:5.5rem; }
/* одна кнопка на всю ширину, под ней строка согласия */
.qd .wy-v2 .qd-submit{ width:auto; }
@media (max-width:479px){ .qd .wy-v2 .qd-submit{ width:100%; } }
.qd .wy-v2 .qd-legal{ line-height:1.55; }
/* Polityka Prywatności раскрывается внутри панели: текст тянем с главной, там он на тёмном фоне */
.qd .wy-v2 .qd-policy{ text-align:left; }
.qd .wy-v2 .qd-policy > div{ max-width:none !important; }
.qd .wy-v2 .qd-policy p{ font-size:14px !important; line-height:1.55 !important; color:rgba(31,33,32,.7) !important; margin:0 0 .7rem; }
.qd .wy-v2 .qd-policy p:last-child{ margin-bottom:0; }
.qd .wy-v2 .qd-policy strong{ color:var(--c-ink) !important; font-weight:600; }
.qd .wy-v2 .qd-policy a{ color:inherit; text-decoration:underline; text-decoration-thickness:1px; text-underline-offset:3px; }

.qd .wy-v2 .qd-legal a:hover{ color:var(--c-ink); }
.qd .wy-v2 #consent, .qd .wy-v2 #consent-qd{ width:22px; height:22px; accent-color:var(--c-terra); }
.qd .wy-v2 .qd-status{ font-size:16px; color:var(--c-ink); font-weight:600; }
.qd .wy-v2 .btn{ font-size:17px; padding:1rem 2rem; border-radius:8px; }
.qd .wy-v2 .btn--pop{ flex:1 1 auto; }

/* Кнопка-стрелка над плашкой, у правого края – без кружка, белая */
.qd-close{ margin:0 8px 10px 0; width:56px; height:56px; display:grid; place-items:center;
 border:0; background:none; color:var(--c-paper); cursor:pointer; }
@media (min-width:640px){ .qd-close{ margin-right:20px; } }
.qd-close:hover .qd-ic, .qd-close:focus-visible .qd-ic{ animation:none; }
.qd-ic{ grid-area:1/1; width:26px; height:26px; transition:opacity .25s ease, transform .25s ease; }
.qd-ic--chev{ transform:rotate(90deg); animation:qd-pulse 1.8s ease-in-out infinite; }  /* стандартная стрелка сайта, вниз */
.qd-ic--x{ opacity:0; transform:scale(.8); }
.qd-close:hover .qd-ic--chev, .qd-close:focus-visible .qd-ic--chev{ opacity:0; transform:rotate(90deg) scale(.8); }
.qd-close:hover .qd-ic--x, .qd-close:focus-visible .qd-ic--x{ opacity:1; transform:none; }
/* курсор ушёл с панели на затемнение – клик там закрывает панель, и кнопка честно показывает это:
   стрелка меняется на крестик так же, как при наведении на саму кнопку. Панель-обёртка .qd-wrap
   клики пропускает, поэтому всё вокруг плашки – это .qd-backdrop. Только для мыши (21.09.2026) */
@media (hover:hover) and (pointer:fine){
 .qd-backdrop:hover ~ .qd-wrap .qd-ic{ animation:none; }
 .qd-backdrop:hover ~ .qd-wrap .qd-ic--chev{ opacity:0; transform:rotate(90deg) scale(.8); }
 .qd-backdrop:hover ~ .qd-wrap .qd-ic--x{ opacity:1; transform:none; }
}
/* пульсирует только стрелка внутри кружка, сам кружок стоит на месте */
@keyframes qd-pulse{
  0%, 100%{ transform:rotate(90deg) translateX(0); }
  50%     { transform:rotate(90deg) translateX(5px); }
}

@media (prefers-reduced-motion:reduce){
  .qd-wrap, .qd-backdrop, .qd-ic{ transition:none; }
  .qd-ic--chev{ animation:none; }
}

/* ===== Подвал-«шторка»: закреплён внизу, контент проезжает над ним =====
   Подвал стоит на месте под страницей, а main с непрозрачным фоном едет поверх него;
   высоту-запас под main задаёт app.js, чтобы подвал открывался ровно на свою высоту. */
#stopka{ position:fixed; left:0; right:0; bottom:0; z-index:0; }
body > header, body > main{ position:relative; z-index:1; }
body > main{ background:var(--c-page); }
/* в потоке подвал relative, а не static: уже 1280px декоративный логотип привязан к его низу */
@media (prefers-reduced-motion:reduce){ #stopka{ position:relative; } body > main{ margin-bottom:0 !important; } }
/* подвал выше окна (телефон в горизонтали, низкое окно): закреплённый, он не показал бы свой верх –
   класс ставит app.js, запас под main при этом снимается */
#stopka.is-flow{ position:relative; }
/* Низ страницы над подвалом (Грег, 03.10.2026): нижние углы main скруглены, как у плашек (26px). За вырезами углов
   лежит фон body (цвет страницы) – в самом низу прокрутки углы пропали бы, поэтому графит подвала продлён вверх на
   радиус его же тенью без размытия (overflow:hidden подвала её не режет). От 640px: уже подвал в потоке, телефон
   не трогаем. */
@media (min-width:640px){
  body > main{ border-radius:0 0 26px 26px; }
  /* последняя секция со своим фоном закрыла бы углы прямыми – скругляем и её */
  body > main > section:last-child{ border-radius:0 0 26px 26px; }
  #stopka{ box-shadow:0 -26px 0 var(--c-graphite); }
}

/* ===== Футер уже 1280px: нижняя строка в потоке, без наложений (21.09.2026) =====
   Раньше место нижней строки задавал декоративный логотип: он стоял в потоке распоркой
   (margin-top −197px + своя высота ≈ 25vw), а колонки съезжали вниз через translateY(%).
   На широком экране логотип высокий, и зазор есть; уже 1280px логотип сжимается вместе с окном,
   а колонки – нет, и строка с «Polityka Prywatności» и копирайтом наезжала на навигацию
   (на телефоне – на «Gdzie działamy»). Здесь логотип вынут из потока и прижат к низу подвала,
   колонки стоят без сдвига, нижняя строка идёт за ними с настоящим отступом: высота подвала
   складывается из содержимого и от ширины окна не зависит. От 1280px раскладка прежняя. */
@media (max-width:1279px){
  /* 1rem подвала + 3.25rem = те же ~67px до заголовков колонок, что давал translateY(21%) */
  .footer-tone .fl-cols{ transform:none; padding-top:3.25rem; }
  .footer-mark{ position:absolute; left:0; right:0; top:auto; margin-top:0;
    /* низ слова уходит за край подвала на 0.22em – то же, что --fm-drop из скрипта */
    bottom:calc(var(--fm-size, 24.6vw) * -.22); }
  .footer-mark .logo{ vertical-align:bottom; }
  .footer-bar{ margin-top:3rem; }
}
/* От 1280px (Грег, 10.10.2026; PL и языковые главные): то же устройство, что уже 1280px. Раньше слово стояло распоркой,
   и зазор между колонками и нижней строкой рос вместе с окном (76px на 1280 → 235px на 1920), а с ним и высота подвала –
   страница уезжала над ним выше. Теперь слово прижато к низу подвала и на его высоту не влияет, зазор один – 71px от «Kontakt» до «Polityka Prywatności». */
@media (min-width:1280px){
  :is(html[lang="pl"], html.pl-zone) .footer-tone .fl-cols{ transform:none; padding-top:3.55rem; }
  :is(html[lang="pl"], html.pl-zone) .footer-mark{ position:absolute; left:0; right:0; top:auto; margin-top:0;
    bottom:calc(var(--fm-size, 24.6vw) * -.22); }
  :is(html[lang="pl"], html.pl-zone) .footer-mark .logo{ vertical-align:bottom; }
  :is(html[lang="pl"], html.pl-zone) .footer-bar{ margin-top:2.5rem; }
}
/* 880–1023px: три равные колонки, нижняя строка по той же сетке –
   юридические ссылки под «Nawigacja», копирайт от левого края «Kontakt» */
@media (min-width:640px) and (max-width:1023px){
  .footer-tone .fl-cols{ grid-template-columns:repeat(3, minmax(0,1fr)); }
  /* первая дорожка не уже самой длинной ссылки: в ru она шире трети на узком окне */
  .footer-bar-inner > .flex{ display:grid; align-items:start; gap:2rem;
    grid-template-columns:minmax(max-content,1fr) repeat(2, minmax(0,1fr)); }
  .footer-bar-inner > .flex > :last-child{ grid-column:2 / -1; }
  .footer-bar [style*="translateX(-20%)"]{ transform:none !important; }
}
/* 640–879px: три колонки по 212px не помещаются (на 640–767px третья уезжала за край окна) –
   слева навигация, справа «Kontakt» и под ним «Gdzie działamy» */
@media (min-width:640px) and (max-width:879px){
  .footer-tone .fl-cols{ grid-template-columns:repeat(2, minmax(0,1fr)); grid-template-rows:auto 1fr;
    gap:1.75rem 2rem; }
  .footer-tone .fl-cols > :first-child{ grid-row:1 / span 2; }
  .footer-bar-inner > .flex{ grid-template-columns:minmax(max-content,1fr) minmax(0,1fr); }
}

/* ===== Футер на телефоне =====
   Колонки идут одна под другой, поэтому подвал вырастал до 86% экрана: как «шторка» он
   на телефоне не работает – возвращаем его в поток и поджимаем внутренние отступы. */
@media (max-width:639px){
  #stopka{ position:relative; }
  body > main{ margin-bottom:0 !important; }
  .footer-tone .fl-cols{ padding-top:2.5rem; gap:1.75rem 1.25rem; padding-left:1.25rem; }
  /* Декоративный логотип на телефоне – вертикальный (Грег, 21.09.2026: «становится в вертикальную версию, снизу начало,
     и опирается так же, как по низу, – по правой стороне; только когда всё в один столбец»). Колонки здесь идут одна под
     другой, правая половина подвала пустая – слово встаёт вдоль правого края и читается снизу вверх. Геометрия та же,
     что у горизонтального: базовая линия стоит на кромке, низ строки уходит за неё на 0.22em (обрезает сам подвал),
     от начала слова до нижнего края 12px. Блок слова вынесен за правый край и повёрнут на −90° вокруг своего левого
     нижнего угла – после поворота он идёт вверх от правого нижнего угла подвала. Кегль считает app.js (fit):
     слово на всю высоту подвала, но не крупнее 0.8 ширины окна. */
  .footer-mark{ left:0; right:0; top:0; bottom:0; padding:0; }
  .footer-mark .logo{ position:absolute; left:100%; bottom:0; font-size:var(--fm-size, 78vw);
    transform-origin:0 100%;
    transform:translate(calc(var(--fm-size, 78vw) * .22), -12px) rotate(-90deg); }
  /* пальцевые цели: ссылки колонок не ниже 36px, между ними зазор убран */
  .footer-tone .fl-link{ min-height:36px; }
  .footer-tone .fl-list{ gap:0; }
  /* строки колонок плотнее: шрифт крупный, поэтому режем только межстрочные зазоры */
  .footer-tone .fl-h{ padding-bottom:.4rem; margin-bottom:.6rem; }
  .footer-tone .fl-note{ margin-top:1.1rem; }
  /* нижняя строка: от последней колонки дальше, чем колонки друг от друга (1.75rem) */
  .footer-bar{ margin-top:2.5rem; padding-bottom:14px; }
  /* левый край – в одной оси с колонками (было на 8px правее) */
  .footer-bar-inner{ padding-left:calc(1.25rem + 1.25rem); }
  .footer-bar-inner > .flex{ gap:1.5rem; }
  /* юридические ссылки – тем же шагом, что списки колонок */
  .footer-bar-inner > .flex > p{ gap:0; }
  /* правый блок с копирайтом на телефоне не сдвигаем влево */
  .footer-bar [style*="translateX(-20%)"]{ transform:none !important; }
}

/* ---- Formularz wyceny: pliki, kompresja, status (12.09.2026) ---- */
/* На телефоне форма идёт первой, текст – под ней */
@media (max-width:1023px){ .qd .wy-v2 .grid > .bg-paper{ order:-1; } }

/* Сообщения: цвет классами. В панели фон белый, во встроенных формах ua/ru/en – тёмный */
/* #quote-form-qd – id панели на страницах, где такая же форма уже стоит в потоке (uniq() в app.js) */
.wy-v2 #quote-form p[role="status"].is-ok,  .wy-v2 #quote-form-qd p[role="status"].is-ok,  .quote-form [role="status"].is-ok { color:var(--c-ink); }
.wy-v2 #quote-form p[role="status"].is-err, .wy-v2 #quote-form-qd p[role="status"].is-err, .quote-form [role="status"].is-err{ color:#C8102E; }
.bg-bluedp .quote-form [role="status"].is-ok { color:var(--c-terra); }
.bg-bluedp .quote-form [role="status"].is-err{ color:#FFD7D7; }

/* Зона загрузки: состояния */
.qd .wy-v2 .qd-drop.is-over{ border-color:var(--c-ink); background:rgba(31,33,32,.08); }
.qd .wy-v2 .qd-drop.is-busy{ opacity:.6; pointer-events:none; }

/* Выбранные файлы – миниатюры в пропорции A4 (72×102), крестик как на сайте, по центру (17.09.2026) */
.qd-files{ list-style:none; margin:.6rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.5rem; justify-content:center; }
.qd-files:empty{ display:none; }
.qd-files li{ position:relative; width:72px; height:102px; border-radius:10px; overflow:hidden;
 border:1px solid rgba(31,33,32,.15); background:var(--c-sand); }
.qd-files img{ width:100%; height:100%; object-fit:cover; display:block; }
.qd-files li.is-doc::before{ content:attr(data-kind); position:absolute; inset:auto 0 10px; display:grid; place-items:center;
 font-size:12px; font-weight:700; letter-spacing:.06em; color:var(--c-ink); }
.qd-files .qd-file-x{ position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:34px; height:34px; border:0; border-radius:50%;
 display:grid; place-items:center; background:rgba(31,33,32,.75); color:#fff; cursor:pointer; padding:0; }
.qd-files .qd-file-x:hover{ background:var(--c-ink); }
.qd-files-cap{ font-size:13px; color:rgba(31,33,32,.55); text-align:center; margin:.4rem 0 0; }
.qd-files-cap:empty{ display:none; }

/* После отправки: поля прячем, благодарность показываем */
.quote-form.is-sent > :not(.qd-done){ display:none; }
.quote-form.is-sent .qd-done{ display:block; }

/* ---- Panel: minimum pól na start{ display:inline-flex; align-items:center; gap:.5rem; font-size:16px; font-weight:700; color:var(--c-ink); cursor:pointer; }
/* druga ścieżka – WhatsApp – widoczna, nie szara */
.qd .wy-v2 .btn:not(.btn--pop){ border-color:var(--c-terra); }

/* ===== Панель wyceny: типографика правой колонки – 4 роли (14.09.2026) =====
   Стоит в конце файла намеренно: перекрывает разрозненные правила выше при той же специфичности.
   Роль 1 · Заголовок   30px 800 + 300 italic, ink
   Роль 2 · Вопрос/шаг  16px 600, ink .7 – «Podaj numer do kontaktu», «Dodaj zdjęcia lub skan»
   Роль 3 · Ввод        17px 400, ink (кнопка 17px 700)
   Роль 4 · Подсказка   14px 400, ink .55 – подписи, ссылки-раскрывашки, согласие
   Чипы                 12px 600 Condensed CAPS, ink .85 – единственный капс в форме */
.qd .wy-v2 .qd-formhead--light{ margin-bottom:1.75rem; }
.qd .wy-v2 .field::placeholder{ color:rgba(31,33,32,.4); }
.qd .wy-v2 .qd-linkbtn{ font-weight:400; color:rgba(31,33,32,.55); }
.qd .wy-v2 .qd-linkbtn:hover, .qd .wy-v2 .qd-linkbtn:focus-visible{ color:var(--c-ink); }
.qd .wy-v2 .qd-legal a, .qd .wy-v2 .qd-legal .qd-linkbtn{ color:rgba(31,33,32,.55); font-weight:400; }

/* Порядок (14.09.2026): заголовок над формой → телефон → дропзона (.qd-photo) → чипы → кнопка */
.qd .wy-v2 .quote-form > .qd-photo{ margin-top:2rem; }

/* Сообщение формы над кнопкой (14.09.2026): ошибка – тёмная плашка по центру, служебные – тихий текст */
.qd .wy-v2 .qd-status:not(.hidden){ display:block; text-align:center; font-size:14px; font-weight:400;
 color:rgba(31,33,32,.55) !important; margin:0 auto 1rem; }
.qd .wy-v2 .qd-status.is-err:not(.hidden){ display:table;
 background:var(--c-ink); color:var(--c-paper) !important; font-weight:500; }

/* Раскрывашки «Podaj adres e-mail» и «Kilka słów o sprawie» – роль «вопрос», как «Podaj numer do kontaktu»:
   16px 600 ink .7, без подчёркивания{ margin-top:1.25rem; text-align:center; }
.qd .wy-v2 .qd-email{ margin-top:.5rem; }
.qd .wy-v2 .qd-msg{ margin-top:.5rem; }

/* Рамка дропзоны той же толщины и тона, что у полей телефона и e-mail (1px, ink .3), только пунктиром (14.09.2026).
   Наведение, перетаскивание и «файл выбран» перекрашивают её правилами выше – у них специфичность больше. */
.qd .wy-v2 .qd-drop{ border-width:1px; }

/* Номер оператора в левой колонке (14.09.2026): можно позвонить и спросить до отправки фото.
   Крупно, как второй главный текст колонки после обещания; ссылка tel: – на телефоне звонок в одно касание */
.qd .wy-v2 .qd-call { line-height:1.1; color:var(--c-ink); text-decoration:none; white-space:nowrap; }
.qd .wy-v2 .qd-call:hover, .qd .wy-v2 .qd-call:focus-visible { text-decoration-thickness:2px; text-underline-offset:5px; }

/* Чипы формы – только размер как у плашек прайса .cn-pill («1–3 dni robocze») (14.09.2026).
   Цвет, толщина, рамка{ font-size:12.5px; letter-spacing:.1em; line-height:1.2; border-radius:6px;
 padding:calc(.45em - 1px) calc(.75em - 1px) calc(.5em - 1px); }

/* «Podaj numer do kontaktu» со стрелкой вниз – только для симметрии с раскрывашками{ display:flex; align-items:center; justify-content:center; gap:7px; }

/* ===== Проба 14.09.2026: вопросы формы – аккордеон как FAQ, поля – тонкая линия вместо рамки =====
   Ряд: вопрос слева (роль 2), «+» справа, линия снизу; открытый «+» поворачивается в «×» как в FAQ.
   «Podaj numer do kontaktu» открыт всегда (--static). Откат – git revert этого коммита. */
.qd .wy-v2 .qd-acc-head{ align-items:center; margin:0; background:none; border:0; cursor:pointer; text-align:left;
 font-family:'Fira Sans',sans-serif; font-size:16px; font-weight:600; line-height:1.2; color:rgba(31,33,32,.7) !important; }
.qd .wy-v2 button.qd-acc-head:hover, .qd .wy-v2 button.qd-acc-head:focus-visible{ color:var(--c-ink) !important; }
.qd .wy-v2 .qd-email, .qd .wy-v2 .qd-msg{ margin-top:0; }
/* поле-линия */
.qd .wy-v2 .quote-form .field.qd-line{ width:100%; max-width:none; margin:0; border:0; border-bottom:1px solid rgba(31,33,32,.3);
 border-radius:0; padding:.35rem 0 .55rem; background:transparent; text-align:left; box-shadow:none; }
.qd .wy-v2 .quote-form .field.qd-line:focus{ border:0; border-bottom:1px solid var(--c-ink); padding:.35rem 0 .55rem; outline:none; box-shadow:none; }
/* ограничения ширины tel/email (15/20rem) выше по файлу сильнее – для полей-линий снимаем явно */
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line, .qd .wy-v2 .quote-form input[type="email"].field.qd-line{ max-width:none; }

/* Проба, шаг 2 (14.09.2026): раскладка по центру как была, вместо «+» справа – стрелка рядом с текстом.
   Линий между рядами нет; от пробы остаются поля-линии и раскрытие по клику. */
.qd .wy-v2 .qd-acc{ border-bottom:0; text-align:center; }
.qd .wy-v2 .qd-acc-head{ display:inline-flex; width:auto; justify-content:center; gap:7px; padding:0; }
.qd .wy-v2 .qd-acc-head .qd-chev{ flex:none; transition:transform .18s ease; }
.qd .wy-v2 .qd-acc-head[aria-expanded="true"] .qd-chev{ transform:rotate(180deg); }
.qd .wy-v2 .qd-acc-body{ padding:0; }
/* поля-линии по центру прежней ширины: телефон 15rem, e-mail 20rem, сообщение во всю ширину */
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line{ margin:0 auto; }
.qd .wy-v2 .quote-form input[type="email"].field.qd-line{ margin:0 auto; }
.qd .wy-v2 .quote-form #phone.qd-line, .qd .wy-v2 .quote-form [id^="phone"].qd-line, .qd .wy-v2 .quote-form [id^="email"].qd-line{ text-align:center; }
.qd .wy-v2 .quote-form textarea.field.qd-line{ text-align:left; }
/* «Podaj numer do kontaktu» – те же свойства, что у раскрывашек, но всегда открыт и не сворачивается:
   стрелка в открытом положении, наведение как у остальных, клик ставит курсор в поле (label for=phone) */
.qd .wy-v2 .qd-acc--static .qd-acc-head .qd-chev{ transform:rotate(180deg); }
.qd .wy-v2 .qd-acc--static .qd-acc-head{ cursor:pointer; }
.qd .wy-v2 .qd-acc--static .qd-acc-head:hover{ color:var(--c-ink) !important; }

/* Три поля-линии одной ширины и по центру: телефон, e-mail и сообщение – 20rem, текст по центру (14.09.2026) */
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line,
.qd .wy-v2 .quote-form input[type="email"].field.qd-line,
.qd .wy-v2 .quote-form textarea.field.qd-line{ width:100%; max-width:20rem; margin:0 auto; display:block; text-align:center; }
.qd .wy-v2 .quote-form textarea.field.qd-line{ min-height:0; resize:none; }
/* Линия поля одна во всех состояниях – фокус не перекрашивает её (активное поле видно по курсору) (14.09.2026) */
.qd .wy-v2 .quote-form .field.qd-line:focus{ border-bottom-color:rgba(31,33,32,.3); }

/* Дропзона при наведении: надпись без подчёркивания, «+» поворачивается (14.09.2026) */
.qd .wy-v2 .qd-plus{ transition:transform .3s ease, background-color .18s ease; }
/* Линия телефона по длине номера с кодом «+48 600 000 000» (~7.4em) + немного воздуха (14.09.2026) */
/* «+» в дропзоне при наведении превращается в стрелку вниз (14.09.2026).
   Стойка остаётся; половины перекладины опускаются к низу стойки (12,19) и расходятся под 45° – наконечник.
   Поворот всего кружка на 90° отменён. */
.qd .wy-v2 .qd-drop:hover .qd-plus, .qd .wy-v2 .qd-drop.is-over .qd-plus{ transform:none; }
.qd .wy-v2 .qd-plus svg path{ transform-box:view-box; transform-origin:12px 12px; transition:transform .3s ease; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-plus svg path{ transition:none; } }

/* Выбранный чип – терракота (17.09.2026{ background:var(--c-terra); border-color:var(--c-terra); color:var(--c-ink); }
/* Отступы (14.09.2026): чипы ближе к дропзоне{ margin-top:1rem; }
/* Номер оператора в левой колонке – по правому краю колонки (14.09.2026) */
.qd .wy-v2 .qd-call{ display:block; width:fit-content; margin-left:auto; }
/* строка про оператора с ручными переносами – без ограничения ширины, чтобы строки не ломались сами (14.09.2026) */
.qd .wy-v2 .qd-human{ max-width:none; }
/* Плашка ошибки: переносы из текста (&#10; в data-msg-required), без ограничения ширины (13.09.2026) */
.qd .wy-v2 .qd-status.is-err:not(.hidden){ white-space:pre-line; max-width:none; }

/* Плашка ошибки крупнее и с белым крестиком справа сверху (13.09.2026).
   Крестик – соседняя кнопка в обёртке: текст плашки пишется через textContent и затёр бы вложенные элементы */
.qd .wy-v2 .qd-status-wrap{ position:relative; display:table; margin:0 auto; }
.qd .wy-v2 .qd-status-wrap:has(.qd-status:not(.hidden)){ margin-bottom:1rem; }
.qd .wy-v2 .qd-status-wrap .qd-status:not(.hidden){ margin:0; }
.qd .wy-v2 .qd-status.is-err:not(.hidden){ padding:1.25rem 2.75rem; border-radius:10px; font-size:15px; line-height:1.5; }
.qd .wy-v2 .qd-status-close{ display:none; position:absolute; top:8px; right:8px; width:28px; height:28px; place-items:center;
 border:0; border-radius:50%; background:none; color:var(--c-paper); opacity:.75; cursor:pointer; padding:0; }
.qd .wy-v2 .qd-status-close:hover, .qd .wy-v2 .qd-status-close:focus-visible{ opacity:1; }
.qd .wy-v2 .qd-status-wrap:has(.qd-status.is-err:not(.hidden)) .qd-status-close{ display:grid; }
/* На узком экране самая длинная строка («Dodaj zdjęcie lub skan dokumentu») не влезала с отступами 44px
   и ломалась на две – поджимаем отступы и кегль, чтобы остались три строки как заданы (13.09.2026) */
@media (max-width:479px){
  .qd .wy-v2 .qd-status.is-err:not(.hidden){ padding:1.1rem 2.25rem; font-size:14px; }
}
/* Самые узкие экраны (≤359px): текст плашки уходит под крестик сверху, боковые отступы меньше –
   иначе «Dodaj zdjęcie lub skan dokumentu» ломается на две строки (13.09.2026) */
@media (max-width:359px){
  .qd .wy-v2 .qd-status.is-err:not(.hidden){ padding:2rem 1.25rem 1.1rem; font-size:13px; }
  .qd .wy-v2 .qd-status-close{ top:4px; right:4px; }
}
/* Крестик плашки всегда чисто белый, без приглушения (13.09.2026) */
.qd .wy-v2 .qd-status-close, .qd .wy-v2 .qd-status-close:hover, .qd .wy-v2 .qd-status-close:focus-visible{ opacity:1; }

/* Мобильная версия: левая колонка панели заявки («Ekspresowa wycena dokumentu», плашка 15 min, текст, телефон) – по центру (17.09.2026) */
@media (max-width:639px){
  .qd .wy-v2 .qd-call{ margin-left:auto; margin-right:auto; }
}

/* ===== Панель wyceny: фото первым, телефон вторым, опции тише (17.09.2026, docs/promt-form-visual.md) ===== */
.qd .wy-v2 .quote-form{ display:flex; flex-direction:column; }
.qd .wy-v2 .quote-form > .qd-photo{ order:-2; }
.qd .wy-v2 .qd-acc--static{ order:-1; }
/* зона фото – главный элемент экрана */
.qd .wy-v2 .qd-drop{ border-color:rgba(31,33,32,.55); background:rgba(239,176,31,.07); }
.qd .wy-v2 .qd-plus{ background:var(--c-terra); color:var(--c-ink); }
.qd .wy-v2 .qd-drop-touch{ display:none; }
@media (hover:none){ .qd .wy-v2 .qd-drop-drag{ display:none; }
.qd .wy-v2 .qd-drop-touch{ display:block; } }
/* телефон: полный контраст, без стрелки (строка не сворачивается); необязательные строки тише */
.qd .wy-v2 .qd-acc--static .qd-acc-head span{ color:var(--c-ink); }
.qd .wy-v2 .qd-acc--static .qd-chev{ display:none; }
.qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-acc-head, .qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-chev{ color:var(--c-ink); }
.qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-acc-head span{ color:var(--c-ink); font-size:15px; }
/* ошибка поля */
/* экран «Dziękujemy»: полный контраст (правило `.wy-v2 #quote-form p` с id иначе сильнее), галочка */
.wy-v2 #quote-form .qd-done .qd-formhead, .wy-v2 #quote-form-qd .qd-done .qd-formhead{ color:var(--c-ink); font-weight:800; }
.wy-v2 #quote-form .qd-done .qd-formsub, .wy-v2 #quote-form-qd .qd-done .qd-formsub{ color:rgba(31,33,32,.75); }
.qd .wy-v2 .qd-done .qd-formhead::before{ content:'✓'; display:inline-grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--c-terra); margin-right:.5rem; font-size:20px; vertical-align:-4px; }
.qd .wy-v2 .quote-form.is-sent{ min-height:320px; justify-content:center; }
/* ≤1023px: под формой в левой колонке только бейдж, строка про оператора и телефон */
@media (max-width:1023px){
  .qd .wy-v2 .qd-left .kicker, .qd .wy-v2 .qd-left h2{ display:none; }
  .qd .wy-v2 .qd-left .qd-eta{ margin-top:0; }
}
/* Шапка панели на телефоне и планшете (.qd-mhead, 21.09.2026) – по идее Грега: «в мобильной версии нет этого
   заголовка, а он органично смотрится, если сверху начать с него и стеклянной части как заголовок», затем:
   «верхнюю шапку закрепил бы при скролле, а блюр вообще бы убрал», затем по снимку с iPhone: «давай сразу в телефонах
   такая плашка будет, а 15 min – wycena это вниз отправить».
   Сверху панели – то же тёмное стекло, что у левой колонки (--hdr-bg-dark поверх размытия .qd-shell).
   • Телефон (уже 640px или окно ниже 800px): сразу одна строка «Ekspresowa wycena Dokumentu» ~52px; плашки
     «15 min | Wyślij zdjęcia – poznasz cenę» стоят, как и раньше, в начале нижнего тёмного блока под формой.
   • Планшет и высокое узкое окно (от 640px шириной и от 800px высотой): шапка полная – кикер, заголовок в две строки
     и плашки «15 min»; в нижнем блоке они тогда скрыты, чтобы не повторяться.
   Закреплена шапка не через sticky: блок стоит ВНЕ области прокрутки (.qd-shell – колонка: шапка + .qd-scroll),
   форма уходит под его нижний край. Под липкой полупрозрачной шапкой просвечивал бы текст формы, а своё размытие
   на липком элементе внутри прокрутки дёргается в Safari – здесь стекло остаётся стеклом без второго размытия.
   Размытие у верхней кромки уже 1024px снято (правило в конце файла). От 1024px всё по-прежнему. */
.qd .wy-v2 .qd-mhead{ display:none; }
@media (max-width:1023px){
  .qd .qd-shell{ display:flex; flex-direction:column; }
  .qd .qd-shell > .qd-scroll{ flex:1 1 auto; min-height:0; max-height:none; }
  .qd .wy-v2 > .qd-mhead{ display:block; flex:0 0 auto; position:relative; z-index:2; overflow:hidden; text-align:center;
    background:var(--hdr-bg-dark); color:var(--c-paper); padding:2.5rem 3rem 2.25rem; }
  .qd .wy-v2 .qd-mhead .kicker{ color:var(--c-paper); margin-bottom:.7rem; }
  .qd .wy-v2 .qd-mhead-title{ margin:0; font-size:46px; line-height:.94; color:var(--c-paper); }
  .qd .wy-v2 .qd-mhead-title span{ color:inherit; }
  .qd .wy-v2 .qd-mhead .qd-eta{ margin-top:1.15rem; justify-content:center; }
  /* липкая шапка нижнего блока не нужна: над областью прокрутки уже стоит закреплённая шапка панели */
  .qd .qd-scroll .qd-left .qd-head{ position:static; }
}
/* планшет и высокое окно: плашки «15 min» стоят в шапке – в нижнем блоке их шапку скрываем */
@media (min-width:640px) and (max-width:1023px) and (min-height:800px){
  .qd .wy-v2 .qd-left .qd-head{ display:none; }
  .qd .wy-v2 .qd-left .qd-lead{ margin-top:0; }
}
/* телефон: компактная шапка сразу, без кикера и плашек */
@media (max-width:639px), (max-width:1023px) and (max-height:799px){
  .qd .wy-v2 > .qd-mhead{ padding:1rem 1.25rem; }
  .qd .wy-v2 .qd-mhead .kicker, .qd .wy-v2 .qd-mhead .qd-eta{ display:none; }
  .qd .wy-v2 .qd-mhead-title{ font-size:clamp(18px, 5.6vw, 22px); line-height:1.05; white-space:nowrap; }
  .qd .wy-v2 .qd-mhead-title br{ display:none; }
  .qd .wy-v2 .qd-mhead-title span{ margin-left:.24em; }
}
/* Жёлтые часы у плашки «15 min» (Грег, 21.09.2026: «svg иконку жёлтых часов, которые набирают 15 мин, четвертинку»).
   Кольцо и сектор-четверть от 12 до 3 часов. Сектор – окружность r=4 с обводкой 8px (обводка закрашивает круг r=8),
   длину дуги задаёт stroke-dasharray: четверть = 6.283 из 25.133. Раз в 5.2 с сектор «набирается» от нуля,
   стоит и гаснет – в духе пульсирующих стрелок сайта; при prefers-reduced-motion – просто четверть.
   На телефоне и планшете иконка стоит в строке перед плашками. От 1024px – вынесена в левое поле колонки:
   ширина строки плашек там равна ряду кнопок WhatsApp / Telegram (324px), и раздвигать её нельзя. */
.qd-clock{ flex:0 0 auto; width:37px; height:37px; margin-right:6px; overflow:visible; }
/* цвет – свойством stroke, а не через currentColor: в тёмной колонке правило `.qd-left *{color:paper}` красит
   и сами окружности, currentColor выходил белым */
.qd-clock circle{ stroke:var(--c-terra); }
.qd-clock-pie{ animation:qdClockFill 5.2s cubic-bezier(.3,.7,.2,1) infinite; }
@keyframes qdClockFill{
  0%   { stroke-dasharray:0 25.133; opacity:1; }
  30%  { stroke-dasharray:6.283 25.133; opacity:1; }
  88%  { stroke-dasharray:6.283 25.133; opacity:1; }
  100% { stroke-dasharray:6.283 25.133; opacity:0; }
}
@media (prefers-reduced-motion:reduce){ .qd-clock-pie{ animation:none; } }
@media (max-width:385px){ .qd .wy-v2 .qd-mhead .qd-clock{ width:34px; height:34px; } }
@media (min-width:1024px){
  .qd .wy-v2 .qd-left .qd-eta{ position:relative; }
  .qd .wy-v2 .qd-left .qd-clock{ position:absolute; right:100%; top:50%; margin:-17px 8px 0 0; width:34px; height:34px; }
}

/* за шапку панель стягивают пальцем вниз (жест – в app.js, bind() панели): браузер не должен перехватывать это
   касание под прокрутку или выделение текста */
.qd .wy-v2 > .qd-mhead{ touch-action:none; -webkit-user-select:none; user-select:none; }
/* подпись к телефону «na niego odpiszemy» – мельче и серым (17.09.2026) */
.qd .wy-v2 .qd-acc--static .qd-acc-head > span{ text-align:center; }
.qd .wy-v2 .qd-acc--static .qd-acc-note{ display:block; font-size:14px; font-weight:400; color:rgba(31,33,32,.55); }
/* подпись «dokąd i na kiedy» у раскрывашки – как у E-mail и Telefon: блоком под заголовком, серым, по центру (27.09.2026) */
.qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-acc-head > span{ text-align:center; }
.qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-acc-note{ display:block; font-size:14px; font-weight:400; color:rgba(31,33,32,.55); }

/* ===== Панель wyceny, этап 2 (17.09.2026, docs/promt-form-ideas.md) ===== */
/* зона фото после добавления файлов выглядит так же, как пустая (17.09.2026) */
/* сохранность документов */
.qd .wy-v2 .qd-safe{ margin:.5rem 0 0; text-align:center; font-size:13px; color:rgba(31,33,32,.55); }
/* прогресс отправки внутри кнопки */
/* ::before у .btn--pop – жёлтая заливка, поэтому прогресс в ::after: z-index -1 ставит его над заливкой, но под текстом */
.qd .wy-v2 .qd-submit::after{ content:''; position:absolute; top:0; bottom:0; left:0; z-index:-1; width:var(--p,0%);
 background:rgba(31,33,32,.14); transition:width .2s linear; pointer-events:none; }
/* шаги «что дальше» – 5 колонок: кружок с номером, тонкая линия между ними{ list-style:none; margin:1.1rem auto 0; padding:0; max-width:28rem; display:grid; grid-template-columns:repeat(5,1fr); gap:0 .25rem; }
/* строка мессенджеров – в левой колонке под номером, по правому краю как номер; ≤639px по центру */
.qd .wy-v2 .qd-alt a{ color:var(--c-ink); text-decoration:underline; text-underline-offset:3px; }

/* ===== Кнопка «Wyślij do wyceny»: поведение (17.09.2026) ===== */
.qd .wy-v2 .qd-field-err{ margin:.45rem 0 0; text-align:center; font-size:14px; font-weight:500; color:#C8102E; }
.qd .wy-v2 .qd-need, .qd .wy-v2 .qd-slow{ margin:.6rem 0 0; text-align:center; font-size:14px; color:rgba(31,33,32,.6); }
.qd .wy-v2 .qd-fail{ margin:.8rem 0 0; text-align:center; }
.qd .wy-v2 .qd-fail-msg{ margin:0; font-size:15px; font-weight:600; color:#C8102E; }
.qd .wy-v2 .qd-fail-acts{ margin:.35rem 0 0; display:flex; justify-content:center; flex-wrap:wrap; gap:.4rem 1.2rem; font-size:14px; }
.qd .wy-v2 .qd-fail-acts .qd-linkbtn{ color:var(--c-ink); text-decoration:underline; text-underline-offset:3px; }
.qd .wy-v2 .qd-submit:disabled{ cursor:progress; }
@keyframes qd-shake{ 0%,100%{ transform:translateX(0) } 20%,60%{ transform:translateX(-6px) } 40%,80%{ transform:translateX(6px) } }
.qd .wy-v2 .qd-submit.is-shake{ animation:qd-shake .3s ease; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-submit.is-shake{ animation:none; } }
/* правило `.wy-v2 #quote-form p` (с id) сильнее классов – цвета подсказок кнопки задаём с id */
.wy-v2 #quote-form .qd-field-err, .wy-v2 #quote-form .qd-fail-msg{ color:#C8102E; }
.wy-v2 #quote-form .qd-need, .wy-v2 #quote-form .qd-slow{ color:rgba(31,33,32,.6); }
/* кнопка отправки в панели: заливка при наведении не уходит вниз (17.09.2026) */
.qd .wy-v2 .qd-submit:hover::before, .qd .wy-v2 .qd-submit:focus-visible::before{ transform:none; opacity:1; }
/* «Polityka Prywatności»: стрелка вниз, жирнее и темнее (17.09.2026) */
.qd .wy-v2 .qd-legal .qd-policy-btn{ align-items:center; gap:6px; }
/* «Zdjęcia usuwamy…» – теперь на экране «Dziękujemy», под текстом */
.wy-v2 #quote-form .qd-done .qd-safe{ margin:.75rem 0 1rem; color:rgba(31,33,32,.55); }
/* ===== Панель: единая шкала вертикальных отступов правой колонки (17.09.2026) =====
   28px – между группами (заголовок / фото / телефон / опции / чипы / кнопка),
   16px – между соседними строками одной группы, 8px – подпись и её поле / текст и ссылка */
.qd .wy-v2 .quote-form > .qd-photo{ margin:0 0 26px; }
.qd .wy-v2 .qd-acc-body{ margin-top:8px; }
.qd .wy-v2 .qd-need, .qd .wy-v2 .qd-slow{ margin-top:8px; }
.qd .wy-v2 .qd-fail{ margin-top:14px; }
.qd .wy-v2 .qd-legal .qd-policy-btn{ display:flex; width:fit-content; margin:8px auto 0; }
.qd .wy-v2 .qd-legal .qd-policy-btn + br, .qd .wy-v2 .qd-legal br:last-of-type{ display:none; }
.qd .wy-v2 .qd-policy{ margin-top:16px; }
/* чипы меньше и тише – они больше для нас{ gap:6px; }
/* зона фото крупнее, кружок «+» под текстом (18.09.2026) */
@media (max-width:639px){ .qd .wy-v2 .qd-drop{ width:100%; } }
.qd .wy-v2 .qd-drop-row{ flex-direction:column-reverse; }
/* телефон: зона фото ниже, чтобы кнопка отправки была на первом экране (18.09.2026) */
@media (max-width:639px){
  .qd .wy-v2 .qd-drop{ padding:1.3rem 1rem 1.2rem; }
  .qd .wy-v2 .qd-plus{ width:44px; height:44px; }
  .qd .wy-v2 .qd-plus svg{ width:20px; height:20px; }
}
/* Левая колонка: номер, строка про мессенджеры и WhatsApp | Telegram – по центру, крупно (18.09.2026).
   Кружок с «+», при наведении «+» складывается в стрелку, как в зоне фото, и поворачивается вправо.
   Кружок серый, не терракота: главный путь – форма, мессенджеры – запасной */
.qd .wy-v2 .qd-alt{ margin:1.1rem 0 0; }
.qd .wy-v2 .qd-msgr a{ display:flex; align-items:center; gap:.6rem; font-size:19px; font-weight:700; color:var(--c-ink); text-decoration:none; }
.qd .wy-v2 .qd-msgr a:first-child{ justify-self:start; }
.qd .wy-v2 .qd-msgr a:last-child{ justify-self:end; flex-direction:row-reverse; }
.qd .wy-v2 .qd-mplus{ flex:none; display:grid; place-items:center; border-radius:50%; color:var(--c-ink); transition:background-color .18s ease; }
.qd .wy-v2 .qd-mplus svg{ transition:transform .3s ease; }
.qd .wy-v2 .qd-mplus svg path{ transform-box:view-box; transform-origin:12px 12px; transition:transform .3s ease; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-mplus svg, .qd .wy-v2 .qd-mplus svg path{ transition:none; } }
/* WhatsApp над Telegram: две одинаковые карточки по центру (18.09.2026) */
.qd .wy-v2 .qd-msgr{ grid-template-columns:1fr; }
.qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{
 justify-self:stretch;
 transition:background-color .18s ease, border-color .18s ease; }
.qd .wy-v2 .qd-msgr a:hover, .qd .wy-v2 .qd-msgr a:focus-visible { border-color:rgba(31,33,32,.3); }
.qd .wy-v2 .qd-mplus{ background:var(--c-sand); }
.qd .wy-v2 .qd-msgr a:hover .qd-mplus, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus{ background:var(--c-terra); }
/* кружок мессенджеров: «+» сразу складывается в стрелку вправо, без поворота всего значка (18.09.2026) */
.qd .wy-v2 .qd-msgr a:hover .qd-mplus svg, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus svg{ transform:none; }
/* карточки мессенджеров меньше: слева углы как у кнопок (8px), справа пилюля с кружком (18.09.2026) */
.qd .wy-v2 .qd-mplus{ width:32px; height:32px; }
/* карточки мессенджеров по ширине текста (обе равны самой широкой), без пустоты внутри (18.09.2026) */
.qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child { padding-left:.9rem; }
/* кружок мессенджеров: сразу стрелка вправо{ transform:translateX(7px) rotate(-45deg); }
/* Левая колонка, 18.09.2026: номер, строка про чат и кнопки мессенджеров по левому краю, как вся колонка.
   WhatsApp и Telegram в одну строку: сплошные белые кнопки, углы 8px как у кнопок сайта, стрелка без кружка.
   ≤639px левая колонка центрирована целиком – там и они по центру */
.qd .wy-v2 .qd-left .qd-call{ margin-left:0; margin-right:0; }
.qd .wy-v2 .qd-alt{ text-align:left; }
.qd .wy-v2 .qd-msgr{ width:auto; max-width:none; margin:.6rem 0 0; display:flex; flex-wrap:wrap; }
.qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{
 flex-direction:row-reverse; justify-content:flex-end; border:0;
 background:var(--c-paper); font-weight:700; line-height:1.1; }
.qd .wy-v2 .qd-msgr a:hover, .qd .wy-v2 .qd-msgr a:focus-visible{ background:var(--c-terra); }
.qd .wy-v2 .qd-mplus, .qd .wy-v2 .qd-msgr a:hover .qd-mplus, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus{
 width:auto; height:auto; background:none; border-radius:0; }
/* зона фото шириной со строку заголовка «każdą stronę dokumentu w całości» (≈14.8em от 30px) (18.09.2026) */
/* строка про чат – тем же шрифтом, что «Dokumenty, od których…» (18.09.2026) */
.qd .wy-v2 .qd-alt{ font-size:18px; line-height:1.4; font-weight:400; font-style:italic; color:rgba(31,33,32,.7); }
/* код страны в номере: тонкий курсив, поднят над строкой (18.09.2026) */
.qd .wy-v2 .qd-call-cc { font-style:italic; }
/* ≤1023px (заголовок «Ekspresowa wycena» скрыт) левая колонка центрирована, как на телефоне (18.09.2026) */
@media (max-width:1023px){
  .qd .wy-v2 .qd-left{ text-align:center; }
  .qd .wy-v2 .qd-eta{ justify-content:center; }
  .qd .wy-v2 .qd-left .qd-call{ margin-left:auto; margin-right:auto; }
  .qd .wy-v2 .qd-alt{ text-align:center; }
  .qd .wy-v2 .qd-msgr{ justify-content:center; }
}
/* кнопки мессенджеров под размер плашек «15 min»: высота 37px, углы 6px, отступ между ними 3px (18.09.2026) */
.qd .wy-v2 .qd-msgr{ gap:3px; }
.qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{
 min-height:37px; box-sizing:border-box; padding:0 .75em; border-radius:6px; font-size:15px; gap:.45rem; }
.qd .wy-v2 .qd-mplus svg{ width:11px; height:11px; }
/* номер целиком курсивом: цифры жирный курсив 28px, «+48» тонкий курсив, поднят (18.09.2026) */
.qd .wy-v2 .qd-call{ font-style:italic; letter-spacing:-.01em; }
/* зона фото ниже на десктопе (18.09.2026); телефон – без изменений */
@media (min-width:640px){
  .qd .wy-v2 .qd-plus{ width:44px; height:44px; }
  .qd .wy-v2 .qd-plus svg{ width:20px; height:20px; }
}
/* заголовок правой колонки крупнее (18.09.2026): 34px – как h2 секций сайта на телефоне, от 1280px – 40px.
   Зона фото по-прежнему шириной со строку «każdą stronę dokumentu w całości» (≈14.8em) */
.qd .wy-v2 {}   /* телефон: крупнее не влезает, кнопка уходит с первого экрана */
.qd .wy-v2 .qd-formhead--light{ font-size:var(--fh); }
/* ≥1024px: WhatsApp и Telegram вместе шириной с плашки «15 min | Wyślij zdjęcia…» (18.09.2026).
   Без JS: содержимое колонки обёрнуто сеткой шириной max-content. Все тексты в ней с ручными переносами
   и уже плашек, поэтому ширина сетки = ширина плашек, а кнопки делят её пополам.
   Новый текст в левую колонку – только с <br>, иначе он растянет сетку в одну строку */
@media (min-width:1024px){
  .qd .wy-v2 .qd-left{ display:grid; grid-template-columns:max-content; }
}
/* зона фото чуть шире строки шагов 1–5 (шаги max 28rem): 30rem (18.09.2026) */
/* номер телефона: без подчёркивания при наведении (18.09.2026) */
.qd .wy-v2 .qd-call:hover, .qd .wy-v2 .qd-call:focus-visible{ text-decoration:none; }
/* «+48» крупнее: 72% номера, тонкий курсив, чуть приподнят (19.09.2026) */
/* кнопки мессенджеров сразу под номером, текст про чат – под ними (19.09.2026) */
.qd .wy-v2 .qd-msgr{ margin-top:1.1rem; }
.qd .wy-v2 .qd-alt{ margin-top:.7rem; }
/* заголовок формы плотный, как «Ekspresowa wycena»: tracking-tightest (-0.045em) и leading .94 (19.09.2026) */
.qd .wy-v2 .qd-formhead--light{ letter-spacing:-0.045em; line-height:.94; }

/* ===== Полоска «5 шагов» на главной (17.09.2026) – вариант .qd-next вне панели wyceny =====
   Правило контейнера возвращено 21.09.2026: оно пропало при чистке CSS (коммит 5e772d2), и без сетки
   шаги вставали столбиком, а линии-связки тянулись от кружков до левого края экрана – на всех ширинах. */
.hp-next{ list-style:none; margin:0 auto; padding:0; max-width:34rem; display:grid;
 grid-template-columns:repeat(5,minmax(0,1fr)); gap:0 .25rem; }
.hp-next li{ position:relative; display:flex; flex-direction:column; align-items:center; gap:.4rem;
 text-align:center; font-size:14px; line-height:1.25; font-weight:600; color:rgba(31,33,32,.7); }
.hp-next li + li::before{ content:''; position:absolute; top:12px; right:calc(50% + 17px); width:calc(100% - 34px + .25rem);
 height:1px; background:rgba(31,33,32,.2); }
.hp-next i{ font-style:normal; display:grid; place-items:center; width:25px; height:25px; border-radius:50%;
 background:var(--c-terra); color:var(--c-ink); font-size:12px; font-weight:700; }
@media (max-width:479px){ .hp-next li{ font-size:12.5px; } }
/* уже 360px колонка шага – 52px, «Realizacja» в неё не входила и упиралась в соседей */
@media (max-width:359px){ .hp-next li{ font-size:11.5px; letter-spacing:-.01em; } }
/* полоска шагов: вариант на тёмном фоне, по левому краю */
.hp-next--left{ margin:1.4rem 0 0; }
.hp-next--light li{ color:rgba(248,247,244,.7); }
.hp-next--light li + li::before{ background:rgba(248,247,244,.25); }
/* поле телефона: линия длиннее и цифры примера крупнее (17.09.2026) */
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line{ font-size:21px; letter-spacing:.01em; }
/* ≥1024px ширину левой колонки задают плашки «15 min | Wyślij zdjęcia…» и кнопки мессенджеров.
   Заголовок в одну строку шире их и раздувал сетку max-content – он больше не участвует в расчёте
   ширины (width:0 + min-width:100%) и кегль подобран так, чтобы строка влезала (19.09.2026) */
@media (min-width:1024px){
  /* ширину колонки, как и раньше, задаёт строка плашек «15 min | Wyślij zdjęcia…»:
     плашки по содержимому, кнопки мессенджеров растянуты ровно под них.
     Заголовок в расчёте ширины не участвует – иначе строка в одну строку раздувает сетку */
  /* заголовок отвязан от плашек: он занимает всю ширину колонки (100cqw),
     но в расчёт ширины сетки не входит (width:0), поэтому плашки и кнопки её по-прежнему задают */
  .qd .wy-v2 .qd-left{ container-type:inline-size; }
  .qd .wy-v2 .qd-left .qd-head{ width:0; min-width:100%; }
  /* только заголовок выходит на всю ширину колонки, плашки внутри .qd-head остаются по содержимому */
  .qd .wy-v2 #qd-title{ width:100cqw; }
  /* номер – по тем же правилам, что заголовок: во всю ширину колонки, но вне расчёта её ширины */
  /* кнопки мессенджеров встают на одну линию с «Wyślij do wyceny» в правой колонке (19.09.2026) */
  .qd .wy-v2 .qd-callwrap .qd-call{ display:block; }
  .qd .wy-v2 .qd-eta{ flex-wrap:nowrap; }
  .qd .wy-v2 .qd-msgr{ display:grid; grid-template-columns:1fr 1fr; width:100%; }
  .qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{ justify-content:center; }
  /* заголовок в одну строку должен влезать в эту ширину */
  .qd .wy-v2 #qd-title{ font-size:42px; }
}
/* согласие под кнопкой: по центру, с ручным переносом (19.09.2026) */
.qd .wy-v2 .qd-legal{ text-align:center; }
/* заголовок формы: жирная строка крупнее курсивной (19.09.2026).
   --fh – жирная строка, --fh-b – light italic, ≈0.857 от неё */
.qd .wy-v2{ --fh:33px; --fh-b:29px; }
@media (min-width:640px){ .qd .wy-v2{ --fh:33px; --fh-b:29px; } }
/* планшетный кегль 36/31 оставлен и на десктопе (19.09.2026) */
.qd .wy-v2 .qd-formhead--light .qd-fh-b{ font-size:var(--fh-b); }
/* срочность – единственная отметка перед кнопкой, вместо ряда чипов (19.09.2026) */
.qd .wy-v2 .qd-urgent{ margin:26px 0 0; }
/* кнопка чуть уже, воздух над и под ней +15% (19.09.2026) */
.qd .wy-v2 .qd-submit{ min-width:14rem; }
/* Telefon, E-mail и Kilka słów – одним кеглем, 16px (19.09.2026) */
.qd .wy-v2 .qd-acc-head, .qd .wy-v2 .qd-acc:not(.qd-acc--static) .qd-acc-head span{ font-size:16px; }
/* номер: спокойный кегль, «+48» той же плотности, что цифры, и без большого отрыва от «Zadzwoń!» (19.09.2026) */
.qd .wy-v2 .qd-call{ font-size:24px; font-weight:700; }
.qd .wy-v2 .qd-call-cc{ font-size:.62em; font-weight:600; vertical-align:.1em; margin-right:.2em; }
/* номер начинается под словом «Zadzwoń!» последней строки (≈8.15em её кегля) (19.09.2026) */
/* номер выключен вправо – по правому краю кнопки Telegram (19.09.2026) */
@media (min-width:1024px){
  .qd .wy-v2 .qd-callwrap{ width:0; min-width:100%; }
}
/* текст согласия – теми же параметрами, что подпись «na niego odpiszemy» (19.09.2026) */
.qd .wy-v2 .qd-legal{ color:rgba(31,33,32,.55) !important; }
/* больше воздуха вокруг главной кнопки (19.09.2026) */
.qd .wy-v2 .qd-legal{ margin-top:26px; }
/* кнопка чуть выше по высоте и ближе к полям (19.09.2026) */
.qd .wy-v2 .qd-submit{ padding-top:20px; padding-bottom:20px; }
.qd .wy-v2 .quote-form > div:has(> [type="submit"]){ margin-top:38px; }
/* Telefon и E-mail крупнее остальных подписей (19.09.2026) */
.qd .wy-v2 .qd-acc--static .qd-acc-head,
.qd .wy-v2 .qd-acc--static .qd-acc-head > span{ font-size:19px; }
/* зона загрузки на 15% меньше: ширина 25.5rem, отступы по высоте пропорционально (19.09.2026) */
@media (min-width:640px){ .qd .wy-v2 .qd-drop{ width:min(100%, 25.5rem); padding:1.3rem 1.2rem 1.2rem; } }
/* «Dodaj zdjęcia lub skan» крупнее – это главное действие в зоне (19.09.2026) */
/* «Zadzwoń!» насыщеннее остального абзаца, но тем же курсивом (18.09.2026) */
.qd .wy-v2 .qd-human .qd-human-cta{ font-style:inherit; font-weight:inherit; color:var(--c-ink); }
/* поле телефона должно читаться как поле, а не как текст: линия ближе к цифрам, пример темнее (18.09.2026) */
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line{ padding-bottom:.3rem; }
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line::placeholder{ color:rgba(31,33,32,.55); }
/* «Sprawa pilna» – круглая точка, после нажатия жёлтая (18.09.2026) */
.qd .wy-v2 .qd-urgent{ display:flex; align-items:center; justify-content:center; gap:.5rem; cursor:pointer; }
.qd .wy-v2 .qd-urgent input{ position:absolute; opacity:0; width:1px; height:1px; margin:0; }
/* переключатель: дорожка с кружком, включённый – охра (18.09.2026) */
.qd .wy-v2 .qd-urgent i{ position:relative; flex:none; width:34px; height:20px; border-radius:10px;
 background:rgba(31,33,32,.18); transition:background .18s ease; }
.qd .wy-v2 .qd-urgent i::after{ content:''; position:absolute; top:2px; left:2px; width:16px; height:16px; border-radius:50%;
 background:#fff; box-shadow:0 1px 2px rgba(31,33,32,.25); transition:transform .18s ease; }
.qd .wy-v2 .qd-urgent:hover i{ background:rgba(31,33,32,.3); }
.qd .wy-v2 .qd-urgent input:checked + i{ background:var(--c-terra); }
.qd .wy-v2 .qd-urgent input:checked + i::after{ transform:translateX(14px); }
.qd .wy-v2 .qd-urgent input:focus-visible + i{ outline:2px solid var(--c-terra); outline-offset:3px; }
/* подпись под телефоном и согласие – 15px, «Polityka Prywatności» на 2 пункта крупнее (18.09.2026) */
.qd .wy-v2 .qd-acc--static .qd-acc-head .qd-acc-note{ font-size:16px; }
.qd .wy-v2 .qd-legal{ font-size:15px; }
/* миниатюры – максимум 6 в ряд (18.09.2026) */
.qd .wy-v2 .qd-files{ max-width:calc(72px * 6 + .5rem * 5); margin-left:auto; margin-right:auto; }

/* ===== Панель wyceny: правки docs/wycena-form-fixes.md (20.09.2026) ===== */
/* п.1 Левая колонка: один курсивный блок – обещание; абзац про оператора обычным начертанием,
   вопрос «Masz pytanie…» склеен с номером в один блок по левому краю, провал перед мессенджерами убран */
.qd .wy-v2 .qd-human{ font-style:normal; font-size:16px; line-height:1.5; color:#4a4a45; margin-top:1.1rem; }
.qd .wy-v2 .qd-callq{ margin:0; font-size:16px; line-height:1.4; color:#4a4a45; }
.qd .wy-v2 .qd-callwrap{ margin-top:1.75rem; text-align:left; }
.qd .wy-v2 .qd-call{ margin-top:.2rem; }
@media (min-width:1024px){
  .qd .wy-v2 .qd-callwrap .qd-call{ width:fit-content; margin-left:0; margin-right:auto; }
  .qd .wy-v2 .qd-msgr{ margin-top:40px; }
}
@media (max-width:1023px){ .qd .wy-v2 .qd-callwrap{ text-align:center; } }
/* п.2 Чипы: белая плашка «Wyślij zdjęcia…» на песочном фоне не пропадала – обводка;
   отступы меньше на 1px рамки, внешний размер плашки прежний. Тёмный текст на охре уже был */
/* «Sprawa pilna»: 17px, 500, тон как у абзаца слева (#4a4a45 ≈ 71% чёрного), межстрочный 1.2.
   Без !important: общее правило `.wy-v2 label` выше исключает подписи панели (:not(.qd-urgent):not(.qd-acc-head)) */
.qd .wy-v2 .qd-urgent, .qd .wy-v2 .qd-urgent span,
.qd .wy-v2 .qd-urgent:has(input:checked) span{ font-size:17px; line-height:1.2; font-weight:500; color:#4a4a45; }
/* E-mail по образцу телефона: та же ширина линии и тот же кегль ввода;
   примеры в обоих полях темнее – #6b6b66, иначе читались как подсказка «на грани видимости» (20.09.2026) */
.qd .wy-v2 .quote-form input[type="email"].field.qd-line{ max-width:20rem; font-size:21px; letter-spacing:.01em; }
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line{ max-width:16rem; }
.qd .wy-v2 .quote-form input[type="tel"].field.qd-line::placeholder,
.qd .wy-v2 .quote-form input[type="email"].field.qd-line::placeholder{ color:#6b6b66; }
/* воздух между группами полей: подпись «Telefon» не должна касаться линии e-mail сверху –
   12px хватало, пока телефон стоял первым и линии над ним не было (20.09.2026) */
.qd .wy-v2 .quote-form > .qd-acc + .qd-acc{ margin-top:26px; }
/* «Kilka słów o sprawie» – 20px от линии телефона, «Sprawa pilna» – 12px от строки над ней (20.09.2026).
   Медиа-запросов на эти отступы в файле нет, значения одни на всех ширинах */
.qd .wy-v2 .quote-form > .qd-acc:not(.qd-acc--static){ margin-top:20px; }
.qd .wy-v2 .qd-urgent{ margin-top:12px; }
/* удаление миниатюры: при наведении кружок охряный, крестик тёмный – белый на охре не читается (20.09.2026) */
.qd .wy-v2 .qd-files .qd-file-x:hover, .qd .wy-v2 .qd-files .qd-file-x:focus-visible{
 background:var(--c-terra); color:var(--c-ink); }
/* значок зоны загрузки: «+» при наведении превращается в тот же шеврон вниз, что на кнопках сайта –
   стойка уходит{ transition:opacity .3s ease; }
/* значок зоны: два состояния наложены друг на друга, как у кнопки закрытия панели (.qd-close) –
   в покое «+», при наведении стрелка вниз: хвост плюс наконечник-шеврон тем же штрихом, что значки сайта */
.qd .wy-v2 .qd-plus{ display:grid; place-items:center; }
.qd .wy-v2 .qd-pic{ grid-area:1/1; transition:opacity .25s ease; }
.qd .wy-v2 .qd-pic--arrow{ opacity:0; }
.qd .wy-v2 .qd-drop:hover .qd-pic--plus, .qd .wy-v2 .qd-drop.is-over .qd-pic--plus{ opacity:0; }
.qd .wy-v2 .qd-drop:hover .qd-pic--arrow, .qd .wy-v2 .qd-drop.is-over .qd-pic--arrow{ opacity:1; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-pic{ transition:none; } }
/* вторая строка в зоне – как вторая строка заголовка над формой (.qd-fh-b): light italic со строчной (20.09.2026) */
/* Пара строк в зоне загрузки собрана по образцу заголовка «Sfotografuj telefonem / każdą stronę…»:
   жирная 800 с плотным трекингом -0.045em и межстрочным .94, вторая – 0.879 от неё (33/29 в заголовке),
   light italic, цвет чернильный – как в заголовке. Кегль 22 / 19px (20.09.2026) */
/* зона загрузки: наведение и фокус – серой обводкой, без охры (20.09.2026) */
.qd .wy-v2 .qd-drop:hover, .qd .wy-v2 .qd-drop.is-over{ border-color:rgba(31,33,32,.7); }
.qd .wy-v2 .file-input-hidden:focus-visible + .qd-drop{ outline-color:rgba(31,33,32,.45); }

/* отступы полей задаём с повышенной специфичностью: в файле много правил на `.qd-acc + .qd-acc`,
   и при равном весе побеждало то, что стоит ниже. Здесь порядок больше не важен (20.09.2026) */
.qd .wy-v2 .quote-form > .qd-acc.qd-acc--static + .qd-acc.qd-acc--static{ margin-top:26px; }
.qd .wy-v2 .quote-form > .qd-acc.qd-acc:not(.qd-acc--static){ margin-top:20px; }
/* правила `> * + *:has(#phone)` удалены: селектор с id весил больше любых классовых и обнулял
   отступ у блока с телефоном – он остался от макета, где телефон стоял первым полем (20.09.2026) */

/* «Dodaj zdjęcia lub skan» / «przeciągnij pliki tutaj» – та же пара, что «E-mail» / «na niego odpiszemy»:
   18px 600 ink и 15px 400 ink .55, межстрочный 1.3 (20.09.2026) */
/* вторая строка зоны – теми же параметрами, что подпись «na niego odpiszemy»: 15px, 400, серый */
.qd .wy-v2 .qd-drop-drag, .qd .wy-v2 .qd-drop-touch{ font-size:16px; font-weight:400; font-style:normal;
 letter-spacing:0; line-height:1.2; color:rgba(31,33,32,.55); }
.qd .wy-v2 .qd-drop-copy{ display:flex; flex-direction:column; align-items:center; gap:0; }
.qd .wy-v2 .qd-drop-btn{ flex:0 0 auto; padding:0; background:none; border-radius:0; white-space:nowrap;
 font-size:19px; font-weight:600; letter-spacing:0; line-height:1.2; color:var(--c-ink); text-decoration:none; }

/* воздух над и под текстом в зоне загрузки +18%: 1.3/1.2rem → 1.534/1.416rem (20.09.2026) */
@media (min-width:640px){ .qd .wy-v2 .qd-drop{ padding-top:1.534rem; padding-bottom:1.416rem; } }
@media (max-width:639px){ .qd .wy-v2 .qd-drop{ padding-top:1.534rem; padding-bottom:1.416rem; } }

/* кружок ниже текста на 15%: зазор .75rem → .8625rem (телефон .7 → .805rem).
   Отступ до нижнего края зоны из-за этого меньше верхнего – так и задумано (20.09.2026) */
@media (min-width:640px){ .qd .wy-v2 .qd-drop-row{ gap:.8625rem; } }
@media (max-width:639px){ .qd .wy-v2 .qd-drop-row{ gap:.805rem; } }

/* Ширину задаёт контейнер .qd-photo, зона тянется на все 100% его ширины.
   Пустая – 408px, с миниатюрами – 472px, ровно ширина сетки (6 × 72px + 5 зазоров по 8px),
   поэтому зона и превью стоят одним блоком. Условие по факту наличия <li>, без класса из JS (20.09.2026) */
@media (min-width:640px){
 .qd .wy-v2 .quote-form > .qd-photo{ width:100%; max-width:408px; margin-left:auto; margin-right:auto; }
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li){ max-width:472px; }
 .qd .wy-v2 .qd-drop, .qd .wy-v2 .qd-drop.is-filled{ width:100%; max-width:none; }
}

/* Ошибки формы: красное только после неудачной отправки – линия поля и строка под ним.
   Подсказка под кнопкой («Podaj e-mail i numer, aby wysłać») остаётся серой: это не ошибка,
   а предупреждение до нажатия. Подписи полей не красим – по ним ищут поле (20.09.2026) */
.qd .wy-v2 .field.is-invalid{ border-bottom-color:#C8102E; border-bottom-width:2px; }
.qd .wy-v2 .field.is-invalid::placeholder{ color:rgba(200,16,46,.55); }

/* Вторичные подписи панели – один набор: 16px, 400, ink .55, межстрочный 1.2 (20.09.2026).
   Сюда входят «przeciągnij pliki tutaj», «na niego odpiszemy», «21 zdjęć» и «Zdjęcia usuwamy…».
   Подсказка под кнопкой («Podaj e-mail i numer…») мельче намеренно – это служебное предупреждение */
.qd .wy-v2 .qd-files-cap, .qd .wy-v2 .qd-safe{ font-size:16px; font-weight:400; line-height:1.2; color:rgba(31,33,32,.55); }
.wy-v2 #quote-form .qd-done .qd-safe{ font-size:16px; font-weight:400; line-height:1.2; }


/* «Polityka Prywatności» – теми же параметрами, что «Sprawa pilna»: 17px, 500, ink .55, межстрочный 1.2 */
.qd .wy-v2 .qd-legal .qd-policy-btn{ font-size:17px; font-weight:500; line-height:1.2;
 color:#4a4a45; text-decoration:none; }


/* Левая колонка «Wycena» – больше воздуха (20.09.2026).
   Заголовок и его типографика не тронуты: увеличены только отступы всего,
   что идёт после него, чтобы блоки дышали и читались группами */
.qd .wy-v2 .qd-eta{ margin-top:4.82rem; }
.qd .wy-v2 .qd-lead{ margin-top:2.6rem; }
.qd .wy-v2 .qd-human{ margin-top:1.6rem; }
.qd .wy-v2 .qd-callwrap{ margin-top:2.6rem; }
.qd .wy-v2 .qd-call{ margin-top:.45rem; }
.qd .wy-v2 .qd-msgr{ margin-top:4.5rem; }
.qd .wy-v2 .qd-alt{ margin-top:1.1rem; }
@media (min-width:1024px){
  /* низ плашки «15 min» совпадает с низом дропзоны в правой колонке */
  .qd .wy-v2 .qd-eta{ margin-top:6rem; }
  .qd .wy-v2 .qd-msgr{ margin-top:9.5rem; }
}
/* WhatsApp / Telegram – кнопки, а не плашки (21.09.2026, ночь).
   Были белыми брусками, растянутыми на полколонки: текст терялся в пустоте, стрелка была белой
   на белом. Теперь это кнопка сайта (.btn) на тёмном: прозрачная, охряная обводка 1px, углы 12px,
   белый текст; при наведении заливается охрой, текст и стрелка – чернила.
   Ширина – по содержимому. Поля от кегля: .8em сверху-снизу, 1.5em по бокам (≈1:2) –
   кнопка получается высотой ~2.6 строки текста и не выглядит ни бруском, ни ярлыком. */
.qd .wy-v2 .qd-msgr, .qd .wy-v2 .qd-left .qd-msgr{ display:flex; flex-wrap:wrap; gap:10px; width:auto; }
.qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{
 flex:0 0 auto; min-height:0; padding:.8em 1.35em .8em 1.5em; gap:9px;
 font-size:17px; font-weight:600; line-height:1; letter-spacing:.005em;
 color:var(--c-paper); background:transparent; border-radius:12px;
 /* обводка белая .65, а не охряная: мессенджеры – второй путь, охра в колонке остаётся за «15 min»,
    а на всей панели – за главной кнопкой «Wyślij do wyceny». Охра приходит только при наведении */
 border:1px solid rgba(255,255,255,.65);
 transition:background-color .3s ease, border-color .3s ease, color .3s ease; }
/* стрелка – того же размера, что у кнопок сайта (.btn-chev: 1.15em), отступ от слова те же 9px */
.qd .wy-v2 .qd-msgr .qd-mplus svg{ width:1.15em; height:1.15em; display:block; margin:-.1em 0; transition:transform .3s ease; }
.qd .wy-v2 .qd-msgr a:hover, .qd .wy-v2 .qd-msgr a:focus-visible{ background:var(--c-terra); border-color:var(--c-terra); }
.qd .wy-v2 .qd-left .qd-msgr a:hover, .qd .wy-v2 .qd-left .qd-msgr a:hover *,
.qd .wy-v2 .qd-left .qd-msgr a:focus-visible, .qd .wy-v2 .qd-left .qd-msgr a:focus-visible *{ color:var(--c-ink); }
.qd .wy-v2 .qd-msgr a:hover .qd-mplus svg, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus svg{ transform:translateX(3px); }
/* Мышь: в покое стрелки нет, слово стоит по центру кнопки. При наведении стрелка выезжает справа,
   слово сдвигается влево – общий приём кнопок сайта (.btn-mark). Ширина кнопки при этом не меняется
   и соседняя не прыгает: место под стрелку (1.15em + 9px) в покое отдано боковым полям поровну,
   при наведении поля сжимаются ровно на столько, на сколько раскрывается стрелка.
   Телефон: наведения нет, стрелка видна всегда (21.09.2026, ночь) */
@media (hover:hover) and (pointer:fine){
 .qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr a:first-child, .qd .wy-v2 .qd-msgr a:last-child{
  gap:0; justify-content:center; padding:.8em calc(1.5em + (1.15em + 9px) / 2);
  transition:background-color .3s ease, border-color .3s ease, color .3s ease, padding .38s cubic-bezier(.2,.7,.25,1); }
 .qd .wy-v2 .qd-msgr .qd-mplus{ display:block; overflow:hidden; width:0; margin-left:0; opacity:0;
  transition:width .38s cubic-bezier(.2,.7,.25,1), margin-left .38s cubic-bezier(.2,.7,.25,1), opacity .28s ease; }
 .qd .wy-v2 .qd-msgr a:hover, .qd .wy-v2 .qd-msgr a:focus-visible{ padding-left:1.5em; padding-right:1.5em; }
 .qd .wy-v2 .qd-msgr a:hover .qd-mplus, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus{ width:1.15em; margin-left:9px; opacity:1; }
 .qd .wy-v2 .qd-msgr a:hover .qd-mplus svg, .qd .wy-v2 .qd-msgr a:focus-visible .qd-mplus svg{ transform:none; }
}
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-msgr a, .qd .wy-v2 .qd-msgr .qd-mplus, .qd .wy-v2 .qd-msgr .qd-mplus svg{ transition:none; } }
/* Тексты левой колонки – в типографике формы (21.09.2026, ночь). Были двумя абзацами обычного
   начертания 24 и 16px с принудительными переносами – чужие и заголовку, и форме.
   – «Odpowiadamy z ceną i terminem / – bez zobowiązań.» собран той же парой, что заголовки панели
     («Ekspresowa wycena / Dokumentu», «Sfotografuj telefonem / każdą stronę…»): первая строка 800
     с трекингом -0.045em и межстрочным .94, вторая – light italic, 0.879 кегля первой.
     Обещание жирно, оговорка – лёгким курсивом: смысл разложен начертаниями одного шрифта.
   – абзац про оператора – второй голос, как «na niego odpiszemy» в форме: 17px, один ровный
     серый (белый .66), без выделений. Переносы – по смыслу, а не по ширине: три строки-синтагмы
     «Dokumenty, od których wiele zależy, / sprawdza nasz specjalista. / Wszystkie traktujemy poufnie.»
     Самая длинная – 35 знаков (≈290px) – входит и в колонку десктопа (438px), и в телефон 375px
     (319px), поэтому рисунок абзаца одинаков на всех ширинах. На самых узких экранах (≤360px)
     кегль 16px; если строка всё же не влезет, она сама делится поровну (text-wrap:balance),
     а неразрывные пробелы не дают повиснуть «od» и «nasz». */
/* 21.09.2026, ночь: пара «жирное 800 / light italic» здесь оказалась перебором – третий заголовок
   на одну панель. Строка набрана однородно: 22px, 500, белый, обычный трекинг. Она старше серого
   абзаца под ней (крупнее, плотнее, белая), но не спорит с заголовком панели.
   Перенос по смыслу остаётся: обещание / оговорка – две строки на любой ширине */
.qd .wy-v2 .qd-left .qd-lead{ font-size:22px; font-weight:500; font-style:normal; line-height:1.28;
 letter-spacing:-.005em; margin-top:2.6rem; }
.qd .wy-v2 .qd-left .qd-lead .qd-lead-a,
.qd .wy-v2 .qd-left .qd-lead .qd-lead-b{ display:block; margin:0; font:inherit; letter-spacing:inherit;
 color:var(--c-paper); text-wrap:balance; }
.qd .wy-v2 .qd-left .qd-human{ margin-top:1.5rem; max-width:none; font-size:17px; font-weight:400; line-height:1.45;
 letter-spacing:0; color:rgba(255,255,255,.66); }
.qd .wy-v2 .qd-left .qd-human span{ display:block; color:inherit; text-wrap:balance; }
@media (max-width:360px){ .qd .wy-v2 .qd-left .qd-human{ font-size:16px; } }
@media (max-width:1023px){ .qd .wy-v2 .qd-left .qd-human{ margin-left:auto; margin-right:auto; } }
/* телефон: при 22px строка «Odpowiadamy z ceną i terminem» (≈322px) на 3px шире колонки 375-го экрана
   и ломалась на три строки. 20px – влезает в одну, рисунок «обещание / оговорка» сохраняется */
@media (max-width:420px){ .qd .wy-v2 .qd-left .qd-lead{ font-size:20px; } }
@media (max-width:340px){ .qd .wy-v2 .qd-left .qd-lead{ font-size:18px; } }

/* Телефон – максимально читаемый (21.09.2026, ночь). Вопрос «Masz pytanie…» над ним убран:
   номер говорит сам за себя. Что сделано для чтения:
   – прямой шрифт вместо курсива: наклонные цифры на размытом фоне читаются хуже;
   – кегль 34px (был 24), жирный 700, цифры одной ширины (tabular-nums) – группы 518 157 581
     стоят ровными тройками; между группами обычный пробел, слегка разрежен трекинг;
   – «+48» на той же строке и того же кегля, но тонкий и приглушённый: номер читается целиком,
     а глаз сразу берёт значимые девять цифр. Раньше код был мелким и поднятым – шумел;
   – номер стоит вплотную над кнопками мессенджеров: это один блок «связаться» внизу колонки,
     весь воздух уходит наверх, между текстом и контактами. */
.qd .wy-v2 .qd-left .qd-call{ font-style:normal; font-size:34px; font-weight:700; line-height:1.1;
 letter-spacing:.01em; word-spacing:.06em; font-variant-numeric:tabular-nums lining-nums; margin-top:0; }
.qd .wy-v2 .qd-left .qd-call .qd-call-cc{ font-style:normal; font-size:1em; font-weight:300; vertical-align:baseline;
 margin-right:.28em; color:rgba(255,255,255,.7); }
.qd .wy-v2 .qd-left .qd-call:hover, .qd .wy-v2 .qd-left .qd-call:focus-visible,
.qd .wy-v2 .qd-left .qd-call:hover *, .qd .wy-v2 .qd-left .qd-call:focus-visible *{ color:var(--c-terra); }
.qd .wy-v2 .qd-left .qd-call, .qd .wy-v2 .qd-left .qd-call *{ transition:color .3s ease; }
.qd .wy-v2 .qd-callwrap{ margin-top:3.2rem; }
.qd .wy-v2 .qd-msgr, .qd .wy-v2 .qd-left .qd-msgr{ margin-top:1.15rem; }
@media (min-width:1024px){
  /* кнопки мессенджеров остаются на линии «Wyślij do wyceny»: воздух перенесён из-под номера наверх */
  .qd .wy-v2 .qd-callwrap{ margin-top:12.1rem; }
  .qd .wy-v2 .qd-msgr, .qd .wy-v2 .qd-left .qd-msgr{ margin-top:1.15rem; }
}
@media (max-width:420px){ .qd .wy-v2 .qd-left .qd-call{ font-size:30px; } }
/* В мобильной шапке, где заголовок скрыт, плашка остаётся прижатой к верху */
@media (max-width:1023px){
  .qd .wy-v2 .qd-left .qd-eta{ margin-top:0; }
}

/* Вся всплывающая панель «Wycena» – стекло того же семейства, что плашка шапки:
   фон, размытие и та же тень наружу (--hdr-shadow).
   Непрозрачные подложки внутри (карточка bg-sand и правая колонка bg-paper) снимаем,
   иначе стекло было бы не видно. Скругления не трогаем (21.09.2026). */
.qd .qd-shell{ background:transparent;
 /* заливку и размытие несут сами колонки: если оставить их ещё и на панели,
    слои складываются и левая колонка выходит плотнее тёмной плашки (21.09.2026) */
 /* та же тень наружу, что у плашки шапки, но вдвое плотнее (21.09.2026) */
 box-shadow:0 1px 2px -1px rgba(31,33,32,.20), 0 8px 12px -8px rgba(31,33,32,.32); }
.qd .qd-scroll > div, .qd .qd-scroll > div > .grid > div{ background:transparent; }
.qd .qd-scroll .qd-head{ background:transparent; }
/* затемнение под панелью накрывает и шапку – слой шапки не поднимаем (21.09.2026).
   Левая колонка – параметры тёмной плашки шапки (--hdr-bg-dark + размытие),
   правая – белая с прозрачностью 8%. */
.qd .qd-scroll > div > .grid > div:first-child{ background:var(--hdr-bg-dark); }
/* Размытие одно на всю панель и висит на неподвижной .qd-shell (21.09.2026, ночь).
   Раньше его несли обе колонки, а они едут внутри прокрутки: браузер на каждом кадре заново
   размывал две большие области – панель дёргалась. Оболочка стоит на месте, размытие под ней
   считается один раз. Колонки дают только цвет: слева --hdr-bg-dark, справа белый .92 */
.qd .qd-shell{ -webkit-backdrop-filter:var(--hdr-blur); backdrop-filter:var(--hdr-blur); }
/* на тёмной колонке текст светлеет – как в шапке над тёмными блоками */
.qd .wy-v2 .qd-left, .qd .wy-v2 .qd-left *{ color:var(--c-paper); }
/* обе плашки строки «15 min» со своими подложками – жёлтой и белой – держат чернильный текст */
.qd .wy-v2 .qd-left .qd-eta b, .qd .wy-v2 .qd-left .qd-eta span{ color:var(--c-ink); }
/* правая колонка почти непрозрачная – 8%, с тем же размытием */
.qd .qd-scroll > div > .grid > div:nth-child(2){ background:rgba(255,255,255,.92);
 isolation:isolate; }  /* свой слой: «тень»-заливка дропзоны (z-index:-1) остаётся внутри колонки */
/* Дропзона – сплошная серо-графитовая плашка, заметно светлее левой колонки (21.09.2026).
   Стекло здесь не работает: под зоной белая колонка, полупрозрачный тёмный даёт грязно-серый,
   поэтому заливка сплошная, без размытия. Пунктир вынесен наружу (::after с отрицательным
   inset): тонкая чернильная прострочка по белому вокруг плашки. Наружной тени нет – с внешней
   прострочкой она спорит; внутренняя есть всегда, при наведении набирает полную силу. Иерархия текста: первая строка белая, вторая – белая .72.
   Кружок охряный с чернильным значком во всех состояниях – единственный цветной акцент формы. */
.qd .wy-v2 .qd-drop{ position:relative; background:#DCDCD8; border-color:transparent;
 -webkit-backdrop-filter:none; backdrop-filter:none;
 /* в покое – 35% от внутренней тени наведения (альфы .38/.42 × .35), геометрия та же */
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.7), inset 0 2px 5px rgba(31,33,32,.06), inset 0 10px 22px -8px rgba(31,33,32,.07);
 transition:box-shadow .25s ease; }
.qd .wy-v2 .qd-drop::after{ content:''; position:absolute; inset:-9px; border-radius:17px;
 /* цвет как у линий полей E-mail / Telefon (чернила .3), штрих 2px – прицел не спорит с формой */
 border:2px solid rgba(31,33,32,.3); pointer-events:none; transition:border-color .6s ease; }
/* наведение и перетаскивание: цвет плашки не меняется, появляется внутренняя тень –
   зона «продавливается», как лоток; прострочка проявляется */
.qd .wy-v2 .qd-drop:hover, .qd .wy-v2 .qd-drop.is-over{ background:#DCDCD8; border-color:transparent;
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.7), inset 0 2px 5px rgba(31,33,32,.17), inset 0 10px 22px -8px rgba(31,33,32,.2); }
/* при наведении и мерцании цвет уголков не меняется – остаётся светлым, как в покое (чернила .3) */
.qd .wy-v2 .qd-drop.is-over::after{ border-color:var(--c-terra); border-style:solid; border-width:2px; }
.qd .wy-v2 .qd-plus,
.qd .wy-v2 .qd-drop:hover .qd-plus,
.qd .wy-v2 .qd-drop.is-over .qd-plus{ background:var(--c-terra); color:var(--c-ink); }
.qd .wy-v2 .qd-drop .qd-plus *{ color:inherit; }
.qd .wy-v2 .qd-drop .qd-drop-btn{ color:var(--c-ink); }
.qd .wy-v2 .qd-drop .qd-drop-drag, .qd .wy-v2 .qd-drop .qd-drop-touch{ color:rgba(31,33,32,.6); }
.qd .wy-v2 .qd-drop.is-filled .file-name{ color:var(--c-ink); }
/* фокус с клавиатуры – обводкой за уголками, а не поверх них */
.qd .wy-v2 .file-input-hidden:focus-visible + .qd-drop{ outline-offset:13px; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .qd-drop, .qd .wy-v2 .qd-drop::after{ transition:none; } }

/* Вместо прострочки – уголки видоискателя снаружи плашки (21.09.2026, вечер): рамка ::after
   стоит в 9px от края, маска оставляет от неё только четыре угла по 26px. Рифмуется с заголовком
   «Sfotografuj telefonem» – так размечают кадр камера и сканер. Сама зона не уменьшается.
   Наведение – уголки чернильные, перетаскивание файла – охряные (цвет задан выше, по border-color) */
.qd .wy-v2 .qd-drop::after,
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li)::after{
 --qd-c:linear-gradient(#000 0 0);
 -webkit-mask:var(--qd-c) top left/26px 26px no-repeat, var(--qd-c) top right/26px 26px no-repeat,
  var(--qd-c) bottom left/26px 26px no-repeat, var(--qd-c) bottom right/26px 26px no-repeat;
 mask:var(--qd-c) top left/26px 26px no-repeat, var(--qd-c) top right/26px 26px no-repeat,
  var(--qd-c) bottom left/26px 26px no-repeat, var(--qd-c) bottom right/26px 26px no-repeat; }

/* Мерцание уголков (21.09.2026, вечер): видоискатель «наводится» – уголки гаснут и чуть
   расходятся (9 → 12px от плашки), потом возвращаются.
   Мышь: мерцают при наведении и пока над зоной держат файл.
   Телефон: наведения нет, поэтому уголки медленно дышат сами, пока зона пуста, – это приглашение
   нажать, как пульсирующая стрелка у кнопки закрытия. После первого снимка замирают: задача
   понята, дальше мерцание только отвлекало бы от миниатюр. На время касания – быстрый ритм. */
/* анимируем только opacity и transform: inset пересчитывал раскладку на каждом кадре,
   а рядом стекло с размытием – оно перерисовывалось вместе с уголками */
@keyframes qd-corners{
  0%, 100%{ opacity:1; transform:none; }
  50%     { opacity:.45; transform:scale(1.012, 1.026); }
}
@keyframes qd-corners-tall{
  0%, 100%{ opacity:1; transform:none; }
  50%     { opacity:.45; transform:scale(1.01, 1.008); }
}
/* Мышь: мерцание включает не :hover, а класс is-live из app.js. Когда курсор уходит, класс снимается
   не сразу, а в конце текущего цикла – в этой точке уголки уже стоят в исходном положении, поэтому
   они спокойно доигрывают движение и замирают, без рывка. Ритм медленный: 2.4s (21.09.2026, ночь) */
.qd .wy-v2 .qd-drop.is-live::after{ animation:qd-corners 2.4s ease-in-out infinite; }
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop.is-live)::after{ animation:qd-corners-tall 2.4s ease-in-out infinite; }
.qd .wy-v2 .qd-drop.is-over::after{ animation:qd-corners 1.4s ease-in-out infinite; }
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop.is-over)::after{ animation:qd-corners-tall 1.4s ease-in-out infinite; }
@media (hover:none){
 .qd .wy-v2 .qd-drop:not(.is-filled)::after{ animation:qd-corners 3.5s ease-in-out infinite; }
 .qd .wy-v2 .qd-drop:active::after,
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop:active)::after{ animation:qd-corners-tall .8s ease-in-out infinite; }
}
@media (prefers-reduced-motion:reduce){
 .qd .wy-v2 .qd-drop::after, .qd .wy-v2 .quote-form > .qd-photo::after{ animation:none !important; }
}

/* С фотографиями зона вырастает: плашкой становится весь блок .qd-photo – и приглашение
   «Dodaj kolejne zdjęcie», и сетка миниатюр, и счётчик лежат на одном графитовом поле
   с одной прострочкой. Сама .qd-drop внутри делается прозрачной. Бросать файлы можно
   в любое место блока, в том числе на миниатюры (обработчики в app.js висят на .qd-photo).
   Ширина: сетка 472px + поля по 16px = 504px (21.09.2026) */
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li){ position:relative; background:#DCDCD8; border-radius:10px;
 padding:0 12px 14px;
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.7), inset 0 2px 5px rgba(31,33,32,.06), inset 0 10px 22px -8px rgba(31,33,32,.07);
 transition:box-shadow .25s ease; }
/* С файлами зона шире пустой ровно на 18% – по 9% на сторону: 408 → 481px (21.09.2026, ночь).
   Расширение плавное. Поля от превью до края зоны – 28px по бокам и 26px снизу (были 16/18:
   миниатюры липли к кромке стекла). Внутри 425px: шесть миниатюр в ряд по 64×90px
   (те же пропорции, что 72×102) с зазорами 8px – 424px, сетка встаёт от поля до поля */
@media (min-width:640px){
 .qd .wy-v2 .quote-form > .qd-photo{ transition:max-width .4s cubic-bezier(.2,.7,.25,1), box-shadow .25s ease; }
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li){ max-width:481px; padding:0 28px 26px; }
 .qd .wy-v2 .qd-photo .qd-files li{ width:64px; height:90px; }
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-files{ margin-top:.35rem; }
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-files-cap{ margin-top:1rem; }
}
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .quote-form > .qd-photo{ transition:none; } }
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li)::after{ content:''; position:absolute; inset:-9px; border-radius:17px;
 /* цвет как у линий полей E-mail / Telefon (чернила .3), штрих 2px – прицел не спорит с формой */
 border:2px solid rgba(31,33,32,.3); pointer-events:none; transition:border-color .6s ease; }
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop,
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop:hover,
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop.is-over{ background:transparent; box-shadow:none; margin-bottom:0; }
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop::after{ display:none; }
/* наведение на приглашение и перетаскивание над блоком – те же состояния, что у пустой зоны */
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop:hover),
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop.is-over){
 box-shadow:inset 0 0 0 1px rgba(255,255,255,.7), inset 0 2px 5px rgba(31,33,32,.17), inset 0 10px 22px -8px rgba(31,33,32,.2); }
.qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li):has(.qd-drop.is-over)::after{ border-color:var(--c-terra); border-style:solid; border-width:2px; }
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-files{ margin-top:0; }
/* цвет задаём с id формы: правило `.wy-v2 #quote-form p` сильнее любых классовых селекторов */
.qd .wy-v2 .qd-photo:has(.qd-files li) .qd-files-cap{ margin-top:.75rem; }
.wy-v2 #quote-form .qd-photo:has(.qd-files li) .qd-files-cap,
.wy-v2 #quote-form-qd .qd-photo:has(.qd-files li) .qd-files-cap{ color:rgba(31,33,32,.6); }
.wy-v2 #quote-form .qd-photo:has(.qd-files li) .qd-field-err,
.wy-v2 #quote-form-qd .qd-photo:has(.qd-files li) .qd-field-err{ color:#C8102E; }
@media (prefers-reduced-motion:reduce){ .qd .wy-v2 .quote-form > .qd-photo, .qd .wy-v2 .quote-form > .qd-photo::after{ transition:none; } }

/* 21.09.2026, ночь: стекло зоны – белое матовое, а не тёмное. Тёмного окна в белом листе было
   слишком мало, чтобы эффект читался, а миниатюры на светлом выглядят чище. Приём тот же:
   в прямоугольнике зоны белого листа (.92) нет, вместо него – белый .75 поверх размытого сайта;
   получается молочное стекло на тон темнее листа. Кромка – светлая внутренняя линия 1px,
   текст чернильный, внутренняя тень мягкая чернильная (в покое 35% от наведения). */
/* Дропзона – стекло, как левая колонка: сквозь неё виден размытый сайт под панелью (21.09.2026).
   Зона лежит на белой колонке, поэтому просто сделать её прозрачной мало – под ней белое.
   Приём: белую заливку с колонки снимаем, а рисует её сама зона – сплошной «тенью» с огромным
   spread вокруг себя (::before, z-index:-1 – под всем содержимым колонки, над её пустым фоном).
   Белое получается везде, кроме прямоугольника зоны: там остаётся только размытие колонки
   и затемнение --hdr-bg-dark – ровно состав левой колонки. clip-path держит «тень» в границах
   правой колонки и, в отличие от overflow:hidden, не ломает липкую полосу сверху.
   После отправки формы (is-sent) зоны нет – колонке возвращается обычная белая заливка.
   Без поддержки :has() всё остаётся как было: сплошная серо-графитовая плашка. */
@supports selector(:has(a)){
 .qd .qd-scroll > div > .grid > div:nth-child(2):has(.quote-form:not(.is-sent) .qd-photo){
  background:transparent; overflow:clip; }
 /* overflow:clip – простая прямоугольная обрезка: не делает колонку контейнером прокрутки
    (липкая полоса жива) и не требует маски, как clip-path, из-за которой прокрутка дёргалась */
 @supports not (overflow:clip){
  .qd .qd-scroll > div > .grid > div:nth-child(2):has(.quote-form:not(.is-sent) .qd-photo){ clip-path:inset(0); }
 }
 .qd .wy-v2 .qd-drop,
 .qd .wy-v2 .qd-drop:hover, .qd .wy-v2 .qd-drop.is-over,
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li){ background:rgba(255,255,255,.75); }
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop,
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop:hover,
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop.is-over{ background:transparent; }
 .qd .wy-v2 .qd-drop::before,
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li)::before{ content:''; position:absolute; z-index:-1;
  border-radius:10px; box-shadow:0 0 0 3000px rgba(255,255,255,.92); pointer-events:none; }
 .qd .wy-v2 .qd-drop::before{ inset:-1px; }   /* у зоны прозрачная рамка 1px – дыра по внешнему краю */
 .qd .wy-v2 .quote-form > .qd-photo:has(.qd-files li)::before{ inset:0; }
 .qd .wy-v2 .qd-photo:has(.qd-files li) .qd-drop::before{ display:none; }
 /* пока снимки готовятся (is-busy), гасим содержимое зоны, а не её саму: opacity на зоне создал бы
    свой слой, «тень»-заливка всплыла бы из-под содержимого колонки и накрыла форму белым */
 .qd .wy-v2 .qd-drop.is-busy{ opacity:1; }
 .qd .wy-v2 .qd-drop.is-busy > .qd-drop-row{ opacity:.5; }
}

/* миниатюры на матовом стекле: вместо обводки – тень, карточки «лежат» на плашке */
.qd .wy-v2 .qd-files li{ border:0;
 box-shadow:0 1px 2px rgba(31,33,32,.22), 0 8px 14px -6px rgba(31,33,32,.4); }

/* Полоса размытия вверху правой колонки: содержимое уходит под неё при прокрутке,
   белый градиент гасит текст. Полоса прилипает к верху области прокрутки, в поток
   не встраивается (отрицательные поля), клики пропускает (21.09.2026). */
.qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2){ position:relative; --qd-pad:1.75rem; }
@media (min-width:640px){ .qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2){ --qd-pad:3rem; } }
@media (min-width:1024px){ .qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2){ --qd-pad:3.5rem; } }
.qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2)::before{
 content:''; position:sticky; top:0; z-index:5; display:block;
 /* высота полосы = верхнему полю колонки: в покое она кончается там, где начинается заголовок,
    и не гасит его (на телефоне поле 1.75rem, полоса в 4rem съедала «Sfotografuj telefonem») */
 height:calc(var(--qd-pad) + var(--qd-fade-grow));
 /* верх поднимаем на поле колонки, снизу компенсируем высоту минус то же поле,
    иначе содержимое уезжает вверх на величину поля */
 margin:calc(var(--qd-pad) * -1) calc(var(--qd-pad) * -1) calc(var(--qd-fade-grow) * -1);
 /* размытие с полосы снято (21.09.2026, вечер): под ней теперь проезжает тёмное стекло дропзоны,
    и blur размазывал его в грязное пятно шире самой плашки; к тому же липкий элемент с backdrop-filter
    внутри прокрутки дёргается в Safari. Остался чистый белый градиент – содержимое уходит в «туман» */
 background:linear-gradient(to bottom, #fff 0%, rgba(255,255,255,.82) 30%, rgba(255,255,255,.4) 65%, rgba(255,255,255,0) 100%);
 pointer-events:none; }
/* «туман» растёт вместе с полосой размытия: в покое он высотой с поле колонки и не задевает заголовок,
   при прокрутке удлиняется на --qd-tb (её ставит app.js на .qd; на телефоне не больше 28px).
   На телефоне поле всего 28px – без прироста градиент обрывался резкой белой полосой
   поверх стекла дропзоны. Отрицательное нижнее поле компенсирует прирост, вёрстка не сдвигается */
.qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2){ --qd-fade-grow:min(var(--qd-tb, 0px), 28px); }
@media (min-width:640px){ .qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2){ --qd-fade-grow:var(--qd-tb, 0px); } }

/* Нарастающее размытие у верхней кромки правой колонки (21.09.2026, ночь) – приём «progressive blur»,
   как у нижнего меню на sakib.design: несколько слоёв backdrop-filter с растущим радиусом, каждый
   проявляется маской всё выше – содержимое, уезжая вверх, размывается плавно, без границы.
   Что выяснилось при проверке и почему сделано именно так:
   – слои лежат в неподвижной .qd-wrap поверх панели, а не в прокручиваемой колонке: липкий элемент
     с размытием внутри прокрутки дёргался. И не внутри .qd-shell: у неё своё размытие фона, вложенный
     backdrop-filter видел бы только содержимое панели без сайта под ней – полоса выходила белее листа;
   – у обёртки слоёв нет overflow:hidden и скругления: такая обрезка делает её «корнем фона»,
     и размытие детей перестаёт видеть панель. Вместо обрезки полоса отступает на 26px от скруглённых
     углов панели – там только поля колонки, размывать нечего;
   – маски накопительные (прозрачно → чёрное до самого верха), слоёв три: 3, 8 и 16px. Полосовые маски
     из пяти слоёв давали резкий срез текста у нижней границы.
   Сверху слои отстоят на высоту кнопки закрытия (56 + 10px). Высота в покое равна верхнему полю колонки –
   под полосой пусто, заголовок резкий; при прокрутке app.js добавляет до 56px (--qd-tb).
   Белый «туман» по-прежнему даёт липкий градиент самой колонки. */
/* на телефоне прирост полосы вдвое меньше (до 28px): экран низкий, длинное размытие съедало бы кнопку */
.qd-wrap > .qd-topblur{ position:absolute; top:66px; right:26px; left:26px; height:calc(1.75rem + min(var(--qd-tb, 0px), 28px));
 z-index:6; pointer-events:none; }
@media (min-width:640px){ .qd-wrap > .qd-topblur{ height:calc(3rem + var(--qd-tb, 0px)); } }
@media (min-width:1024px){ .qd-wrap > .qd-topblur{ height:calc(3.5rem + var(--qd-tb, 0px)); left:var(--qd-leftw); } }   /* от края левой колонки */
.qd-topblur i{ position:absolute; inset:0; }
.qd-topblur i:nth-child(1){ -webkit-backdrop-filter:blur(3px); backdrop-filter:blur(3px);
 -webkit-mask-image:linear-gradient(to top, transparent 0%, #000 45%);
 mask-image:linear-gradient(to top, transparent 0%, #000 45%); }
.qd-topblur i:nth-child(2){ -webkit-backdrop-filter:blur(8px); backdrop-filter:blur(8px);
 -webkit-mask-image:linear-gradient(to top, transparent 30%, #000 75%);
 mask-image:linear-gradient(to top, transparent 30%, #000 75%); }
.qd-topblur i:nth-child(3){ -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
 -webkit-mask-image:linear-gradient(to top, transparent 60%, #000 100%);
 mask-image:linear-gradient(to top, transparent 60%, #000 100%); }

/* Панель wyceny уже 1024px: без размытия у верхней кромки (Грег, 21.09.2026: «верхнюю шапку закрепил бы при скролле,
   а блюр вообще бы убрал»). Там сверху стоит закреплённая шапка .qd-mhead, форма уезжает под её нижний край –
   ни слои нарастающего размытия (.qd-topblur лёг бы прямо на шапку), ни белый «туман» колонки формы не нужны.
   Правило стоит после объявления самих слоёв: у «тумана» та же специфичность, выше по файлу его отмена не срабатывала.
   От 1024px размытие остаётся – там шапки сверху нет, правая колонка уходит под кромку панели. */
@media (max-width:1023px){
  .qd-wrap > .qd-topblur{ display:none; }
  .qd .wy-v2 .qd-scroll > div > .grid > div:nth-child(2)::before{ display:none; }
}

/* Левая колонка – по содержимому, а не 5/12 панели (21.09.2026, ночь): правое поле равно левому (56px),
   освободившаяся ширина уходит форме. 468px = 56 + 356 + 56: самая широкая строка колонки –
   заголовок «Ekspresowa wycena» (352px при 42px, замер; 4px запаса – при ширине впритык строка переносилась). На узком десктопе, где 5/12 меньше, остаётся 5/12.
   Та же переменная двигает левый край полосы размытия над формой. */
.qd{ --qd-leftw:41.6667%; }
@media (min-width:1024px){
 .qd{ --qd-leftw:min(468px, 41.6667%); }
 .qd .qd-scroll > div > .grid{ grid-template-columns:var(--qd-leftw) minmax(0, 1fr); }
 .qd .qd-scroll > div > .grid > div{ grid-column:auto; }
}

/* =====================================================================================================
   Мобильный проход 21.09.2026. Замеры всех польских страниц на 320–1279px (выход за край, наложения,
   зоны нажатия, контраст) и снимки 390×664 / 768×1024 с эмуляцией тач-экрана. Здесь – то, что не
   привязано к одному месту файла; точечные правки того же прохода стоят по месту и помечены той же датой
   (.hp-next, .ua-term-v, высота панели wyceny и окна шага в dvh).
   ===================================================================================================== */

/* --- Плита институтов на главной (#slab-grid) ---
   Телефон: две равные колонки по 135px не вмещали «Apostille Ukraina» (155px при 22px) – название
   упиралось в край плиты, на 360–375px не входил и «Sąd Okręgowy». Левая колонка – короткие названия
   (MSZ, KRK / KRS), поэтому ей хватает 0.85 доли; кегль чуть сжимается только уже 410px.
   Названия в разметке теперь с обычным пробелом: на 320px они переносятся, а не режутся. */
@media (max-width:639px){
  .slab-grid{ grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr); }
  .slab-grid .slab-name{ font-size:clamp(19px, 5.4vw, 22px); }
  /* кнопка-ячейка центрирует содержимое по вертикали: при названии в две строки ярлыки соседей разъезжались */
  .slab-grid .slab-cell{ display:flex; flex-direction:column; justify-content:flex-start; }
}
/* уже 340px узкой левой колонке не хватает места под ярлык «Zaświadczenia» – колонки снова равные,
   длинные названия справа переносятся на вторую строку */
@media (max-width:339px){
  .slab-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
/* 768–1023px: Tailwind включал четыре колонки по ~170px при кегле 28px – «Sąd Okręgowy» наезжал
   на «KRK / KRS», «Apostille Ukraina» срезался краем экрана. До 1024px остаются две колонки. */
@media (min-width:768px) and (max-width:1023px){
  .slab-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
/* 1024–1149px: четыре колонки по 184px, самому длинному названию нужно 198px */
@media (min-width:1024px) and (max-width:1149px){
  .slab-grid .slab-name{ font-size:25px; }
}

/* Описание под плитой. На десктопе место зарезервировано под самый высокий текст – при смене колонки
   ничего не прыгает. Уже 1024px строки короткие, разница в высоте между «Sąd Okręgowy» и
   «Apostille Ukraina» доходила до 370px пустого чёрного поля (больше половины экрана телефона).
   Здесь высоту задаёт только открытый текст; остальные выведены из потока и гаснут поверх него, как раньше.
   Плавную смену высоты ведёт app.js (блок «Плита институтов»). */
@media (max-width:1023px){
  .slab-panels{ transition:height .42s cubic-bezier(.22,.7,.24,1); }
  .slab-panel:not(.is-open){ position:absolute; top:22px; left:1rem; right:1rem; }
}
@media (min-width:640px) and (max-width:1023px){
  .slab-panel:not(.is-open){ left:1.5rem; right:1.5rem; }
}
@media (prefers-reduced-motion:reduce){ .slab-panels{ transition:none; } }

/* --- Цена с единицей («550,- zł / dokument», «90,- zł / strona») ---
   Единица стояла голым текстом после цены и становилась третьим элементом flex-строки: в .faq-price
   цена зависала посередине между названием и «/ strona», в .slab-price «/ dokument» отрывался на новую
   строку, а на главной жирный nowrap-блок «90,- zł / strona = 1125 znaków ze spacjami» (324px) уходил
   за правый край экрана. Теперь цена и единица – одна обёртка: .fp-val в списках, .sp-val в плитах. */
/* .fp-main (цена + единица) не рвётся: на узком экране переносится название слева, а не «/ dokument»;
   пояснение .fp-note уходит под цену отдельной строкой */
/* название забирает свободное место и переносится первым (не уже своего самого длинного слова):
   значение остаётся в одну строку, пока помещается, – на десктопе строка выглядит как раньше */
.faq-price li > span:first-child{ flex:1 1 0%; }
.faq-price .fp-val{ flex:0 1 auto; text-align:right; color:inherit; }
.faq-price .fp-main{ display:inline-block; white-space:nowrap; color:inherit; }
.faq-price .fp-note{ display:inline-block; }
.slab-price > span.sp-val{ font:inherit; letter-spacing:normal; text-transform:none; color:inherit;
 white-space:nowrap; }
/* ua / ru / en пока на старой разметке (жирный nowrap-блок прямо в строке): на телефоне даём ему
   переноситься, иначе «= 1125 знаков с пробелами» срезается краем экрана. Сама цена внутри не рвётся. */
@media (max-width:639px){
  .faq-price li > b{ white-space:normal; text-align:right; min-width:0; }
}

/* --- Жёлтая плашка «Apostille na dokumenty z Ukrainy» на главной ---
   768–1023px: ряд «звезда | текст | кнопка» оставлял тексту 240px, цена рвалась посреди «550,- / zł».
   До 1024px блок идёт столбиком, как на телефоне. */
@media (min-width:768px) and (max-width:1023px){
  .ua-promo{ flex-direction:column; align-items:flex-start; gap:1.5rem; }
  .ua-promo > a{ margin-left:0; }
}

/* --- /cennik/: заголовок «Ile kosztuje…» 57px --- уже 390px строка «i Tłumaczenie» (в жирном
   начертании после смены – 328px) выходила за колонку, на 320px у страницы появлялась горизонтальная
   прокрутка. От 390px кегль прежний. */
@media (max-width:420px){
  .cn-v2 .h2-swap, .cn-faq .h2-swap, .cn-v2 .cn-group-h.h2-swap{ font-size:clamp(44px, 14.6vw, 57px); }
}
@media (max-width:359px){
  .cn-name, .cn-name small{ min-width:0; overflow-wrap:anywhere; }
}

/* --- Панель wyceny: кнопка закрытия встаёт поверх бургера, его две линии торчали из-под стрелки.
   Пока панель открыта, бургер не нужен – гасим линии (сама кнопка остаётся в разметке для фокуса). */
html.qd-open #burger > span{ opacity:0; }

/* --- Зоны нажатия на тач-экранах: вид не меняется, растёт только область, которая ловит палец ---
   день календаря 36 → 50×46 (ячейка 50×42, соседей не перекрывает по горизонтали), стрелки месяца
   34 → 44px, сегменты «Rano · Południe · Wieczór» 34 → 40px, ссылка-стрелка и язык в шапке +10px сверху и снизу. */
@media (pointer:coarse){
  .cal-day{ position:relative; }
  .cal-day::after{ content:''; position:absolute; inset:-5px -7px; }
  .cal-btn{ width:44px; height:44px; }
  .cal-nav{ gap:0; margin-right:-5px; }   /* значки стрелок остаются на прежнем месте: (44 − 34) / 2 */
  .k-where-link, .lang-switch, .logo-brand{ position:relative; }
  .k-where-link::after, .lang-switch::after, .logo-brand::after{ content:''; position:absolute; inset:-10px 0; }
}

/* =====================================================================================================
   Мобильная шапка (21.09.2026, по просьбе Грега): «в меню языки спрятать, в мобильной версии оставить
   только Zamów wycenę» + шапка прячется при прокрутке вниз.
   Режим тот же, что у бургера, – уже 1150px. В ряду остаются логотип, кнопка «Zamów wycenę» и бургер;
   переключатель языка из ряда убран, языки стоят первой строкой в панели меню (её собирает app.js из того
   же списка .lang-pop – разметку страниц трогать не пришлось, ua / ru / en работают так же).
   ===================================================================================================== */
@media (max-width:1149px){
  /* язык – в меню */
  .hdr-seg--lang .lang-wrap{ display:none; }
  .hdr-seg--lang{ flex:0 0 auto; padding-left:6px; }
  /* средняя часть ряда – пустой промежуток между логотипом и бургером. С 23.09.2026 кнопки «Zamów wycenę» в ряду
     нет (Грег: «в меню только бургер – нажав, человек увидит сразу всё»; одна кнопка без соседей читалась как
     звонок или обязательство). Всё действие – в открытом меню: форма, телефон, мессенджеры. Стили кнопки ниже
     оставлены на случай возврата: достаточно снова показать #nav-main (display:flex) */
  .hdr-seg--menu{ display:flex; flex:1 1 auto; min-width:0; justify-content:flex-end; padding-left:0; padding-right:0; }
  #nav-main{ display:none !important; margin:0; gap:0; min-width:0; }
  #nav-main .navlink:not(.navlink--plate){ display:none; }
  /* на десктопе это пункт меню с «вдавленной» плашкой по наведению; на телефоне наведения нет, а действие
     главное – поэтому вид главной кнопки сайта (.cta-btn--main): жёлтая заливка, 12px, Fira Sans 600 без капса.
     Компактнее обычной: 15px и высота 40px, без стрелки – в ряду 390px рядом с логотипом есть 144px */
  /* ссылка тянется на всю высоту ряда (72px) – палец попадает и чуть выше или ниже самой плашки 40px */
  header #nav-main .navlink--plate{ display:flex; align-items:center; align-self:stretch; min-width:0; font-size:15px; font-weight:600;
    line-height:1; letter-spacing:.005em; color:var(--c-ink); -webkit-tap-highlight-color:transparent; }
  header #nav-main .navlink--plate .nl-plate{ display:flex; align-items:center; justify-content:center; text-align:center;
    height:40px; padding:0 13px; border-radius:12px; background:var(--c-terra); color:var(--c-ink);
    transition:background-color .3s ease, color .3s ease; }
  header #nav-main .navlink--plate .nl-plate::before{ display:none; }
  /* над тёмной секцией шапка темнеет, кнопка остаётся жёлтой с чернильным текстом (схема .bg-ink) */
  header #nav-main .navlink--plate.on-dark{ color:var(--c-ink); }
  header #nav-main .navlink--plate:active .nl-plate{ background:var(--c-ink); color:var(--c-paper); }
  header #nav-main .navlink--plate.on-dark:active .nl-plate{ background:var(--c-paper); color:var(--c-ink); }
  header #nav-main .navlink--plate:focus-visible{ outline:none; }
  header #nav-main .navlink--plate:focus-visible .nl-plate{ outline:2px solid currentColor; outline-offset:2px; }
  /* пока открыта панель wyceny, кнопка «нажата» */
  html.qd-open header #nav-main .navlink--plate .nl-plate{ background:var(--c-ink); color:var(--c-paper); }
  /* меню открыто – кнопка в ряду шапки не нужна: та же «Zamów wycenę» стоит внизу панели (Грег, 21.09.2026).
     Гасим без display:none – место остаётся, крестик не сдвигается; из обхода клавиатурой кнопка тоже уходит */
  header #nav-main .navlink--plate{ transition:opacity .18s ease, visibility 0s linear 0s; }
  html.menu-open header #nav-main .navlink--plate{ opacity:0; visibility:hidden; pointer-events:none;
    transition:opacity .15s ease, visibility 0s linear .15s; }
}
@media (hover:hover) and (max-width:1149px){
  header #nav-main .navlink--plate:hover .nl-plate{ background:var(--c-ink); color:var(--c-paper); }
  header #nav-main .navlink--plate.on-dark:hover .nl-plate{ background:var(--c-paper); color:var(--c-ink); }
}
/* от 640px места в ряду достаточно – кнопка обычного размера группы .cta-btns */
@media (min-width:640px) and (max-width:1149px){
  header #nav-main .navlink--plate{ font-size:17px; }
  header #nav-main .navlink--plate .nl-plate{ height:46px; padding:0 20px; }
  .hdr-seg--lang{ padding-left:10px; }
}
/* узкие телефоны: подпись мельче, поля меньше; совсем длинная подпись (ru / ua) переносится в две строки */
@media (max-width:379px){
  header #nav-main .navlink--plate{ font-size:14px; }
  header #nav-main .navlink--plate .nl-plate{ padding:0 10px; }
}
@media (max-width:339px){
  header #nav-main .navlink--plate{ font-size:13px; }
  header #nav-main .navlink--plate .nl-plate{ padding:0 8px; }
  .hdr-seg--lang{ padding-left:2px; }
}
/* «Заказать оценку» / «Замовити оцінку» длиннее польской подписи: до 420px кегль 13px, уже 380px – в две строки */
@media (max-width:420px){
  html[lang="ru"] header #nav-main .navlink--plate, html[lang="uk"] header #nav-main .navlink--plate{ font-size:13px; }
  html[lang="ru"] header #nav-main .navlink--plate .nl-plate, html[lang="uk"] header #nav-main .navlink--plate .nl-plate{
    white-space:normal; line-height:1.08; padding:0 9px; }
}

/* Шапка в режиме бургера – «пилюля» по центру: логотип, название страницы и бургер, высота 50px
   (Грег, 23.09.2026, вариант 3 – «как строка Safari»; с 24.09.2026 пилюля всегда, полный ряд – только под меню
   и панель wyceny). --hp 0…1 и --ps (поле с боков в пилюле) ставит app.js, разворот – .34s. Стекло рисует .hdr-row::before,
   поэтому сужается вместе с рядом. */
@property --hp{ syntax:'<number>'; inherits:true; initial-value:0; }
@media (max-width:1149px){
  /* пилюля пропорциональна логотипу: логотип уменьшается в той же доле, что и высота ряда (72 → 50 = ×.694,
     на планшете 90 → 50 = ×.556); --shr – сколько он теряет при полном сворачивании */
  /* --hp:1 – пилюля с первого кадра, ещё до app.js (с 24.09.2026 пилюля – основной вид); место шапки в потоке –
     по пилюле (9px + 50px): развёрнутый под меню ряд ложится поверх страницы и не сдвигает её на 22–40px */
  #top{ --row-h:72px; --shr:.306; --logo-fs:30px; --hp:1; height:59px; }
  #top .hdr-seg--logo .logo-brand{ font-size:calc(var(--logo-fs) * (1 - var(--shr) * var(--hp, 0)));
    width:calc(var(--logo-w, auto) * (1 - var(--shr) * var(--hp, 0))); }
  #top .hdr-row{ height:calc(var(--row-h) - (var(--row-h) - 50px) * var(--hp, 0));
    margin-left:calc(var(--ps, 0px) * var(--hp, 0)) !important; margin-right:calc(var(--ps, 0px) * var(--hp, 0)) !important; }
  #top .hdr-seg--menu{ overflow:hidden; opacity:calc(1 - 2 * var(--hp, 0)); }
  /* у верха страницы пилюля крупнее (--pz ставит app.js по прокрутке: до .36 → 0 за 160px); растёт от верхнего
     края вниз, в поле над заголовком; под меню (--hp → 0) масштаб сходит к 1 */
  #top .hdr-row{ transform-origin:50% 0; transform:scale(calc(1 + var(--pz, 0) * var(--hp, 0))); }
  html.hdr-pill #top .hdr-seg--menu{ pointer-events:none; }
}
/* название страницы в пилюле: жирное, лёгкий серый; появляется вместе со сворачиванием – по буквам из знака «/»
   (Грег, 23.09.2026): сначала косая черта, за ней буквы по одной, при разворачивании – обратно в черту.
   Каждой букве app.js ставит --s (порог по --hp); видимость буквы --o = (hp − s) / .12 в пределах 0…1.
   Ширина подписи раскрывается в том же темпе, что и буквы */
.hdr-page{ display:none; }
@media (max-width:1149px){
  #top .hdr-page{ display:block; flex:0 0 auto; overflow:hidden; white-space:nowrap;
    width:calc(var(--lw, 0px) * clamp(0, (var(--hp, 0) - .1) / .87, 1));
    /* логотип защищён: подпись стоит от видимого края логотипа (сдвиг transform-ом --lx) на 10px, отступ
       набирается к шестой части сворачивания – раньше, чем появляется черта (.12); справа 10px воздуха до бургера */
    margin-left:calc((var(--lx) + 10px) * min(1, 6 * var(--hp, 0)));
    margin-right:calc(10px * var(--hp, 0));
    font-size:16px; font-weight:700; line-height:1; letter-spacing:-.035em; color:rgba(31,33,32,.45); }
  #top .hdr-row.on-dark .hdr-page{ color:rgba(255,255,255,.5); }
  /* раздел перед подстраницей прячется, когда пилюля не помещается (app.js, 30.09.2026) */
  #top .hdr-page.hp-short > .hp-par{ display:none; }
  #top .hdr-page > .hp-sub{ font-size:.9em; }   /* имя подстраницы на 2 кегля меньше раздела (Грег, 02.10.2026) */
  #top .hdr-page > span{ display:inline-block; white-space:pre;
    --o:clamp(0, (var(--hp, 0) - var(--s)) / .12, 1);
    opacity:var(--o); transform:translateX(calc((1 - var(--o)) * -6px)); }
  /* в пилюле поле слева от логотипа равно полю справа от бургера: сдвиг логотипа 18px (он для высокой шапки)
     уходит к --pill-x, его считает app.js (поле справа от линий бургера минус padding плашки логотипа) */
  #top{ --lx:calc(18px - (18px - var(--pill-x, 18px)) * var(--hp, 0)); }
  #top .hdr-seg--logo .logo-brand{ transform:translateX(var(--lx)) scale(var(--logo-scale, 1)); }
  /* пилюля мимо логотипа и бургера ведёт к началу страницы (обработчик – в app.js) */
  html.hdr-pill #top .hdr-row{ cursor:pointer; -webkit-tap-highlight-color:transparent; }
}
@media (min-width:768px) and (max-width:1149px){ #top{ --row-h:90px; --shr:.444; --logo-fs:40px; } }
@media (max-width:359px){ #top{ --logo-fs:24px; } }

/* Языки в панели меню: первая строка под рядом шапки, мелко, текущий – полужирный. Сверху и снизу – те же
   линии, что между пунктами: единая плашка читается как один список. Названия входят в одну строку от 340px
   (кегль 15px уже 400px), уже – коды PL · UA · RU · EN (решено 21.09.2026: на узком экране коды читаются лучше).
   Телефон (уже 560px), просьба Грега 21.09.2026: текущий язык – слева на оси логотипа, три остальных – группой
   у правого края с малым шагом. «Где я» и «куда перейти» читаются раздельно, цели перехода стоят рядом.
   Вперёд текущий ставит order: в разметке порядок прежний (PL · UA · RU · EN), его читает скринридер.
   Шаг в группе – поля --mn-lang-pad по обе стороны слова: зона нажатия остаётся по центру слова, а крайние слова
   встают точно на концы линий за счёт отрицательных полей.
   Высота строки ужимается на низком экране вместе с пунктами меню, чтобы кнопки остались на экране (iPhone SE). */
.mn-langs{ display:flex; flex-wrap:nowrap; align-items:center; justify-content:flex-start; gap:0; margin:0; padding:2px 0;
 border-top:1px solid rgba(31,33,32,.1); border-bottom:1px solid rgba(31,33,32,.1); }
.mn-lang{ display:inline-flex; align-items:center; justify-content:center; min-height:44px; font-size:16px; font-weight:400;
 line-height:1.1; white-space:nowrap;
 color:rgba(31,33,32,.72); text-decoration:none; -webkit-tap-highlight-color:transparent; transition:opacity .15s ease; }
.mn-lang.is-current{ font-weight:700; color:var(--c-ink); }
.mn-lang:active{ opacity:.5; }
.mn-lang:focus-visible{ outline:2px solid currentColor; outline-offset:2px; border-radius:6px; }
.mn-lang-code{ display:none; letter-spacing:.04em; }
@supports (height:100dvh){ .mn-lang{ min-height:clamp(34px, 6.2dvh, 44px); } }
@media (max-width:400px){ .mn-lang{ font-size:15px; } }
@media (max-width:559px){
  /* шаг между словами группы = два поля: 10px на 340px, 18px от 380px – пока названиям тесно, группа плотнее,
     иначе разрыв между текущим языком и группой выходит не больше шага внутри неё */
  .mn-langs{ --mn-lang-pad:clamp(5px, calc(5px + (100vw - 340px) * .1), 9px); }
  .mn-lang{ padding:0 var(--mn-lang-pad); }
  .mn-lang.is-current{ order:-1; margin-left:calc(-1 * var(--mn-lang-pad)); margin-right:auto; }
  /* последний на экране: последний в разметке, а на странице последнего языка (EN) – предпоследний */
  .mn-lang:last-child:not(.is-current),
  .mn-lang:nth-last-child(2):has(+ .mn-lang.is-current){ margin-right:calc(-1 * var(--mn-lang-pad)); }
}
@media (max-width:339px){
  .mn-lang-full{ display:none; }
  .mn-lang-code{ display:inline; }
  /* коды: шаг 22px ≈ ширина самого кода, зона нажатия 43–44px */
  .mn-langs{ --mn-lang-pad:11px; }
  .mn-lang{ font-size:16px; }
}
/* широкая плашка: названия не растягиваем на 700px – стоят слева с обычным шагом, порядок как в разметке */
@media (min-width:560px){ .mn-langs{ gap:0 30px; } }
/* iPhone SE (видимая высота ~548px): со строкой языков панель была на 17px выше окна – пункты чуть плотнее,
   нижнее поле меньше, и всё меню снова на экране без прокрутки */
@media (max-height:600px) and (max-width:559px){
  #mobile-nav{ --mn-pad:8px; }
  .mn-in{ padding-bottom:12px; }
  /* с кнопкой телефона (23.09.2026) мессенджеры снова уходили за край на 17px – кнопки меню ниже на 7px */
  #mobile-nav .mn-cta{ margin-top:10px; --cg:8px; }
  #mobile-nav .mn-cta .cta-btn{ padding-top:.6em; padding-bottom:.6em; }
}
header:has(.hdr-row.on-dark) #mobile-nav .mn-langs{ border-color:rgba(255,255,255,.14); }
header:has(.hdr-row.on-dark) #mobile-nav a.mn-lang:not(.is-current){ color:rgba(255,255,255,.72); }

/* /apostille-bez-przyjazdu/ – плашка «Twój sąd okręgowy» (22.09.2026): 12 городов, суд + адрес */
.gdz--light .gdz-full b{ color:var(--c-ink); font-weight:700; }
.so-text{ margin-top:1rem; font-size:17px; line-height:1.6; color:rgba(31,33,32,.75); max-width:62ch; }
.hero-lead b{ font-size:19px; font-weight:700; color:var(--c-ink); }
/* Врезка как на /kontakt/ («Składamy tylko w Warszawie.»): начало абзаца жирным ink, чуть крупнее */
.so-text b{ font-size:19px; font-weight:700; color:var(--c-ink); }
.so-list{ margin-top:1.6rem; display:grid; gap:0 2rem; align-items:start; }
/* Один столбец-стопка: в сетке раскрытый город растягивал строку у соседей (24.09.2026).
   На широком экране стопка встаёт справа от текста. */
@media (min-width:1024px){
  .so-plate{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:4rem; grid-template-rows:auto auto auto 1fr; align-items:start; }
  .so-plate > :not(.so-list, .so-crest, .so-more){ grid-column:1; }
  .so-plate > .so-list{ grid-column:2; grid-row:2 / span 3; margin-top:-8px; }
  .so-plate > .so-more{ grid-column:1; grid-row:4; margin-top:2rem; }   /* под текстом слева (Грег, 24.09.2026), стопка городов справа */
}
/* Знак судов как на /kontakt/ (ico-sad.svg): угол плашки; от 1024px – угол левой колонки, стопка справа */
.so-crest{ position:absolute; top:1.75rem; right:1.75rem; width:40px; height:auto; opacity:.85; pointer-events:none; }
@media (min-width:640px){ .so-crest{ width:50px; top:2.5rem; right:2.5rem; } }
@media (min-width:1024px){ .so-crest{ right:calc(50% + 2rem); } }
.so-plate > :is(.slab-kicker, .so-lead){ padding-right:62px; }
@media (min-width:640px){ .so-plate > :is(.slab-kicker, .so-lead){ padding-right:76px; } }

/* Подзаголовок плашки судов – не как заголовки сайта (не black + light italic): узкий обычный, спокойный;
   одним тоном. Значимость ниже h2 и ниже врезки «Podpis notariusza». */
.so-lead{ font-family:"Fira Sans Condensed",sans-serif; font-weight:700; font-size:22px; line-height:1.2; color:var(--c-ink); }
@media (min-width:640px){ .so-lead{ font-size:24px; } }

/* Варшава – наша территория: жирнее остальных уже в закрытом виде (открытая – 800, как все) */
.so-list .so-waw summary{ font-weight:600; }  /* .so-list – иначе перебивает общий 300 ниже */
.so-list .so-waw summary:hover, .so-list .so-waw details[open] > summary{ font-weight:800; }  /* Варшава: наведение и открытая – 800; остальные открытые – 600 */
/* Варшава в стопке: жёлтая точка после названия (как «текущая страница» в меню) */
.so-waw summary::after{ content:''; display:inline-block; width:10px; height:10px; margin-left:6px; border-radius:50%;
  background:var(--c-terra); vertical-align:middle; position:relative; top:-2px; }  /* центр строчных букв */
.so-addr2{ margin-top:.7rem; }

/* «Nie ma Twojego miasta?» под стопкой – врезка как «Podpis notariusza», ссылка-стрелка на заявку */
.so-more{ margin-top:1.4rem; font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); max-width:46ch; }
.so-more b{ color:var(--c-ink); font-weight:700; }
.so-more .k-where-link{ display:flex; width:fit-content; margin-top:.6rem; }

/* «Inne miasta» – последняя строка стопки (тот же срез, но курсив, чтобы читалась как «ещё», не как город);
   внутри – компактный алфавитный список: город жирным, суд + адрес, ссылка-стрелка. */
/* Вложенная стопка внутри «Miasta pozostałe» – тот же принцип (срез, 300 → 800 открытый), мельче: 28px, строка 27px.
   Свой name="so-sub" – открытие вложенного города не закрывает родителя. */
.so-sub{ margin:.2rem 0 1rem; }
.so-list .so-sub summary{ font-size:26px; height:25px; padding-top:5.5px; }
.so-list .so-sub details[open] > summary{ height:auto; }
.so-list.so-sub li + li::before{ width:min(100%, 250px); }  /* пропорционально 26px к 40px */

/* «miasta pozostałe» – на пару пунктов мельче городов (40px): читается как «ещё», не как город */
.so-list .so-other > details > summary{ font-size:32px; padding-top:14.4px; }
/* открытая – без жирного (слишком тянет на себя); шеврон вниз, при открытии – вверх */
.so-list .so-other > details[open] > summary{ font-weight:500; }  /* как при наведении */
.so-other > details > summary::after{ content:''; display:inline-block; width:7px; height:7px; margin-left:7px;
  border-right:1.25px solid currentColor; border-bottom:1.25px solid currentColor; transform:rotate(45deg);
  vertical-align:baseline; position:relative; top:-6px; transition:transform .25s ease; }  /* низ – у линии среза */
.so-other > details[open] > summary::after{ transform:rotate(-135deg); }  /* только разворот, место то же */
/* толщина шеврона следует начертанию: тонкий 300 – тонкая линия, 500 (наведение/открыт) – плотнее */
.so-other > details > summary:hover::after, .so-other > details[open] > summary::after{ border-width:0 2px 2px 0; }  /* базовая линия там же, где у 40px – срез на том же уровне */

/* Зацеп в жёлтой плашке: города плашками-ссылками (24.09.2026) */
.so-chips-lbl{ margin-top:1.6rem; font-size:17px; font-weight:600; }
.so-list details{ scroll-margin-top:120px; }
/* Разделители короткие и только между городами: над первым нет, как нет под последним */
.so-list li + li{ position:relative; }
.so-list li + li::before{ content:''; position:absolute; left:0; top:0; width:min(100%, 380px); border-top:1px solid rgba(31,33,32,.12); }
/* Изюминка (24.09.2026): закрытая строка срезает низ названия, как корешки в стопке / вырубка справочника;
   клик открывает целиком + суд и адрес. details name="so" – открыт только один. */
.so-list summary{ list-style:none; cursor:pointer; height:37.7px; overflow:hidden; padding-top:8px;
  font-family:"Fira Sans Condensed",sans-serif; font-weight:300; font-size:40px; line-height:1; letter-spacing:-.02em; color:var(--c-ink); }
.so-list summary:hover{ font-weight:500; }
.so-list summary::-webkit-details-marker{ display:none; }
.so-list details[open] > summary{ height:auto; padding-bottom:6px; font-weight:600; }  /* > – иначе открытый родитель раскрывал и вложенные */
/* Карточка суда (24.09.2026): без подписей-капса, роль строки видна по начертанию.
   Суд – узкий полужирный; адрес – обычный, место в здании курсивом; часы – обычный приглушённый. */
.so-card{ padding:.3rem 0 1.3rem; }
.so-court{ font-family:"Fira Sans Condensed",sans-serif; font-weight:600; font-size:21px; line-height:1.2; }
.so-addr{ margin-top:.2rem; font-size:17px; line-height:1.45; }
.so-addr i{ font-weight:400; color:rgba(31,33,32,.75); }
.so-hours{ margin-top:.5rem; font-size:17px; line-height:1.5; color:var(--c-ink); }
/* Часы как на /kontakt/ (.gdz-hr): дни с точками в колонке, время отдельной строкой на группу */
.so-hr{ display:grid; grid-template-columns:6.5ch 1fr; align-items:baseline; }
.so-hr b{ font-weight:600; color:var(--c-ink); font-variant-numeric:tabular-nums; }
.so-go{ margin-top:.8rem; font-size:15.5px; font-weight:600; }
.so-go a{ color:inherit; }
/* Жёлтая плашка: крупный узкий светлый + обычный – не повтор заголовков (жирный + курсив) */
.so-hero{ font-family:"Fira Sans Condensed",sans-serif; font-weight:300; font-size:30px; line-height:1.1; letter-spacing:-.01em; max-width:24ch; }
.so-hero span{ display:block; font-weight:700; font-size:56px; line-height:.95; letter-spacing:-.02em; }  /* 25.09.2026, Грег: без капса – «Każde miasto» как написано */
@media (min-width:640px){ .so-hero{ font-size:36px; } .so-hero span{ font-size:80px; } }

/* Текущая страница в меню (Грег, 23.09.2026): название сдвинуто, перед ним пульсирующая жёлтая точка
   (сначала была стрелка справа – заменена на точку) */
.mn-link.is-here{ display:flex; align-items:center; gap:12px; padding-left:4px; }
.mn-link.is-here::before{ content:''; flex:0 0 auto; width:9px; height:9px; border-radius:50%;
  background:var(--c-terra); animation:mnHerePulse 2.8s ease-in-out infinite; }
@keyframes mnHerePulse{
  0%, 100% { transform:scale(1); opacity:1 }
  50%      { transform:scale(1.4); opacity:.7 }
}
@media (prefers-reduced-motion:reduce){ .mn-link.is-here::before{ animation:none } }

/* ===== Сравнение «Jedziesz sam / Zlecasz Apostilo» (/apostille-bez-przyjazdu/#koszt, 24.09.2026) =====
   Уже 1024px – переключатель (одна сторона видна); от 1024px – две поверхности как у Altium:
   песок «было» + белая приподнятая карточка «стало», на стыке жёлтый круг с фирменным шевроном. */
.cmp{ background:var(--c-sand); border-radius:26px; padding:1.25rem 1rem; position:relative; }
.cmp-h{ font-size:22px; font-weight:700; letter-spacing:-.03em; line-height:1; }
.cmp-lead{ margin-top:.6rem; font-size:17px; line-height:1.5; color:rgba(31,33,32,.75); max-width:44ch; }
.cmp-rows{ margin-top:1.2rem; }
.cmp-rows > div{ display:grid; grid-template-columns:6.5rem 1fr; gap:.8rem; padding:.8rem 0; border-top:1px solid rgba(31,33,32,.12); }
.cmp-rows dt{ font-family:"Fira Sans Condensed",sans-serif; text-transform:uppercase; letter-spacing:.14em; font-size:11px; font-weight:600; color:rgba(31,33,32,.55); padding-top:.4em; }
.cmp-rows dd{ font-size:17px; line-height:1.4; color:var(--c-ink); }
.cmp-rows b{ font-weight:700; }
.cmp-arrow{ display:none; }
.cmp-note{ margin-top:1rem; padding:0 .25rem; }
.cmp-note p{ font-size:16px; line-height:1.6; color:rgba(31,33,32,.7); max-width:78ch; }
.cmp-note p b{ color:var(--c-ink); font-weight:700; }

/* Уже 1024px (вариант 3 со стенда docs/stack/compare-m.html, 24.09.2026): песочная «было» во всю ширину,
   справа из-за края выглядывает белая «стало», на стыке фирменный круг. Тап по кругу/краю или свайп –
   белая наезжает, круг уходит влево и разворачивается. Обе стороны в одной ячейке сетки – высота по большей.
   Без JS (.is-js нет) – стороны просто друг под другом. */
.cmp-tog, .cmp-seg{ display:none; }
@media (max-width:1023.98px){
  .cmp{ background:none; padding:0; }
  .cmp-side{ border-radius:26px; padding:1.4rem 1.1rem; }
  .cmp-old{ background:var(--c-sand); }
  .cmp-new{ background:#fff; margin-top:1rem; box-shadow:0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(0,0,0,.07); }
  /* Телефон и планшет (Грег, 24.09.2026: «мобильный вариант этот самый классный»): одна песочная плашка,
     сверху переключатель-сегмент «Jadę sam / Zlecam» (белая «таблетка» у выбранного), под ним одна сторона.
     Обе стороны в одной ячейке сетки, скрытая – visibility:hidden: высота плашки по большей, при переключении не прыгает. */
  .cmp.is-js{ display:grid; background:var(--c-sand); border-radius:26px; padding:.75rem 1rem 1.5rem; }
  .cmp.is-js .cmp-seg{ grid-area:1 / 1; display:grid; }
  .cmp.is-js .cmp-side{ grid-area:2 / 1; background:none; box-shadow:none; margin:0; border-radius:0; padding:1.1rem .25rem 0; }
  .cmp.is-js[data-s="old"] .cmp-new, .cmp.is-js[data-s="new"] .cmp-old{ visibility:hidden; }
  .cmp.is-js[data-s="old"] .cmp-old, .cmp.is-js[data-s="new"] .cmp-new{ animation:cmpFade .3s ease; }
  .cmp.is-js .cmp-arrow{ display:none; }
  .cmp.is-js .cmp-rows > div:first-child{ border-top-color:rgba(31,33,32,.12); }
  .cmp-seg{ grid-template-columns:1fr 1fr; gap:4px; padding:5px; border-radius:20px; background:rgba(31,33,32,.07); }
  .cmp-seg button{ font:600 17px/1 "Fira Sans",sans-serif; padding:.9rem .5rem; border:0; border-radius:15px; background:none;
    color:rgba(31,33,32,.5); cursor:pointer; transition:background-color .2s, color .2s, box-shadow .2s; }
  .cmp-seg button[aria-selected="true"]{ background:#fff; color:var(--c-ink); box-shadow:0 1px 2px rgba(0,0,0,.06), 0 4px 12px rgba(0,0,0,.07); }
}
@keyframes cmpFade{ from{ opacity:0; } to{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .cmp-new, .cmp-arrow, .cmp-arrow svg{ transition:none !important; } }

@media (min-width:1024px){
  .cmp{ display:grid; grid-template-columns:1fr 1fr; padding:12px; }
  .cmp-side{ padding:2.75rem 3rem; }
  .cmp-new{ background:#fff; border-radius:20px; box-shadow:0 1px 2px rgba(0,0,0,.04), 0 10px 28px rgba(0,0,0,.06); }
  .cmp-h{ font-size:28px; }
  .cmp-arrow{ display:grid; place-items:center; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
    width:48px; height:48px; border-radius:50%; background:var(--c-terra); color:var(--c-ink); z-index:2; }
  .cmp-arrow svg{ width:16px; height:16px; }
}

/* Подзаголовки групп (PL /cennik/, 24.09.2026) – по правилам плашки судов: узкий 700, одним тоном,
   22/24px; не повторяют заголовки сайта (black + light italic). Класс .sub-h – только в PL-разметке. */
.cn-v2 .cn-group-h.sub-h{ font-family:"Fira Sans Condensed",sans-serif; font-weight:700; font-size:22px; line-height:1.2; letter-spacing:0; color:var(--c-ink); }
@media (min-width:640px){ .cn-v2 .cn-group-h.sub-h{ font-size:24px; } }

/* Шеврон в круге сравнения пульсирует по принципу стрелки «наверх» (toTopNudge): 2.8s, сдвиг 5px + scale 1.14
   в сторону, куда ведёт; на «new» развёрнут – rotate(180deg) до сдвига, поэтому пульс уходит влево. Пауза при наведении. */
.cmp-arrow svg{ animation:cmpNudge 2.8s ease-in-out infinite; }
@keyframes cmpNudge{
  0%, 100% { transform:scale(1); }
  50%      { transform:scale(1.2); }   /* пульс на месте, без сдвига */
}
/* отдельные keyframes для «влево»: var() внутри @keyframes Safari обновляет ненадёжно */
@keyframes cmpNudgeL{
  0%, 100% { transform:rotate(180deg) scale(1); }
  50%      { transform:rotate(180deg) scale(1.2); }
}
.cmp-arrow:hover svg{ animation-play-state:paused; }
@media (prefers-reduced-motion:reduce){ .cmp-arrow svg{ animation:none !important; } }

/* /apostille-bez-przyjazdu/ #czas (24.09.2026): маршрут paczkomat → MSZ → paczkomat, светлая плашка */
.route-legs{ margin:0; padding:0; list-style:none; display:grid; gap:1.4rem; }
.route-legs li{ display:flex; flex-direction:column; gap:.3rem; }
.route-k{ font-family:"Fira Sans Condensed",sans-serif; text-transform:uppercase; letter-spacing:.14em; font-size:12px; font-weight:600; color:rgba(31,33,32,.6); }
.route-n{ font-weight:900; font-size:40px; line-height:1; letter-spacing:-.03em; color:var(--c-ink); }
.route-t{ font-size:17px; line-height:1.5; color:rgba(31,33,32,.75); }
.route-sum{ margin-top:1.6rem; padding-top:1.4rem; border-top:1px solid rgba(31,33,32,.15); font-size:17px; line-height:1.55; color:rgba(31,33,32,.75); max-width:62ch; }
.route-sum b{ color:var(--c-ink); font-weight:700; }
.route-far{ margin-top:2rem; font-size:26px; line-height:1.2; font-weight:300; font-style:italic; color:var(--c-ink); max-width:30ch; }
.route-far span{ font-weight:900; font-style:normal; }
@media (min-width:768px){
  .route-legs{ grid-template-columns:repeat(3,1fr); gap:2rem; }
  .route-legs li + li{ border-left:1px solid rgba(31,33,32,.15); padding-left:2rem; }
  .route-far{ font-size:32px; }
}

/* #czas – маршрут (Грег, 25.09.2026: идея 7 со стенда docs/typografia/, «встроить в сайт»). Схема пешего маршрута
   по Вене (Fonts inspirations/136951.png): остановки узким Fira Sans Condensed 300 по центру, нитка 1px видна только
   между ними и уходит за край карточки; две колонки – туда и обратно, вторая кончается там, где началась первая;
   одна жёлтая точка – у MSZ; подписи повёрнуты и читаются снизу вверх. Телефон: одна колонка, вся петля сверху вниз.
   Список .route-legs остаётся для экранных чтецов (визуально скрыт), схема .rt-map – aria-hidden.
   Мышь (app.js): наведение на отрезок раскрывает его – остановки плавно переходят из узкого начертания в обычную
   ширину Fira Sans (два слоя .rt-c/.rt-w, в каждом кадре одной ширины), нитка отрезка прорисовывается 2px по ходу
   маршрута, «1 dzień» разрежается, остальное уходит в тень, под линейкой вместо итога – текст отрезка.
   Появление: нитка один раз прорисовывается сверху вниз, как пройденный путь, остановки по пути на миг раскрываются
   (эффект показывает себя сам, и на телефоне); жёлтая точка – когда путь дошёл до MSZ. */
.route--map{ --rt-pad:1.75rem; position:relative; padding-top:var(--rt-pad); }   /* sm:p-10 в сборке нет – везде 28px */
.route--map > .route-legs{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }
.rt-map{ --rt-fs:26px; --rt-gap:70px; --rt-stub:26px; --rt-m:10px; --rt-line:rgba(31,33,32,.85); --rt-ease:cubic-bezier(.2,.7,.1,1);
  display:grid; grid-template-columns:auto minmax(0,1fr); column-gap:10px; margin-top:calc(-1 * var(--rt-pad));
  color:var(--c-ink); cursor:default; }
@media (min-width:640px){ .rt-map{ --rt-fs:30px; --rt-gap:74px; } }
@media (min-width:768px){ .rt-map{ --rt-fs:32px; --rt-gap:80px; --rt-stub:34px;
  grid-template-columns:auto minmax(0,1fr) auto minmax(0,1fr) auto; column-gap:clamp(12px, 2.4vw, 40px); } }
@media (min-width:1024px){ .rt-map{ --rt-fs:40px; --rt-gap:84px; --rt-stub:36px; --rt-m:12px; } }
/* строки колонки – во всю её ширину: наведение ловится по всей строке, а не только по слову */
.rt-col{ display:flex; flex-direction:column; align-items:stretch; min-width:0; }
.rt-st{ display:block; margin:0; text-align:center; white-space:nowrap; font-family:"Fira Sans Condensed","Fira Sans",sans-serif;
  font-weight:300; font-size:var(--rt-fs); line-height:1; letter-spacing:-.02em; }
.rt-st--key{ font-weight:600; }
.rt-dot{ display:inline-block; position:relative; top:-.04em; width:.25em; height:.25em; margin-right:.28em; border-radius:50%;
  background:var(--c-terra); vertical-align:middle; }
/* нитка: отрезки только в промежутках – имена её прерывают; концы уходят за край: сверху – до края карточки,
   снизу – до линейки итога */
.rt-gap{ display:flex; flex-direction:column; align-items:center; flex:none; height:var(--rt-gap); }
.rt-ln{ display:block; position:relative; width:1px; min-height:0; background:var(--rt-line); transform-origin:50% 0; }
.rt-gap > .rt-ln{ flex:1 1 auto; margin:var(--rt-m) 0; }
.rt-ln--top, .rt-ln--bot{ flex:none; align-self:center; }
.rt-ln--top{ height:calc(var(--rt-pad) + var(--rt-stub)); margin-bottom:var(--rt-m); }
.rt-ln--bot{ height:var(--rt-stub); margin-top:var(--rt-m); }
.rt-dur{ display:block; margin:calc(7px - var(--rt-m)) 0; padding-left:.18em; white-space:nowrap;
  font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-size:12px; font-weight:600; line-height:1;
  letter-spacing:.18em; text-transform:uppercase; }
/* повёрнутые подписи – снизу вверх */
.rt-rot{ margin:0; align-self:center; justify-self:center; writing-mode:vertical-rl; transform:rotate(180deg); white-space:nowrap;
  font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-size:18px; font-weight:400; line-height:1; }
.rt-rot--key{ font-weight:600; }
.rt-rot .rt-dot{ top:0; width:8px; height:8px; margin-right:0; margin-inline-end:.4em; }
@media (min-width:768px){ .rt-rot{ font-size:20px; } }
/* телефон: одна колонка – вся петля сверху вниз; главная подпись повёрнута слева, две другие убраны */
@media (max-width:767px){
  .rt-map > .rt-rot--key{ grid-column:1; grid-row:1 / span 2; }
  .rt-map > .rt-col{ grid-column:2; }
  .rt-map > .rt-col--a{ grid-row:1; }
  .rt-map > .rt-col--b{ grid-row:2; }
  .rt-map > .rt-rot--a, .rt-map > .rt-rot--b{ display:none; }
  .rt-col--b > .rt-ln--top{ height:calc(var(--rt-gap) - var(--rt-stub) - 2 * var(--rt-m)); }
}
/* низ нитки упирается в линейку итога – край «кадра»; линейка во всю ширину карточки, текст – в прежней мере.
   Итог и подписи отрезков лежат в одной клетке сетки: высота – по самому длинному, при смене ничего не прыгает */
.route-foot{ display:grid; border-top:1px solid rgba(31,33,32,.15); padding-top:1.4rem; }
.route-foot > *{ grid-area:1 / 1; }
.route-foot > .route-sum{ margin-top:0; padding-top:0; border-top:0; }
.rt-cap{ margin:0; max-width:62ch; font-size:17px; line-height:1.55; color:var(--c-ink); opacity:0; translate:0 6px; pointer-events:none; }
.rt-cap b{ font-weight:700; }

/* ---- наведение (классы ставит app.js; только мышь) ---- */
.rt-map [data-leg], .route-foot > *{ transition:opacity .3s ease, translate .3s ease; }
.rt-map.is-live [data-leg]:not(.is-on){ opacity:.2; }
/* Ширина: узкий слой растягивается и гаснет, обычный приходит из сжатого – в каждом кадре оба одной ширины.
   Обычный слой ещё и разрежен (+.02em против −.02em): одна смена гарнитуры даёт только +11 %, так – около +22 %.
   Наплыв без провала в серый: приходящий слой проявляется поверх ещё плотного уходящего, уходящий гаснет уже под ним
   (задержки – у того, кто уходит; переход берётся из состояния, в которое идём).
   is-on – наведение, is-pass – остановка, мимо которой при появлении проходит нитка (раскрывается на 0,4 с);
   is-tight – обычная ширина не влезает в колонку (iPhone 320), слово остаётся узким. */
.rt-x{ position:relative; display:inline-block; }
.rt-c{ display:inline-block; transition:transform .55s var(--rt-ease), opacity .12s linear; }
.rt-w{ position:absolute; left:50%; top:0; font-family:"Fira Sans",sans-serif; letter-spacing:.02em; white-space:nowrap; opacity:0;
  transform:translateX(-50%) scaleX(var(--rt-k, .82)); transition:transform .55s var(--rt-ease), opacity .14s linear .1s;
  pointer-events:none; -webkit-user-select:none; user-select:none; }
.rt-st:is(.is-on, .is-pass):not(.is-tight) .rt-c{ transform:scaleX(var(--rt-r, 1.22)); opacity:0;
  transition:transform .55s var(--rt-ease), opacity .12s linear .1s; }
.rt-st:is(.is-on, .is-pass):not(.is-tight) .rt-w{ transform:translateX(-50%) scaleX(1); opacity:1;
  transition:transform .55s var(--rt-ease), opacity .14s linear; }
.rt-dot{ transition:translate .55s var(--rt-ease); }
.rt-st:is(.is-on, .is-pass):not(.is-tight) .rt-dot{ translate:calc(-1 * var(--rt-dx, .5em)) 0; }   /* точка отходит с левым краем слова */
/* нитка отрезка – 2px по ходу маршрута (--o – порядок кусочка в отрезке, ставит app.js) */
.rt-ln::after{ content:""; position:absolute; left:0; top:0; bottom:0; width:2px; background:var(--c-ink);
  transform:scaleY(0); transform-origin:50% 0; transition:transform .2s ease; }
.rt-gap.is-on > .rt-ln::after, .rt-ln.is-on::after{ transform:scaleY(1);
  transition:transform .34s cubic-bezier(.3,.6,.2,1) calc(var(--o, 0) * 90ms); }
.rt-dur{ transition:letter-spacing .5s var(--rt-ease), padding-left .5s var(--rt-ease); }
.rt-gap.is-on > .rt-dur{ letter-spacing:.34em; padding-left:.34em; }
.route-foot.is-leg > .route-sum{ opacity:0; translate:0 -6px; }
.route-foot > .rt-cap.is-on{ opacity:1; translate:0 0; }

/* ---- появление: нитка прорисовывается один раз сверху вниз (--i – порядок кусочка по всему маршруту) ---- */
.rt-map.rt-pre .rt-ln{ scale:1 0; }
.rt-map.rt-pre .rt-dot{ scale:0; }
.rt-map.rt-go .rt-ln{ scale:1 1; transition:scale .42s cubic-bezier(.3,.6,.2,1) calc(var(--i, 0) * 80ms); }
.rt-map.rt-go .rt-dot{ scale:1; transition:translate .55s var(--rt-ease), scale .5s cubic-bezier(.3,1.6,.5,1) .62s; }
@media print{ .rt-map.rt-pre .rt-ln, .rt-map.rt-pre .rt-dot{ scale:none; } }
@media (prefers-reduced-motion:reduce){
  .rt-map *, .rt-map *::after, .route-foot > *{ transition-duration:.01s !important; transition-delay:0s !important; }
}

/* #koszt: подзаголовок-вопрос над карточками сравнения; карточки идут с mt-9/md:mt-12 */
.cmp-ask{ margin-top:2.4rem; font-size:24px; line-height:1.2; font-weight:900; letter-spacing:-.02em; color:var(--c-ink); max-width:34ch; }
.cmp-ask span{ font-weight:300; font-style:italic; }
.cmp-ask + .cmp{ margin-top:1.4rem; }
@media (min-width:768px){ .cmp-ask{ font-size:30px; } .cmp-ask + .cmp{ margin-top:1.8rem; } }

/* Жёлтая плашка /kontakt/ #odbior (24.09.2026): аккордеон способов на основе .so-list; заголовок строки – h4 без своего стиля */
.ob-acc{ margin-top:0; }
.ob-acc summary h4{ font:inherit; margin:0; display:inline; }
.ob-acc li + li::before{ width:100%; border-top-color:rgba(31,33,32,.2); }
.ob-acc .so-card{ max-width:52ch; }
.ob-t{ margin-top:.5rem; font-size:17px; line-height:1.55; }
/* 24.09.2026, Грег: на плашке /kontakt/ без среза и скромнее – строка целиком, 28px, шеврон справа */
.so-list.ob-acc summary{ height:auto; overflow:visible; padding:14px 0 12px; font-size:28px; line-height:1.1; font-weight:400;
  display:flex; align-items:center; justify-content:space-between; gap:1rem; }
.so-list.ob-acc summary:hover{ font-weight:500; }
.so-list.ob-acc details[open] > summary{ padding-bottom:8px; font-weight:600; }
.ob-acc summary::after{ content:''; flex:none; width:8px; height:8px; margin-right:4px; border:solid currentColor; border-width:0 2px 2px 0;
  transform:translateY(-3px) rotate(45deg); transition:transform .2s ease; }
.ob-acc details[open] > summary::after{ transform:translateY(2px) rotate(-135deg); }
@media (max-width:639px){ .so-list.ob-acc summary{ font-size:24px; } }
.ob-acc summary h4 b{ font-weight:700; }
.so-list.ob-acc details[open] > summary{ font-weight:400; }

/* Плита судов #twoj-sad (Грег, 24.09.2026): линия под городом по длине названия + 44px, а не общей ширины.
   Линия – нижняя граница самой строки (details шириной по содержимому), у последней в списке линии нет.
   Открытый город – линия под карточкой, по её ширине. /kontakt/ #odbior (.ob-acc) не задевает. */
.so-plate .so-list li + li::before{ content:none; }
.so-plate .so-list li > details{ width:fit-content; max-width:100%; padding-right:44px; box-shadow:inset 0 -1px 0 rgba(31,33,32,.12); }
.so-plate .so-list > li:last-child > details{ box-shadow:none; }
/* #twoj-sad: «drugi – my w Warszawie» с новой строки (Грег, 24.09.2026) */
.so-plate .so-lead span{ display:block; }
/* #twoj-sad: «Miasta pozostałe» целиком, без среза букв (Грег, 24.09.2026); города – по-прежнему со срезом */
.so-plate .so-list .so-other > details > summary{ height:auto; overflow:visible; padding-bottom:6px; }
.ob-acc summary h4 .font-light{ font-weight:400; }  /* Грег 24.09.2026: вторая часть строки не такая тонкая */
.ob-lead p + p{ margin-top:.6rem; }
.ob-lead p + p{ margin-top:1rem; }
.ob-note{ margin-top:.5rem; font-size:17px; line-height:1.55; max-width:42ch; }  /* 25.09.2026: в левой колонке под ответами, без линии – ширина как у .ob-lead (было: под списком способов, линия 1px) */
.so-list.ob-acc{ margin-top:.75rem; }  /* отступ от «Wybierz wygodną drogę»: вместе с полем строки 14px ≈ отступу заголовка слева (1.5rem) */
/* FAQ (24.09.2026, Грег): шеврон вместо «+», как в аккордеоне способов на /kontakt/. Только в summary –
   крестики закрытия (.chev--x, .tl-close) остаются. Знак «+» в разметке скрыт размером шрифта. */
details > summary .chev:not(.chev--x){ font-size:0; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; transform:none; }
details > summary .chev:not(.chev--x)::before{ content:''; width:10px; height:10px; border:solid currentColor; border-width:0 2.5px 2.5px 0;
  transform:translateY(-3px) rotate(45deg); transition:transform .25s ease; }
details[open] > summary .chev:not(.chev--x){ transform:none; }
details[open] > summary .chev:not(.chev--x)::before{ transform:translateY(3px) rotate(-135deg); }
/* Кнопки в жёлтой плашке /kontakt/ #odbior (24.09.2026): серая подложка, главная «Wycena ze zdjęć» охрой,
   под ней белый ряд из трёх ячеек – иконка серым над подписью */
.ob-cta{ display:grid; gap:8px; padding:8px; background:#E5E5E1; border-radius:22px; max-width:420px; }
.ob-cta .cta-btn--main{ width:100%; background:var(--c-terra); color:var(--c-ink); }
.ob-seg{ display:grid; grid-template-columns:repeat(3,1fr); background:var(--c-paper); border-radius:16px; overflow:hidden; }
.ob-seg a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; padding:14px 6px 12px;
  text-decoration:none; color:var(--c-ink); font-weight:700; font-size:17px; line-height:1.1; transition:background .2s ease; }
.ob-seg a + a{ border-left:1px solid rgba(31,33,32,.14); }
.ob-seg svg{ width:28px; height:28px; color:#6b6d6a; }
.ob-seg a:hover, .ob-seg a:focus-visible{ background:#F1F1EF; }
/* 24.09.2026, Грег: ряд ниже и без иконок – только подписи */
.ob-seg svg{ display:none; }
.ob-seg a{ padding:13px 6px; gap:0; }
/* 24.09.2026, по образцу Грега: подпись «Skontaktuj się z nami», главная кнопка белая, как ячейки ряда */
.ob-cta{ padding:10px; border-radius:24px; gap:10px; }
.ob-cta-h{ padding:10px 14px 2px; font-size:17px; line-height:1.3; color:var(--c-ink); }
.ob-cta .ob-cta-main{ width:100%; background:var(--c-paper); color:var(--c-ink); border-radius:16px; padding-top:18px; padding-bottom:18px; }
.ob-cta .ob-cta-main:hover, .ob-cta .ob-cta-main:focus-visible{ background:var(--c-ink); color:var(--c-paper); }
.ob-seg a{ padding:16px 4px; }
/* 24.09.2026, Грег: кнопки прижаты к низу плашки, ниже на 24% (56 → 43px) */
.ob-cta{ margin-top:auto; }
.ob-cta .ob-cta-main{ padding-top:11px; padding-bottom:11px; }
.ob-seg a{ padding-top:11px; padding-bottom:11px; }
/* Кнопки жёлтой плашки /kontakt/ на компьютере (24.09.2026): полоса по низу под линией – подпись слева, три кнопки
   справа, без кнопки формы. Уже 1024px пока прежний блок .ob-cta в колонке. */
.ob-strip{ display:none; }
@media (min-width:1024px){
  .ob-cta{ display:none; }
  .ob-strip{ display:flex; align-items:center; justify-content:space-between; gap:12px 24px;
    margin-top:2.4rem; padding-top:1.6rem; border-top:1px solid rgba(31,33,32,.25); }
  .ob-strip-h{ font-size:19px; font-weight:700; line-height:1.3; }
  .ob-strip .cta-btns{ margin:0; }
}
.so-list.ob-acc{ margin-top:1.5rem; }  /* Грег 24.09.2026: отступ от «Wybierz wygodną drogę» больше */
@media (min-width:1024px){ .ob-strip{ flex-wrap:wrap; } .ob-strip .cta-btns{ flex-wrap:nowrap; } }
/* 24.09.2026, Грег: кнопки полосы кончаются там же, где текст «Wysyłasz oryginał?» (52ch при 17px).
   Полоса повторяет сетку плашки: подпись – в левой колонке, кнопки – в правой, в пределах ширины текста. */
@media (min-width:1024px){
  .ob-strip{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:2rem; row-gap:12px; }
  .ob-strip-h{ grid-column:1 / 6; }
  .ob-strip .cta-btns{ grid-column:6 / 13; font-size:17px; width:100%; max-width:52ch; justify-content:flex-end; flex-wrap:wrap; }
}
.so-list.ob-acc{ font-size:17px; max-width:52ch; }  /* Грег 24.09.2026: шевроны и линии кончаются там же, где текст «Wysyłasz oryginał?», справа воздух */
/* /kontakt/ #odbior: «Zamów wycenę» справа вверху секции – только от 1024px */
.ob-quote{ display:none; }
/* Правый край – как у кнопок полосы внизу плашки: та же сетка 12 колонок, поля плашки 3rem, правая колонка до 52ch */
@media (min-width:1024px){
  .ob-quote{ display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); column-gap:2rem; padding:0 3rem; margin-top:-3rem; }
  .ob-quote-in{ grid-column:6 / 13; width:100%; max-width:52ch; font-size:17px; justify-content:flex-end; }
}
/* Линия над полосой кнопок кончается там же, где кнопки (Грег, 24.09.2026): линия нарисована у двух ячеек,
   у подписи она заходит в межколоночный зазор, чтобы не рваться */
@media (min-width:1024px){
  .ob-strip{ border-top:0; padding-top:0; align-items:stretch; }
  .ob-strip-h, .ob-strip .cta-btns{ border-top:1px solid rgba(31,33,32,.25); padding-top:1.6rem; }
  .ob-strip-h{ display:flex; align-items:center; margin-right:-2rem; padding-right:2rem; }
}
/* Грег 24.09.2026: строки аккордеона спорили с заголовками плашки (26/34px) – теперь явно ниже: 20px на телефоне, 24px от 640px */
.so-list.ob-acc summary{ font-size:20px; padding-top:12px; padding-bottom:10px; }
@media (min-width:640px){ .so-list.ob-acc summary{ font-size:24px; } }
@media (min-width:1024px){ .ob-strip-h{ font-size:17px; } }  /* Грег 24.09.2026: как жирные подводки «Przy tłumaczeniu… / Przy Apostille…» – 17px, 700 */

/* ===== Единая сетка плашек /kontakt/ (Грег, 24.09.2026: «желтая плашка не совпадает с серединой судов и MSZ»).
   Эталон – плашка MSZ/Sądy (.gdz--duo): поле 3rem, две равные половины, от середины текст отступает на 3rem.
   Жёлтая плашка #odbior, её нижняя полоса и кнопка «Zamów wycenę» над ней строятся так же – произвольные
   12 колонок 5/7 и ширина 52ch отменены. Правый край всего – поле плашки, как у карточки судов. */
@media (min-width:1024px){
  .ob-grid{ grid-template-columns:1fr 1fr; column-gap:0; }
  .ob-grid > div{ grid-column:auto; }
  .ob-grid > div:first-child{ padding-right:3rem; }
  .ob-grid > div:nth-child(2){ padding-left:3rem; }
  .so-list.ob-acc, .ob-note{ max-width:none; }
  .ob-strip{ grid-template-columns:1fr 1fr; column-gap:0; }
  .ob-strip-h{ grid-column:1; margin-right:0; padding-right:3rem; }
  .ob-strip .cta-btns{ grid-column:2; max-width:none; padding-left:3rem; }
  .ob-quote{ grid-template-columns:1fr 1fr; column-gap:0; }
  .ob-quote-in{ grid-column:2; max-width:none; }
}
@media (min-width:1024px){ .ob-lead{ max-width:none; } }  /* Грег 24.09.2026: текст левой половины – до «середина −48», как MSZ */
/* 25.09.2026, полировка #odbior по стенду docs/odbior (Грег: «сделай это»). Совет «Wysyłasz oryginał?» переехал в левую колонку
   без линии – правило «линия по длине текста, 28em» больше не нужно, от 1024px ширина совета – вся половина, как у ответов.
   Кнопки полосы – сеткой 3 × 1fr ровно по правой колонке: одинаковые, от «Wybierz wygodną drogę» до поля плашки; на 1024–1200px
   больше не переносятся в два ряда. */
@media (min-width:1024px){
  .ob-strip .cta-btns{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
  .ob-strip .cta-btn, .ob-strip .cta-btn:not(.cta-btn--main), .ob-strip .cta-btn:not(.cta-btn--main):hover,
  .ob-strip .cta-btn:not(.cta-btn--main):focus-visible{ min-width:0; padding-left:.5em; padding-right:.5em; }
}
/* 25.09.2026, ход 5 стенда docs/odbior (Грег: «сделай пятый ход тоже»): ответы на «Czy muszę oddać oryginał?» – строками
   того же уровня, что способы доставки справа («Polska – InPost»): узкий 20px на телефоне и 24px от 640px, жирное + обычное.
   Плашка читается как два списка – что отдать и как доставить. Первая строка стоит на высоте «Osobiście…» полем 12px, как
   строка аккордеона (поэтому отступ .ob-lead 10px из полировки снят); пояснение – 17px под строкой. */
.ob-ans{ font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-size:20px; line-height:1.1; letter-spacing:-.02em; font-weight:400; color:var(--c-ink); }
@media (min-width:640px){ .ob-ans{ font-size:24px; } }
.ob-ans b{ font-weight:700; }
.ob-lead > .ob-ans:first-child{ padding-top:12px; }
.ob-lead > .ob-ans + p{ margin-top:.5rem; }
.ob-lead > p + .ob-ans{ margin-top:1.6rem; }

/* ===== Цвет текста по роли + лид размером (Грег, 25.09.2026: «делай 3 вариант», стенд docs/tekst/) =====
   Всё, что читают (вступления, абзацы, списки, ответы FAQ, подписи к фото, текст на плашках) – чернильный на любом фоне:
   плашку выделяет заливка, а не цвет текста. Серый остаётся у служебного – подписи капсом, «/ dokument», сноски
   и крошки в 60 % (text-ink/60) – эти правила не трогаются. Вступление сразу после h1/h2 (17px) – лид: 20px от 640px,
   18px на телефоне; уже крупные лиды (главная 21px, /cennik/ 24px) не меняются.
   Только польские страницы (html[lang="pl"]) – ua/ru/en догоняют общим проходом, тогда ограничение снять.
   04.10.2026 (аналитика 02.10, В5): /tlumaczenia-przysiegle/ukrainski|rosyjski|angielski/ лежат в польской зоне, но lang у них
   uk/ru/en – им дан класс html.pl-zone, правила ниже действуют и на него.
   Не трогаются здесь: прайс /cennik/ (#ceny), цены в FAQ (.faq-price) и текст панели после отправки – их чернит
   правило ниже (02.10.2026); остальная панель заявки (.qd), шапка, меню, подвал. */
:is(html[lang="pl"], html.pl-zone) :is(.text-ink\/65, .text-ink\/70, .text-ink\/75, .text-ink\/80, .text-ink\/85):not(.uppercase):not(section#ceny *, .qd *, header *, nav *, #mobile-nav *, footer *){ color:var(--c-ink); }
:is(html[lang="pl"], html.pl-zone) :is(.tl-def-text, .tl-lead, .tl-meta, .step-lead, .scheme-item figcaption, .flow li, .opt span, .rules li,
  .gdz--light .gdz-full, .gdz--light .gdz-docs li, .gdz--light .gdz-note p, .gdz-key-s, .gdz-src,
  .kt-steps-list li, .ap-doc p, .ua-term-t, .so-text, .so-more, .so-addr i, .cmp-lead, .cmp-note p, .route-t, .route-sum){ color:var(--c-ink); }
:is(html[lang="pl"], html.pl-zone) :is(h1, h2) + p.text-\[17px\]{ font-size:18px; color:var(--c-ink); }
@media (min-width:640px){ :is(html[lang="pl"], html.pl-zone) :is(h1, h2) + p.text-\[17px\]{ font-size:20px; } }
:is(html[lang="pl"], html.pl-zone) :is(h1, h2) + p.text-\[17px\] b{ font-size:1em; }   /* .hero-lead b было 19px – в лиде 20px оно стало бы мельче текста */
/* Прайс и цены – тоже чернильные (Грег, 02.10.2026: «исправь серый ink/65 на чернильный», затем «сделай если нужно»;
   было 65–80 %): описания и вводные строки групп /cennik/ (#ceny), пояснения «Odbiór i wysyłka», примечания под прайсом,
   курсивные формулы сумм .cn-sum (их и так отличает курсив), строки цен .faq-price (главная #faq, /apostille-ukraina/ #dyplom),
   текст панели заявки после отправки (что будет дальше и где искать ответ). Единицы «/ strona», «/ dokument»
   и «= 1125 znaków ze spacjami» – служебные, остаются серыми. */
html[lang="pl"] :is(.faq-price span:not(.fp-unit):not(.fp-note), .cn-v2 .cn-group-t, .cn-v2 .cn-desc, .cn-v2 .cn-name small,
  .cn-v2 .cn-foot p, .cn-v2 .cn-sum){ color:var(--c-ink); }
html[lang="pl"] .wy-v2 :is(#quote-form, #quote-form-qd) .qd-done .qd-formsub{ color:var(--c-ink); }   /* своё правило с id – 75 % */

/* Плашка судов #twoj-sad (Грег, 25.09.2026: «правая часть супер, в левой грустно»). Тезис плашки – самый сильный уровень
   слева и тем же языком, что стопка городов справа: узкий светлый «Pierwszy krok robisz u siebie,» (как названия городов)
   и жирный «drugi – my w Warszawie.» (как Warszawa в стопке – единственный город, где оба шага наши). Кегль не меньше
   названий городов (40px), иначе тезис проигрывает списку. Абзац – два шага (.so-text p), сумма – strong в кегле текста.
   От 1024px «Potrzebujesz konsultacji?» стоит внизу левой колонки, на одной линии с «Miasta pozostałe». */
.so-plate .so-lead{ font-weight:300; font-size:40px; line-height:1.02; letter-spacing:-.02em; }
.so-plate .so-lead span{ font-weight:800; }
@media (min-width:640px){ .so-plate .so-lead{ font-size:44px; } }
.so-text p + p{ margin-top:.8rem; }
.so-text strong{ font-size:inherit; font-weight:700; color:var(--c-ink); }
@media (min-width:1024px){ .so-plate > .so-more{ align-self:end; } }
/* телефон: тезис начинается под значком суда и занимает всю ширину (с полем под значок выходило по слову в строке) */
@media (max-width:639px){
  .so-plate > .slab-kicker{ margin-bottom:30px; }
  .so-plate > .so-lead{ padding-right:0; font-size:34px; }
}

/* ===== Образец перевода «po polsku» (.pp, 25.09.2026 – идея 4 «По-польски» со стенда docs/typografia/) =====
   По мотивам Bookmania «Markers / becomes / Markers»: подпись языка (узкий капс 12px, как .kicker), название документа
   на своём языке (Fira 300 курсив – «второй голос» сайта), связка «po polsku» с волоском и точкой-меткой (заливка, не текст),
   то же название по-польски (Fira 900, -0.045em) – акцент весом, а не кеглем. Разметка – в hero /tlumaczenia-przysiegle/
   (.pp--side, пять пар, подпись языка едет вместе со своим словом) и /tlumaczenia-przysiegle/ukrainski/ (.pp--under,
   под h1, три украинские пары; подпись одна, «po ukraińsku», и стоит на месте – надзаголовок страницы уже «UKRAIŃSKI»).
   Документы – только те, что сайт называет сам. ua/ru/en не трогались – PL ведёт.
   Каждая строка образца – ячейка сетки .pp-cell, в которой лежат слои всех пар сразу (grid-area 1/1): высота ячейки =
   самый высокий слой, поэтому при смене пар ничего ниже не прыгает. Оригинал прижат вниз, к связке, перевод – вверх,
   к связке: пустота резерва уходит за края блока. Смену пар раз в 3,5 с ведёт app.js; класс .is-live включает переходы –
   старый слой уходит вверх и гаснет, новый выходит снизу: ±92%, .58s и кривая – как у слова на плашке главной (.swap).
   Кегль строк – --pp-fs: 30px на телефоне, 40px от 640px, под h1 – 48px от 1024px; подписи всегда 12px, отступы – от --pp-fs.
   От 1024px .pp--side стоит absolute в пустой правой колонке первого экрана (левая колонка не перетекает): левый край,
   верх и кегль считает app.js (--pp-x, --pp-y, --pp-side-fs): левый край – по правому краю текста слева, верх – волосок связки
   на середине зазора между h1 и лидом. До скрипта – запасные значения ниже (правый край лида ≈ 704px
   от края сетки + зазор 4% окна, 40–64px; верх 5px – запасной до скрипта; кегль – ширина / 8.4: самая длинная пара
   слов «Dyplom ukończenia» = 8.15em, две строки максимум). */
.pp{ --pp-fs:max(22px, min(30px, calc((100vw - 40px) / 8.4))); display:block; font-size:var(--pp-fs); color:var(--c-ink);
 margin-top:3.5rem; max-width:min(100%, 14em); }
@media (min-width:640px){ .pp{ --pp-fs:40px; margin-top:4rem; } }
/* 13em: «Zaświadczenie o niekaralności» (12.6em) встаёт в одну строку при 40 и 48px – резерв высоты не растёт */
.pp.pp--under{ margin-top:2.75rem; max-width:min(100%, 13em); }
@media (min-width:768px){ .pp.pp--under{ margin-top:3.25rem; } }
@media (min-width:1024px){
  .pp.pp--under{ --pp-fs:48px; }
  .pp.pp--side{ position:absolute; margin:0; left:var(--pp-x, calc(704px + clamp(40px, 4vw, 64px))); top:var(--pp-y, 5px);
   right:2rem; width:auto; max-width:none;
   --pp-fs:var(--pp-side-fs, max(22px, min(34px, calc((min(100vw, 1320px) - 736px - clamp(40px, 4vw, 64px)) / 8.4)))); }
}
@media (min-width:1280px){
  .pp.pp--side{ --pp-fs:var(--pp-side-fs, min(48px, calc((min(100vw, 1320px) - 736px - clamp(40px, 4vw, 64px)) / 8.4))); }
}
/* подписи: узкий капс 12px / 600 / .22em; язык – чернильный, связка – служебная, 60% */
.pp-lab, .pp-con{ display:flex; align-items:center; gap:.9rem; font-family:"Fira Sans Condensed","Fira Sans",sans-serif;
 font-size:12px; font-weight:600; font-style:normal; letter-spacing:.22em; line-height:1; text-transform:uppercase; white-space:nowrap; }
.pp-lab{ color:var(--c-ink); margin-bottom:calc(var(--pp-fs) * .3 + 6px); }
.pp-con{ color:rgba(31,33,32,.6); margin:calc(var(--pp-fs) * .36 + 8px) 0 calc(var(--pp-fs) * .3 + 8px); }
.pp-tx{ flex:0 0 auto; white-space:nowrap; }
/* волосок до правого края; точка акцентом перед связкой */
.pp-hl{ flex:1 1 auto; min-width:1.5rem; height:1px; background:rgba(31,33,32,.2); }
.pp-dot{ flex:0 0 auto; width:7px; height:7px; border-radius:50%; background:var(--c-terra); margin-right:-.25rem; }
/* ячейка со слоями всех пар; клип только по вертикали, поля – под диакритику и выносные */
.pp-cell{ display:grid; overflow-x:visible; overflow-y:clip; padding:.16em .12em .2em 0; margin:-.16em -.12em -.2em 0; }
.pp-con .pp-cell{ flex:1 1 auto; min-width:0; padding:.4em 0; margin:-.4em 0; }
.pp-l{ grid-area:1 / 1; min-width:0; opacity:0; transform:translateY(92%); transition:none; }
.pp-con .pp-l{ display:flex; align-items:center; gap:.9rem; }
.pp-src .pp-l, .pp-tgt .pp-l, .pp-sw{ display:block; }
.pp-l.is-on{ opacity:1; transform:none; }
/* движение – ровно как у слова на плашке главной (.swap: sw-out / sw-in): ±92%, .58s, одна кривая на прозрачность и сдвиг */
.pp.is-live .pp-l.is-on{ transition:opacity .58s cubic-bezier(.2,.72,.24,1), transform .58s cubic-bezier(.2,.72,.24,1); }
.pp.is-live .pp-l.is-out{ opacity:0; transform:translateY(-92%); transition:opacity .58s cubic-bezier(.2,.72,.24,1), transform .58s cubic-bezier(.2,.72,.24,1); }
.pp.is-live .pp-con .pp-l.is-on{ transition-delay:.05s; }
.pp.is-live .pp-tgt .pp-l.is-on{ transition-delay:.1s; }
.pp-src .pp-l{ align-self:end; }
.pp-tgt .pp-l{ align-self:start; }
.pp-src, .pp-tgt{ font-family:"Fira Sans",sans-serif; line-height:.95; text-wrap:balance; overflow-wrap:break-word; }
.pp-sw{ font-weight:300; font-style:italic; letter-spacing:-.03em; }
.pp-tgt{ font-weight:900; letter-spacing:-.045em; }
@media (prefers-reduced-motion:reduce){
  .pp .pp-l, .pp.is-live .pp-l.is-on, .pp.is-live .pp-l.is-out{ transition:none !important; transform:none !important; }
}

/* ===== Go Tabular – цены столбцом огромных табличных цифр (Грег, 26.09.2026: идея 8 стенда docs/typografia/ – в сайт;
   образец Fonts inspirations/219064.png «GO TABULAR»). Только польские страницы: /apostille/ и /cennik/.
   /apostille/ #ile-trwa: список ul.faq-price остаётся в разметке для экранных чтецов (.gt-sr, визуально скрыт), на экране –
   столбец .gt--ap (aria-hidden): 260 / 120 / 200 / 90 – Fira Sans 800, табличные цифры, «90» стоит под «60».
   У каждой цифры подпись Fira Sans Condensed: услуга капсом 600 с разрядкой и «,- zł / единица» (единицы – как в прайсе
   /cennik/). За цифрами – тонкие белые контуры листов A4, повёрнутые на 23°, цепочкой по диагонали, обрезаны краем карточки.
   Телефон и планшет – столбец под абзацами, внутри карточки. С 1024px карточка – две колонки на всю высоту: сноска
   и кнопка «Wyceń dokument» (тот же элемент, [data-quote]) встают под абзацы слева, столбец – справа, по центру карточки;
   за верх и низ карточки он выходит только явно (правило ниже).
   /cennik/ первый экран: с 1280px справа от вводного абзаца – вставной песочный блок .gt--cn с тем же столбцом
   (260 / 120 / 550 / 90); уже 1280px его нет – цены и так перечислены в абзаце.
   Всё на CSS, без JS: кегль цифр – от ширины колонки (cqi), правило вылета – от высоты карточки (cqh). */
.faq-price.gt-sr{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden;
  clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; border:0; }

/* Общий столбец. Три табличные цифры 800 с трекингом -.03em = 1,59 кегля; кегль --gt-f считается от ширины контейнера:
   ширина = 3 цифры + зазор --gt-gap + колонка подписей --gt-lw. --gt-ov – на сколько подписи заходят в поле карточки справа */
.gt{ position:relative; container-type:inline-size; --gt-lw:120px; --gt-gap:18px; --gt-ov:0px; --gt-rot:23deg;
  --gt-f:clamp(56px, min(calc((100cqi + var(--gt-ov) - var(--gt-lw) - var(--gt-gap)) / 1.59), 24vw), 190px); }
.gt-col{ position:relative; z-index:1; display:grid; grid-template-columns:max-content max-content; column-gap:var(--gt-gap);
  align-items:center; justify-content:start; }
.gt .gt-n{ display:block; font-family:"Fira Sans",sans-serif; font-weight:800; font-style:normal; font-size:var(--gt-f);
  line-height:.9; letter-spacing:-.03em; color:var(--c-ink); font-variant-numeric:tabular-nums lining-nums;
  font-feature-settings:"tnum" 1, "lnum" 1, "liga" 1, "clig" 1, "calt" 1; text-align:right; white-space:nowrap; }
/* подпись поверх контуров листов: песочный ореол вокруг букв, чтобы белая линия не зачёркивала мелкий текст */
.gt .gt-l{ display:flex; flex-direction:column; gap:4px; min-width:0; color:var(--c-ink);
  text-shadow:0 0 2px var(--c-sand), 0 0 4px var(--c-sand), 0 0 6px var(--c-sand), 0 0 8px var(--c-sand); }
.gt .gt-l b{ font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:600; font-size:12.5px; line-height:1.25;
  letter-spacing:.3em; text-transform:uppercase; color:var(--c-ink); margin-right:-.3em; white-space:nowrap; }
.gt .gt-l small{ font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:500; font-size:13px; line-height:1.2;
  letter-spacing:.02em; color:rgba(31,33,32,.6); white-space:nowrap; }
/* цифры выходят за блок – подписи крайних строк сходятся к центру на --gt-d (задаётся ниже для каждого места), чтобы не
   садиться на край карточки: цифры шире блока, подписи внутри, как в образце. Цифры помещаются – подпись по центру цифры */
.gt .gt-l:nth-child(2){ transform:translateY(calc(var(--gt-d, 0px) * 1.5)); }
.gt .gt-l:nth-child(4){ transform:translateY(calc(var(--gt-d, 0px) * .5)); }
.gt .gt-l:nth-child(6){ transform:translateY(calc(var(--gt-d, 0px) * -.5)); }
.gt .gt-l:nth-child(8){ transform:translateY(calc(var(--gt-d, 0px) * -1.5)); }

/* Листы: белый контур 1px, A4 (1 : 1,414), поворот 23°, цепочка вдоль собственной вертикали листа (sin 23° = .3907,
   cos 23° = .9205), как квадраты в образце; --gt-cx – центр цепочки по горизонтали = середина колонки подписей */
.gt-clip{ position:absolute; z-index:0; overflow:hidden; pointer-events:none; left:-28px; right:-28px; top:-18px; bottom:-10px;
  --gt-sw:calc(var(--gt-f) * .7); --gt-sh:calc(var(--gt-f) * .99); --gt-st:calc(var(--gt-f) * 1.06);
  --gt-cx:calc(28px + var(--gt-f) * 1.59 + var(--gt-gap) + var(--gt-lw) / 2); }
.gt-clip i{ position:absolute; left:var(--gt-cx); top:50%; width:var(--gt-sw); height:var(--gt-sh);
  margin:calc(var(--gt-sh) / -2) 0 0 calc(var(--gt-sw) / -2); box-sizing:border-box; border:1px solid rgba(255,255,255,.92);
  transform:translate(calc(var(--gt-i) * var(--gt-st) * -.3907), calc(var(--gt-i) * var(--gt-st) * .9205)) rotate(var(--gt-rot)); }
.gt-clip i:nth-child(1){ --gt-i:-1.5; }
.gt-clip i:nth-child(2){ --gt-i:-.5; }
.gt-clip i:nth-child(3){ --gt-i:.5; }
.gt-clip i:nth-child(4){ --gt-i:1.5; }

/* /apostille/, телефон и планшет: столбец под абзацами, внутри карточки */
.gt--ap{ margin:4px 0 10px; }
/* до 1024px слой листов обрывается внутри карточки – концы линий тают, а не обрезаются по невидимой черте */
@media (max-width:1023px){
  .gt--ap .gt-clip{ -webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 22%, #000 78%, transparent 100%);
    mask-image:linear-gradient(to bottom, transparent 0, #000 22%, #000 78%, transparent 100%); }
}
@media (max-width:639px){
  .gt--ap{ --gt-lw:96px; --gt-gap:10px;
    --gt-f:clamp(56px, min(calc((100cqi - var(--gt-lw) - var(--gt-gap)) / 1.59), 26vw), 120px); }
  .gt--ap .gt-l b{ font-size:11px; letter-spacing:.2em; margin-right:-.2em; }
  .gt--ap .gt-l small{ font-size:12px; }
}
@media (min-width:640px){
  .gt--ap .gt-clip{ left:-48px; right:-48px; --gt-cx:calc(48px + var(--gt-f) * 1.59 + var(--gt-gap) + var(--gt-lw) / 2); }
}

/* /apostille/ с 1024px: карточка – две колонки на всю высоту. Колонка 5 растворяется в сетке (display:contents), сноска
   и кнопка встают под абзацы слева, столбец цифр – справа, по центру карточки.
   Правило вылета (со стенда): цифры выходят за верх и низ карточки либо явно – не меньше 24px с каждой стороны, – либо никак;
   цифры, которые едва касаются края карточки, выглядят как ошибка вёрстки. На стенде это считал JS, здесь – CSS:
   .gt--ap стоит на обеих строках сетки, поэтому её высота (100cqh, container-type:size) = высота содержимого карточки,
   вся карточка H = 100cqh + 96px (поля 48px). 3,39 – высота столбца от верха первой цифры до базовой линии последней
   в кеглях (4 строки: 3 × .9 + .69).
   1) --gt-fw – кегль по ширине колонки (подписи заходят в правое поле карточки на 12px). Если с ним вылет не меньше 24px
      (3,39·fw − H ≥ 48px) – он и остаётся (примерно с 1300px; с 1384px кегль 213px, вылет ≈ 33px).
   2) Иначе, если не хватает немного: --gt-fo – кегль, при котором вылет ровно 24px. Берётся, если он не больше 224px
      и подписи зайдут в поле не дальше 28px (fo − fw ≤ 16px / 1,59 = 10,06px) – примерно 1260–1300px.
   3) Иначе цифры стоят внутри (1024 – ~1260px): кегль не больше --gt-fi – верх цифры на уровне кикера, низ – на уровне
      низа сноски. Сверено со стендом на 1024–1920px: кегль и положение совпадают до 0,1px.
   «Если – то» без JS: max(Б, min(А, x × 10000)) = А при x ≥ 0 и Б при x < 0, когда А ≥ Б – в обоих выборах так и есть
   (fo ≥ fi; в случае 1 fw ≥ fo). --gt-ov – на сколько подписи заходят в поле при выбранном кегле (не меньше 12px);
   --gt-d – схождение подписей: 35.2px – высота подписи (12.5 × 1.25 + 4 + 13 × 1.2). */
@media (min-width:1024px){
  .gt-card > .grid{ row-gap:28px; }
  .gt-card .gt-c5{ display:contents; }
  .gt-card .gt-note{ grid-column:1 / span 7; grid-row:2; align-self:center; margin:0; max-width:min(52ch, calc(100% - 222px)); }
  .gt-card .gt-btn{ grid-column:1 / span 7; grid-row:2; align-self:center; justify-self:end; margin:0; }
  .gt--ap{ grid-column:8 / -1; grid-row:1 / span 2; align-self:stretch; margin:0; container-type:size;
    --gt-fw:clamp(120px, calc((100cqi + 12px - var(--gt-lw) - var(--gt-gap)) / 1.59), 224px);
    --gt-h:calc(100cqh + 96px);
    --gt-fo:calc((var(--gt-h) + 48px) / 3.39);
    --gt-fi:min(var(--gt-fw), calc(100cqh / 3.39));
    --gt-f2:max(var(--gt-fi), min(var(--gt-fo), calc(min(224px - var(--gt-fo), var(--gt-fw) + 10.06px - var(--gt-fo)) * 10000)));
    --gt-f:max(var(--gt-f2), min(var(--gt-fw), calc((3.39 * var(--gt-fw) - var(--gt-h) - 48px) * 10000)));
    --gt-ov:max(12px, calc(1.59 * var(--gt-f) + var(--gt-lw) + var(--gt-gap) - 100cqi));
    --gt-d:max(0px, calc(.9 * var(--gt-f) - (100cqh - 35.2px) / 3)); }
  .gt--ap .gt-col{ position:absolute; right:calc(-1 * var(--gt-ov)); top:50%; transform:translateY(-50%); justify-content:end; }
  .gt--ap .gt-clip{ top:-48px; bottom:-48px; left:-16px; right:-48px; border-radius:0 26px 26px 0;
    --gt-cx:calc(100% - 48px + var(--gt-ov) - var(--gt-lw) / 2); }
}

/* /cennik/ первый экран, с 1280px: вставной песочный блок справа от вводного абзаца (.lead-lines – 36em при 24px = 864px;
   поля страницы 32px, зазор до блока 40px). Блок ниже столбца цифр (3,08 кегля): первая цифра выходит за его верх,
   последняя – за низ; подписи сходятся так, что крайние стоят в 14px от края блока
   (62px = 2 × (14 + 34 / 2), 34px – высота подписи: 12 × 1.25 + 4 + 12.5 × 1.2). */
.gt--cn{ display:none; }
@media (min-width:1280px){
  .gt-host{ position:relative; }
  .gt--cn{ display:block; position:absolute; top:0; bottom:0; right:32px; width:calc(100% - 64px - 864px - 40px);
    --gt-lw:112px; --gt-gap:14px;
    --gt-f:clamp(80px, calc((100cqi - 46px - var(--gt-lw) - var(--gt-gap)) / 1.59), 150px);
    --gt-d:max(0px, calc(.9 * var(--gt-f) - (3.08 * var(--gt-f) - 62px) / 3)); }
  .gt--cn .gt-l b{ font-size:12px; letter-spacing:.26em; margin-right:-.26em; }
  .gt--cn .gt-l small{ font-size:12.5px; }
  .gt-blk{ position:absolute; left:0; right:0; top:50%; height:calc(var(--gt-f) * 3.08); transform:translateY(-50%);
    background:var(--c-sand); border-radius:26px; overflow:hidden; }
  .gt--cn .gt-col{ position:absolute; left:20px; top:50%; transform:translateY(-50%); }
  .gt--cn .gt-clip{ inset:0; border-radius:inherit; --gt-cx:calc(20px + var(--gt-f) * 1.59 + var(--gt-gap) + var(--gt-lw) / 2); }
}

/* .gt--cn, вид 40 со стенда docs/ceny-gt/ (Грег, 02.10.2026: «40 реализуй на сайте»). Вместо одной плашки с листами –
   серая полоса под каждой строкой; цифры – жирный курсив, межстрочный интервал .792 (на 12% плотнее); столбец наклонён
   вслед курсиву: строки сдвинуты на ±.06 / ±.18 кегля; подпись – услуга капсом, под ней крупный курсивный «zł»
   и «/ ЕДИНИЦА» капсом. Полоса – две половинки: .gt-n::before (от знаков цифры) + .gt-l::before (до конца колонки
   подписей), обе одной высоты, сходятся встык; z-index:-1 – внутри .gt-col (у неё z-index:1), под текстом.
   Ширина .gt-n – по числу знаков (табличные цифры: 1ch минус трекинг), иначе при накрутке цены (app.js) левый край
   полосы прыгал бы. Схождение подписей (--gt-d) снято: подпись стоит по центру своей полосы. */
@media (min-width:1280px){
  .gt--cn .gt-blk{ display:none; }
  .gt--cn .gt-col{ left:0; }
  .gt--cn .gt-n, .gt--cn .gt-l{ position:relative; translate:calc(var(--gt-k, 0) * var(--gt-f) * -.12) 0; }
  .gt--cn .gt-n:nth-child(1), .gt--cn .gt-l:nth-child(2){ --gt-k:-1.5; }
  .gt--cn .gt-n:nth-child(3), .gt--cn .gt-l:nth-child(4){ --gt-k:-.5; }
  .gt--cn .gt-n:nth-child(5), .gt--cn .gt-l:nth-child(6){ --gt-k:.5; }
  .gt--cn .gt-n:nth-child(7), .gt--cn .gt-l:nth-child(8){ --gt-k:1.5; }
  .gt--cn .gt-n{ font-style:italic; line-height:.792; justify-self:end; padding-right:.04em;
    min-width:calc(var(--gt-dg, 3) * (1ch - .03em) + .04em); }
  .gt--cn .gt-n:nth-child(7){ --gt-dg:2; }
  .gt--cn .gt-col .gt-l{ transform:none; align-self:stretch; justify-content:center; gap:4px; }   /* .gt-col – перебить .gt .gt-l:nth-child(n) */
  .gt--cn .gt-n::before, .gt--cn .gt-l::before{ content:""; position:absolute; z-index:-1; background:var(--c-sand);
    top:calc(var(--gt-f) * .07); bottom:calc(var(--gt-f) * .03); }
  .gt--cn .gt-n::before{ left:-14px; right:-1px; border-radius:14px 0 0 14px; }
  .gt--cn .gt-l::before{ left:calc(-1 * var(--gt-gap)); right:-14px; border-radius:0 14px 14px 0; }
  .gt--cn .gt-l small{ display:flex; align-items:baseline; gap:6px; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
    color:rgba(31,33,32,.75); }
  .gt--cn .gt-z{ font:italic 800 calc(var(--gt-f) * .3)/.9 "Fira Sans",sans-serif; letter-spacing:-.01em; text-transform:none; color:var(--c-ink); }
}

/* Go Tabular на /tlumaczenia-przysiegle/ #cena (Грег, 26.09.2026: «сверху оставить 260 Apostille, потом внизу 90, над ней
   1125 znaków и −10%»). Классы .gt--ap (как «Ile trwa» на /apostille/) + .gt--tl: две огромные строки – 260 (Apostille MSZ
   do tłumaczenia) и 90 (Tłumaczenie ,- zł / strona); между ними, прижатый к «90», маленький табличный столбик .gt-cap
   средним кеглем (0,3 большого): 1125 – znaków ze spacjami = 1 strona, −10% – od 6 stron w zleceniu. Цифры столбика стоят
   вправо, как большие. Скидка больше не стоит среди цен большим кеглем – она уточняет цену за страницу.
   Отличия от .gt--ap: три листа, подписи без схождения; с 1024px кегль – по ширине колонки, но так, чтобы весь столбец
   (≈ 2,35 кегля) помещался в высоту карточки; вылета за карточку нет. */
.gt--tl .gt-clip i:nth-child(1){ --gt-i:-1; }
.gt--tl .gt-clip i:nth-child(2){ --gt-i:0; }
.gt--tl .gt-clip i:nth-child(3){ --gt-i:1; }
.gt--tl .gt-l{ transform:none !important; }
/* столбик 1125 / −10% – строки той же сетки, что большие цифры: числа стоят правым краем под «260» и «90», подписи – в колонке
   подписей; отступ сверху отделяет его от «260», снизу он прижат к «90» */
.gt--tl .gt-cap, .gt--tl .gt-m{ display:contents; }
.gt--tl .gt-m b{ justify-self:end; align-self:baseline; font-family:"Fira Sans",sans-serif; font-weight:800;
  font-size:max(24px, calc(var(--gt-f) * .3)); line-height:.95; letter-spacing:-.03em; color:var(--c-ink); text-align:right;
  font-variant-numeric:tabular-nums lining-nums; font-feature-settings:"tnum" 1, "lnum" 1, "liga" 1, "clig" 1, "calt" 1; white-space:nowrap; }
.gt--tl .gt-m small{ align-self:baseline; font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:500; font-size:13px;
  line-height:1.2; letter-spacing:.02em; color:rgba(31,33,32,.6);
  text-shadow:0 0 2px var(--c-sand), 0 0 4px var(--c-sand), 0 0 6px var(--c-sand); }
.gt--tl .gt-m:first-child b, .gt--tl .gt-m:first-child small{ margin-top:calc(var(--gt-f) * .1); }
.gt--tl .gt-m:last-child b, .gt--tl .gt-m:last-child small{ margin-bottom:calc(var(--gt-f) * .02); }
@media (max-width:639px){
  /* колонка подписей может сужаться – подписи переносятся, а не выходят за карточку */
  .gt--tl .gt-col{ grid-template-columns:max-content minmax(0, 1fr); }
  .gt--tl .gt-l small{ white-space:normal; }
  .gt--tl .gt-m small{ font-size:12px; }
}
@media (min-width:1024px){
  .gt--ap.gt--tl{ --gt-f:min(var(--gt-fw), calc((100cqh - 40px) / 2.35)); --gt-ov:max(12px, calc(1.59 * var(--gt-f) + var(--gt-lw) + var(--gt-gap) - 100cqi)); --gt-d:0px; }
}

/* #jezyki на /tlumaczenia-przysiegle/ (Грег, 26.09.2026: «вот такое реализуй», лист 42 стенда docs/konstrukcje/ –
   «сетка и призрачное A»). Коды языков Fira Sans 900, под ними названия узким 400. Сетку делят только внутренние
   волосяные линейки, внешней рамки нет: у каждой ячейки линия слева и сверху, а обёртка срезает первую колонку и первый
   ряд на 1px – так правило не зависит от числа колонок. Пустой последний ряд сохранён: линейки уходят вниз и обрываются.
   Жёлтая точка у кода – язык, который делаем каждый день; расшифровка – жёлтая метка под сеткой.
   За всем – гигантская «A» цветом sand на фоне страницы: стоит на нижнем крае секции, правую ногу срезает край окна
   (около 20 % ширины буквы), на очень широких экранах буква не уходит дальше пятой колонки.
   Колонки: 3 на телефоне (9 кодов = ровно три ряда), 5 от 640px. Ячейки UA/RU/EN – ссылки на подстраницы языков. */
.lng{ position:relative; overflow:hidden; isolation:isolate; }
/* по вертикали не режем: хвосты «Д» в «Да.» за сеткой уходят под секцию на следующий блок (Грег, 30.09.2026: «большие
   буквы могут заходить на следующий блок, это лучше, чем срезать их другим блоком»); по горизонтали «A» режет край окна.
   Следующая секция – позиционированная, чтобы её текст шёл поверх серых букв, а не под ними */
@supports (overflow:clip){ .lng{ overflow:visible; overflow-x:clip; } }
.lng + section{ position:relative; }
/* метрики Fira Sans 900 «A» (замер): ширина 0,601em, чернила от −0,025 до 0,626em, прописная 0,696em,
   при line-height:1 базовая линия на 0,165em выше низа строки */
.lng-ghost{ position:absolute; z-index:-1; bottom:-.165em; right:max(calc(var(--lng-cut) * -1em), calc(50% - 420px - .601em));
  font-family:"Fira Sans",sans-serif; font-weight:900; font-size:var(--lng-a); line-height:1; color:var(--c-sand);
  pointer-events:none; -webkit-user-select:none; user-select:none; --lng-a:190vw; --lng-cut:.15; }
/* телефон: вершина буквы – на ~72 % ширины экрана, видны вершина и просвет, срезана правая нога (~27 %) */
.lng-wrap{ overflow:hidden; }
.lng-grid{ --lng-h:108px; --lng-v:52px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr));
  width:calc(100% + 1px); margin:-1px 0 0 -1px; padding:0; list-style:none; }
.lng-cell{ display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:var(--lng-h);
  border-left:1px solid rgba(31,33,32,.15); border-top:1px solid rgba(31,33,32,.15); }
.lng-cell--void{ min-height:var(--lng-v); }
.lng-cell:nth-child(n+13){ display:none; }   /* телефон: в четвёртом ряду «pozostałe języki» и две пустые клетки */
.lng-link{ align-self:stretch; flex:1 1 auto; display:flex; flex-direction:column; align-items:center; justify-content:center; color:var(--c-ink); }
.lng-code{ position:relative; font-family:"Fira Sans",sans-serif; font-weight:900; font-size:clamp(42px, 12.5vw, 52px);
  line-height:1; letter-spacing:-.02em; color:var(--c-ink); }
/* точка – слева от кода по середине высоты прописных (Грег, 26.09.2026: «по левой оставим»). Висит на .lng-code, а не
   на гаснущих буквах .lng-c, поэтому при наведении остаётся («при наведении она остаётся») и отъезжает влево к краю
   самоназвания (--lng-dd); у ячеек с точкой слово сдвинуто вправо на половину точки с отступом (--lng-ws), чтобы точка
   и слово стояли парой по центру ячейки и точка не прилипала к слову (оба числа считает app.js). */
.lng-cell--day .lng-code::before{ content:""; position:absolute; right:100%; top:50%; width:max(7px,.147em); height:max(7px,.147em);
  margin-right:.12em; border-radius:50%; background:var(--c-terra); transform:translate(0,-50%);
  transition:transform .45s cubic-bezier(.2,.7,.25,1) var(--lng-back, 0ms); }
/* --lng-back – задержка обратного хода: пока видна первая буква самоназвания, точка стоит (ставит app.js в flipOut) */
.lng-cell--day.is-w .lng-code::before{ transform:translate(calc(-1 * var(--lng-dd, 0px)), -50%); transition-delay:0ms; }
@media (prefers-reduced-motion:reduce){ .lng-cell--day .lng-code::before{ transition:none; } }
.lng-name{ margin-top:7px; font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:400; font-size:16px; line-height:1.2;
  color:var(--c-ink); white-space:nowrap; }
.lng-name svg{ display:inline-block; width:.6em; height:.6em; margin-left:.3em; vertical-align:0; transition:transform .25s cubic-bezier(.2,.7,.25,1); }
@media (hover:hover){ .lng-link:hover .lng-name svg{ transform:translateX(4px); } }
.lng-link:focus-visible{ outline:2px solid var(--c-ink); outline-offset:-8px; }
.lng-sr{ position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%);
  white-space:nowrap; border:0; }
.lng-foot{ display:flex; flex-wrap:wrap; align-items:center; gap:6px 12px; margin-top:32px;
  font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:600; font-size:13px; line-height:1.5; letter-spacing:.18em;
  text-transform:uppercase; color:var(--c-ink); }
.lng-price > span{ white-space:nowrap; }   /* цена и страница – строкой; на телефоне переносятся целыми кусками */
.lng-tag{ padding:3px calc(7px - .18em) 3px 7px; background:var(--c-terra); }   /* углы острые (скругление 3px Грег снял 26.09.2026) */
.lng-note{ margin-top:1rem; color:var(--c-ink); }
@media (min-width:640px){
  .lng-ghost{ --lng-a:min(90vw, 1150px); --lng-cut:.18; }   /* видимая часть буквы – около 0,43 ширины сетки на любом экране */
  .lng-grid{ --lng-h:128px; --lng-v:88px; grid-template-columns:repeat(5,minmax(0,1fr)); }
  .lng-cell:nth-child(n+13){ display:flex; }
  .lng-code{ font-size:56px; }
  .lng-name{ margin-top:8px; font-size:17px; }
  .lng-foot{ margin-top:40px; }
}
@media (min-width:1024px){
  .lng-grid{ --lng-h:150px; --lng-v:110px; }
  .lng-code{ font-size:68px; }
  .lng-foot{ margin-top:44px; }
}
@media (prefers-reduced-motion:reduce){ .lng-name svg{ transition:none; } }
/* Код раскрывается в самоназвание (Грег, 26.09.2026: «реализуй 1 сразу на стр»; вместо сменяющихся букв за сеткой).
   Наведение или фокус на ячейке (на телефоне – по очереди при прокрутке, класс .is-w ставит app.js): код гаснет, на его
   месте – самоназвание языка. Начертание – как самоназвания на главной: жирный курсив; жёлтую черту Грег снял
   («подчёркивание убрать»).
   Размер (Грег: «слишком крупно и непонятно, зачем другие скрывать»): самое длинное слово (Nederlands, Українська ≈ 4,9em)
   помещается в свою ячейку – соседей слово не задевает, они не гаснут. Слово – по середине высоты кода (прописные кода
   и слова на одной средней линии), не у его низа: «сейчас слишком вниз».
   Появление – «табло» (Грег, 26.09.2026: «реализуй Табло на странице», вариант 6 стенда docs/jezyki-ruch/; раньше хвост
   выезжал шторкой сбоку): буквы серым перебирают алфавит своего языка (ї є ґ, ñ, ł ż…) и встают на место слева направо,
   уходят с конца. На время перебора буквы – копией поверх слова (.lng-ov, app.js ставит её по замерам настоящих букв),
   само слово под ней прозрачное (.is-flip); копия сложилась – убирается, остаётся живое слово: кернинг и лигатуры целы.
   Слово видно при .is-on (app.js), код гаснет по .is-w. Слово в разметке – одним куском, без деления на начало и хвост. */
.lng-c{ position:relative; display:inline-block; transition:opacity .22s ease .1s; }   /* код возвращается, пока буквы уходят */
.lng-cell.is-w .lng-c{ opacity:0; transition:opacity .15s ease; }
.lng-w{ position:absolute; left:50%; top:50%; transform:translate(calc(-50% + var(--lng-ws, 0px)),-50%); white-space:nowrap; pointer-events:none;
  font-size:clamp(15px, calc((100vw - 40px) / 18), 22px); font-weight:700; font-style:italic; letter-spacing:-.02em; opacity:0; }
@media (min-width:640px){ .lng-w{ font-size:min(34px, calc((100vw - 64px) / 30)); } }   /* с обеих сторон самого длинного слова остаётся место под точку */
.lng-w.is-on{ opacity:1; }
.lng-w.is-flip{ color:transparent; }
.lng-ov{ position:absolute; left:0; top:0; color:var(--c-ink); }
.lng-ov > span{ position:absolute; white-space:pre; text-align:left; }
.lng-ov > .lng-x{ opacity:.32; text-align:center; }   /* буква в переборе – серым, по середине места своей буквы */
@media (prefers-reduced-motion:reduce){ .lng-c{ transition:none !important; } }

/* ПРАВИЛО ДЛЯ ВСЕГО САЙТА (Грег, 26.09.2026): лигатуры работают всегда, при любых раскладах.
   Браузеры (особенно Safari/WebKit) выключают fi/fl/ff при ненулевом letter-spacing – явные liga/clig/calt возвращают их
   везде, включая кнопки, поля, кикеры с трекингом и псевдоэлементы. font-feature-settings не складывается:
   любое правило, где он задан (tnum, lnum…), обязано повторять "liga" 1, "clig" 1, "calt" 1 – иначе лигатуры там пропадут. */
*, *::before, *::after{ font-variant-ligatures:common-ligatures contextual;
  font-feature-settings:"liga" 1, "clig" 1, "calt" 1; }

/* Ответ за сеткой (Грег, 30.09.2026: «из 1 реализуй для всех», вариант 1 «Yes» стенда docs/jezyki-fon/; раньше – код
   языка Pl, Ua… со срезом по краю окна, ещё раньше – буква языка Ł Ї Ы & ß). Вместе с раскрытием самоназвания «A» гаснет,
   а за сеткой проявляется «Tak.», «Так.», «Yes.», «Oui.»… – ответ на языке клиента на «Twój język w parze z polskim».
   Слои .lng-g создаёт и расставляет app.js: один кегль на все слова (верх прописных на одной высоте, «подравняй по высоте»),
   базовая линия – низ секции (на телефоне – низ сетки), правый край окна режет точку – 36 % её за краем, как было у кодов;
   длинные слова не заходят левее сетки. Две штуки – для наплыва. */
.lng-g{ position:absolute; left:0; top:0; z-index:-1; display:block; font-family:"Fira Sans",sans-serif; font-weight:900; line-height:1;
  letter-spacing:-.03em; white-space:pre; color:var(--c-sand); opacity:0; transition:opacity .35s ease; pointer-events:none; -webkit-user-select:none; user-select:none; }
.lng-g.is-on{ opacity:1; }
.lng-ghost{ transition:opacity .35s ease; }
.lng.is-g .lng-ghost{ opacity:0; }
@media (prefers-reduced-motion:reduce){ .lng-g, .lng-ghost{ transition:none; } }
/* «pozostałe języki» – за сеткой лента других языков вместо «?» (Грег, 30.09.2026, вариант 5 «Лента» стенда docs/jezyki-fon/):
   Português Čeština Ελληνικά…, жирный через один со светлым курсивом, вразброс от второго столбца до правого края сетки.
   В каждом слове оба начертания – видно одно (.is-b / .is-i); кегль, начертание и место каждого слова ставит app.js */
.lng-g--more{ letter-spacing:0; }
.lng-g--more .lng-mw{ position:absolute; left:0; top:0; line-height:1; white-space:nowrap; }
.lng-g--more .lng-mw.is-b i, .lng-g--more .lng-mw.is-i b{ display:none; }
.lng-g--more b{ font-weight:900; letter-spacing:-.035em; }
.lng-g--more i{ font-weight:300; font-style:italic; letter-spacing:-.02em; padding-right:.06em; }

/* Клетка «pozostałe języki» (Грег, 26.09.2026: «Pozostałe języki можно добавить в последнюю клеточку», «поставь в ячейку
   под Fr», «уберём ?/Zapytaj, оставим только Pozostałe języki и поднимем повыше, при наведении большой вопрос»):
   продолжение «найди свой код» – не нашёл, спроси. Кода нет – только подпись, по середине высоты линий нижнего ряда.
   Под FR: на телефоне это и так следующая клетка после NL (FR – первая колонка), от 640px – явное место в пустом ряду
   (ряд 3, колонка 2), пустые клетки обтекают. Ряд остаётся высотой пустого. Наведение – за сеткой лента других языков
   (30.09.2026, раньше «?»; data-g="?", app.js). */
.lng-cell--label{ min-height:var(--lng-v); }
.lng-cell--label .lng-link{ padding:12px 6px; }   /* подпись – по середине клетки */
@media (min-width:640px){ .lng-cell--more{ grid-column:2; grid-row:3; } }
.lng-cell--label .lng-name{ white-space:normal; text-align:center; padding:0 6px; }
.lng-cell--label .lng-name svg{ margin-left:.25em; }


/* #z-apostille на /tlumaczenia-przysiegle/ (Грег, 26.09.2026): вопрос для окошка и варианты-ответы. Вопрос – смысловой узел
   блока, крупно парой начертаний (жирный + светлый курсив) в кавычках – это фраза, которую клиент скажет в окошке. Над ним –
   задача клиенту обычным предложением, жирным 20/22px, не кикер (Грег: «это не кикер, а задача для клиента»). Варианты – строками,
   как ответы в #odbior на /kontakt/ (узкий 20/22px, жирное + обычное), шаги через стрелки; между строками – волосяная линия.
   От 1024px вопрос слева, ответы справа, верхом на одной линии; на телефоне – друг под другом. */
.zap{ display:grid; row-gap:1.4rem; border-top:1px solid rgba(31,33,32,.15); padding-top:1.6rem; }
@media (min-width:1024px){ .zap{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); column-gap:3.5rem; } }
.zap-task{ margin-bottom:.7rem; font-size:20px; line-height:1.25; font-weight:700; letter-spacing:-.01em; color:var(--c-ink); }
@media (min-width:640px){ .zap-task{ font-size:22px; } }
.zap-q{ max-width:17ch; font-size:30px; line-height:1.02; font-weight:800; letter-spacing:-.03em; color:var(--c-ink); }
@media (min-width:640px){ .zap-q{ font-size:36px; } }
.zap-list{ margin:0; padding:0; list-style:none; }
.zap-list li{ padding:.85rem 0; border-top:1px solid rgba(31,33,32,.15); font-family:"Fira Sans Condensed","Fira Sans",sans-serif;
  font-size:20px; line-height:1.25; font-weight:400; letter-spacing:-.01em; color:var(--c-ink); }
.zap-list li:first-child{ border-top:0; padding-top:0; }
@media (min-width:640px){ .zap-list li{ font-size:22px; } }
.zap-list b{ font-weight:700; }
.zap-list small{ display:block; margin-top:.3rem; font-family:"Fira Sans",sans-serif; font-size:15px; line-height:1.4; letter-spacing:0; color:rgba(31,33,32,.6); }

/* Образец «po polsku» в hero /tlumaczenia-przysiegle/ (.pp--side) – мельче и с отступом (Грег, 26.09.2026: «текст языков
   перевода под плашками, правее и после po polsku; размер уменьшить, а то спорит с главным заголовком, а это просто
   украшение»). Подписи (язык и «po polsku» с волоском) стоят как были; строки документа и перевода начинаются правее –
   там, где после «po polsku» начинается волосок (--pp-ind, меряет app.js; запасное 7.25rem). Кегль: до 22px на телефоне,
   26px от 640px, от 1024px – до 26px, от 1280px – до 30px (app.js, ширина за вычетом отступа / 8.4).
   /tlumaczenia-przysiegle/ukrainski/ (.pp--under) не тронут. */
.pp.pp--side{ --pp-fs:max(18px, min(22px, calc((100vw - 40px - var(--pp-ind, 7.25rem)) / 8.4)));
  max-width:min(100%, calc(14em + var(--pp-ind, 7.25rem))); }
.pp--side .pp-sw, .pp--side .pp-tgt .pp-l{ padding-left:var(--pp-ind, 7.25rem); }
@media (min-width:640px){ .pp.pp--side{ --pp-fs:26px; } }
@media (min-width:1024px){
  .pp.pp--side{ max-width:none;
    --pp-fs:var(--pp-side-fs, max(20px, min(26px, calc((min(100vw, 1320px) - 736px - clamp(40px, 4vw, 64px) - var(--pp-ind, 7.25rem)) / 8.4)))); }
}
@media (min-width:1280px){
  .pp.pp--side{ --pp-fs:var(--pp-side-fs, max(20px, min(30px, calc((min(100vw, 1320px) - 736px - clamp(40px, 4vw, 64px) - var(--pp-ind, 7.25rem)) / 8.4)))); }
}

/* Главная, #faq (Грег, 26.09.2026: идея 5 стенда docs/typografia/ – «на главной так реализуем»): «Częste pytania» –
   одна чёрная строка от края до края колонки. Кегль – от ширины колонки: h2 – контейнер, строка .hw-fit-l получает
   100cqw / ширину своих чернил в em. Подгонка по чернилам, а не по коробке: «C» встаёт в ось кикера, конец «a» – в конец
   линейки под заголовком. Числа для «Częste pytania» (Fira Sans 900, −0.045em; canvas measureText, 26.09.2026):
   --k – чернила 6.104em, --l – «C» начинается на 0.02em правее начала строки, --pb – хвосты ę, p, y уходят на 0.163em
   ниже коробки строки при line-height .82; под хвостами – mb-9 (36px) до линейки, как у заголовков разделов.
   Трекинг задан на самой строке: у h2 −0.045em считается от его 48px и наследовался бы готовыми пикселями.
   Другой текст – свои --k, --l, --pb в style строки. Без поддержки cqw остаются 34/48px из классов h2.
   Варианты для подстраниц (там вторая часть – тема страницы) – стенд docs/faq-h/. */
.hw-fit{ container-type:inline-size; }
@supports (width:1cqw){
  .hw-fit-l{ --k:6.104; --l:-.02; --pb:.163;
    display:block; width:max-content; white-space:nowrap; letter-spacing:-.045em; line-height:.82;
    font-size:calc(100cqw / var(--k)); margin-left:calc(var(--l) * 1em); padding-bottom:calc(var(--pb) * 1em); }
}

/* Вопрос для окошка карточкой (.zap--card) – только /apostille/ (Грег, 26.09.2026: вариант 3 стенда docs/pytanie/
   «на странице Apostille реализуй 3-й вариант, подумай над изюминкой из жёлтого»). Вопрос – серая карточка на всю ширину,
   одним начертанием (Fira Sans 800, без светлого курсива), «czy oba?”» не рвётся; маршруты – под ней в две колонки
   (с 1024px). За вопросом – серый «?» ростом в карточку, как «A» в сетке языков: слой .zap-gw (absolute, inset:0,
   container-type:size), кегль min(152cqh, 80cqw) – высота глифа «?» 0,69 кегля, низ точки на 6 % высоты карточки
   ниже края (точку срезает). Жёлтое – маркер сайта (как под ценами во вводном абзаце /cennik/) под «oba» в вопросе
   и под «Oba» в первом маршруте: самый частый ответ отмечен там, где его спрашивают, и там, где он описан.
   Жёлтый – заливка, не цвет текста. На /tlumaczenia-przysiegle/ блок .zap без .zap--card – как был. */
.zap--card{ border-top:0; padding-top:0; }
.zap--card .zap-ask{ position:relative; isolation:isolate; background:var(--c-sand); border-radius:26px; padding:28px 24px 34px; }
@media (min-width:640px){ .zap--card .zap-ask{ padding:40px 40px 48px; } }
.zap--card .zap-q{ max-width:16ch; text-wrap:balance; }
.zap-gw{ position:absolute; inset:0; z-index:-1; overflow:hidden; container-type:size; pointer-events:none; border-radius:inherit; }
.zap-g{ position:absolute; right:2cqw; bottom:calc(-.165em - 6cqh); font-family:"Fira Sans",sans-serif; font-weight:900;
  font-size:min(152cqh, 80cqw); line-height:1; color:rgba(31,33,32,.055); -webkit-user-select:none; user-select:none; }
@media (min-width:1024px){
  .zap.zap--card{ grid-template-columns:1fr; row-gap:28px; }
  .zap--card .zap-ask{ padding:44px 48px 52px; }
  .zap--card .zap-q{ max-width:24ch; font-size:48px; line-height:1; }
  .zap--card .zap-list{ display:grid; grid-template-columns:1fr 1fr; column-gap:48px; }
  .zap--card .zap-list li, .zap--card .zap-list li:first-child{ border-top:1px solid rgba(31,33,32,.15); padding:.85rem 0; }
}
.zap-mark{ background-image:linear-gradient(var(--c-terra),var(--c-terra)); background-repeat:no-repeat;
  background-position:0 88%; background-size:100% .42em; }

/* «pozostałe języki» при наведении – курсивом (Грег, 26.09.2026: «при наведении в italic, посмотрим»). Класс .is-w ставит
   app.js: наведение и фокус на маке, очередь при прокрутке на телефоне – подпись ведёт себя так же, как коды языков. */
.lng-cell--more.is-w .lng-name{ font-style:italic; }

/* ===== /tlumaczenia-przysiegle/: три новых блока (Грег, 26.09.2026: «реализуй всё, только не меняй уже готовое») =====
   Порядок готовых блоков не менялся; новые вставлены: «Jak to działa» и «Dokumenty» – после #cena, «Zamówienie» – после FAQ. */

/* #jak-to-dziala – четыре шага строкой: номер, жирный заголовок шага, строка текста; волосок сверху, как у рядов сетки.
   Телефон – столбиком, от 640px – 2 × 2, от 1024px – в одну строку. В конце – главное действие (форма). */
.tl-go{ margin:2.25rem 0 0; padding:0; list-style:none; display:grid; grid-template-columns:minmax(0,1fr); gap:1.6rem 2rem; }
@media (min-width:640px){ .tl-go{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .tl-go{ grid-template-columns:repeat(4,minmax(0,1fr)); } }
.tl-go li{ padding-top:1rem; border-top:1px solid rgba(31,33,32,.15); font-size:17px; line-height:1.55; color:var(--c-ink); }
/* Шаги делят общие строки (subgrid): номер, заголовок, описание – описания в ряду начинаются на одной высоте, даже если
   заголовок переносится («Bezpłatna wycena zwykle w 15 minut», 27.09.2026). 3 = число детей li; ниже 640px одна колонка. */
@media (min-width:640px){
  @supports (grid-template-rows:subgrid){
    .tl-go li{ display:grid; grid-row:span 3; grid-template-rows:subgrid; row-gap:0; align-content:start; }
  }
}
.tl-go-n{ display:block; margin-bottom:.6rem; font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:700; font-size:22px; line-height:1; }
.tl-go b{ display:block; margin-bottom:.35rem; font-size:20px; line-height:1.2; font-weight:700; letter-spacing:-.01em; }
@media (min-width:640px){ .tl-go b{ font-size:22px; } }
.tl-go-cta{ margin-top:2.25rem; }
/* Фраза-часы в конце #jak-to-dziala (PL, 27.09.2026, стенд docs/jak-cta/ – вариант 10): светлый курсив кеглем h2,
   действие – прямое 900 на жёлтой плашке внутри фразы, время – цифрами одной ширины (смена минуты не двигает строку).
   Ночная часть («Jutro rano – odpowiadamy od 7:00») – в подписи .tl-go-note, крупного шрифта меньше. Время пишет app.js. */
.tl-go-now{ margin:3rem 0 0; max-width:30ch; font-weight:300; font-style:italic;  font-size:26px; line-height:1.36; letter-spacing:-.02em; color:var(--c-ink); text-wrap:pretty; }
@media (min-width:640px){ .tl-go-now{ font-size:40px; line-height:1.3; max-width:none; } }
@media (min-width:1024px){ .tl-go-now{ margin-top:3.5rem; font-size:48px; line-height:1.26; } }
.tl-go-t{ font-variant-numeric:tabular-nums lining-nums; font-feature-settings:"tnum" 1,"lnum" 1,"liga" 1,"clig" 1,"calt" 1; letter-spacing:-.01em; white-space:nowrap; }
.tl-go-go{ position:relative; display:inline-block; white-space:nowrap; font-style:normal; font-weight:900; letter-spacing:-.03em; line-height:1.08;
 padding:calc(.05em + 3px) .26em calc(.09em + 3px) .3em; margin:0 .04em; border-radius:12px; background:var(--c-terra);   /* +3px сверху и снизу (Грег, 30.09.2026) */
 color:var(--c-ink); text-decoration:none;
 transition:background-color .25s ease, color .25s ease; }
@media (max-width:639px){ .tl-go-go{ border-radius:9px; } }
/* 30.09.2026: «Zamów ekspresową wycenę» на телефоне шире колонки – в плашке фразы разрешён перенос: две строки в одном жёлтом блоке,
   стрелка остаётся при последнем слове. Плашка в #cena (.tl-go-go--gt) не трогается. */
@media (max-width:639px){ .tl-go-go:not(.tl-go-go--gt){ white-space:normal; text-wrap:balance; } }
.tl-go-go::after{ content:""; position:absolute; left:-4px; right:-4px; top:-6px; bottom:-6px; }   /* мишень для пальца выше плашки */
.tl-go-go .cta-mark{ display:inline-block; width:.56em; margin-left:.12em; overflow:visible; vertical-align:-.02em; }
.tl-go-go .cta-mark svg{ width:.56em; height:.56em; margin:0; display:block; transition:transform .25s ease; }
.tl-go-go .cta-mark path{ stroke-width:4.6; }
.tl-go-go:hover, .tl-go-go:focus-visible{ background:var(--c-ink); color:var(--c-paper); }
.tl-go-go:hover .cta-mark svg, .tl-go-go:focus-visible .cta-mark svg{ transform:translateX(3px); }
.tl-go-go:focus-visible{ outline:2px solid var(--c-ink); outline-offset:3px; }
.tl-go-note{ margin-top:1rem; font-size:17px; line-height:1.5; color:var(--c-ink); }
@media (min-width:1024px){ .tl-go-note{ margin-top:1.25rem; font-size:18px; } }
@media (prefers-reduced-motion:reduce){ .tl-go-go, .tl-go-go .cta-mark svg{ transition:none; } }
/* Та же кнопка отдельной плашкой в конце «Ile kosztuje» (#cena, PL, 27–28.09.2026): вместо контурной .btn, кегль как во фразе
   (26 / 40 / 48px), чуть выше, чем там (во фразе высоту держит межстрочный). Под сноской, по её левому краю, воздух 28px;
   с 1024px – третьей строкой сетки .gt-card, столбец цифр (строки 1–2) не меняется. */
.tl-go-go--gt{ align-self:flex-start; margin:12px 0 0; font-size:26px; padding:.15em .3em .19em .34em; }
@media (min-width:640px){ .tl-go-go--gt{ font-size:40px; } }
@media (min-width:1024px){ .gt-card .tl-go-go--gt{ grid-row:3; justify-self:start; align-self:start; margin:0; font-size:48px; } }

/* #dokumenty – строка «документ · сколько страниц · цена»: от 640px в три колонки, на телефоне название сверху,
   страницы и цена – строкой под ним. Цены – с накруткой при наведении, как в остальных ценах сайта (.price-hit). */
.tl-doc{ margin:2rem 0 0; padding:0; list-style:none; max-width:880px; border-bottom:1px solid rgba(31,33,32,.15); }
.tl-doc li{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:1rem; row-gap:.2rem; align-items:baseline;
  padding:.9rem 0; border-top:1px solid rgba(31,33,32,.15); color:var(--c-ink); }
.tl-doc li > b{ grid-column:1 / -1; font-size:18px; line-height:1.3; font-weight:700; }
.tl-doc-p{ font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-size:17px; line-height:1.3; }
.tl-doc-c{ text-align:right; font-size:18px; line-height:1.3; white-space:nowrap; }
@media (min-width:640px){
  .tl-doc li{ grid-template-columns:minmax(0,1fr) 10rem 12rem; column-gap:1.5rem; }   /* 12rem: «оцінка за 15 хвилин» (UA) не вылезает за линию, 28.09.2026 */
  .tl-doc li > b{ grid-column:auto; font-size:20px; }
  .tl-doc-c{ font-size:20px; }
}
.tl-doc-note{ margin-top:1rem; max-width:62ch; font-size:17px; line-height:1.55; color:var(--c-ink); }

/* #zamow – закрывающая плашка после FAQ: три роли каналов подписью run-in («Dokumenty.» + текст) и кнопкой под ней;
   от 1024px – три колонки, кнопки на одной линии (прижаты к низу колонки). Большой нижний отступ FAQ (pb-28 / md:pb-44)
   не трогаем – съедаем его отрицательным верхом, чтобы до плашки было, как между остальными блоками. */
.tl-fin{ margin-top:-3rem; }
@media (min-width:768px){ .tl-fin{ margin-top:-4rem; } }
.tl-fin-cols{ display:grid; grid-template-columns:minmax(0,1fr); gap:1.8rem 2.5rem; margin-top:2rem; }
@media (min-width:1024px){ .tl-fin-cols{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.tl-fin-cols > div{ display:flex; flex-direction:column; }
.tl-fin-t{ font-size:17px; line-height:1.55; color:var(--c-ink); max-width:40ch; }
.tl-fin-t b{ font-weight:700; }
.tl-fin-cols .cta-btns{ margin-top:1rem; }
@media (min-width:1024px){ .tl-fin-cols .cta-btns{ margin-top:auto; padding-top:1.1rem; } }

/* Бирка-стикер «PL → UA» в hero /tlumaczenia-przysiegle/ukrainski/ (26.09.2026, лист k-58 docs/konstrukcje/).
   Две полосы: белая с «Apostilo» курсивом и жёлтая с ценой, парой и языком; текст повёрнут (vertical-rl), правый край скруглён.
   Стрелка – своя SVG: стебель + уголок толщиной штриха букв, конец обрезан, угол острый – в родстве с шевроном сайта.
   Все размеры в em от font-size бирки: 9px на телефоне, 11px от 640px. От 1280px бирка стоит справа от h1 (absolute),
   уже – в потоке под образцом перевода. */
.stk{ font-size:9px; display:flex; width:max-content; height:28em; margin-top:3rem; color:var(--c-ink);
 border-radius:0 6em 6em 0; overflow:hidden; line-height:1; }
@media (min-width:640px){ .stk{ font-size:11px; } }
@media (min-width:1280px){ .stk{ position:absolute; top:0; right:2rem; margin:0; } }
.stk-sr{ position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); clip-path:inset(50%); white-space:nowrap; }
.stk-a{ background:#fff; width:9em; display:flex; align-items:center; justify-content:center; }
.stk-a span{ writing-mode:vertical-rl; font-weight:800; font-style:italic; font-size:4em; letter-spacing:-.01em; }
.stk-b{ background:var(--c-terra); width:19em; display:flex; align-items:center; justify-content:center; gap:1em; padding-right:1.5em; }
.stk-price, .stk-lang{ writing-mode:vertical-rl; font-family:"Fira Sans Condensed","Fira Sans",sans-serif; font-weight:700; white-space:nowrap; }
.stk-price{ font-size:3em; font-variant-numeric:lining-nums; font-feature-settings:"lnum" 1, "liga" 1, "clig" 1, "calt" 1; }
.stk-lang{ font-size:1.4em; letter-spacing:.2em; text-transform:uppercase; }
.stk-pair{ display:flex; flex-direction:column; align-items:center; font-weight:900; font-size:6.6em; letter-spacing:-.02em; }
.stk-pair span{ writing-mode:vertical-rl; }
/* стрелка шириной в высоту прописной (≈.69em Fira 900), зазоры до букв – как межбуквенный у пары */
.stk-pair svg{ width:.62em; height:.99em; margin:.1em 0 .12em; }

/* Кнопка «Zamów wycenę» внизу экрана на телефоне (.m-dock, Грег, 26.09.2026). Разметку и показ ведёт app.js (класс .is-on).
   Над нижним краем с учётом «домашней полоски» iPhone; вид – главная кнопка сайта (.cta-btn--main) с лёгкой тенью,
   чтобы отделялась от текста под ней. Выезжает снизу. От 1150px – справа внизу (с 30.09.2026 в шапке компьютера кнопки нет). */
/* 27.09.2026 (Грег): «жёлтая кнопка внизу по размерам как и пилюля меню должна быть, по форме» – по центру, ширина
   пилюли (--pill-w ставит app.js, без скрипта – прежние поля 12px), высота 50px, скругление её же (--hdr-r: 16px, от 768px – 20px).
   Так и на 768–1149px (раньше там была справа, по ширине текста). Длинная подпись шире пилюли не обрезается – min-width. */
.m-dock{ position:fixed; left:0; right:0; margin-inline:auto; width:var(--pill-w, calc(100% - 24px)); min-width:max-content;
  bottom:calc(12px + env(safe-area-inset-bottom, 0px)); z-index:45;
  opacity:0; visibility:hidden; transform:translateY(calc(100% + 16px));
  transition:opacity .3s ease, transform .35s cubic-bezier(.2,.7,.25,1), visibility .35s; pointer-events:none; }
.m-dock.is-on{ opacity:1; visibility:visible; transform:none; pointer-events:auto; }
.m-dock .cta-btn{ display:flex; width:100%; height:50px; padding-block:0; border-radius:var(--hdr-r);
  justify-content:center; box-shadow:0 8px 24px rgba(31,33,32,.18); }
/* 30.09.2026 (Грег): и на компьютере – в шапке меню 126 кнопки заявки нет; справа внизу, по ширине подписи
   (right:32px, width:auto) – так было до 03.10.2026, см. ниже */
/* 03.10.2026 (Грег): «кнопка „Ekspresowa wycena“ – как плашка меню (те же параметры), такого же размера». Сначала док был
   близнецом плашки во всю её ширину (1314×90, охра 64 % с размытием);
   Грег в тот же день: «кнопку необходимо уменьшать и уводить в правый край, насыщать охрой», «до размера букв», «правый
   край кнопки там же можно оставить, по высоте уменьшить на 24 %», а на плотную охру – «прозрачность похоже исчезла?».
   От 1150px: кнопка справа внизу, правый край – по правому краю плашки шапки (ряд #top: 1354px минус поля 1.25rem), от низа
   окна 18px – как плашка от верха; высота 68px (90px плашки − 24 %), ширина – по подписи (поля 30px), скругление 28px и тень –
   плашки (--hdr-shadow).
   С вечера 03.10 охра – вид при наведении, в покое кнопка тёмная (см. «Цвета» в блоке правил ниже).
   Охра – стекло плашки, окрашенное охрой, в два слоя: .m-dock-glass (ставит app.js за доком) – то же стекло, что у шапки
   (--hdr-bg 64 % белого + --hdr-blur), по размеру кнопки (ширину --dock-w меряет app.js); сам док с охрой ложится на него
   умножением. Так охра насыщенная (на светлом фоне ≈ #E9AA1D), а страница под кнопкой видна, как под плашкой; охра 64 % обычным
   наложением на светлом выцветала до #EFC76A. Оба слоя – прямо в <body>: умножение из-под слоя с position:fixed на страницу
   не действует, а стекло внутри слоя с умножением не видит страницу.
   Над тёмным блоком (.m-dock.on-dark, ставит app.js) – как тёмная плашка меню (Грег: «прозрачность очень низкая, посмотри
   как в чёрной версии меню»): охра 78 % (доля --hdr-bg-dark) обычным наложением с тем же размытием – светлый текст под
   кнопкой виден так же, как под тёмной плашкой; умножение на чёрном дало бы чёрное, поэтому там без него и без подложки.
   Подпись – как на жёлтой полосе меню: «Ekspresowa wycena» 26px / 700 (.md-l, текст берёт app.js у .mnd-t; уже 1150px –
   прежняя .md-s). Слои: 46 – стекло, 47 – док. Появление – выездом, оба слоя одним переходом. */
.m-dock .md-l, .m-dock-glass{ display:none; }
@media (min-width:1150px){
  /* --dock-lift – подъём у конца страницы (app.js): кнопка не исчезает, а остаётся над подвалом и уезжает вместе со страницей */
  .m-dock, .m-dock-glass{ left:auto; right:calc(max(0px, (100% - 1354px) / 2) + 1.25rem); bottom:calc(18px + var(--dock-lift, 0px));
    transform:translateY(calc(100% + 30px));
    transition:transform .35s cubic-bezier(.2,.7,.25,1), opacity 0s linear .35s, visibility 0s linear .35s; }
  .m-dock.is-on{ transition:transform .35s cubic-bezier(.2,.7,.25,1), opacity 0s, visibility 0s; }
  /* Цвета (Грег, 03.10.2026, вечер: «давай перевернём цвета при наведении и в покое»).
     В покое – стекло тёмной плашки меню: --hdr-bg-dark 78 %, то же размытие и тёмная тень, подпись белая; так и на светлом,
     и на тёмном фоне.
     При наведении кнопка загорается охрой: на светлом – охра умножением на белом стекле плашки (.m-dock-glass, см. выше),
     на тёмном (.m-dock.on-dark) – охра 78 % обычным наложением с размытием. */
  .m-dock{ margin-inline:0; width:auto; min-width:0; z-index:47; }
  .m-dock-glass{ position:fixed; width:var(--dock-w, 0px); height:68px; border-radius:28px; pointer-events:none; opacity:0; visibility:hidden; }
  .m-dock-glass{ display:block; z-index:46; background:var(--hdr-bg); -webkit-backdrop-filter:var(--hdr-blur); backdrop-filter:var(--hdr-blur); }
  .m-dock.is-on ~ .m-dock-glass{ transform:none; transition:transform .35s cubic-bezier(.2,.7,.25,1), opacity 0s linear .3s, visibility 0s linear .3s; }
  .m-dock .cta-btn{ height:68px; padding-inline:30px; border-radius:28px; font-size:26px; font-weight:700; letter-spacing:-.035em;
    background:var(--hdr-bg-dark); color:var(--c-paper); -webkit-backdrop-filter:var(--hdr-blur); backdrop-filter:var(--hdr-blur);
    /* тень – та же минимальная, что у плашки меню (Грег, 11.10.2026: «убери тень под кнопкой, сделай аналогично с меню»);
       сама кнопка остаётся тёмной */
    box-shadow:var(--hdr-shadow);
    transition:background-color .3s ease, color .3s ease, box-shadow .3s ease; }
  .m-dock.on-dark .cta-btn{ box-shadow:var(--hdr-shadow-dark); }
  /* наведение на светлом: док – умножением, под ним появляется белое стекло; своё размытие кнопке тут не нужно */
  .m-dock:not(.on-dark):hover{ mix-blend-mode:multiply; }
  .m-dock:not(.on-dark) .cta-btn:hover, .m-dock:not(.on-dark) .cta-btn:focus-visible{ background:var(--c-terra); color:var(--c-ink);
    -webkit-backdrop-filter:none; backdrop-filter:none; box-shadow:var(--hdr-shadow); }
  .m-dock.is-on:not(.on-dark):hover ~ .m-dock-glass{ opacity:1; visibility:visible; transition:opacity 0s, visibility 0s; }
  /* наведение на тёмном */
  .m-dock.on-dark .cta-btn:hover, .m-dock.on-dark .cta-btn:focus-visible{ background:rgba(239,176,31,.78); color:var(--c-ink); }
  /* то же с клавиатуры */
  .m-dock:not(.on-dark):has(.cta-btn:focus-visible){ mix-blend-mode:multiply; }
  .m-dock.is-on:not(.on-dark):has(.cta-btn:focus-visible) ~ .m-dock-glass{ opacity:1; visibility:visible; transition:opacity 0s, visibility 0s; }
  .m-dock .cta-mark{ margin-left:12px; }
  .m-dock .md-s{ display:none; }
  .m-dock .md-l{ display:inline; }
}
@media (prefers-reduced-motion:reduce){ .m-dock, .m-dock.is-on, .m-dock-glass, .m-dock.is-on ~ .m-dock-glass{ transition:none; } }
@media print{ .m-dock, .m-dock-glass{ display:none; } }

/* Панель wyceny: вид перевода (.qd-kind, Грег, 26.09.2026) – «Tłumaczenie: Przysięgłe · Zwykłe · Nie wiem», необязательно.
   Строка по центру, как «Sprawa pilna» под ней: подпись тем же кеглем и тоном (17px / 500 / #4a4a45), варианты – плашки
   формы панели (скругление 10px, без капса), выбранная – охра, как включённый переключатель срочности. */
.qd .wy-v2 .qd-kind{ margin:26px 0 0; padding:0; border:0; min-width:0; text-align:center; }
.qd .wy-v2 .qd-kind legend{ display:block; width:100%; margin:0 0 .6rem; padding:0; font-size:17px; line-height:1.2; font-weight:500; color:#4a4a45; }
.qd .wy-v2 .qd-kind-opts{ display:flex; flex-wrap:wrap; justify-content:center; gap:8px; }
.qd .wy-v2 .qd-kind label{ position:relative; cursor:pointer; }
.qd .wy-v2 .qd-kind input{ position:absolute; opacity:0; width:1px; height:1px; margin:0; }
.qd .wy-v2 .qd-kind span{ display:inline-block; padding:.5rem .95rem; border:1px solid rgba(31,33,32,.22); border-radius:10px;
  font-size:16px; line-height:1.2; font-weight:500; color:var(--c-ink); background:transparent; transition:background-color .18s ease, border-color .18s ease; }
@media (hover:hover){ .qd .wy-v2 .qd-kind label:hover span{ border-color:rgba(31,33,32,.45); } }
.qd .wy-v2 .qd-kind input:checked + span{ background:var(--c-terra); border-color:var(--c-terra); }
.qd .wy-v2 .qd-kind input:focus-visible + span{ outline:2px solid var(--c-terra); outline-offset:3px; }
/* «Sprawa pilna» стоит теперь под выбором вида перевода – воздух между строками как между группами полей */
.qd .wy-v2 .qd-kind + .qd-urgent{ margin-top:22px; }

/* #cena на /tlumaczenia-przysiegle/: из столбца Go Tabular убрана строка «260 Apostille MSZ» (Грег, 26.09.2026: «блок про переводы»).
   Остались столбик 1125 / −10% и «90» под ним – это ≈1,75 кегля в высоту, а не 2,35: с 1024px кегль считаем по новой высоте,
   иначе «90» мельчало бы без причины. Отступ столбика сверху (был – от «260») не нужен. */
@media (min-width:1024px){
  .gt--ap.gt--tl{ --gt-f:min(var(--gt-fw), calc((100cqh - 40px) / 1.75)); }
}
.gt--tl .gt-m:first-child b, .gt--tl .gt-m:first-child small{ margin-top:0; }

/* ===== /apostille/ после аналитики 27.09.2026 (docs/analityka-apostille-2026-09-27.md) =====
   №17 – плита «Gdzie uzyskać Apostille» (#urzedy) светлая, как на /kontakt/: на чёрной мелкий серый текст не читался
   (решение владельца по анкете). Та же .gdz--light, но три колонки .ap3 со своими полями ячеек. Класса .slab нет
   намеренно – наблюдатель шапки считает .slab тёмной зоной. Цена чернильная: охра на песке не читается. */
.gdz--ap .ap3-cell + .ap3-cell{ border-top-color:rgba(31,33,32,.15); }
@media (min-width:1024px){ .gdz--ap .ap3-cell + .ap3-cell{ border-left-color:rgba(31,33,32,.15); } }
.gdz--ap .ap3-cell .ap-desc{ font-size:17px; color:var(--c-ink); }
.gdz--ap .slab-price::before{ background:rgba(31,33,32,.3); }
.gdz--ap .slab-price > span:not(.price-hit){ color:rgba(31,33,32,.7); }
.gdz--ap .slab-price b{ color:var(--c-ink); }
.gdz--ap .gdz-note{ margin-top:0; padding:1.35rem 1rem 1.5rem; }
@media (min-width:640px){ .gdz--ap .gdz-note{ padding:1.5rem 1.5rem 1.6rem; } }
/* №33 – от 1024px три ячейки делят строки (subgrid), цены и таблицы стоят на одной высоте.
   6 = детей .ap3-cell: подпись, h3, адрес, описание, dl, цена. Общее правило .gdz-meta (subgrid на 4 строки, для /kontakt/)
   здесь отключено – у ячеек разное число строк в таблице. */
@media (min-width:1024px){
  @supports (grid-template-rows:subgrid){
    .gdz--ap .ap3-cell{ display:grid; grid-template-rows:subgrid; grid-row:span 6; align-content:start; }
    .gdz--ap .gdz-meta{ grid-template-rows:none; grid-row:auto; align-self:start; }
    .gdz--ap .slab-price{ align-self:end; }
  }
}
/* №32 – подпись «Najczęściej – tak jest np. we Włoszech…» – довод, а не служебная строка: чернильная (только PL) */
html[lang="pl"] .zap-list small{ color:var(--c-ink); }
/* №21–22 – якоря для постов и ссылок (карточки документов, «Kolejność ma znaczenie», столбец цен, вопрос для окошка):
   тот же отступ под шапку, что у section[id] */
:is(.gdz-note, .gt-c5, .gt--ap, .ap-doc, .zap)[id], #dokumenty p[id]{ scroll-margin-top:88px; }
@media (min-width:1150px){ :is(.gdz-note, .gt-c5, .gt--ap, .ap-doc, .zap)[id], #dokumenty p[id]{ scroll-margin-top:124px; } }
/* Два выбора подряд в панели wyceny (27.09.2026): «Apostille na» (.qd-ap, только на страницах про Apostille) и «Tłumaczenie» –
   второй ближе к первому, чтобы читались одной группой */
.qd .wy-v2 .qd-kind + .qd-kind{ margin-top:18px; }
/* /apostille/ #urzedy, анкета 28.09.2026: до 1024px в ячейке сначала адрес, сроки и цена, описание – последним
   (плита на телефоне занимала 6 экранов, цена стояла после ~16 строк текста). От 1024px порядок прежний – subgrid выше. */
@media (max-width:1023px){
  .gdz--ap .ap3-cell{ display:flex; flex-direction:column; }
  .gdz--ap .ap3-cell .ap-desc{ order:1; margin-top:1.4rem; }
}

/* Выбор суда по городу – /apostille/pelnomocnictwo/#ktory-sad (29.09.2026). Карточка суда – общий .so-card
   со страницы /apostille-bez-przyjazdu/; select – нативный (на iPhone открывается системный список), 20px – без увеличения в Safari. */
.sad-pick-l{ display:block; font-size:20px; font-weight:700; letter-spacing:-.01em; line-height:1.25; max-width:34ch; }
.sad-pick-s{ margin-top:1rem; display:block; width:100%; max-width:420px; -webkit-appearance:none; appearance:none;
  background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%231F2120' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 4px center / 14px 10px;
  border:0; border-bottom:1px solid rgba(31,33,32,.35); border-radius:0; padding:.55rem 2rem .6rem 0;
  font:inherit; font-size:20px; line-height:1.3; color:var(--c-ink); cursor:pointer; }
.sad-pick-s:focus-visible{ outline:2px solid var(--c-terra); outline-offset:4px; }
.sad-pick-out .so-card{ padding:1.5rem 0 0; }
.sad-pick-next{ margin-top:1rem; font-size:17px; line-height:1.55; max-width:56ch; }
.sad-pick-note{ margin-top:1.6rem; font-size:15px; line-height:1.6; color:var(--c-ink); max-width:62ch; }
/* от 1024px: слева вопрос, выбор и примечание, справа карточка суда и «что дальше» – плашка не пустует */
@media (min-width:1024px){
  .sad-pick{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:3.5rem; align-items:start; }
  .sad-pick-l{ grid-column:1; grid-row:1; }
  .sad-pick-s{ grid-column:1; grid-row:2; }
  .sad-pick-note{ grid-column:1; grid-row:3; }
  .sad-pick-out{ grid-column:2; grid-row:1 / span 2; }
  .sad-pick-out .so-card{ padding-top:0; }
  .sad-pick-next{ grid-column:2; grid-row:3; }
}


/* =====================================================================================================
   Меню компьютера (30.09.2026; стенд docs/menu-desk/, вариант 126 – Грег: «126 реализуй на сайт», все языки).
   От 1150px шапка – одна плашка во всю ширину: логотип, серым «/ страница», бургер; пунктов и переключателя языка
   в ряду больше нет. Меню раскрывается вниз из той же плашки, как на планшете: строка языков справа, пункты в две
   колонки, колонка связи шириной со строку языков (WhatsApp, Telegram – «Napisz do nas» при наведении на строку),
   крупный номер с часами на уровне третьей строки пунктов, внизу жёлтая полоса «Ekspresowa wycena» с чёрной
   створкой: на ней по кругу три строки, при наведении створка уходит вправо и открывает «Otwórz formularz wyceny ⌄».
   Колонку связи, номер и полосу собирает app.js (.mnd-*); уже 1150px они скрыты – планшет и телефон как прежде.
   Открывается бургером, нажатием и наведением с задержкой (app.js). Не откатывать без Грега.
   ===================================================================================================== */
.mnd-rail, .mnd-num, .mnd-floor{ display:none; }
.mnd-grid{ display:contents; }
@media (min-width:1150px){
  /* ряд шапки: ширина – по ряду (края меню совпадают со стеклом, целые пиксели на 1440), без увеличения логотипа
     (рядом подпись страницы) */
  #top{ max-width:1354px; margin-inline:auto; --hdr-r:28px; --logo-scale:1 !important; --logo-extra:0px !important; }
  #top .hdr-row{ max-width:none !important; margin:0 !important; }
  #top #nav-main{ display:none !important; }
  #top .hdr-seg--lang .lang-wrap{ display:none; }
  #top #burger{ display:flex !important; }
  #top .hdr-seg--menu{ flex:1 1 auto; }
  #top .hdr-page{ display:block; flex:0 0 auto; margin-left:32px; white-space:nowrap; font-size:21px; font-weight:700; line-height:1;
    letter-spacing:-.035em; color:rgba(31,33,32,.45); }
  #top .hdr-page > span{ display:inline-block; white-space:pre; }
  #top .hdr-page > .hp-sub{ font-size:.9em; }   /* 19px при 21px раздела */
  #top .hdr-row.on-dark .hdr-page{ color:rgba(255,255,255,.5); }

  /* панель – под рядом, прозрачная; вниз растёт стекло ряда (--mn-h ставит app.js) */
  .hdr-row::before{ transition:background-color .25s ease, bottom .34s cubic-bezier(.2,.7,.25,1); }
  .hdr-row::after{ transition:box-shadow .25s ease, bottom .34s cubic-bezier(.2,.7,.25,1); }
  html.menu-open .hdr-row::before, html.menu-open .hdr-row::after{ bottom:calc(-1 * var(--mn-h, 0px)); }
  #mobile-nav{ --mn-top:108px; --mn-inset:50px; --mn-fs:26px; --mn-pad:13px;
    display:block; position:absolute; z-index:1; left:1.25rem; right:1.25rem; top:100%; margin:0;
    max-height:calc(100vh - var(--mn-top) - 12px); overflow-y:auto; overscroll-behavior:contain;
    border-radius:0 0 var(--hdr-r) var(--hdr-r); background:none; box-shadow:none;
    opacity:0; visibility:hidden; pointer-events:none; transition:opacity 0s linear .3s, visibility 0s linear .3s; }
  html.menu-open #mobile-nav{ opacity:1; visibility:visible; pointer-events:auto; transition:opacity 0s, visibility 0s; }
  #mobile-nav .mn-in{ -webkit-clip-path:inset(0 -40px 100% -40px); clip-path:inset(0 -40px 100% -40px);
    transition:clip-path .3s cubic-bezier(.2,.7,.25,1), -webkit-clip-path .3s cubic-bezier(.2,.7,.25,1); }
  html.menu-open #mobile-nav .mn-in{ -webkit-clip-path:inset(0 -40px 0 -40px); clip-path:inset(0 -40px 0 -40px);
    transition:clip-path .34s cubic-bezier(.2,.7,.25,1), -webkit-clip-path .34s cubic-bezier(.2,.7,.25,1); }
  #mobile-nav .mn-langs{ justify-content:flex-end; }
  #mobile-nav .mn-cta{ display:none; }

  /* пункты в две колонки + колонка связи шириной со строку языков (--mnd-w ставит app.js) */
  #mobile-nav .mnd-grid{ display:grid; grid-template-columns:minmax(0,1fr) var(--mnd-w, 340px); column-gap:3rem; align-items:start; }
  #mobile-nav .mnd-grid .mn-list{ display:grid; grid-template-columns:1fr 1fr; grid-template-rows:repeat(2, auto); column-gap:3rem; min-width:0; }
  #mobile-nav .mn-link:nth-child(1){ grid-area:1 / 1; }
  #mobile-nav .mn-link:nth-child(2){ grid-area:2 / 1; border-bottom:0; }
  #mobile-nav .mn-link:nth-child(3){ grid-area:1 / 2; }
  #mobile-nav .mn-link:nth-child(4){ grid-area:2 / 2; }
  #mobile-nav .mnd-rail{ display:flex; flex-direction:column; min-width:0; }
  #mobile-nav .mnd-rail a{ display:flex; align-items:center; justify-content:space-between; gap:12px; box-sizing:border-box;
    height:calc(var(--mn-fs) * 1.15 + 2 * var(--mn-pad) + 1px); border-bottom:1px solid rgba(31,33,32,.1);
    font-size:var(--mn-fs); font-weight:700; letter-spacing:-.035em; line-height:1.15; color:var(--c-ink); text-decoration:none; }
  #mobile-nav .mnd-rail a:focus-visible{ outline:2px solid currentColor; outline-offset:-2px; border-radius:6px; }
  /* «Napisz do nas» – как языки (16px, 400, тот же серый), появляется при наведении на строку */
  #mobile-nav .mnd-hint{ font-size:16px; font-weight:400; letter-spacing:normal; line-height:1.1; color:rgba(31,33,32,.72);
    opacity:0; transform:translateX(-6px); transition:opacity .2s ease, transform .25s cubic-bezier(.2,.7,.25,1); }
  #mobile-nav .mnd-rail a:hover .mnd-hint, #mobile-nav .mnd-rail a:focus-visible .mnd-hint{ opacity:1; transform:none; }
  header:has(.hdr-row.on-dark) #mobile-nav .mnd-hint{ color:rgba(255,255,255,.72); }

  /* крупный номер у правого края – поднят в пустую третью строку колонки связи, ближе к часам */
  /* номер с подписью опущен ближе к жёлтой полосе: от подписи до полосы 12px (Грег, 30.09.2026); полоса на месте –
     её отступ сверху уменьшен на те же 11px */
  /* подпись часов ближе к номеру на 3px (Грег, 30.09.2026): зазор 6 → 3, номер на месте, до полосы теперь 15px */
  #mobile-nav .mnd-num{ display:flex; flex-direction:column; align-items:flex-end; gap:3px; text-align:right;
    margin-top:calc(-1 * var(--mn-fs) * 1.15 - var(--mn-pad) + 8px); }
  #mobile-nav .mnd-num a{ position:relative; top:5px; font-size:38px; font-weight:700; letter-spacing:-.03em; line-height:1; color:var(--c-ink); text-decoration:none; }
  /* «+48» мелко у верха цифр, номер – основа (Грег, 30.09.2026) */
  #mobile-nav .mnd-num .mnd-cc{ position:relative; top:-13px; margin-right:.4em; font-size:16px; font-weight:700; letter-spacing:0; }
  #mobile-nav .mnd-num span{ font-size:16px; font-weight:600; color:rgba(31,33,32,.55); }
  header:has(.hdr-row.on-dark) #mobile-nav .mnd-num span{ color:rgba(255,255,255,.6); }
  /* над тёмной секцией ссылки меню белеют (a:not(.cta-btn)) – полоса ссылка, но на охре текст чернильный */
  header:has(.hdr-row.on-dark) #mobile-nav a.mnd-floor{ color:var(--c-ink); }

  /* жёлтая полоса: поля 10px внутри плашки, скругление 18 (плашка 28 = 18 + 10); охра – только до левого края
     створки (--cl), под створку подкладывается при наведении и убирается через .75s после ухода, иначе на углах
     створки из-под неё просвечивает жёлтая дуга */
  #mobile-nav .mnd-floor{ position:relative; display:flex; align-items:center; margin:9px calc(10px - var(--mn-inset)) -12px;
    padding:24px calc(var(--mn-inset) - 10px) 26px; border-radius:18px; overflow:hidden; color:var(--c-ink); text-decoration:none;
    font-size:var(--mn-fs); font-weight:700; letter-spacing:-.035em; line-height:1.1;
    background:linear-gradient(var(--c-terra), var(--c-terra)) 0 0 / calc(var(--cl, 100%) + 2px) 100% no-repeat;
    transition:background-size 0s linear .75s; }
  #mobile-nav .mnd-floor:hover, #mobile-nav .mnd-floor:focus-visible{ background-size:100% 100%; transition:background-size 0s; }
  /* «Ekspresowa wycena» – по центру жёлтой зоны, без привязки к оси пунктов (Грег, 30.09.2026) */
  #mobile-nav .mnd-floor{ padding-left:0; }
  #mobile-nav .mnd-t{ flex:0 0 var(--cl, 40%); text-align:center; }
  #mobile-nav .mnd-floor:focus-visible{ outline:2px solid var(--c-ink); outline-offset:3px; }
  #mobile-nav .mnd-cur{ position:absolute; top:0; bottom:0; right:0; left:var(--cl, 60%); display:flex; align-items:center; justify-content:flex-end;
    gap:14px; padding:0 calc(var(--mn-inset) - 10px) 0 28px; overflow:hidden; background:var(--c-ink); color:var(--c-paper);
    transition:transform .7s cubic-bezier(.6,0,.2,1); }
  /* при наведении створка уезжает влево на --sl и накрывает «Ekspresowa wycena»: её строка остаётся на виду, справа сразу охра
     с «Otwórz formularz wyceny» (стенд docs/menu-desk/, вариант 113; Грег, 30.09.2026); --sl считает app.js */
  #mobile-nav .mnd-floor:hover .mnd-cur, #mobile-nav .mnd-floor:focus-visible .mnd-cur{ transform:translateX(calc(-1 * var(--sl, 50%))); }
  /* растровый переход охры в чёрную створку (вариант 190 стенда; Грег, 01.10.2026): створка прозрачна в зоне --hr, чёрное там
     рисует SVG с маской-растром (app.js), в дырках – сама охра кнопки: её фон продлён под створку на --hr, шва нет */
  #mobile-nav .mnd-cur{ background:linear-gradient(to right, transparent var(--hr, 0px), var(--c-ink) var(--hr, 0px)); }
  #mobile-nav .mnd-floor{ background-size:calc(var(--cl, 100%) + var(--hr, 0px) + 2px) 100%; }
  #mobile-nav .mnd-ht{ position:absolute; left:0; top:0; z-index:0; pointer-events:none; overflow:visible; }
  #mobile-nav .mnd-ht-ink{ fill:var(--c-ink); }
  #mobile-nav .mnd-cur > :not(.mnd-ht){ position:relative; z-index:1; }
  #mobile-nav .mnd-car{ position:relative; flex:1; min-width:0; height:38px; overflow:hidden; }
  #mobile-nav .mnd-car span{ position:absolute; right:0; top:0; white-space:nowrap; font-size:28px; font-weight:800; letter-spacing:-.03em; line-height:38px;
    transform:translateY(100%); opacity:0; transition:transform .5s cubic-bezier(.3,.7,.2,1), opacity .4s ease; }
  #mobile-nav .mnd-car span.on{ transform:none; opacity:1; }
  #mobile-nav .mnd-car span.out{ transform:translateY(-100%); opacity:0; }
  #mobile-nav .mnd-go{ position:absolute; top:0; bottom:0; right:calc(var(--mn-inset) - 10px); display:flex; align-items:center;
    font-size:28px; font-weight:800; letter-spacing:-.03em; }
  #mobile-nav .mnd-cur .cta-mark, #mobile-nav .mnd-go .cta-mark{ margin-left:12px; }
  /* на охре стрелка вниз и мягко пульсирует, на чёрном – вправо */
  #mobile-nav .mnd-go .cta-mark{ transform:translateY(-.08em) rotate(90deg); }
  #mobile-nav .mnd-go .cta-mark svg{ animation:mndPulse 1.6s ease-in-out infinite; }
  @keyframes mndPulse{ 0%,55%,100%{ transform:translateX(0); } 25%{ transform:translateX(.16em); } }

  /* Языки – этажом выше: в ряду шапки, слева от крестика, видны при открытом меню (app.js переносит .mn-langs в .hdr-seg--menu от 1150px;
     Грег, 01.10.2026: «языки на один этаж выше»). Общая сетка .mn-in: слева пункты (3 строки), справа WhatsApp и Telegram – отдельными
     строками по левому краю колонки, номер – в третьей; под строками линии с разрывами между колонками. Первая тонкая линия – целая,
     на 8px выше прежнего (Грег, 01.10.2026: «поднять на 4–6 px», затем ещё на 3): панель со стеклом поднята на 8px, пункты опущены внутри на те же 8px –
     двигается только линия (над краем панели её рисовать нельзя – #mobile-nav с overflow-y:auto срезает всё выше себя) */
  #mobile-nav .mn-in{ display:grid; grid-template-columns:minmax(0,1fr) var(--mnd-w, 340px); column-gap:3rem; align-items:start; position:relative; padding-top:8px; }
  #mobile-nav .mn-in::before{ content:""; position:absolute; left:var(--mn-inset); right:var(--mn-inset); top:0; height:1px; background:rgba(31,33,32,.1); }
  header:has(.hdr-row.on-dark) #mobile-nav .mn-in::before{ background:rgba(255,255,255,.14); }
  #mobile-nav{ top:calc(100% - 8px); }
  html.menu-open .hdr-row::before, html.menu-open .hdr-row::after{ bottom:calc(8px - var(--mn-h, 0px)); }
  #mobile-nav .mnd-grid{ display:contents; }
  #mobile-nav .mnd-grid .mn-list{ grid-column:1; grid-row:1 / span 3; }
  #mobile-nav .mnd-rail{ grid-column:2; grid-row:1 / span 2; }
  #mobile-nav .mnd-num{ grid-column:2; grid-row:3; margin-top:12px; }
  #mobile-nav .mnd-floor{ grid-column:1 / -1; grid-row:4; }
  #top .hdr-seg--menu .mn-langs{ display:flex; gap:0 30px; margin:0 6px 0 0; padding:0; border:0;
    opacity:0; visibility:hidden; transition:opacity .2s ease, visibility 0s linear .2s; }
  html.menu-open #top .hdr-seg--menu .mn-langs{ opacity:1; visibility:visible; transition:opacity .25s ease .06s, visibility 0s; }
  header:has(.hdr-row.on-dark) .hdr-seg--menu a.mn-lang{ color:var(--c-paper); }
  header:has(.hdr-row.on-dark) .hdr-seg--menu a.mn-lang:not(.is-current){ color:rgba(255,255,255,.72); }

  /* облачко «napisz do nas» – сразу за названием наведённого мессенджера, через 36px (Грег, 01.10.2026: «баблы очень далеко от Telegram
     и Wapp»; 36px – Грег, 01.10.2026): три прыгающие точки, через 0,9 с – подпись (как «Печатает…», вариант 130 стенда). Хвостик – к названию. Облачко – часть
     ссылки, по нему тоже можно нажать; на 1px ниже середины строки (Грег, 01.10.2026: «поднять на 1 px», было 2px) */
  /* отступ облачка от слова – свой у каждого (Грег, 01.10.2026: «для Wapp 39, а Teleg 43») */
  #mobile-nav .mnd-rail a{ position:relative; justify-content:flex-start; gap:39px; }
  #mobile-nav .mnd-rail a + a{ gap:43px; }
  #mobile-nav .mnd-rail .mnd-hint{ position:relative; z-index:1; top:1px; flex:none; height:30px; display:flex; align-items:center; gap:4px;
    padding:0 12px; border-radius:15px 15px 15px 4px; background:#fff; box-shadow:0 1px 3px rgba(31,33,32,.08); color:rgba(31,33,32,.72);
    font-size:15px; font-weight:400; letter-spacing:normal; line-height:1.1; white-space:nowrap; pointer-events:none;   /* текст – как неактивный язык, на кегль меньше */
    transform:scale(.6); transform-origin:0 100%; transition:transform .3s cubic-bezier(.3,1.5,.5,1), opacity .2s ease; }
  #mobile-nav .mnd-rail a:hover .mnd-hint, #mobile-nav .mnd-rail a:focus-visible .mnd-hint{ pointer-events:auto; transform:none; }
  header:has(.hdr-row.on-dark) #mobile-nav .mnd-rail .mnd-hint{ color:rgba(31,33,32,.72); }
  #mobile-nav .mnd-hint i{ width:6px; height:6px; border-radius:50%; background:rgba(31,33,32,.5); animation:mndDot 1s infinite; }
  #mobile-nav .mnd-hint i:nth-child(2){ animation-delay:.15s; }
  #mobile-nav .mnd-hint i:nth-child(3){ animation-delay:.3s; }
  @keyframes mndDot{ 0%,60%,100%{ transform:none; opacity:.4; } 30%{ transform:translateY(-5px); opacity:1; } }
  #mobile-nav .mnd-hint em{ display:none; font-style:normal; }
  #mobile-nav .mnd-hint.done i{ display:none; }
  #mobile-nav .mnd-hint.done em{ display:inline; }
}
@media (min-width:1150px) and (prefers-reduced-motion:reduce){
  #mobile-nav .mnd-cur, #mobile-nav .mnd-car span, #mobile-nav .mnd-hint{ transition:none; }
  #mobile-nav .mnd-go .cta-mark svg{ animation:none; }
  #mobile-nav .mnd-hint i{ display:none; }
  #mobile-nav .mnd-hint em{ display:inline; }
}

/* Плашка-ссылка «Masz dokument z Ukrainy?» – /apostille/ сразу под первым экраном (30.09.2026, проба перед решением о пункте меню).
   Вопрос – заголовок плиты как в #odbior (600, 26/34, lh 1.03), текст 17px чернильный, внизу ссылка-стрелка; вся плашка кликабельна.
   От 768px вопрос слева, текст и стрелка справа. */
.ua-hop{ display:grid; gap:1rem; padding:1.75rem; text-decoration:none; color:var(--c-ink); transition:background-color .2s ease; }
@media (min-width:640px){ .ua-hop{ padding:2.25rem 2.5rem; } }
@media (min-width:768px){ .ua-hop{ grid-template-columns:minmax(0,5fr) minmax(0,7fr); gap:2.5rem; align-items:start; } }
.ua-hop-q{ font-weight:600; font-size:26px; line-height:1.03; letter-spacing:-.045em; }
@media (min-width:640px){ .ua-hop-q{ font-size:34px; } }
.ua-hop-body{ display:grid; gap:1rem; justify-items:start; }
.ua-hop-t{ font-size:17px; line-height:1.55; max-width:56ch; }
.ua-hop .ua-hop-go{ margin-top:0; }
@media (hover:hover){ .ua-hop:hover{ background-color:#DDDDD8; } .ua-hop:hover .k-where-link svg{ transform:translateX(4px); } }
.ua-hop:focus-visible{ outline:2px solid var(--c-terra); outline-offset:4px; }

/* .ua-hop, вариант 2 (30.09.2026, владелец: «текста скудно, фигня про доставку»): слева вопрос, пояснение и стрелка,
   справа три типичных случая строками «документ · срок – цена» (данные – /apostille-ukraina/); про пересылку не пишем. */
.ua-hop-head{ display:grid; gap:1rem; justify-items:start; align-content:start; }
.ua-hop-list{ display:grid; }
.ua-hop-row{ display:flex; align-items:baseline; justify-content:space-between; gap:1.25rem; padding:.9rem 0; border-top:1px solid rgba(31,33,32,.14); }
.ua-hop-row:last-child{ border-bottom:1px solid rgba(31,33,32,.14); }
.ua-hop-n{ display:grid; gap:.2rem; font-size:17px; line-height:1.35; font-weight:600; }
.ua-hop-n small{ font-size:15px; font-weight:400; line-height:1.4; color:var(--c-ink); }
.ua-hop-row b{ font-size:20px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
@media (min-width:768px){ .ua-hop{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; } }
/* .ua-hop на телефоне: название во всю ширину, цена строкой ниже – иначе колонка цены сжимала названия до 4 строк */
@media (max-width:639px){
  .ua-hop-row{ flex-direction:column; align-items:flex-start; gap:.35rem; }
  .ua-hop-row b{ font-size:18px; }
}

/* /kontakt/ hero – четыре кнопки (30.09.2026, аналитика К2): на телефоне две строки по две, главная не во всю ширину;
   уже 400px у главной прячется стрелка и сужаются поля – иначе «Zamów wycenę» не влезает в половину экрана 320px */
@media (max-width:479px){ .hero-cta--4 .cta-btn--main{ grid-column:auto; } }
@media (max-width:399px){
  .hero-cta--4 .cta-btn--main .cta-mark{ display:none; }
  .hero-cta--4 .cta-btn, .hero-cta--4 .cta-btn:not(.cta-btn--main){ padding-left:.45em; padding-right:.45em; }
}
/* календарь записи на тёмном (30.09.2026, аналитика К6): дни недели читаемее – были 11px и .36 (контраст 3,3) */
.cal-wd{ font-size:12px; color:rgba(255,255,255,.62); }
[data-book] .cal-cell.is-out.is-past:not(.is-weekend){ color:rgba(255,255,255,.4); }
[data-book] .cal-cell.is-past.is-weekend{ color:rgba(255,255,255,.4); }

/* Аналитика /apostille/ 30.09.2026 (PL). Карточки #dokumenty хаба: текст короче, под ним ссылка-стрелка на подстраницу (К3) */
.ap-doc .k-where-link{ margin-top:.75rem; font-size:16px; }
/* Список цен подстраниц: названия услуг – читаемый текст, поэтому чернильные (цвет по роли, К6) */
html[lang="pl"] #ile-trwa .faq-price span{ color:var(--c-ink); }
/* Крупная цена и срок в #ile-trwa – смысловой узел парой начертаний: жирная цена, светлый курсив срока (К6).
   Владелица 01.10.2026: «чтоб везде выглядело как один стиль» – akt-urodzenia (260), pełnomocnictwo (380), KRK (460) */
.ile-big{ margin-top:1.5rem; display:flex; flex-wrap:wrap; align-items:baseline; column-gap:.45em; row-gap:.2em;
  line-height:.95; letter-spacing:-.035em; }
.ile-big b{ font-weight:900; font-size:clamp(52px, 13vw, 88px); white-space:nowrap; font-variant-numeric:tabular-nums; }
.ile-big > span{ font-weight:300; font-style:italic; font-size:clamp(22px, 5vw, 34px); letter-spacing:-.02em; }

/* Выбор суда, 01.10.2026: подсказка до выбора города – только от 1024px, где справа пустует половина плашки
   (на телефоне карточка и так встаёт сразу под выбором); строка над карточкой для городов без своего суда;
   отступ под шапку для ссылки сразу на город (#sad-<город>) */
.sad-pick-empty{ display:none; }
.sad-pick-empty p{ font-size:17px; line-height:1.55; max-width:44ch; }
.sad-pick-empty p + p{ margin-top:1rem; }
@media (min-width:1024px){ .sad-pick-empty:not([hidden]){ display:block; } }
.sad-pick-via{ padding-top:1.5rem; font-size:17px; line-height:1.5; font-weight:600; max-width:44ch; }
.sad-pick-via + .so-card, .sad-pick-via:not([hidden]) ~ .so-card{ padding-top:.6rem; }
.sad-pick{ scroll-margin-top:88px; }
@media (min-width:1150px){ .sad-pick{ scroll-margin-top:124px; } }
@media (min-width:1024px){ .sad-pick-via{ padding-top:0; } }

/* Образец клаузулы Apostille в #co-to-jest на /apostille/ (01.10.2026): фото слева, подпись run-in справа от 768px */
.ap-wzor{ margin-top:2.5rem; display:grid; gap:1rem; align-items:end; }
.ap-wzor img{ display:block; width:100%; max-width:585px; height:auto; border-radius:14px; border:1px solid rgba(31,33,32,.12); background:#fff; }
.ap-wzor figcaption{ font-size:15px; line-height:1.55; color:var(--c-ink); max-width:44ch; }
.ap-wzor figcaption b{ font-weight:700; }
@media (min-width:768px){ .ap-wzor{ grid-template-columns:minmax(0,585px) minmax(0,1fr); gap:2rem; } }
#wzor{ scroll-margin-top:88px; }
@media (min-width:1150px){ #wzor{ scroll-margin-top:124px; } }

/* .ua-hop на телефоне в один экран (владелица 01.10.2026; было 939px на 320): уже 640px – короткий текст
   (.ua-hop-t--short, длинный остаётся от 640px) и строки цен компактнее – цена справа от названия, срок под ним */
.ua-hop-t--short, .ua-hop-q-go{ display:none; }
@media (max-width:639px){
  .ua-hop{ padding:1.5rem 1.4rem; gap:.9rem; }
  .ua-hop-t--long{ display:none; }
  .ua-hop-t--short{ display:block; }
  /* стрелка – у вопроса, отдельная строка-ссылка «Apostille na Dokumenty z Ukrainy» здесь скрыта (вся плашка – ссылка) */
  .ua-hop-go{ display:none; }
  .ua-hop-q-go{ display:inline-block; width:.62em; height:.62em; margin-left:.3em; vertical-align:.02em; }
  /* строка – сетка: название и цена в одной линии, срок под ними во всю ширину (.ua-hop-n раскрыт через contents) */
  .ua-hop-row{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:.9rem; row-gap:.2rem; align-items:baseline; padding:.7rem 0; }
  .ua-hop-n{ display:contents; font-size:16px; line-height:1.3; }
  .ua-hop-n small{ grid-column:1 / -1; grid-row:2; font-size:14px; line-height:1.4; }
  .ua-hop-row b{ grid-column:2; grid-row:1; font-size:17px; }
}

/* Krok po kroku – шаги стопкой карточек (01.10.2026, вариант 39 со стенда docs/kroki/, Грег: «39 реализуй на сайте»).
   Только блоки .kt-steps[data-kroki] – пока польские страницы (/apostille-bez-przyjazdu/, /apostille-ukraina/, /kontakt/);
   ua/ru/en – прежний список, переводы потом. Собирает app.js (блок «Krok po kroku» перед панелью wyceny); без JS – обычный список.
   Блок встаёт на месте, прокрутка ведёт шаги ПО ШАГУ: карточка стоит целиком, пока заполняется следующий отрезок полосы,
   потом вылетает вверх, под ней уже целиком следующая (без медленных затуханий). Под текущей – края 2–3 следующих (стопка).
   Номер шага – водяным знаком на самой карточке. Последний слайд – жёлтая «Prześlij zdjęcia dokumentu» с кнопкой формы.
   Полоса уже карточки на её поле: заполняемый отрезок белый, пройденные серые; первого отрезка нет (он всегда полный).
   Под полосой «Pokaż wszystkie kroki» (обычный список без номеров) и «Pomiń» – строка шире карточки на её поле. */
.kt-steps.kk-on > .kt-steps-list{ display:none; }
.kk{ position:relative; margin-top:2rem; }
.kk-pin{ position:sticky; top:110px; padding:6px 0 10px; }
.kk-st{ position:relative; }
.kk-c{ position:absolute; left:calc((100% - min(760px, 100%)) / 2); top:0; width:min(760px, 100%); box-sizing:border-box;
  padding:34px 40px 38px; border-radius:26px; background:var(--c-paper); cursor:pointer; overflow:hidden; will-change:transform;
  --sx:12px; --sy:8px; box-shadow:0 1px 2px rgba(31,33,32,.05), 0 10px 24px -14px rgba(31,33,32,.22);
  transform-origin:50% 100%; transition:transform .5s cubic-bezier(.5,0,.75,0), opacity .12s linear .38s, box-shadow .3s ease; }
.kk-c.kk-cta{ background:var(--c-terra); overflow:visible; }
.kk-c:not(.is-cur){ pointer-events:none; }
.kk-c.is-next{ transform:translate(calc(var(--d) * var(--sx)), calc(var(--d) * var(--sy))) scale(calc(1 - var(--d) * .015));
  transition:transform .45s cubic-bezier(.2,.7,.3,1); }
.kk-c.is-next .kk-in{ opacity:0; }
.kk-c.is-deep{ visibility:hidden; }
.kk-c.is-past{ transform:translateY(-135%) rotate(-2deg); opacity:0; box-shadow:0 24px 40px -20px rgba(31,33,32,.3); }
.kk-c.is-cur{ transition:transform .45s cubic-bezier(.2,.7,.3,1), opacity .06s linear, box-shadow .3s ease; }
.kk-in{ position:relative; z-index:1; display:flex; flex-direction:column; height:100%; }
.kk-t{ margin:0 0 18px; font-size:44px; line-height:1.02; letter-spacing:-.045em; color:var(--c-ink); }
.kk-t b{ font-weight:900; }
.kk-t i{ font-weight:300; }
.kk-x{ margin:0; font-size:20px; line-height:1.5; color:var(--c-ink); }
.kk-btn{ margin:auto 0 0; padding-top:26px; }
.kk-btn .cta-btn{ font-size:19px; max-width:100%; }
.kk-wm{ position:absolute; right:-.04em; bottom:-.2em; z-index:0; pointer-events:none; -webkit-user-select:none; user-select:none;
  font-family:'Fira Sans Condensed','Fira Sans',sans-serif; font-weight:900; font-size:300px; line-height:1; letter-spacing:-.04em; color:#ECECE8; }
.kk-nav{ position:relative; margin-top:24px; }
.kk-seg{ display:grid; grid-template-columns:repeat(var(--n), minmax(0, 1fr)); column-gap:2rem; margin:0; padding:0; list-style:none; }
.kk-seg li{ min-width:0; }
.kk-seg button{ display:block; width:100%; padding:6px 0; border:0; background:none; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.kk-seg .bar{ position:relative; display:block; height:10px; border-radius:5px; background:var(--c-sand); overflow:hidden; }
.kk-seg .bar i{ position:absolute; inset:0; background:var(--c-paper); transform:scaleX(var(--f, 0)); transform-origin:0 50%; transition:background-color .2s ease; }
.kk-seg li.done .bar i, .kk-seg li.on .bar i{ background:rgba(31,33,32,.2); }
.kk-seg button:focus-visible{ outline:2px solid var(--c-ink); outline-offset:2px; border-radius:6px; }
.kk-ln{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px 16px; margin:12px -80px 0; }
.kk-ln button, .kk-back button{ display:inline-flex; align-items:center; gap:8px; padding:0; border:0; background:none; cursor:pointer;
  font-weight:600; font-size:16px; line-height:1.3; color:var(--c-ink); white-space:nowrap; }
.kk-ln svg, .kk-back svg{ width:14px; height:14px; flex:none; transition:transform .25s cubic-bezier(.2,.7,.25,1); }
.kk-ln button:hover svg, .kk-back button:hover svg{ transform:translateX(3px); }
.kk-ln button.dn svg{ transform:rotate(90deg); }
.kk-ln button.dn:hover svg{ transform:rotate(90deg) translateX(3px); }
.kk-all{ margin:2rem 0 0; padding:0; list-style:none; display:grid; gap:18px; max-width:70ch; }
.kk-all li{ font-size:17px; line-height:1.55; color:var(--c-ink); }
.kk-all b{ font-weight:700; }
.kk-back{ margin:1.5rem 0 0; }
.kk-all[hidden], .kk-back[hidden]{ display:none; }   /* свой display перебивал бы hidden */
@media (max-width:1023px){
  .kk-pin{ top:24px; }
  .kk-c{ padding:26px 26px 30px; }
  .kk-t{ font-size:34px; }
  .kk-x{ font-size:18px; }
  .kk-seg{ column-gap:12px; }
  .kk-ln{ margin-left:-46px; margin-right:-46px; }
  .kk-wm{ font-size:240px; }
}
@media (max-width:767px){ .kk-seg{ column-gap:6px; } }
@media (max-width:639px){
  .kk-c{ padding:22px 20px 26px; border-radius:22px; --sx:6px; --sy:6px; }
  .kk-t{ font-size:27px; margin-bottom:12px; }
  .kk-x{ font-size:17px; }
  .kk-btn{ padding-top:20px; }
  .kk-btn .cta-btn{ display:flex; width:100%; justify-content:space-between; white-space:normal; text-align:left; font-size:17px; line-height:1.2; padding:.8em 1em .8em 1.1em; }
  .kk-ln{ margin-left:-32px; margin-right:-32px; }
  .kk-wm{ font-size:200px; }
}
@media (prefers-reduced-motion:reduce){ .kk-c, .kk-seg .bar i, .kk-ln svg, .kk-back svg{ transition:none !important; } }
/* Индикатор шагов – точки в пилюле, как у галерей apple.com (Грег, 04.10.2026: «реализуй по такому же принципу и у нас на сайте»; кнопку
   повтора рядом с пилюлей он зачеркнул). Заменяет полосу из равных отрезков (.kk-seg выше – больше не собирается, правила оставлены).
   Точка на каждый слайд, включая слайд заявки: 8px, через 16px. У текущего слайда точка вытянута в полоску 48px (.on), и полоска
   заполняется слева направо, пока слайд читают (--f ставит app.js); заполнилась – слайд сменился, полоска за 0,4 с снова стала точкой,
   вытянулась следующая. Точки нажимаются (переход к слайду), зона нажатия – во всю высоту пилюли.
   От 768px пилюля стоит по центру той же строки, что «Pokaż wszystkie kroki» и «Pomiń»; уже – над этой строкой. */
.kk-dots{ display:flex; align-items:center; width:max-content; height:48px; margin:0 auto; padding:0 14px; list-style:none; border-radius:24px; background:var(--c-sand); }
.kk-dots button{ display:flex; align-items:center; height:48px; padding:0 8px; border:0; background:none; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.kk-dots .bar{ position:relative; display:block; width:8px; height:8px; border-radius:4px; overflow:hidden; background:rgba(31,33,32,.3);
  transition:width .4s cubic-bezier(.3,.7,.3,1), background-color .2s ease; }
.kk-dots li.on .bar{ width:48px; }
/* заполнение – полоска того же размера, выезжает слева: передний край скруглён, задний срезает сама дорожка */
.kk-dots .bar i{ position:absolute; inset:0; border-radius:4px; background:var(--c-ink); opacity:0; transform:translateX(calc((var(--f, 0) - 1) * 100%)); transition:opacity .2s ease; }
.kk-dots li.on .bar i{ opacity:1; }
@media (hover:hover){ .kk-dots li:not(.on) button:hover .bar{ background:rgba(31,33,32,.55); } }
.kk-dots button:focus-visible{ outline:2px solid var(--c-ink); outline-offset:-8px; border-radius:14px; }
.kk-dots + .kk-ln{ margin-top:12px; }
@media (min-width:768px){
  .kk-dots{ position:absolute; left:50%; top:0; z-index:1; margin:0; transform:translateX(-50%); }
  .kk-dots + .kk-ln{ margin-top:0; min-height:48px; align-items:center; }
}
/* на тёмном: пилюля – светлая подложка 10 %, как серые кружки календаря, точки и заполнение белые */
.bg-ink .kk-dots{ background:rgba(255,255,255,.1); }
.bg-ink .kk-dots .bar{ background:rgba(255,255,255,.42); }
.bg-ink .kk-dots .bar i{ background:var(--c-paper); }
@media (hover:hover){ .bg-ink .kk-dots li:not(.on) button:hover .bar{ background:rgba(255,255,255,.7); } }
.bg-ink .kk-dots button:focus-visible{ outline-color:var(--c-paper); }
@media (prefers-reduced-motion:reduce){ .kk-dots .bar, .kk-dots .bar i{ transition:none; } }

/* Заголовки разделов (h2 34/48px) с 01.10.2026 – одним начертанием 900, без пары со светлым курсивом (стенд docs/naglowki/,
   вариант 7; пара осталась у FAQ и карточек). Строки делятся поровну, чтобы последнее слово не висело одно
   («Ile trwa i ile kosztuje Apostille na / odpis»). */
h2[class*="text-[34px]"]{ text-wrap:balance; }

/* ===== Прайс /cennik/ #ceny, вид 116 со стенда docs/ceny-gt (Грег, 02.10.2026: «реализуй на сайт»). Только PL – раздел
   помечен .cn-v3; ua/ru/en /cennik/ со старой разметкой не задеты. Правила собраны со стенда как есть (88 → 98 → 99 → 107 →
   109 → 110 → 111–116): группа – серая плита со строками-кнопками (li.xh, раскрытая – .open, белая), цена – курсив 800
   (свёрнутая 44px, раскрытая 58px; «Wycena» не растёт), окончание по одной схеме (.xe: значение · zł · единица ·
   пояснение капсом), «Odbiór i wysyłka» – жёлтая плита со списком /kontakt/ (.cg105), «W cenie / Poza ceną» – две плиты
   (.cg108), названия и заголовки – пара Fira Sans Condensed 700 + 400 (.xp). Поведение – «Прайс /cennik/ (.cn-v3)» в app.js. */
#ceny.cn-v3 .cn-list li.xpopli{position:relative;margin-top:18px}
#ceny.cn-v3 .xpop{position:absolute;z-index:2;top:-11px;left:1.4rem;background:var(--c-terra);color:var(--c-ink);border-radius:6px;padding:.4em .7em .45em;font:700 12px/1 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;box-shadow:0 2px 6px rgba(31,33,32,.12);pointer-events:none}
#ceny.cn-v3 .tcell{flex-direction:row!important;align-items:baseline;gap:8px;position:relative;padding:0 14px 0 0!important}
#ceny.cn-v3 .tcell .price-hit b.tp{font:italic 800 var(--tf,52px)/.85 "Fira Sans",sans-serif!important;letter-spacing:-.03em!important;font-variant-numeric:tabular-nums lining-nums;background:none!important;padding:0 .04em 0 0;margin:0;color:var(--c-ink)}
#ceny.cn-v3 .tcell .tu{display:flex;align-items:baseline;gap:5px;white-space:nowrap;align-self:center;translate:0 calc(var(--tf,52px) * .08)}
#ceny.cn-v3 .tcell .tz{font:italic 800 calc(var(--tf,52px) * .36)/1 "Fira Sans",sans-serif;letter-spacing:-.01em;color:var(--c-ink)}
#ceny.cn-v3 .tcell small{margin:0!important;font:500 12px/1 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;color:rgba(31,33,32,.72)!important}
#ceny.cn-v3 .tcell{--tf:52px}
#ceny.cn-v3 .cn-list{border-top:0!important}
#ceny.cn-v3 .cn-list::before{display:none}
#ceny.cn-v3 .cn-list li{border:0!important;background:var(--c-sand);border-radius:16px;padding:1.1rem 1.4rem!important;margin-top:8px}
#ceny.cn-v3 .cn-desc,#ceny.cn-v3 .cn-name small,#ceny.cn-v3 .cn-sum{color:var(--c-ink)!important;font-size:17px!important;line-height:1.45!important;font-weight:500}
#ceny.cn-v3 .cn-name small{display:block;margin-top:.25rem}
#ceny.cn-v3 .cn-price:not(.tcell) b{font:italic 800 30px/1 "Fira Sans",sans-serif!important;letter-spacing:-.02em!important;text-transform:none!important;background:none!important;padding:0!important;margin:0!important;color:var(--c-ink)!important}
#ceny.cn-v3 .cn-price:not(.tcell) small{font:500 12px/1.2 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:.14em!important;text-transform:uppercase;color:rgba(31,33,32,.72)!important}
#ceny.cn-v3.xexp .cn-list li.xh .cn-desc,#ceny.cn-v3.xexp .cn-list li.xh .cn-sum,#ceny.cn-v3.xexp .cn-list li.xh .cn-tags,#ceny.cn-v3.xexp .cn-list li.xh .cn-name small{display:none!important}
#ceny.cn-v3.xexp .cn-list li.xh.open .cn-desc,#ceny.cn-v3.xexp .cn-list li.xh.open .cn-sum,#ceny.cn-v3.xexp .cn-list li.xh.open .cn-name small{display:block!important;animation:xIn .35s ease both}
#ceny.cn-v3.xexp .cn-list li.xh.open .cn-tags{display:contents!important}
@keyframes xIn{from{opacity:0;transform:translateY(-4px)}}
#ceny.cn-v3.xexp .cn-list li.xh{cursor:pointer}
#ceny.cn-v3 .cn-name{display:block!important}
#ceny.cn-v3 .xc{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto;color:var(--c-ink);vertical-align:1px;margin-left:8px;flex:none}
#ceny.cn-v3 .xc svg{width:14px;height:14px;transform:rotate(90deg);transition:transform .3s cubic-bezier(.4,0,.2,1)}
#ceny.cn-v3 .cn-list li.open .xc svg{transform:rotate(-90deg)}
#ceny.cn-v3 .tcell{flex-wrap:wrap;justify-content:flex-end;row-gap:8px}
#ceny.cn-v3 .cg86z{flex-basis:100%;text-align:right;padding-right:14px;font:600 12.5px/1 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--c-ink)}
#ceny.cn-v3 .cg86z b{font:italic 800 20px/1 "Fira Sans",sans-serif;letter-spacing:-.01em;margin:0 .15em}
#ceny.cn-v3 .cn-group > .cn-list{background:var(--c-sand);border-radius:26px;padding:.6rem!important;border:0!important;display:grid;gap:6px}
#ceny.cn-v3 .cn-group > .cn-list::before{display:none}
#ceny.cn-v3 .cn-list li{background:none!important;border:0!important;margin:0!important;border-radius:16px!important;padding:1rem 3.6rem 1rem 1.2rem!important;position:relative}
#ceny.cn-v3 .cn-list li.xh:hover{background:rgba(255,255,255,.5)!important}
#ceny.cn-v3 .cn-list li.open,#ceny.cn-v3 .cn-list li.open:hover{background:var(--c-paper)!important}
#ceny.cn-v3 .cn-list li.xpopli{margin-top:14px!important}
#ceny.cn-v3 .cn-price{align-self:center!important}
#ceny.cn-v3 .cn-list li > .xc{position:absolute;right:1.3rem;top:50%;margin:-7px 0 0}
/* 02.10 (Грег: «все заголовки в таком стиле», как «Co jest w cenie, a za co płacisz osobno»): заголовки групп – h2 сайта, одно начертание 900 48px, без пары Condensed */
#ceny.cn-v3 .cn-group-h{font:900 48px/.95 "Fira Sans",sans-serif!important;letter-spacing:-.045em!important;margin-top:.7rem;text-wrap:balance}
#ceny.cn-v3 .cn-group-t{font-size:18px!important;color:var(--c-ink)!important;margin-top:.9rem}
#ceny.cn-v3 .cn-list li .cg90{display:none;grid-column:1 / -1;justify-self:start;margin-top:1rem}
#ceny.cn-v3 .cn-list li.open .cg90{display:inline-flex;animation:xIn .35s ease both}
#ceny.cn-v3 .cn-list li.open .cn-price{align-self:end!important}
#ceny.cn-v3 .cn-list li.open > .xc{top:1.45rem;margin-top:0}
#ceny.cn-v3 .cn-list li .tcell{--tf:44px}
#ceny.cn-v3 .cn-list li.open .tcell{--tf:58px}
#ceny.cn-v3 .cn-list li.open .tcell.xwyc{--tf:44px}
#ceny.cn-v3.xready .tcell .price-hit b.tp,#ceny.cn-v3.xready .tcell .tz{transition:font-size .3s cubic-bezier(.4,0,.2,1)}
@media (min-width:1024px){ #ceny.cn-v3 .cn-groups > .cn-r{grid-column:1 / span 8!important} }
#ceny.cn-v3 #razem{grid-column:1 / -1!important}
#ceny.cn-v3 #razem .cn-list{grid-template-columns:1fr!important;column-gap:0!important}
#ceny.cn-v3 #razem .cn-group-t,#ceny.cn-v3 #razem .cn-note{max-width:none}
#ceny.cn-v3 #razem .cn-note{margin-top:1.4rem;font-size:16px;color:var(--c-ink)}
#ceny.cn-v3 .cn-incl{column-gap:2rem!important}
#ceny.cn-v3 .cn-incl > .kicker{grid-column:1 / -1;margin-bottom:0}
#ceny.cn-v3 .cn-plain{background:var(--c-sand);border-radius:26px;padding:.6rem!important;border:0!important;margin-top:1.4rem!important;display:grid;gap:6px}
#ceny.cn-v3 .cn-plain::before{display:none}
#ceny.cn-v3 .cn-plain li{border:0!important;border-radius:16px;padding:.95rem 1.2rem .95rem 3rem!important;font-size:17px;color:var(--c-ink)}
#ceny.cn-v3 .cn-plain li::after{left:1.2rem;top:1.15rem}
#ceny.cn-v3 .cn-plain li::before{left:calc(1.2rem + 3px);top:calc(1.15rem + 3px)}
#ceny.cn-v3 .cn-foot p{color:var(--c-ink)!important;font-size:17px!important}
#ceny.cn-v3 .cn-price.xend{display:block!important;padding:0!important;align-self:center}
#ceny.cn-v3 .cn-list li.open .cn-price.xend{align-self:end!important}
#ceny.cn-v3 .xe{display:flex;flex-direction:column;align-items:flex-end;gap:7px;text-align:right}
#ceny.cn-v3 .xl1{display:flex;align-items:baseline;gap:6px;white-space:nowrap}
#ceny.cn-v3 .xv{font:italic 800 var(--tf,44px)/.85 "Fira Sans",sans-serif;letter-spacing:-.03em;font-variant-numeric:tabular-nums lining-nums;color:var(--c-ink);padding-right:.04em}
#ceny.cn-v3 .xz{font:italic 800 calc(var(--tf,44px) * .36)/1 "Fira Sans",sans-serif;color:var(--c-ink)}
#ceny.cn-v3 .xu,#ceny.cn-v3 .xn{font:500 12px/1.25 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.14em;text-transform:uppercase;color:rgba(31,33,32,.72);margin:0!important}
#ceny.cn-v3 .tcell small.xn,#ceny.cn-v3 .tcell small.xcap,#ceny.cn-v3 .xn,#ceny.cn-v3 .xcap{font:600 12.5px/1.35 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:.12em!important;text-transform:uppercase;color:var(--c-ink)!important;white-space:nowrap;margin:0!important}
#ceny.cn-v3 .tcell small.xn b,#ceny.cn-v3 .tcell small.xcap b,#ceny.cn-v3 .xn b,#ceny.cn-v3 .xcap b{font:italic 800 20px/1 "Fira Sans",sans-serif;letter-spacing:-.01em;margin:0 .15em;text-transform:none}
#ceny.cn-v3 .xcap{display:none}
#ceny.cn-v3.xready .xv,#ceny.cn-v3.xready .xz{transition:font-size .3s cubic-bezier(.4,0,.2,1)}
#ceny.cn-v3 .cg86z{display:none}
#ceny.cn-v3 #odbior > .cn-list{background:var(--c-terra)!important}
#ceny.cn-v3 #odbior .cn-list li.xh:hover{background:color-mix(in srgb, var(--c-terra) 75%, #fff)!important}
#ceny.cn-v3 #odbior .cn-list li.open,#ceny.cn-v3 #odbior .cn-list li.open:hover{background:color-mix(in srgb, var(--c-terra) 45%, #fff)!important}
#ceny.cn-v3 #odbior .cn-desc p + p{margin-top:.5rem}
#ceny.cn-v3 .cn-incl.cg108{position:relative;column-gap:1.6rem!important;align-items:stretch}
#ceny.cn-v3 .cg108 > .kicker{margin-bottom:1.5rem!important}
#ceny.cn-v3 .cg108 > .cn-group{border-radius:26px;padding:2.6rem 2.8rem 2.4rem;background:var(--c-paper)}
#ceny.cn-v3 .cg108 > .cn-group + .cn-group{background:var(--c-sand)}
#ceny.cn-v3 .cg108 .cn-group-h{font:400 40px/1.02 "Fira Sans",sans-serif!important;letter-spacing:-.045em!important;margin:0!important}
#ceny.cn-v3 .cg108 .cn-group-h b{font-weight:900}
#ceny.cn-v3 .cg108 .cn-group-h i{font-weight:300}
#ceny.cn-v3 .cg108k{margin-top:.9rem;font:600 12.5px/1 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.2em;text-transform:uppercase;color:rgba(31,33,32,.6)}
#ceny.cn-v3 .cg108 .cn-plain{background:none!important;padding:0!important;margin-top:1.6rem!important;display:grid;gap:1.1rem}
#ceny.cn-v3 .cg108 .cn-plain li{padding:0 0 0 2.2rem!important;border-radius:0;font-size:18px!important;line-height:1.55;font-weight:500}
#ceny.cn-v3 .cg108 .cn-plain li b{font-weight:700}
#ceny.cn-v3 .cg108 .cn-plain li::after{left:0;top:.3em;width:16px;height:16px}
#ceny.cn-v3 .cg108 .cn-plain li::before{display:none}
#ceny.cn-v3 .cg108 .cn-plain--out li::after{background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M8 4l8 8-8 8' fill='none' stroke='%231F2120' stroke-width='3.8'/></svg>")}
#ceny.cn-v3 .cg108c{position:absolute;left:50%;top:calc(var(--cg108t, 4.6rem) + 2.6rem);width:64px;height:64px;margin-left:-32px;border-radius:50%;background:var(--c-terra);box-shadow:0 0 0 8px var(--c-page);display:flex;align-items:center;justify-content:center;font:700 34px/1 "Fira Sans",sans-serif;color:var(--c-ink);z-index:2}
#ceny.cn-v3 .cg108 > .cn-group:first-of-type{background:var(--c-paper)}
#ceny.cn-v3 .cg108 .cn-plain li{padding-left:0!important}
#ceny.cn-v3 .cg108 .cn-plain li::after,#ceny.cn-v3 .cg108 .cn-plain li::before{display:none!important}
#ceny.cn-v3 .cg108k{display:none}
#ceny.cn-v3 .cg108 .cn-plain{margin-top:1.4rem!important}
#ceny.cn-v3 .cg108 > .kicker{margin-bottom:0!important}
#ceny.cn-v3 .cg108h{grid-column:1 / -1;font:900 48px/.95 "Fira Sans",sans-serif;letter-spacing:-.045em;margin:.7rem 0 1.8rem}
#ceny.cn-v3 .cg110b{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:2rem;align-items:end}
#ceny.cn-v3 .cg110b > .cg106{padding-bottom:1.3rem;margin-right:22px}
#ceny.cn-v3 .cg105{border-radius:26px;padding:.6rem 2.2rem 1.2rem;margin-top:1.4rem}
#ceny.cn-v3 .cg105 .so-list.ob-acc{margin-top:0!important}
#ceny.cn-v3 .cg105 .ob-acc li + li::before{border-top-color:rgba(31,33,32,.2)}
#ceny.cn-v3 .cg105 .ob-acc .so-card{max-width:60ch}
#ceny.cn-v3 .cg106 small b{font:italic 800 20px/1 "Fira Sans",sans-serif;letter-spacing:-.01em;margin:0 .12em;text-transform:none;color:var(--c-ink)}
#ceny.cn-v3 .cg106{margin-left:auto;display:inline-flex;flex-direction:column;align-items:flex-end;gap:5px;text-align:right;font-weight:400}
#ceny.cn-v3 .cg106 b{font:italic 800 30px/.9 "Fira Sans",sans-serif;letter-spacing:-.02em}
#ceny.cn-v3 .cg106 i{font:italic 800 13px/1 "Fira Sans",sans-serif;margin-left:4px}
#ceny.cn-v3 .cg106 small{font:500 11.5px/1.2 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:rgba(31,33,32,.75)}
#ceny.cn-v3 .cg106 .r{display:inline-flex;align-items:baseline;gap:4px}
#ceny.cn-v3 .cg106 .ln{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
#ceny.cn-v3 .cg106 .ln + .ln{margin-top:8px}
#ceny.cn-v3 .cg106 small.n{font:600 12.5px/1.35 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:.12em;color:var(--c-ink);max-width:240px;text-wrap:balance}
#ceny.cn-v3 .cg105 .ob-acc summary{gap:1.4rem}
#ceny.cn-v3 .cg105 details:not([open]) .cg106{display:none}
#ceny.cn-v3 .cg105 details[open] .cg106{animation:xIn .3s ease both}
#ceny.cn-v3 .cn-list li .cn-name{font-family:"Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:-.02em!important;font-weight:400!important;font-size:26px!important}
#ceny.cn-v3 .cn-list li .cn-name .xpa{font-weight:700}
#ceny.cn-v3 .cn-list li .cn-name .xpb{font-weight:400}
#ceny.cn-v3 .cn-meta{display:block!important;margin-top:.5rem!important;font:400 20px/1.3 "Fira Sans Condensed","Fira Sans",sans-serif;letter-spacing:-.01em;color:var(--c-ink)}
#ceny.cn-v3 .cn-meta .cn-pill{all:unset;font:inherit}
#ceny.cn-v3 .cn-meta .cn-term .cn-pill{font-weight:700}
#ceny.cn-v3 .cn-meta .cn-term .cn-pill + .cn-pill::before{content:", ";font-weight:700}
#ceny.cn-v3 .cn-meta .cn-tags .cn-pill::before{content:", "}
#ceny.cn-v3 .cn-meta .cn-tags .cn-pill:first-child::before{content:" – "}
#ceny.cn-v3 .cn-meta .cn-tags:first-child .cn-pill:first-child::before{content:none}
#ceny.cn-v3 .xe .xz{font:700 calc(var(--tf,44px) * .5)/1 "Fira Sans Condensed","Fira Sans",sans-serif;font-style:normal;letter-spacing:-.02em}
#ceny.cn-v3 .xe .xu{font:400 18px/1.25 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:-.01em!important;text-transform:none!important;color:var(--c-ink)!important}
#ceny.cn-v3 .cn-group-t{font:400 22px/1.35 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:-.01em;color:var(--c-ink)!important}
#ceny.cn-v3 .cn-group-t .xpa{font-weight:700}
#ceny.cn-v3 .cg108 .cn-plain li{font:400 20px/1.4 "Fira Sans Condensed","Fira Sans",sans-serif!important;letter-spacing:-.01em}
/* Прайс .cn-v3 уже 640px – чтобы не вылезал за экран (02.10.2026; телефоны – следующий этап, здесь только «не ломать»):
   цена – под названием и описанием, кегль цены 34 / 40px, заголовки групп и плит меньше, окончание доставки – под текстом */
@media (max-width:639px){
  #ceny.cn-v3 .cn-groups:not(.cn-incl) > .cn-group > .cn-group-h{font-size:34px!important}
  #ceny.cn-v3 .cn-list li{grid-template-columns:minmax(0,1fr)!important;grid-template-areas:"name" "desc" "sum" "meta" "price"!important;padding:1rem 2.8rem 1rem 1rem!important}
  #ceny.cn-v3 .cn-list li > .xc{right:1rem}
  #ceny.cn-v3 .cn-list li .cn-name{font-size:21px!important}
  #ceny.cn-v3 .cn-price.xend{justify-self:start;align-self:start!important;margin-top:.7rem}
  #ceny.cn-v3 .xe{align-items:flex-start;text-align:left}
  #ceny.cn-v3 .cn-list li .tcell{--tf:34px}
  #ceny.cn-v3 .cn-list li.open .tcell{--tf:40px}
  #ceny.cn-v3 .xn{white-space:normal}
  #ceny.cn-v3 .cg105{padding:.3rem 1.2rem 1rem}
  #ceny.cn-v3 .so-list.ob-acc summary{font-size:22px}
  #ceny.cn-v3 .cg110b{grid-template-columns:minmax(0,1fr)}
  #ceny.cn-v3 .cg110b > .cg106{justify-self:start;align-items:flex-start;margin:0 0 1.1rem;padding:0}
  #ceny.cn-v3 .cg106 .ln{align-items:flex-start}
  #ceny.cn-v3 .cg108 > .cn-group{padding:1.6rem 1.4rem}
  #ceny.cn-v3 .cg108 .cn-group-h{font-size:30px!important}
  #ceny.cn-v3 .cg108h{font-size:34px!important}
  #ceny.cn-v3 .cn-list li .cg90{grid-row:20}   /* «Zamów wycenę» – последней строкой, после цены */
}
/* Прайс #ceny – шире и со сроком в колонке (Грег, 03.10.2026: «эти блоки можно расширить», «цены в закрытом виде может ещё
   уменьшить»; вариант 121 стенда docs/ceny-gt). Группы – во всю сетку, как «Ile zapłacę za…?» и «Co jest w cenie» ниже:
   у прайса один правый край. Цена свёрнутой строки 36px (было 44), раскрытой – 58px, «Wycena» не растёт. От 1280px лишняя
   ширина занята сроком: название · срок · цена – сроки строк стоят друг под другом, свёрнутая строка в одну линию;
   у раскрытой описание и состав идут под названием на две колонки. Уже 1280px срок остаётся под названием. */
@media (min-width:1024px){ #ceny.cn-v3 .cn-groups > .cn-group.cn-l, #ceny.cn-v3 .cn-groups > .cn-group.cn-r{grid-column:1 / -1!important} }
#ceny.cn-v3 .cn-group > .cn-list .cn-desc{max-width:72ch}
@media (min-width:640px){ #ceny.cn-v3 .cn-list li:not(.open) .tcell, #ceny.cn-v3 .cn-list li.open .tcell.xwyc{--tf:36px} }
@media (min-width:1280px){
  #ceny.cn-v3 .cn-group > .cn-list li.xh{grid-template-columns:minmax(0,27rem) minmax(0,1fr) auto!important;grid-template-areas:"name meta price" "desc desc price" "sum sum price"!important;column-gap:2rem!important}
  #ceny.cn-v3 .cn-group > .cn-list li.xh .cn-name{align-self:center}
  #ceny.cn-v3 .cn-group > .cn-list li.xh .cn-meta{margin-top:0!important;align-self:center}
  #ceny.cn-v3 .cn-group > .cn-list li.xh.open .cn-meta{align-self:start;margin-top:.2rem!important}
}

/* /cennik/: кнопки Zadzwoń · Zamów wycenę под подвалом прайса (анкета 02.10.2026), отступ – как между группами */
.cn-foot .cn-foot-cta{ margin-top:28px; }
.cn-foot .cn-foot-cta a.cta-btn{ text-decoration:none; }   /* .cn-v2 .cn-foot a подчёркивает ссылки текста */

/* /cennik/, строка статуса (финальная аналитика 02.10.2026, Н5 и Н6; только PL): жёлтое скруглённое – только главная кнопка,
   поэтому плашка песочная, рядом с серым ярлыком «Cennik»; месяц по-польски строчными */
html[lang="pl"] .cn-v2 .cn-status > span{ background:var(--c-sand); }
html[lang="pl"] .cn-v2 .cn-status .cennik-updated{ text-transform:none; }

/* /apostille-ukraina/ #sprawdz – светлая плита (04.10.2026) */
/* Плита «Apostille od razu czy najpierw duplikat» теперь на .gdz--light .gdz--ap, как #urzedy на /apostille/ (класса .slab нет –
   шапка считает .slab тёмной зоной). У сценария 3 две строки цены («Uzyskanie dokumentu» и «Z Apostille»), поэтому от 1024px
   ячейки делят 7 строк, а не 6: первая цена всех трёх сценариев стоит на одной высоте, вторая строка третьего – под ней. */
@media (min-width:1024px){
  @supports (grid-template-rows:subgrid){
    #sprawdz .gdz--ap .ap3-cell{ grid-row:span 7; }
  }
}

/* Окно согласия на cookies (.zg, 09.10.2026) – собирает assets/app.js, блок «Zgoda na cookies i kod Google».
   Появляется, только когда в app.js вписаны номера Google (или с ?zgoda=1 в адресе – посмотреть вид).
   Две кнопки одинаковые нарочно: отказаться должно быть так же просто, как согласиться.
   Белая плашка, а не тёмная: читается и на светлом, и на тёмном. Слой 90 – над меню и
   всплывающей кнопкой, под окнами шагов (100) и панелью заявки (110). */
.zg{ position:fixed; left:50%; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); transform:translateX(-50%); z-index:90;
  width:min(640px, calc(100% - 24px)); box-sizing:border-box; padding:22px 24px 20px; border-radius:26px;
  background:var(--c-paper); color:var(--c-ink); box-shadow:0 18px 50px rgba(31,33,32,.22), 0 0 0 1px rgba(31,33,32,.08);
  font-size:16px; line-height:1.45; animation:zg-in .45s ease both; }
@keyframes zg-in{ from{ opacity:0; transform:translate(-50%, 12px); } to{ opacity:1; transform:translate(-50%, 0); } }
.zg-t{ margin:0; }
.zg-pol{ color:inherit; text-decoration:underline; text-underline-offset:3px; white-space:nowrap; }
.zg-opts{ display:grid; gap:10px; margin-top:16px; }
.zg-opts[hidden]{ display:none; }
.zg-opt{ display:flex; align-items:center; gap:10px; cursor:pointer; }
.zg-opt input{ width:18px; height:18px; margin:0; accent-color:var(--c-ink); }
.zg-btns{ display:flex; flex-wrap:wrap; align-items:center; gap:10px 12px; margin-top:18px; }
.zg-b{ flex:1 1 150px; min-height:46px; padding:0 18px; border:0; border-radius:12px; background:var(--c-ink); color:var(--c-paper);
  font:inherit; font-size:17px; font-weight:600; cursor:pointer; transition:background-color .2s ease; }
.zg-b:hover{ background:var(--c-graphite); }
.zg-more{ flex:0 0 auto; padding:10px 4px; border:0; background:none; color:inherit; font:inherit; cursor:pointer;
  text-decoration:underline; text-underline-offset:3px; }
.zg-b:focus-visible, .zg-more:focus-visible, .zg-pol:focus-visible{ outline:2px solid var(--c-terra); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){ .zg{ animation:none; } }
.zg--top{ z-index:120; }   /* окно открыто ссылкой «Ustawienia cookies» – в том числе из политики внутри панели заявки (110) */

/* ===== Новая главная (.gn-*) – установлена 09.10.2026 из docs/glowna-nowa/ =====
   Только новые классы .gn-*; готовые форматы сайта (.ap-doc, .ua-hop-*, .tl-fin, .cta-btn, .k-where-link)
   не переопределяются, кроме модификаторов внутри .gn. История – docs/glowna-nowa/. */

.gn h2{ text-wrap:balance; }
.gn :is(.hero-more){ margin-top:.9rem; }

/* ---------- Первый экран ---------- */
/* три услуги с ценой: строка = ссылка; формат строк – как .ua-hop-row (имя, мелкая подпись, цена) */
.gn-ceny{ display:grid; }
.gn-cena{ display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:1.25rem; align-items:baseline;
  padding:1rem 0; border-top:1px solid rgba(31,33,32,.18); color:var(--c-ink); text-decoration:none; }
.gn-cena:last-child{ border-bottom:1px solid rgba(31,33,32,.18); }
.gn-cena-n{ display:inline-flex; align-items:center; gap:10px; font-size:22px; font-weight:600; letter-spacing:-.02em; line-height:1.15; }
.gn-cena-n svg{ width:16px; height:16px; flex:0 0 auto; transition:transform .25s cubic-bezier(.2,.7,.25,1); }
.gn-cena:hover .gn-cena-n svg, .gn-cena:focus-visible .gn-cena-n svg{ transform:translateX(4px); }
.gn-cena:focus-visible{ outline:2px solid var(--c-terra); outline-offset:4px; }
.gn-cena b{ grid-column:2; grid-row:1; font-size:22px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
.gn-cena b i, .gn-door-h b i{ font-style:normal; font-weight:400; font-size:15px; color:rgba(31,33,32,.68); }  /* единица «/ strona» – служебное */
.gn-cena small{ grid-column:1 / -1; margin-top:.25rem; font-size:15px; line-height:1.4; max-width:44ch; }
/* единица уходит под цену: цифры трёх строк стоят в один столбец по правому краю */
@media (min-width:1024px){
  .gn-cena b{ position:relative; }
  .gn-cena b i{ position:absolute; right:0; top:100%; margin-top:.25rem; line-height:1.4; white-space:nowrap; }
  .gn-cena small{ max-width:36ch; }
}
@media (prefers-reduced-motion:reduce){ .gn-cena-n svg{ transition:none; } }

/* ---------- Первый экран: одна крупная цена (вариант 5 стенда docs/glowna-ekran/, выбран 09.10.2026) ----------
   Услугу переключают три подписи – это радиокнопки с label, скрипт не нужен. Три ссылки-цены стоят в одной клетке
   сетки (невыбранные скрыты через visibility), поэтому высота блока – по самой высокой, и при переключении
   ни подписи, ни кнопки ниже не сдвигаются. */
.gn-one-r{ position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.gn-one-tabs{ display:flex; gap:1.75rem; border-bottom:1px solid rgba(31,33,32,.18); }
.gn-one-tabs label{ margin-bottom:-1px; padding:0 0 .8rem; border-bottom:3px solid transparent; font-weight:600; font-size:17px; line-height:1.2;
  color:rgba(31,33,32,.7); white-space:nowrap; cursor:pointer; transition:color .2s ease; }   /* невыбранная подпись – служебное состояние; контраст 5,7 */
.gn-one-tabs label:hover{ color:var(--c-ink); }
#gn-u1:checked ~ .gn-one-tabs label[for="gn-u1"], #gn-u2:checked ~ .gn-one-tabs label[for="gn-u2"], #gn-u3:checked ~ .gn-one-tabs label[for="gn-u3"]{
  color:var(--c-ink); border-bottom-color:var(--c-ink); }
#gn-u1:focus-visible ~ .gn-one-tabs label[for="gn-u1"], #gn-u2:focus-visible ~ .gn-one-tabs label[for="gn-u2"], #gn-u3:focus-visible ~ .gn-one-tabs label[for="gn-u3"]{
  outline:2px solid var(--c-terra); outline-offset:4px; }
.gn-one .gn-cena, .gn-one .gn-cena:last-child{ grid-area:1 / 1; display:flex; flex-direction:column; align-items:flex-start; padding:1.4rem 0 0; border:0;
  visibility:hidden; opacity:0; transition:opacity .3s ease; }
#gn-u1:checked ~ .gn-ceny .gn-cena:nth-child(1), #gn-u2:checked ~ .gn-ceny .gn-cena:nth-child(2), #gn-u3:checked ~ .gn-ceny .gn-cena:nth-child(3){ visibility:visible; opacity:1; }
.gn-one .gn-cena b{ order:1; position:static; font-size:clamp(72px,9.4vw,132px); font-weight:900; letter-spacing:-.055em; line-height:.85; }
.gn-one .gn-cena b i{ display:block; position:static; margin:.9rem 0 0; font-size:17px; letter-spacing:0; line-height:1.3; white-space:nowrap; }
.gn-one .gn-cena small{ order:2; margin-top:.9rem; font-size:17px; line-height:1.4; max-width:none; }
.gn-one .gn-cena b:has(i) + small{ margin-top:.15rem; }
.gn-one .gn-cena-n{ order:3; margin-top:.5rem; font-size:17px; letter-spacing:0; }
@media (max-width:479px){ .gn-one-tabs{ gap:1rem; } .gn-one-tabs label{ font-size:15px; } }
@media (prefers-reduced-motion:reduce){ .gn-one .gn-cena, .gn-one-tabs label{ transition:none; } }

/* четыре кнопки под ценами – две строки по две; главная – последней (анкета 04.10.2026) */
.cta-btns.gn-hero-cta{ display:grid; grid-template-columns:1fr 1fr; gap:10px; width:100%; margin-top:1.75rem; }
.cta-btns.gn-hero-cta > .cta-btn{ grid-column:auto; }
.gn-hero-note{ margin-top:1rem; font-size:15px; line-height:1.45; text-wrap:balance; }

/* ---------- Двери по документам ---------- */
.ap-docs.gn-drzwi{ grid-template-columns:minmax(0,1fr); gap:2rem; margin-top:2.5rem; }
@media (min-width:768px){ .ap-docs.gn-drzwi{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:2.75rem 3.5rem; margin-top:3.5rem; } }
.gn-drzwi .ap-doc{ display:flex; flex-direction:column; align-items:flex-start; padding-top:1.25rem; scroll-margin-top:124px;
  border-top:1px solid rgba(31,33,32,.18); }   /* линия – как у остальных строк страницы, не 2px */
.gn-door-h{ display:flex; align-items:baseline; justify-content:space-between; gap:1.5rem; width:100%; }
/* заголовок двери – уровень «заголовок плиты» (600, 26px, lh 1.03), как в #odbior и .ua-hop-q */
.gn-drzwi .ap-doc .gn-door-h h3{ font-size:26px; font-weight:600; letter-spacing:-.045em; line-height:1.03; }
.gn-door-h b{ font-size:20px; font-weight:700; white-space:nowrap; font-variant-numeric:tabular-nums; }
@media (max-width:479px){ .gn-door-h{ flex-wrap:wrap; gap:.35rem 1rem; } }   /* на узком телефоне цена уходит под заголовок, а не за край */
.gn-drzwi .ap-doc p{ margin-top:.9rem; max-width:58ch; color:var(--c-ink); }
.gn-drzwi .ap-doc .k-where-link{ margin-top:1rem; font-size:17px; }
.gn-drzwi .ap-doc p.gn-door-more{ margin-top:.9rem; font-size:15px; line-height:1.5; max-width:none; }

/* Dokumenty z Ukrainy: сетка плашки .ua-hop, но это не ссылка целиком */
.gn-ua{ display:grid; gap:1.5rem; padding:1.75rem; margin-top:3rem; }
@media (min-width:640px){ .gn-ua{ padding:2.25rem 2.5rem; } }
@media (min-width:1024px){ .gn-ua{ grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:3rem; align-items:start; padding:3rem; margin-top:4rem; } }
@media (min-width:1024px){ .gn-ua{ column-gap:3.5rem; } }   /* вторая колонка – на оси второй колонки дверей */
.gn-ua .ua-hop-go{ margin-top:0; }
.gn-ua .ua-hop-q{ text-wrap:balance; }
.gn-ua .ua-hop-row{ margin:0; }
.gn-ua .ua-hop-row:not(:has(> b)) .ua-hop-n{ max-width:none; }

.gn-inne{ margin-top:2.5rem; font-size:17px; line-height:1.6; max-width:70ch; }
.gn-inne b{ font-weight:700; }
.gn-inne-go{ margin-top:.6rem; line-height:1.3; }
.gn-inne-go .k-where-link{ margin-top:0; }

/* ---------- Apostille и перевод одним заказом ---------- */
.gn-sumy{ display:grid; gap:1.25rem; margin-top:2.5rem; }
@media (min-width:900px){ .gn-sumy{ grid-template-columns:repeat(2, minmax(0,1fr)); gap:1.5rem; } }
.gn-suma{ display:flex; flex-direction:column; padding:1.75rem; border-radius:18px; }
@media (min-width:640px){ .gn-suma{ padding:2.25rem 2.5rem 2.4rem; } }
.gn-suma h3{ font-size:26px; font-weight:600; letter-spacing:-.045em; line-height:1.03; max-width:20ch; }
.gn-suma-t{ margin-top:.9rem; font-size:17px; line-height:1.55; max-width:46ch; }
/* формула – как курсивные .cn-sum в прайсе */
.gn-suma-f{ margin-top:1.1rem; font-size:17px; line-height:1.5; font-weight:500; font-style:italic; max-width:48ch; }
.gn-suma-f > i{ font-style:normal; font-weight:700; margin:0 .35em; }
.gn-suma-r{ margin-top:auto; padding-top:1.5rem; display:flex; flex-wrap:wrap; align-items:baseline; gap:.35rem 1rem; }
.gn-suma-r b{ font-size:34px; font-weight:700; letter-spacing:-.03em; line-height:1; white-space:nowrap; font-variant-numeric:tabular-nums; }
.gn-suma-r span{ font-size:15px; line-height:1.4; }
.gn-sumy-go{ margin-top:1.5rem; line-height:1.3; }
.gn-sumy-go .k-where-link{ margin-top:0; }

/* ---------- Цена окончательная ---------- */
.gn-cena-box{ display:grid; gap:2rem; }
.gn-cena-box h2 + p{ max-width:44ch; }
@media (min-width:1024px){ .gn-cena-box{ grid-template-columns:minmax(0,6fr) minmax(0,5fr); gap:4rem; align-items:end; } }
/* факты run-in: жирная фраза с точкой и текст в той же строке; строки – через тонкую линию */
/* длину строки держит правое поле, а не max-width: линия идёт до края колонки, как у соседних блоков */
.gn-fakty p{ padding:1rem 0; padding-right:max(0px, calc(100% - 52ch)); border-top:1px solid rgba(31,33,32,.18); font-size:17px; line-height:1.55; }
.gn-fakty p:last-child{ border-bottom:1px solid rgba(31,33,32,.18); }
.gn-fakty b{ font-weight:700; }
.gn-fakty--top{ margin-top:2rem; }

/* ---------- Как заказать: три случая строками ---------- */
/* две ссылки-стрелки под лидом: страница с адресами урядов и окно «как сфотографировать» */
.gn-jak-links{ display:flex; flex-wrap:wrap; gap:.5rem 2.5rem; margin-top:.9rem; }
.gn .gn-jak-links .hero-more{ margin-top:0; }
.gn-foto.step-card{ width:fit-content; cursor:default; transform:none !important; will-change:auto; }
.gn-foto.step-card:hover .step-go{ transform:none; }
.gn-foto .step-go{ display:inline-flex; justify-content:flex-start; margin-top:0; font:inherit; font-weight:600; font-size:17px; cursor:pointer; }
.gn-foto .step-go:hover{ transform:none; opacity:1; }
.gn-drogi{ margin-top:2.5rem; }
.gn-droga{ display:grid; gap:.6rem; padding:1.5rem 0; border-top:1px solid rgba(31,33,32,.18); }
.gn-droga:last-child{ border-bottom:1px solid rgba(31,33,32,.18); }
.gn-droga h3{ font-size:26px; font-weight:600; letter-spacing:-.045em; line-height:1.03; }
.gn-droga p{ font-size:17px; line-height:1.55; max-width:56ch; }
.gn-droga .k-where-link{ margin-top:0; justify-self:start; }
@media (min-width:1024px){
  .gn-droga{ grid-template-columns:minmax(0,3fr) minmax(0,6fr) minmax(0,4fr); column-gap:3rem; align-items:baseline; padding:1.75rem 0; }
  .gn-droga .k-where-link{ justify-self:end; text-align:right; }
}

/* ---------- Zanim oddasz Oryginał ---------- */
.gn-ufaj{ display:grid; gap:2.5rem; }
@media (min-width:1024px){ .gn-ufaj{ grid-template-columns:minmax(0,585px) minmax(0,1fr); gap:4rem; align-items:start; } }
.gn-wzor img{ display:block; width:100%; max-width:585px; height:auto; border-radius:14px; border:1px solid rgba(31,33,32,.12); background:#fff; }
.gn-wzor figcaption{ margin-top:1rem; font-size:15px; line-height:1.55; max-width:52ch; }
.gn-wzor figcaption b{ font-weight:700; }
.gn .gn-tel{ margin-top:1.5rem; }

/* ---------- Polityka и Regulamin на светлом ---------- */
.ws-legal.gn-legal{ margin-top:0; border-top-color:rgba(31,33,32,.18); }
.gn-legal .ws-legal-item{ border-bottom-color:rgba(31,33,32,.18); }
.gn-legal .legal-wrap > *{ color:var(--c-ink); }

/* якоря под шапкой: styles.css даёт отступ только section[id], а это details и div */
.gn-legal .ws-legal-item, .gn-drogi[id]{ scroll-margin-top:88px; }
@media (min-width:1150px){ .gn-legal .ws-legal-item, .gn-drogi[id]{ scroll-margin-top:124px; } }

/* ===== Языковые главные /ua/ /ru/ /en/ – 09.10.2026 =====
   Тело – перевод польской главной (docs/glowna-nowa/install_lang.py). У страниц класс html.pl-zone:
   чернильный текст и лид 20px они получают оттуда. Здесь – то, что польской главной даёт html[lang="pl"]. */
.gn-drzwi .ap-doc p{ font-size:17px; }
html.pl-zone #faq .faq-price span:not(.fp-unit):not(.fp-note){ color:var(--c-ink); }
/* подписи-переключатели первого экрана: если три подписи не помещаются в строку (длинные «Документи з України»,
   «Documents from Ukraine», телефон 320px), последняя переносится на две строки, а не уходит за край;
   подписи стоят по нижней линии */
.gn-one-tabs{ align-items:flex-end; }
.gn-one-tabs label{ white-space:normal; }
/* /ua/: «Зателефонувати» и «Дізнатися ціну» вдвоём не помещаются в ряд уже 400px – идут во всю ширину под мессенджерами */
@media (max-width:399px){ html[lang="uk"] .cta-btns.gn-hero-cta > .cta-btn:nth-child(n+3){ grid-column:1 / -1; } }

/* ===== /cennik/ в формате главной (Грег, 11.10.2026: «привести как на главной к такому же стилю») – только PL =====
   Первый экран – разметка главной (.gn-hero, .gn-one); у блока одной крупной цены здесь четыре подписи (радиокнопки cn-u1…4).
   Цены разделов – «двери» главной (.ap-docs.gn-drzwi: заголовок 26px + цена справа, абзац, ссылка-стрелка) вместо серых плит
   со строками-кнопками; у раздела класс .cn-gn, заголовок двери – h4 (раздел – h3). Формула комплекта – .gn-suma-f. */
#cn-u1:checked ~ .gn-one-tabs label[for="cn-u1"], #cn-u2:checked ~ .gn-one-tabs label[for="cn-u2"], #cn-u3:checked ~ .gn-one-tabs label[for="cn-u3"], #cn-u4:checked ~ .gn-one-tabs label[for="cn-u4"]{
  color:var(--c-ink); border-bottom-color:var(--c-ink); }
#cn-u1:focus-visible ~ .gn-one-tabs label[for="cn-u1"], #cn-u2:focus-visible ~ .gn-one-tabs label[for="cn-u2"], #cn-u3:focus-visible ~ .gn-one-tabs label[for="cn-u3"], #cn-u4:focus-visible ~ .gn-one-tabs label[for="cn-u4"]{
  outline:2px solid var(--c-terra); outline-offset:4px; }
#cn-u1:checked ~ .gn-ceny .gn-cena:nth-child(1), #cn-u2:checked ~ .gn-ceny .gn-cena:nth-child(2), #cn-u3:checked ~ .gn-ceny .gn-cena:nth-child(3), #cn-u4:checked ~ .gn-ceny .gn-cena:nth-child(4){ visibility:visible; opacity:1; }
.gn-drzwi .ap-doc .gn-door-h h4{ font-size:26px; font-weight:600; letter-spacing:-.045em; line-height:1.03; }
@media (min-width:1024px){ #ceny.cn-gn.cn-v3 .cn-groups > :is(.cn-l, .cn-r){ grid-column:1 / -1 !important; } }
#ceny.cn-gn .ap-docs.gn-drzwi{ margin-top:2.25rem; }
#ceny.cn-gn .gn-drzwi .ap-doc p.gn-suma-f{ margin-top:.7rem; max-width:none; }
#ceny.cn-gn .gn-drzwi .ap-doc p + p:not(.gn-suma-f){ margin-top:.6rem; }
#ceny.cn-gn #razem .cn-note{ margin-top:2.75rem; }

/* ===== /kontakt/ (PL) светлая, как остальные страницы; блок «24/7» тоже светлый (Грег, 11.10.2026) =====
   Модификатор .kt--light у #ws: те же блоки .ws / .kt / .cal, цвета – для светлого фона (текст чернильный, служебное – серым,
   линии – как у остальных строк сайта). Охра остаётся только заливкой: точка статуса, точка «сегодня», выбранный день, обводки
   при наведении. Языковые /kontakt/ пока стоят на тёмной плите – базовые правила не тронуты. */
.kt--light .kt-row, .kt--light .kt-talk, .kt--light .ws-hours{ border-top-color:rgba(31,33,32,.18); }
.kt--light .ws-hours li{ border-bottom-color:rgba(31,33,32,.18); }
.kt--light .kt-ch{ border-top-color:rgba(31,33,32,.18); }
@media (min-width:1024px){ .kt--light .kt-cal-main, .kt--light .kt-cal-side{ border-left-color:rgba(31,33,32,.18); } }
.kt--light :is(.kt-text, .kt-ch-t, .ws-top, .ws-msg, .ws-clock, .ws-date, .cal-title, .cal-place-name, .cal-slots-date,
  .cal-note, .cal-book-hint, .cal-book-note){ color:var(--c-ink); }
.kt--light :is(.kt-ch-h, .ws-tz, .cal-slots-tz){ color:rgba(31,33,32,.68); }
.kt--light .ws-tz-off{ color:var(--c-ink); }
.kt--light .ws-tz-dst::before{ background:rgba(31,33,32,.35); }
.kt--light .ws-clock .ws-sec{ color:rgba(31,33,32,.42); }
.kt--light.is-closed .ws-dot{ background:rgba(31,33,32,.3); }
.kt--light .kt-ch-v, .kt--light .kt-ch-v:hover, .kt--light .kt-ch-v:focus-visible{ color:var(--c-ink); }
.kt--light .kt-ch-v:hover, .kt--light .kt-ch-v:focus-visible{ text-decoration:underline; text-decoration-thickness:2px; text-underline-offset:.16em; }
.kt--light .ws-hours li, .kt--light .ws-hours li > span:is(:first-child, :last-child), .kt--light .ws-hours li.ws-note{ color:var(--c-ink); }
.kt--light .ws-hours :is(.ws-soft, .ws-off){ color:rgba(31,33,32,.55) !important; }
.kt--light .ws-hours li.is-now > span{ color:var(--c-ink) !important; }
/* календарь */
.kt--light .cal-btn{ color:rgba(31,33,32,.55); }
.kt--light .cal-btn:hover{ color:var(--c-ink); }
.kt--light .cal-wd{ color:rgba(31,33,32,.6); }
.kt--light .cal-cell{ color:rgba(31,33,32,.8); }
.kt--light .cal-cell.is-weekend{ color:rgba(31,33,32,.4); }
.kt--light[class] [data-book] .cal-cell.is-past{ color:rgba(31,33,32,.55); }
.kt--light[class] [data-book] .cal-cell.is-past.is-weekend{ color:rgba(31,33,32,.4); }
.kt--light[class] [data-book] .cal-cell.is-out{ color:rgba(31,33,32,.28); }
.kt--light[class] [data-book] .cal-cell.is-out.is-past:not(.is-weekend){ color:rgba(31,33,32,.4); }
.kt--light [data-book] .cal-day{ background:var(--c-sand); color:var(--c-ink); }
@media (hover:hover){ .kt--light [data-book] .cal-cell .cal-day:hover{ background:#D0D0CB; } }
.kt--light .cal-cell.is-today, .kt--light [data-book] .cal-cell.is-today, .kt--light [data-book] .cal-cell.is-today .cal-day,
.kt--light .cal-cell.is-today .cal-hol{ color:var(--c-ink); }
.kt--light .cal-hol{ color:var(--c-ink); }
.kt--light [data-book] .cal-cell.is-past .cal-hol{ color:inherit; }
.kt--light [data-book] .cal-day.is-on, .kt--light [data-book] .cal-cell .cal-day.is-on, .kt--light [data-book] .cal-cell.is-today .cal-day.is-on{
  background:var(--c-ochre); border-color:var(--c-ochre); color:var(--c-ink); }
.kt--light .cal-opt-ic{ color:rgba(31,33,32,.55); }
.kt--light .cal-slot{ border-color:rgba(31,33,32,.18); color:var(--c-ink); }
.kt--light .cal-slot:focus-visible{ border-color:var(--c-ochre); }
@media (hover:hover){ .kt--light .cal-slot:hover{ border-color:var(--c-ochre); color:var(--c-ink); } }
.kt--light .cal-slot.is-on{ background:var(--c-paper); border-color:var(--c-ochre); color:var(--c-ink); }
.kt--light .cal-slot.is-on .cal-slot-time{ color:var(--c-ink); }
.kt--light .cal-slot:disabled{ color:rgba(31,33,32,.35); border-color:rgba(31,33,32,.1); }

/* ===== Шапка компьютера: четыре пункта на плашке (Грег, 11.10.2026) – все языки =====
   От 1150px в ряду: логотип, справа пункты меню и текущий язык (по нажатию – список остальных, .lang-pop). Бургера и серой
   подписи страницы («/ Kontakt») нет, меню не раскрывается (app.js: setOpen от 1150px ничего не делает); текущий пункт –
   полужирный. Уже 1150px – пилюля с бургером, как было. Правила раскрывающегося меню (вариант 126) выше остались без дела. */
@media (min-width:1150px){
  #top #nav-main{ display:flex !important; gap:2.5rem; margin:0 1.75rem 0 0; }
  #top #nav-main .navlink--plate{ display:none; }
  #top #burger{ display:none !important; }
  #top .hdr-page{ display:none; }
  #top .hdr-seg--menu .mn-langs{ display:none; }
  #top .hdr-seg--lang .lang-wrap{ display:block; }
  #top .hdr-seg--lang{ padding-right:34px; }
  header #nav-main .navlink.is-here{ font-weight:700; }
  header #nav-main .navlink.is-here .nl-a{ visibility:hidden; }
  header #nav-main .navlink.is-here .nl-b{ visibility:visible; opacity:1; }
}

/* ===== Подвал без большого логотипа (Грег, 11.10.2026: «в футере убрать лого… убери везде») =====
   Слово «Apostilo✦» из подвала снято на всех страницах. У языковых подстраниц оно от 1280px стояло распоркой между колонками
   и нижней строкой – теперь у них то же устройство, что у польских: колонки без сдвига, нижняя строка с настоящим отступом. */
@media (min-width:1280px){
  .footer-tone .fl-cols{ transform:none; padding-top:3.55rem; }
  .footer-bar{ margin-top:2.5rem; }
}