/* ============================================================
   Redesign (flex, fluid) — header. v0.67 (тёмная шапка)
   Грузится ПОСЛЕ style.css. Резиновость: проценты-гаттеры, flex-grow,
   без фиксированного max-width. Тёмно-синяя (#003) шапка в тон футеру.
   Белый фон у строки меню — ТОЛЬКО когда она переносится на 2-ю строку (<=680).
   ============================================================ */

/* ---------- Шапка (тёмная) ----------
   Шапка = два соседних блока (.fk-hdr__sub + .fk-hdr__bar), БЕЗ обёртки,
   чтобы sticky на .fk-hdr__bar работал относительно всей страницы. */

/* основная строка: лого | навигация | инструменты.
   ЗАЛИПАЕТ только она (лого+меню); подстрока страна/язык уезжает вверх при скролле. */
.fk-hdr__bar{
    display:flex;
    align-items:center;
    gap:24px;
    padding:8px 2.6%;
    box-sizing:border-box;
    width:100%;
    position:sticky;
    top:0;
    z-index:1000;
    background:#003;
    box-shadow:0 1px 6px rgba(0,0,0,.25);
}

/* логотип: фон-картинка 200x50 прямо на navy */
.fk-hdr__logo{
    flex:0 0 auto;
    display:block;
    width:150px;
    height:38px;
    background:url(/images/reifenantonpartner.svg) no-repeat left center;   /* SVG: viewBox впритык к рисунку (без правого отступа) */
    background-size:contain;
    text-decoration:none;
}

