/* ═══════════════════════════════════════════════════════════════════
   «Рядом с Викой» — основа оформления портала.
   Направление «Тёплая студия»: кремовый фон, крупные округлые формы,
   одна терракота как акцент, засечный курсив для отдельных слов.

   Здесь только настройки. Компоненты — в components.css, шрифты —
   в fonts.css. Будущая страница портала подключает три файла и
   получает единое оформление, не копируя ни одного значения.

   Размеры в rem: при увеличении текста до 200 % вместе с текстом
   растут отступы, кнопки и скругления.
   ═══════════════════════════════════════════════════════════════════ */

:root {
    /* ── Цвет ──
       Контраст обычного текста к фону проверяется автоматически
       (tools/portal-checks.py) и держится не ниже 4,5 : 1. */
    --bg:            #fdf6f0;   /* тёплый кремовый фон страницы */
    --surface:       #ffffff;   /* карточки, лист расписания */
    --surface-warm:  #f8ece2;   /* спокойная подложка раздела */

    /* Три оттенка для входов: они должны отличаться друг от друга,
       а не повторять один и тот же блок трижды. */
    --tint-peach:    #f7e3d2;
    --tint-sage:     #e3eae0;
    --tint-sand:     #f3ece2;

    /* Декорации первого экрана */
    --blob:          #f3d8c2;   /* крупное пятно за карточкой */
    --sun:           #f3a860;   /* круг, выглядывающий из-за пятна */

    --ink:           #1f1b19;   /* основной текст */
    --ink-2:         #615853;   /* пояснения и подписи */
    --line:          #ecdccd;   /* рамки и разделители */
    --line-strong:   #d9c4b2;   /* рамка там, где нужна заметность */

    --accent:        #a3452f;   /* терракота: ссылки, основные кнопки */
    --accent-dk:     #84351f;   /* при наведении и нажатии */
    --accent-soft:   #f6e3dc;   /* очень светлая акцентная подложка */

    --focus:         #1b61b5;   /* обводка фокуса, намеренно вне палитры */

    /* ── Шрифты ──
       Оба лежат рядом с сайтом, внешних запросов нет. Inter — весь
       текст, Lora курсивом — отдельные выразительные слова. */
    --font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto,
            'Helvetica Neue', Arial, sans-serif;
    --font-accent: 'Lora', Georgia, 'Times New Roman', serif;

    --text-xs:   0.8125rem;
    --text-sm:   0.9375rem;
    --text-base: 1.0625rem;   /* основной текст крупнее обычного: читать легче */
    --text-lg:   1.1875rem;
    --text-xl:   1.375rem;
    --text-2xl:  1.75rem;
    --text-3xl:  2.25rem;     /* заголовок первого экрана, телефон */

    --leading-tight: 1.1;
    --leading-snug:  1.3;
    --leading-base:  1.6;

    /* ── Отступы ── шаг 4 px, в rem */
    --space-1:  0.25rem;
    --space-2:  0.5rem;
    --space-3:  0.75rem;
    --space-4:  1rem;
    --space-5:  1.25rem;
    --space-6:  1.5rem;
    --space-8:  2rem;
    --space-10: 2.5rem;
    --space-12: 3rem;
    --space-16: 4rem;
    --space-20: 5rem;

    /* ── Форма ──
       Скругления крупные: это основная примета направления.
       Кнопки и метки — полностью круглые торцы. */
    --radius-sm:   10px;
    --radius:      16px;
    --radius-lg:   24px;
    --radius-xl:   36px;
    --radius-pill: 999px;

    --shadow-sm: 0 1px 2px rgba(31, 27, 25, .05);
    --shadow:    0 6px 24px rgba(31, 27, 25, .07);
    --shadow-lg: 0 18px 48px rgba(31, 27, 25, .12);

    /* ── Раскладка ── */
    --container: 75rem;
    --measure:   62ch;

    /* Минимальная сторона всего, что нажимают */
    --tap: 2.75rem;
}

/* Заголовок первого экрана растёт вместе с окном. Границы в rem,
   поэтому увеличение текста браузером продолжает работать. */
@media (min-width: 48rem) {
    :root { --text-3xl: 3rem; --text-2xl: 2rem; }
}
@media (min-width: 64rem) {
    :root { --text-3xl: 3.5rem; }
}