/* ==========================================================================
   overrides.css — landing-specific values
   --------------------------------------------------------------------------
   ВСЁ, что меняется с ленда на ленд, живёт здесь. Файл подключается ПОСЛЕДНИМ —
   значит любая переменная или правило отсюда перекрывает базовые из других
   файлов. Бери этот файл за основу при заведении нового ленда.

   Содержит ровно три секции:
     1. Бренд-переменные   (цвет акцента, золота, фон, радиусы)
     2. Шрифт и оффер      (название продукта, цены, ссылки)
     3. Точечные правки    (для микрокорректировок без переписывания компонентов)
   ========================================================================== */

:root {
    /* --- 1. Бренд-переменные (Metabo RX — палитра по Figma-макету) ----- */
    /* Основной navy/teal бренда (Dark/Navy #104F73) — шапка, H1/H2, specs, иконки */
    --c-navy:      #104f73;
    --c-navy-deep: #0c3f5c;
    --c-darker:    #2d566d;
    /* Cyan-акцент (Primary/Accent #31A9D5) — кнопки .cta-btn, ссылки */
    --c-accent:    #31a9d5;
    --c-tint:      #c6dfe8;
    --c-wash:      #eaf4f7;
    /* Золото CTA (Accent/Gold #EC9B4F) — главные кнопки "Zamów" */
    --c-gold:      #ec9b4f;
    --c-gold-soft: #fcebd6;
    --c-gold-text: #b5701f;
    /* Красный (warning) */
    --c-danger:    #da2f15;
    --c-danger-bg: #ffece9;

    /* --- 2. Типографика, оффер ---------------------------------------- */
    --ff-display: 'Brygada 1918', 'Geologica', serif;
    --ff-body:    'Inter', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;

    /* Радиусы (если ленд требует более плоский/острый стиль) */
    --radius-sm: 8px;
    --radius:    12px;
    --radius-lg: 16px;
    --radius-xl: 24px;
}

/* --- 3. Точечные правки --------------------------------------------------
   Здесь можно держать одиночные правила, которые «подкручивают» компонент,
   не переписывая его исходные стили. Примеры:

   .topbar { background: linear-gradient(...); }
   .product__cta { text-transform: uppercase; }
   .desc__title { font-style: italic; }

   ----------------------------------------------------------------------- */

/* [A] Мини-форма заказа в шагах (order.html) */
.steps .register__submit {
    height: 46px;
    font-size: 14px;
}

.steps .mockform {
    height: auto;
    min-height: 200px;
}

/* [C] Планшет: язык, CTA и бургер — справа */
@media (max-width: 1024px) {
    .header__lang {
        margin-left: auto;
    }
}

/* [D] Узкие экраны: карточки шагов не на всю ширину */
@media (max-width: 768px) {
    .steps {
        justify-items: center;
    }

    .steps__card {
        width: 100%;
        max-width: 400px;
    }
}

/* [E] CTA в шапке — одна строка; поджим отступов при переполнении */
.product__cta--sm {
    white-space: nowrap;
    text-align: center;
}

@media (min-width: 1025px) and (max-width: 1180px) {
    .topbar__nav {
        gap: 12px;
    }

    .topbar__inner {
        gap: 12px;
    }

    .product__cta--sm {
        padding: 6px 14px;
    }
}

/* ==========================================================================
   [F]-[I] Превентивные правки стокового multi-2 (рекуррентные ревью Anastasiya M)
   — применены заранее, чтобы ревьюер не возвращал то же самое. См. seox-task SKILL.
   ========================================================================== */

/* [F] Горизонтальный оверфлоу (мобайл/таблет/HD): scroll-reveal --right стартует
   сдвинутым → страница шире вьюпорта. clip (НЕ hidden!) не ломает sticky-хедер. */
.page { overflow-x: clip; }

/* [G] Промо-бар: симметричные отступы на мобайле (правило ≤1024 даёт padding-right:36px
   под кнопку закрытия; в колоночном ≤768 не сбрасывалось → пустой зазор справа). */
@media (max-width: 768px) {
    .promo__inner { padding-right: 20px; }
    .promo__msg { padding-right: 24px; }
}

/* [H] iPad/таблет ≤1024: блок инфо товара центрировать под галереей
   (по умолчанию flex:1 0 0 растягивал влево → пустота справа). */
@media (max-width: 1024px) {
    .product__info { width: 100%; max-width: 500px; align-self: center; }
}

/* [I] Шапка на десктопе не должна обрезаться. <1200 → бургер-дроп; ≥1200 → инлайн-nav
   поджата (brand+nav+CTA умещаются в контейнер 1200). Порог = ширина контента.
   Дробно-пиксельная граница 1199.98, чтобы не было щели на high-DPI ~1024.5px. */
@media (min-width: 1200px) {
    .topbar__inner { gap: 16px; }
    .topbar__nav { gap: 12px; }
    .topbar__nav-link { font-size: 15px; }
}
@media (max-width: 1199.98px) {
    .topbar__nav { display: none; }
    .topbar__burger { display: inline-flex; }
    .topbar .product__cta--sm { margin-left: auto; }
}