/* навигация по центру */
.fk-hdr__nav{
    display:flex;
    align-items:center;
    gap:30px;
    flex:1 1 auto;
    margin:0;
    padding:0;
}
.fk-hdr__nav a{
    text-transform:uppercase;
    font-size:16px;
    font-weight:600;
    letter-spacing:.02em;
    color:#ffffff;
    text-decoration:none;
    padding:6px 0;
    border-bottom:2px solid transparent;
    transition:border-color .15s ease;
    white-space:nowrap;
}
.fk-hdr__nav a:hover{ border-bottom-color:#ffffff; }

/* правый блок: «о нас» (+ место под прочее) */
.fk-hdr__tools{
    display:flex;
    align-items:center;
    gap:16px;
    flex:0 0 auto;
}
.fk-hdr__about a{
    color:#cdd7e6;
    text-decoration:none;
    font-size:14px;
    white-space:nowrap;
    border-bottom:1px solid transparent;
}
.fk-hdr__about a:hover{ border-bottom-color:#cdd7e6; color:#fff; }

/* ---------- Подстрока: страна + язык (+ позже валюта) ---------- */
.fk-hdr__sub{
    display:flex;
    align-items:center;
    justify-content:flex-end;        /* весь кластер контролов — справа */
    gap:24px;
    padding:7px 2.6%;
    background:#00214a;
    border-bottom:1px solid rgba(255,255,255,.08);   /* подстрока теперь СВЕРХУ — разделитель снизу */
    font-size:13px;
    color:#aab8cc;
    box-sizing:border-box;
    width:100%;
    position:relative;               /* якорь для попапа «регион» */
    z-index:1002;                    /* ВЫШЕ .fk-hdr__bar(1000): иначе попап «регион» заперт в контексте sub и его перекрывает соседняя строка-меню (равный z-index -> побеждает поздний в DOM). Также выше #loader-all(998)/.loader-loader(999) */
}

/* кластер селектов (страна / валюта / язык) */
.fk-hdr__picks{
    display:flex;
    align-items:center;
    gap:24px;
}

/* кнопка-триггер «регион» — скрыта на широких, видна при <=480 */
.fk-hdr__region-toggle{
    display:none;
    align-items:center;
    gap:6px;
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.25);
    border-radius:6px;
    color:#eef2f8;
    font-size:13px;
    padding:4px 9px;
    cursor:pointer;
}
/* сводка в кнопке: иконка + код, через разделитель */
.fk-hdr__rt{ display:inline-flex; align-items:center; gap:4px; }
.fk-hdr__rt-sep{ opacity:.45; }
.fk-hdr__region-toggle .fk-hdr__ico svg{ width:16px; height:16px; }

/* неразрывная группа: подпись + select всегда вместе */
.fk-hdr__pick{
    display:inline-flex;
    align-items:center;
    gap:8px;
    white-space:nowrap;
    flex:0 0 auto;
}
.fk-hdr__pick .delivery-to-string{
    margin:0;
    font-weight:600;
    color:#cdd7e6;
}
/* иконки (инлайн-SVG, перекрашиваются через color/currentColor) */
.fk-hdr__ico{ display:inline-flex; align-items:center; color:#cdd7e6; }
.fk-hdr__ico svg{ width:18px; height:18px; display:block; }

/* единый стиль select'ов (страна и язык) — компактный, не отвлекающий */
.fk-hdr__select{
    padding:2px 6px;
    border:1px solid rgba(255,255,255,.25);
    border-radius:6px;
    background:rgba(255,255,255,.10);
    color:#eef2f8;
    /* системный фолбэк: старые WebKit (Samsung Internet) не делают per-glyph fallback в form-control → кириллица/греческий в эндонимах пропадали */
    font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif;
    font-size:13px;
    line-height:1.3;
    cursor:pointer;
}
.fk-hdr__select option{ color:#003; background:#fff; font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, sans-serif; }

/* ---------- Адаптив ---------- */
/* навигация переносится на 2-ю строку только при <=680; остаётся сбитой влево
   и получает белый фон с синими пунктами (только в этом состоянии) */
@media (max-width:680px){
    .fk-hdr__bar{ flex-wrap:wrap; gap:12px; }
    .fk-hdr__nav{
        order:3;
        width:100%;
        justify-content:flex-start;
        flex-wrap:wrap;                 /* длинные пункты/языки переносятся, без гориз. прокрутки */
        gap:8px 24px;                   /* row-gap 8 / column-gap 24 */
        background:#ffffff;
        border-radius:8px;
        padding:6px 12px;
        box-sizing:border-box;
    }
    .fk-hdr__nav a{ font-size:14px; color:#2a3340; }
    .fk-hdr__nav a:hover{ border-bottom-color:#2a3340; }
    .fk-hdr__tools{ margin-left:auto; }
    .fk-hdr__sub{ flex-wrap:wrap; gap:12px; }
}
/* <=480: кластер селектов сворачивается в попап «регион» (одна кнопка справа) */
@media (max-width:480px){
    .fk-hdr__region-toggle{ display:inline-flex; }
    .fk-hdr__picks{
        display:none;
        position:absolute;
        top:calc(100% + 4px);
        right:2.6%;
        flex-direction:column;
        align-items:stretch;
        gap:12px;
        min-width:220px;
        padding:14px;
        background:#00214a;
        border:1px solid rgba(255,255,255,.18);
        border-radius:8px;
        box-shadow:0 10px 28px rgba(0,0,0,.4);
        z-index:1001;
    }
    .fk-hdr__picks.fk-picks--open{ display:flex; }
    .fk-hdr__pick{ white-space:normal; }
    .fk-hdr__picks .fk-hdr__select{ width:100%; }
}
/* <=380: меню на всю ширину (space-between) и сжимается до упора */
@media (max-width:380px){
    .fk-hdr__nav{ justify-content:space-between; gap:8px 10px; padding:6px 8px; }
    .fk-hdr__nav a{ font-size:13px; padding:4px 0; }
}
/* очень узкие экраны: прячем ссылку «о нас» (warum wir) */
@media (max-width:330px){
    .fk-hdr__about{ display:none; }
}

/* ============================================================
   Футер (flex) + прижатие к низу экрана (sticky footer)
   ============================================================ */

/* sticky footer: футер всегда внизу вьюпорта при коротком/пустом контенте.
   #body-container — общая обёртка-карточка (фикс 1310px); делаем её flex-колонкой
   на всю высоту, футер margin-top:auto уезжает вниз. */
#body-container.complect-body{
    min-height:100vh;
    display:flex;
    flex-direction:column;
}
#sub-body-container-2{           /* на части страниц контент завёрнут ещё одним слоем */
    flex:1 0 auto;
    display:flex;
    flex-direction:column;
}
#footer-dark-block{
    margin-top:auto;          /* прижатие к низу */
    background:#00214a;        /* основной фон футера (светлее #003) */
    padding:0;                /* общий padding убран — задаётся каждому блоку отдельно */
}

/* меню футера — отдельным тёмным блоком (#003), со своим padding */
#footer-dark-block .footer-bottom-menu{ background:#003; padding:14px 2.6%; }

/* flex-раскладка ссылок футера, без " | "-разделителей */
#footer-dark-block .footer-bottom-menu ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:6px 20px;
    padding:0;
    margin:0;
    list-style:none;
}
#footer-dark-block .footer-bottom-menu li{ display:inline-flex; padding:0; }
#footer-dark-block .footer-bottom-menu .bottom-link-hide{ display:none; }  /* убираем " | " */
#footer-dark-block .footer-bottom-menu a{ color:#cdd7e6; text-decoration:none; }
#footer-dark-block .footer-bottom-menu a:hover{ color:#fff; text-decoration:underline; }

/* список стран в футере — тоже flex */
#countries-top-menu-bottom ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:4px 14px;
    padding:0;
    margin:12px 0 0;
    list-style:none;
}
#countries-top-menu-bottom a{ color:#9fb0c4; text-decoration:none; font-size:13px; }
#countries-top-menu-bottom a:hover{ color:#fff; }

/* языки (и будущие валюты) под странами — тот же flex-стиль */
.fk-ftr-locale ul{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:4px 14px;
    padding:0;
    margin:8px 0 0;
    list-style:none;
}
.fk-ftr-locale a{ color:#9fb0c4; text-decoration:none; font-size:13px; }
.fk-ftr-locale a:hover{ color:#fff; }
.locale-current{ color:#fff; font-weight:600; font-size:13px; }  /* выделение выбранного (страна/язык) */

/* зона региона (страны + языки) — на основном фоне футера (#00214a), свой padding */
.fk-ftr__locale-zone{
    margin:0;
    padding:14px 2.6%;
}

/* копирайт + таймер — внизу футера */
.fk-ftr__copyright{ text-align:center; color:#cdd7e6; font-size:13px; padding:12px 2.6% 2px; }
#footer-dark-block .if-text-navy{ text-align:center; padding:0 2.6% 12px; font-size:11px; opacity:.6; }

/* SEO-описание — по центру, приглушённое, со своим боковым padding (общий padding футера убран) */
.felgenkonfigurator-description{
    max-width:1100px;
    margin:0 auto;
    padding:14px 2.6% 0;
    box-sizing:border-box;
    text-align:center;
    font-size:13px;
    color:#9fb0c4;
    line-height:1.5;
}

/* ============================================================
   Главная (flex, светлый боди): поиск HSN/TSN + плитки + бейджи
   ============================================================ */

/* бейджи-преимущества (рейтинг убран) — строка пилюль */
.success-information{ padding:16px 2.6% 6px; display:block; }   /* display:block — отменяем мобильный display:none из style.css */
.success-information-points{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;      /* центрируются САМИ плашки (группа), а не текст внутри */
    gap:12px;
    padding:0;
    margin-left:0;                    /* было 280px (отступ под убранный рейтинг) */
}
.success-information-points .success-point{
    flex:1 1 0;                 /* десктоп: 5 равных плашек в один ряд */
    min-width:170px;            /* не уже строки «Riesige Auswahl» + иконка → nowrap не вылезает; иначе перенос ряда */
    box-sizing:border-box;
    display:flex;
    align-items:center;         /* иконка+текст слева внутри плашки (текст НЕ центрируем) */
    gap:10px;
    height:auto;                /* снимаем ограничение высоты 24px/20px из style.css (резало 2 строки) */
    overflow:visible;           /* убираем overflow:hidden из style.css (резал текст плашки) */
    line-height:1.2;
    padding:12px 14px;
    color:#2a3340;
    font-size:15px;
    font-weight:600;
    white-space:nowrap;         /* строки целиком, пока есть место */
    text-align:left;
    background:#f5f7fb;          /* плашка (заодно сбрасывает старую галочку success_point.png) */
    border:1px solid #e3e8f0;
    border-radius:12px;
}
.success-information-points .success-point svg{ width:30px; height:30px; color:#00CC44; flex:0 0 auto; }   /* фирменный зелёный (secondary), чтобы не всё синее */
.success-information-points .success-point span{ line-height:1.15; }
/* планшет/телефон (≤900 — включая ландшафт телефона): ровно 3 в ряд → раскладка 3+2, плашки центрированы.
   брейкпойнт 900: выше него 5 плашек всегда влезают в один ряд (нет одиночной растянутой на всю ширину).
   плашка узкая → иконка над текстом; white-space:nowrap (из базы) — строки бейджа целиком, «Riesige Auswahl» не ломается */
@media (max-width:900px){
    .success-information-points .success-point{
        flex:0 0 31%;            /* ровно 3 в ряд; последние 2 центрируются контейнером */
        min-width:0;
        flex-direction:column;
        text-align:center;
        gap:6px;
        padding:12px 8px;
    }
}
/* узкие портретные экраны: уменьшаем шрифт и гаттеры, чтобы «Riesige Auswahl» влезала в одну строку в плашке 31% */
@media (max-width:460px){
    .success-information-points{ gap:8px; }
    .success-information-points .success-point{ font-size:12px; padding:10px 4px; gap:5px; }
    .success-information-points .success-point svg{ width:26px; height:26px; }
}

/* поиск по HSN/TSN — карточка, по левому краю */
.fk-home__search{
    background:#f5f7fb;          /* выделение цветом — как было */
    border:1px solid #e3e8f0;
    border-left:0;               /* без рамки слева */
    border-right:0;              /* без рамки справа */
    border-radius:0;             /* без закруглённых краёв — полоса на всю ширину */
    /* выходим за гор. padding родителя #center-block (2.6%), чтобы полоса касалась краёв карточки.
       -2.74% = 2.6% относительно ширины родителя (его контент на 5.2% уже) → края совпадают, без overflow.
       свой padding 2.6% сохраняет выравнивание контента с остальными блоками. */
    margin:0 -2.74%;
    padding:14px 2.6% 14px;
    text-align:left;
}
.fk-home__search .select-block-title{ margin:0 0 14px; font-size:20px; color:#0b2b5c; }
.fk-home__search #second{
    display:flex;
    flex-wrap:wrap;
    justify-content:flex-start;
    align-items:flex-end;
    gap:14px;
    max-width:760px;             /* компактная форма-виджет (не на всю ширину карточки) */
}
.fk-home__search .hsn-tsn-block{
    float:none;
    margin:0;
    display:flex;
    flex-direction:column;
    gap:6px;
    text-align:left;
}
.fk-home__search .hsn-tsn-title{ font-size:13px; color:#5a6472; font-weight:600; min-height:16px; }
.fk-home__search .hsn-tsn-block .button:hover{ background:#e07e00; }   /* оранжевый темнее на ховере */

/* ============================================================
   Логотипы автобрендов в каталоге (returnTableGrid, секция brand)
   ============================================================ */
.catalog-brands .table-row-cell.brand-cell{
    display:flex;
    align-items:center;
    gap:10px;
}
.catalog-brands .brand-logo{
    flex:0 0 auto;
    width:30px;
    height:30px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
}
/* монохром #003: форму даёт svg (CSS-маска), цвет — фирменный #003 (фон). Сами svg не трогаем.
   вернуть фирменные цвета лого = заменить этот блок на <img> + убрать маску. */
.catalog-brands .brand-logo--mask{
    background:#003;
    -webkit-mask:var(--logo) no-repeat center / contain;
            mask:var(--logo) no-repeat center / contain;
}
/* запасной <img>-рендер (если где-то остался) */
.catalog-brands .brand-logo img{
    max-width:100%;
    max-height:100%;
    object-fit:contain;
    display:block;
}
.catalog-brands .table-row-cell.brand-cell h2{ margin:0; }

/* ---------- Кнопки-бренды: общий вид для обоих гридов (popular .fk-bgrid и A-Z .fk-azgrid) ----------
   без рамок/фона/скругления; название не переносится; верхний margin ячейки снят. */
.fk-bgrid .table-row-cell-a,
.fk-azgrid .table-row-cell-a{ box-sizing:border-box; border:0; border-radius:0; background:none; }
.fk-bgrid .brand-cell h2,
.fk-azgrid .brand-cell h2{ white-space:nowrap; }
.fk-bgrid .table-row-cell-a .table-row-cell,
.fk-azgrid .table-row-cell-a .table-row-cell{ margin-top:0; color:#2a3340; }   /* 3 класса — перебивает мобильные margin-top; цвет текста плашек — фирменный #2a3340 (все секции) */

/* popular: многоколоночная раскладка — заполнение ПО СТОЛБЦАМ (1,2 в первой колонке, 3,4 во второй…),
   а не по строкам. column-count сам балансирует элементы сверху-вниз; адаптив 5→4→3→2→1 колонок.
   break-inside:avoid — чтобы ячейка бренда не разрывалась между колонками. */
.fk-bgrid{ column-count:5; column-gap:0; }
.fk-bgrid .table-row-cell-a{ display:block; width:100%; break-inside:avoid; -webkit-column-break-inside:avoid; }
@media (max-width:1100px){ .fk-bgrid{ column-count:4; } }
@media (max-width:900px){ .fk-bgrid{ column-count:3; } }
@media (max-width:680px){ .fk-bgrid{ column-count:2; } }
@media (max-width:460px){ .fk-bgrid{ column-count:1; } }

/* блок популярных — фирменный фон */
.catalog-brands--popular{ margin-bottom:18px; background:#f5f7fb; }

/* A-Z: ЕДИНАЯ grid-сетка — колонки общие для всех букв (как таблица).
   Буква занимает всю ширину (все актуальные колонки), бренды заполняются по строкам; «змейка» 5→4→3→2→1. */
.fk-azgrid{ display:grid; grid-template-columns:repeat(5,1fr); align-items:start; }
@media (max-width:1100px){ .fk-azgrid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:900px){ .fk-azgrid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:680px){ .fk-azgrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:460px){ .fk-azgrid{ grid-template-columns:repeat(1,1fr); } }
/* заголовок буквы — на всю ширину сетки; шрифт как был раньше (вес 300, 28px), family наследуется */
.fk-azgrid .fk-az-title{
    grid-column:1 / -1;
    font-size:28px;
    font-weight:300;
    color:#00CC44;
    border-bottom:1px solid #00CC44;
    padding:0 10px;
    margin-top:12px;
}
/* годы — короткие (4 цифры): держим 5 колонок дольше, переносим только на узких экранах
   (scoped перебивает общие брейкпойнты .fk-azgrid за счёт большей специфичности) */
.catalog-years .fk-azgrid{ grid-template-columns:repeat(5,1fr); }
@media (max-width:560px){ .catalog-years .fk-azgrid{ grid-template-columns:repeat(4,1fr); } }
@media (max-width:440px){ .catalog-years .fk-azgrid{ grid-template-columns:repeat(3,1fr); } }
@media (max-width:340px){ .catalog-years .fk-azgrid{ grid-template-columns:repeat(2,1fr); } }

/* модели/типы и двигатели — длинные строки: база 3 колонки, текст в ячейках переносится (без nowrap) */
.catalog-models .fk-azgrid,
.catalog-ccms .fk-azgrid{ grid-template-columns:repeat(3,1fr); }
@media (max-width:760px){ .catalog-models .fk-azgrid, .catalog-ccms .fk-azgrid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:480px){ .catalog-models .fk-azgrid, .catalog-ccms .fk-azgrid{ grid-template-columns:repeat(1,1fr); } }

/* ---------- Аккордеон групп (двигатели по топливу, годы, модели/типы) ---------- */
/* заголовок группы — кликабелен по всей ширине; шрифт как у буквенных заголовков */
.fk-acc__head{
    cursor:pointer;
    -webkit-user-select:none; -moz-user-select:none; user-select:none;
    font-size:28px;
    font-weight:300;
    color:#00CC44;
    border-bottom:1px solid #00CC44;
    margin-top:12px;
}
/* блок «название + стрелка» = ширина ОДНОЙ колонки плашек; стрелка прижата к правому краю первой колонки (с padding) */
.fk-acc__cell{
    display:flex;
    align-items:center;
    justify-content:space-between;
    box-sizing:border-box;
    padding:6px 10px;
}
.fk-acc__arrow{ width:22px; height:22px; flex:0 0 auto; color:#00CC44; transition:transform .15s ease; }
.fk-acc__body{ display:none; }                    /* по умолчанию свёрнуто */
.fk-acc.is-open .fk-acc__body{ display:grid; }    /* раскрыто (тело = .fk-azgrid) */
.fk-acc.is-open .fk-acc__arrow{ transform:rotate(180deg); }

/* складные блоки с обычным (не grid) содержимым — Kompletträder / Felgen / Reifen на странице размеров */
.fk-acc.fk-acc--block.is-open .fk-acc__body{ display:block; }   /* 4 класса — перебивает display:grid независимо от порядка */

/* страница размеров: сезон на всю ширину (заголовок-подзаголовок сохраняет свой дизайн .ads-season-title),
   радиусы (Zoll) внутри — змейка, старт 3 колонки; подпункты радиуса (Seriengröße / ohne Umbau) идут в столбик под главной плашкой */
.ads-season-block.fk-season{ float:none; width:100%; padding:10px 0; }   /* перебивает .ads-season-block{float:left;width:33.33%} */
/* колоночный (газетный) порядок: сверху вниз, потом слева направо — через multicolumn, старт 4 колонки */
.fk-zollgrid{ column-count:4; column-gap:0; }
@media (max-width:1000px){ .fk-zollgrid{ column-count:3; } }
@media (max-width:760px){ .fk-zollgrid{ column-count:2; } }
@media (max-width:480px){ .fk-zollgrid{ column-count:1; } }
.fk-zoll-cell{ break-inside:avoid; -webkit-column-break-inside:avoid; page-break-inside:avoid; margin-bottom:10px; }  /* ячейку (плашка+подпункты) не рвать между колонками; отступ снизу между ячейками */
.fk-zoll-cell .table-row-cell-a{ display:block; }               /* главная плашка + подпункты — каждая своей строкой */
/* подпункты (бывший margin-left:8%) — компактнее; специфичность поднята, чтобы перебить .table-row-cell-a:link .table-row-cell-zoll{padding:10px} */
.fk-zoll-sub.table-row-cell-a .table-row-cell-zoll,
.fk-zoll-sub.table-row-cell-a:link .table-row-cell-zoll,
.fk-zoll-sub.table-row-cell-a:visited .table-row-cell-zoll{ padding:6px 10px; }
.fk-zoll-nb{ white-space:nowrap; }                              /* «16 Zoll» (и «ohne Umbaumaßnahmen») не переносятся */

/* /reifen — страница размеров шин (index type=t / tyres_by_size): сезоны стопкой на всю ширину,
   радиусы внутри — flex-змейка построчно, старт 5 колонок. Цвет заголовков сезонов пока не трогаем. */
.fk-sizes{ margin-bottom:20px; }
.fk-sizes .ads-season-title{ /* border-bottom:2px solid #e3e8f0; */ margin-bottom:10px; }
.fk-zollflex{ display:flex; flex-wrap:wrap; }
.fk-zollflex > .table-row-cell-a{ flex:0 0 16.666%; max-width:16.666%; box-sizing:border-box; }   /* старт 6 колонок */
@media (max-width:1000px){ .fk-zollflex > .table-row-cell-a{ flex-basis:25%; max-width:25%; } }
@media (max-width:760px){ .fk-zollflex > .table-row-cell-a{ flex-basis:33.333%; max-width:33.333%; } }
@media (max-width:480px){ .fk-zollflex > .table-row-cell-a{ flex-basis:50%; max-width:50%; } }
@media (max-width:340px){ .fk-zollflex > .table-row-cell-a{ flex-basis:100%; max-width:100%; } }

/* подзаголовок объёма внутри топливной группы (2.0L, 3.0L …) — на всю ширину сетки, не сворачивается, чуть мельче плашек */
.fk-azgrid .fk-subhead{
    grid-column:1 / -1;
    font-size:16px;
    font-weight:600;
    color:#2a3340;
    border-bottom:1px solid #e3e8f0;
    padding:6px 10px;
    margin-top:6px;
}

/* ширина «первой колонки» заголовка = 1 колонка плашек секции (синхронно со змейкой грида) */
.catalog-ccms .fk-acc__cell, .catalog-models .fk-acc__cell{ width:33.333%; }
@media (max-width:760px){ .catalog-ccms .fk-acc__cell, .catalog-models .fk-acc__cell{ width:50%; } }
@media (max-width:480px){ .catalog-ccms .fk-acc__cell, .catalog-models .fk-acc__cell{ width:100%; } }
.catalog-years .fk-acc__cell{ width:40%; }   /* годы: заголовок шириной 2 колонки (узкие колонки → имя «2025—» влезает) */
@media (max-width:560px){ .catalog-years .fk-acc__cell{ width:50%; } }
@media (max-width:440px){ .catalog-years .fk-acc__cell{ width:66.666%; } }
@media (max-width:340px){ .catalog-years .fk-acc__cell{ width:100%; } }
.catalog-brands .fk-acc__cell{ width:20%; }   /* бренды: 5 колонок, змейка как у грида */
@media (max-width:1100px){ .catalog-brands .fk-acc__cell{ width:25%; } }
@media (max-width:900px){ .catalog-brands .fk-acc__cell{ width:33.333%; } }
@media (max-width:680px){ .catalog-brands .fk-acc__cell{ width:50%; } }
@media (max-width:460px){ .catalog-brands .fk-acc__cell{ width:100%; } }

/* страница размеров/сезона (results): блок выбора авто на всю ширину — инфо-блок справа убран, таблица растягивается как на komplettraeder */
.results-auto-filters-block{ float:none; width:100%; }

/* ── Полноэкранный загрузчик (loader('fullpage')) ──
   Класс .loader-fp вешается из JS только на fullpage-лоадер; перекрывает инлайновые
   position:absolute/offset из loader() через !important. Оверлей — на весь вьюпорт (fixed),
   спиннер — строго по центру экрана, прокрутка страницы блокируется до конца загрузки.
   Внутриэлементные лоадеры (tab/page/price/фильтры) класс .loader-fp НЕ получают — их верстка не меняется. */
#loader-all.loader-fp{
    position:fixed !important;
    top:0 !important; left:0 !important;
    width:100% !important; height:100% !important;
    z-index:1100;
}
.loader-loader.loader-fp{
    position:fixed !important;
    top:50% !important; left:50% !important;
    transform:translate(-50%,-50%);
    z-index:1101;
}
body.loader-noscroll{ overflow:hidden; }

/* ── Пустая страница размеров (нет товаров): полноценный вид + CTA ── */
.results-empty{ max-width:680px; margin:24px auto 40px; padding:0 16px; text-align:center; }
.results-empty__status{ font-size:22px; font-weight:300; color:#003; margin:0 0 10px; }
.results-empty__hint{ font-size:15px; line-height:1.55; color:#2a3340; margin:0 0 18px; }
.results-empty__cta{ margin-top:6px; }
.results-empty__link{ color:#00CC44; font-size:15px; }
.results-empty__link:hover{ text-decoration:underline; }

/* ── Нижний SEO-текст главной/категорий (новое позиционирование) ── */
#startseitentext{ margin-top:30px; line-height:1.55; }
#startseitentext h2{ font-size:20px; font-weight:300; color:#003; margin:18px 0 8px; }
#startseitentext p{ margin:0 0 12px; }
.home-seo-season{ margin:18px 0 14px; }
.home-seo-season a{ color:#00CC44; font-weight:600; text-decoration:none; }
.home-seo-season a:hover{ text-decoration:underline; }
.home-seo-links{ margin:6px 0; }
.home-seo-links strong{ color:#2a3340; }
.home-seo-links a, .home-seo-gutachten a{ color:#00CC44; text-decoration:none; }
.home-seo-links a:hover, .home-seo-gutachten a:hover{ text-decoration:underline; }
.home-seo-gutachten{ margin-top:14px; }

/* ============================================================
   Checkout-Stepper (Cart > Checkout > Review > Payment > Success)
   Перенесён 1:1 из sportticketsoffice. Используется на cart /
   checkout / confirmation / success (партиал includes/boxes/checkout_steps.php).
   Акцент-цвет — фирменный #00CC44 (в оригинале был тиловый #1d9e8a);
   чтобы вернуть оригинальный тон, замени #00CC44 на #1d9e8a ниже.
   ============================================================ */
.qc-steps {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	list-style: none;
	padding: 0;
	margin: 8px 0 16px;
	counter-reset: qc-step;
}
.qc-steps__item {
	flex: 1 1 0;
	min-width: 0;
	text-align: center;
	position: relative;
}
.qc-steps__circle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: #ccc;
	color: #fff;
	font-weight: 700;
	font-size: 14px;
	line-height: 1;
	position: relative;
	z-index: 2;
}
.qc-steps__label {
	display: block;
	margin-top: 6px;
	font-size: 13px;
	color: #6c757d;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.qc-steps__item--done .qc-steps__circle,
.qc-steps__item--active .qc-steps__circle {
	background: #00CC44;
}
.qc-steps__item--active .qc-steps__circle {
	box-shadow: 0 0 0 4px rgba(0, 204, 68, 0.18);
}
.qc-steps__item--active .qc-steps__label {
	color: #00CC44;
	font-weight: 600;
}
.qc-steps__item--done .qc-steps__label {
	color: #4a4a4a;
}
/* Connector line между кругами: ::after на каждом, кроме последнего;
   идёт из центра текущего круга к центру следующего. */
.qc-steps__item:not(:last-child)::after {
	content: '';
	position: absolute;
	top: 15px;
	left: calc(50% + 16px);
	right: calc(-50% + 16px);
	height: 2px;
	background: #ccc;
	z-index: 1;
}
.qc-steps__item--done:not(:last-child)::after {
	background: #00CC44;
}
/* Mobile (<576): меньше круг, меньше текст. */
@media (max-width: 575.98px) {
	.qc-steps__circle { width: 26px; height: 26px; font-size: 12px; }
	.qc-steps__label { font-size: 10px; margin-top: 4px; }
	.qc-steps__item:not(:last-child)::after {
		top: 12px;
		left: calc(50% + 13px);
		right: calc(-50% + 13px);
	}
}

/* Мультивалюта: дуальная цена (выбранная валюта + EUR). При активном EUR пары нет. */
.fk-price-alt {
	display: block;
	font-size: .72em;
	font-weight: 400;
	color: #2a3340;
	opacity: .62;
	line-height: 1.2;
	white-space: nowrap;
}
/* Дисклеймер «оплата в EUR» в корзине/чекауте */
.fk-pay-eur-note {
	font-size: 12px;
	color: #2a3340;
	opacity: .75;
	margin-top: 4px;
}
/* Страница «временно недоступно» (домен без партнёров) */
.fk-unavailable {
	max-width: 760px;
	margin: 48px auto;
	padding: 0 16px;
	text-align: center;
	color: #003;
}
.fk-unavailable h1 { font-size: 26px; margin: 0 0 12px; }
.fk-unavailable p { font-size: 16px; color: #2a3340; margin: 0 0 20px; }
.fk-unavailable__countries { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 16px; justify-content: center; }
.fk-unavailable__countries a { display: inline-block; padding: 8px 14px; background: #f5f7fb; border: 1px solid #e3e8f0; border-radius: 6px; color: #003; text-decoration: none; }
.fk-unavailable__countries a:hover { background: #FFE800; }