/*
 * Orthodox Parish — дизайн-токены (рабочий источник).
 * Описание и расчёт контрастов: docs/03-DESIGN-SYSTEM.md.
 * Любой новый токен сначала документируется в docs/03.
 *
 * Брейкпоинты (в custom properties их нельзя использовать в @media,
 * поэтому значения зафиксированы здесь и повторяются в media-запросах):
 *   md  48rem  (768px)   — 2 колонки сеток, увеличенные поля
 *   lg  64rem  (1024px)  — горизонтальное меню, 3–4 колонки
 *   xl  80rem  (1280px)  — максимум контейнера, крупные отступы секций
 * Mobile-first: базовые стили — для 320px, дальше только min-width.
 */

/* Шрифты: локальные woff2, подмножества latin + cyrillic. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/inter-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-500-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("../fonts/inter-latin-500-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-cyrillic-600-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "Inter";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("../fonts/inter-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "PT Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/pt-serif-cyrillic-400-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "PT Serif";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/pt-serif-latin-400-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "PT Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/pt-serif-cyrillic-400-italic.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "PT Serif";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/pt-serif-latin-400-italic.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
  font-family: "PT Serif";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/pt-serif-cyrillic-700-normal.woff2") format("woff2");
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}

@font-face {
  font-family: "PT Serif";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/pt-serif-latin-700-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

:root {
  /* ---- Цвет: палитра «Б — Шампань» (docs/03, docs/29). Единственный источник цвета темы ---- */
  --color-primary: #4A3122;
  --color-primary-hover: #38251A;
  --color-blue-soft: #EEEBE4;
  --color-page: #FCFAF6;
  --color-surface: #FFFFFF;
  --color-text: #2E3236;
  --color-text-muted: #5F554A;

  /* ---- Цвет: бронза (кнопка accent, декоративные линии) и шампань (только подложки) ---- */
  --color-bronze: #4A3122;              /* фон accent-кнопки, линии под заголовками, штрих цитаты, маркер ленты; текст --color-on-bronze */
  --color-bronze-hover: #3D2A1C;        /* accent-кнопка при наведении */
  --color-bronze-active: #322117;       /* accent-кнопка при нажатии */           /* текст на бронзе */
  --color-champagne: #F8DAB2;           /* подложки: метки, плашки; текст на нём --color-text; не для кнопок и линий */
  --color-champagne-soft: #FDF1E0;      /* мягкая подложка; текст --color-text */

  /* ---- Цвет: производные (контрасты — в docs/03) ---- */
  --color-on-primary: #FFFFFF;          /* текст на primary / primary-hover */
  --color-on-bronze: #FFFFFF;           /* текст на кнопке accent */
  --color-on-primary-muted: #D9CCB8;    /* приглушённый текст на primary-hover, 8.38:1 (подвал — свои --color-footer-*, docs/66) */
  --color-section-tint: #F8DAB2;     /* фон мягких секций: исходный светлый цвет палитры (docs/03, «Пресеты палитры») */
  --color-decor: #9F6D2D;            /* линии, полоски цитат, маркеры: не ниже 3:1 к фону */
  --color-footer: #3B3632;           /* фон подвала: приглушённый тёплый графит, не насыщенный основной цвет (владелец 2026-10-25, docs/66); белый 11.9:1 */
  --color-footer-text: #FFFFFF;      /* текст подвала; у светлых подвалов — тёмный */
  --color-footer-muted: #FFFFFF;
  --color-footer-heading: #FFFFFF;
  --color-footer-focus: #FFFFFF;
  --color-footer-line: color-mix(in srgb, var(--color-footer-muted) 35%, var(--color-footer)); /* линия над копирайтом: видна на любом подвале (2,1–2,9:1, декоративная), docs/66 */
  --color-field-border: #746657;        /* рамка полей и контролов, >= 3:1 на page и surface */
  --color-border: #D2D2D2;              /* декоративные разделители и рамки карточек (без смысловой нагрузки) */
  --color-disabled-bg: #EEF0F2;         /* фон недоступных элементов (нейтральный серый), текст --color-text-muted */
  --color-overlay: rgb(28 35 48 / 60%); /* подложка модальных окон */
  /* «Обложка 1»: графитовое затемнение фото (нейтральное, без синевы, docs/34). Градиенты собраны здесь: rgb() вне tokens.css запрещён */
  --color-cover-shade-rgb: 22 21 20;   /* графит во всех палитрах (решение владельца 2026-10-25): палитры его не переопределяют */
  --color-cover-shade: rgb(var(--color-cover-shade-rgb) / 64%);      /* ровное затемнение: белый текст не ниже 4.5:1 даже на белом фото */
  --color-cover-shade-soft: rgb(var(--color-cover-shade-rgb) / 34%); /* только для макетов styleguide */
  /* Затемнение обложки — плавные кривые (владелец 2026-10-25: «градиент должен быть плавным, а не резким»): точки через
     4–8% по кривой без площадок и изломов, поэтому на фото нет видимой полосы. До края текста — не слабее 64%:
     белый текст на белом фото держит 4.5:1 (bin/check-palette.mjs проверяет минимум по зоне текста, а не одну точку). */
  --cover-gradient-light-right:
    linear-gradient(
      90deg,
      rgb(var(--color-cover-shade-rgb) / 82%) 0%,
      rgb(var(--color-cover-shade-rgb) / 81%) 8%,
      rgb(var(--color-cover-shade-rgb) / 78%) 16%,
      rgb(var(--color-cover-shade-rgb) / 75%) 24%,
      rgb(var(--color-cover-shade-rgb) / 71%) 32%,
      rgb(var(--color-cover-shade-rgb) / 68%) 40%,
      rgb(var(--color-cover-shade-rgb) / 65%) 48%,
      rgb(var(--color-cover-shade-rgb) / 64%) 56%,
      rgb(var(--color-cover-shade-rgb) / 62%) 60%,
      rgb(var(--color-cover-shade-rgb) / 57%) 64%,
      rgb(var(--color-cover-shade-rgb) / 50%) 68%,
      rgb(var(--color-cover-shade-rgb) / 43%) 72%,
      rgb(var(--color-cover-shade-rgb) / 36%) 76%,
      rgb(var(--color-cover-shade-rgb) / 28%) 80%,
      rgb(var(--color-cover-shade-rgb) / 21%) 84%,
      rgb(var(--color-cover-shade-rgb) / 14%) 88%,
      rgb(var(--color-cover-shade-rgb) / 7%) 92%,
      rgb(var(--color-cover-shade-rgb) / 2%) 96%,
      rgb(var(--color-cover-shade-rgb) / 0%) 100%
    ); /* «Свет справа»: 0–56% ширины — зона текста (82% → 64%), дальше плавная кривая к 0 на 100% */
  --cover-gradient-narrow:
    linear-gradient(
      0deg,
      rgb(var(--color-cover-shade-rgb) / 85%) 0%,
      rgb(var(--color-cover-shade-rgb) / 84%) 8%,
      rgb(var(--color-cover-shade-rgb) / 82%) 16%,
      rgb(var(--color-cover-shade-rgb) / 79%) 24%,
      rgb(var(--color-cover-shade-rgb) / 75%) 32%,
      rgb(var(--color-cover-shade-rgb) / 71%) 40%,
      rgb(var(--color-cover-shade-rgb) / 68%) 48%,
      rgb(var(--color-cover-shade-rgb) / 65%) 56%,
      rgb(var(--color-cover-shade-rgb) / 64%) 64%,
      rgb(var(--color-cover-shade-rgb) / 64%) 65%,
      rgb(var(--color-cover-shade-rgb) / 63%) 67.5%,
      rgb(var(--color-cover-shade-rgb) / 60%) 70%,
      rgb(var(--color-cover-shade-rgb) / 56%) 72.5%,
      rgb(var(--color-cover-shade-rgb) / 51%) 75%,
      rgb(var(--color-cover-shade-rgb) / 45%) 77.5%,
      rgb(var(--color-cover-shade-rgb) / 39%) 80%,
      rgb(var(--color-cover-shade-rgb) / 32%) 82.5%,
      rgb(var(--color-cover-shade-rgb) / 25%) 85%,
      rgb(var(--color-cover-shade-rgb) / 19%) 87.5%,
      rgb(var(--color-cover-shade-rgb) / 13%) 90%,
      rgb(var(--color-cover-shade-rgb) / 8%) 92.5%,
      rgb(var(--color-cover-shade-rgb) / 4%) 95%,
      rgb(var(--color-cover-shade-rgb) / 1%) 97.5%,
      rgb(var(--color-cover-shade-rgb) / 0%) 100%
    ); /* узкий экран («Свет справа», «Подпись снизу»): текст занимает до 65% высоты, дальше плавно к 0 */
  --cover-gradient-bottom:
    linear-gradient(
      0deg,
      rgb(var(--color-cover-shade-rgb) / 88%) 0%,
      rgb(var(--color-cover-shade-rgb) / 86%) 8%,
      rgb(var(--color-cover-shade-rgb) / 82%) 16%,
      rgb(var(--color-cover-shade-rgb) / 77%) 24%,
      rgb(var(--color-cover-shade-rgb) / 71%) 32%,
      rgb(var(--color-cover-shade-rgb) / 64%) 40%,
      rgb(var(--color-cover-shade-rgb) / 57%) 48%,
      rgb(var(--color-cover-shade-rgb) / 49%) 56%,
      rgb(var(--color-cover-shade-rgb) / 40%) 64%,
      rgb(var(--color-cover-shade-rgb) / 31%) 72%,
      rgb(var(--color-cover-shade-rgb) / 22%) 80%,
      rgb(var(--color-cover-shade-rgb) / 14%) 88%,
      rgb(var(--color-cover-shade-rgb) / 7%) 94%,
      rgb(var(--color-cover-shade-rgb) / 0%) 100%
    ); /* «Подпись снизу»: у низа 88%, к 40% высоты — 64% (зона подписи), дальше плавно к 0 */

  /* ---- Цвет: статусы ---- */
  --color-success: #2F6B45;
  --color-success-bg: #E3F0E6;
  --color-warning: #7A5410;
  --color-warning-bg: #F7EDD6;
  --color-error: #A3302A;
  --color-error-bg: #F8E3E1;

  /* ---- Цвет: фокус ---- */
  --color-focus: var(--color-primary);  /* на светлом фоне */
  --color-focus-on-dark: #FFFFFF;       /* на тёмных фонах (primary, primary-hover); в подвале — --color-footer-focus */

  /* ---- Шрифты ---- */
  --font-heading: "PT Serif", Georgia, "Times New Roman", serif;
  --font-body: "Inter", Arial, sans-serif;
  --font-weight-regular: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;              /* только PT Serif */

  /* ---- Шкала размеров ---- */
  --text-h1: clamp(2rem, 1.6rem + 1.8vw, 2.75rem);
  --text-h2: clamp(1.625rem, 1.4rem + 1vw, 2.125rem);
  --text-h3: clamp(1.375rem, 1.25rem + 0.5vw, 1.625rem);
  --text-h4: 1.25rem;
  --text-h5: 1.125rem;
  --text-h6: 1rem;
  --text-lead: clamp(1.125rem, 1.07rem + 0.25vw, 1.25rem);
  --text-base: 1rem;
  --text-sm: 0.9375rem;                  /* чуть меньше основного: меню шапки, название сайта */
  --text-caption: 0.875rem;             /* подписи, метаданные */

  /* ---- Межстрочные ---- */
  --leading-tight: 1.2;                 /* H1–H3 */
  --leading-snug: 1.35;                 /* H4–H6, кнопки, подписи */
  --leading-body: 1.6;

  /* ---- Отступы (кратны 4) ---- */
  --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;
  --space-24: 6rem;
  --section-space: clamp(var(--space-12), 4vw + 2rem, var(--space-24)); /* вертикальный отступ секций */

  /* ---- Контейнер и поля ---- */
  --container-width: 75rem;
  --container-narrow: 46rem;            /* текстовая колонка */
  --gutter: var(--space-4);             /* боковые поля: 16px */

  /* ---- Радиусы и тени ---- */
  --radius-sm: 0.375rem;
  --radius-md: 0.75rem;
  --radius-lg: 1rem;
  --radius-full: 62.5rem;               /* бейджи-«таблетки» */
  --shadow-card: 0 0.25rem 1.25rem rgb(30 58 100 / 8%);
  --shadow-raised: 0 0.375rem 1.5rem rgb(30 58 100 / 14%); /* hover карточки-ссылки, меню */

  /* ---- Рамки и интерактивные зоны ---- */
  --border-width: 1px;
  --border-width-strong: 2px;
  --hit-min: 2.75rem;                   /* 44px — минимальная зона нажатия */
  --control-size: 1.375rem;             /* 22px — чекбокс и радио */
  --icon-size: 1.25rem;
  --icon-size-lg: 1.5rem;

  /* ---- Фокус ---- */
  --focus-width: 3px;
  --focus-offset: 2px;

  /* ---- Анимации ---- */
  --duration-fast: 160ms;
  --duration-base: 180ms;
  --duration-slow: 240ms;
  --duration-spin: 900ms;               /* индикатор загрузки */
  --ease-standard: ease;
  --transition-ui: var(--duration-base) var(--ease-standard);

  /* ---- Слои ---- */
  --z-base: 0;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-overlay: 300;
  --z-modal: 400;
  --z-skip-link: 1000;
}

/*
 * Пресеты палитры (docs/03, docs/51, docs/palettes/): выбираются в «Внешний вид → Настроить → Цвета сайта»; PHP ставит data-op-palette на <html>.
 * Базовый :root выше — «Тёплая патина» (умолчание, docs/51). Блок переопределяет только эти токены (surface, статусы, затемнение обложки, шрифты, отступы общие).
 * Селектор без :root, чтобы образцы в настройщике показывали цвета пресета на своём элементе.
 * Список id — в inc/palette.php; контрасты каждого пресета проверяет bin/check-palette.mjs.
 */

/* Жемчужный камень */
[data-op-palette="pearl-stone"] {
  --color-primary: #514842;
  --color-primary-hover: #39322E;
  --color-blue-soft: #E6EAED;
  --color-page: #FAF9F7;
  --color-text: #2E3236;
  --color-text-muted: #5D5651;
  --color-bronze: #B1B9CC;
  --color-bronze-hover: #9CA3B4;
  --color-bronze-active: #878D9B;
  --color-champagne: #CEC5BC;
  --color-champagne-soft: #F4F1ED;
  --color-field-border: #786E67;
  --color-border: #D8D3CF;
  --color-on-primary-muted: #DAD3CE;
  --color-section-tint: #E6EAED;
  --color-decor: #69503C;
  --color-footer: #7C716C;
  --color-footer-text: #FFFFFF;
  --color-footer-muted: #FFFFFF;
  --color-footer-heading: #FFFFFF;
  --color-footer-focus: #FFFFFF;
}

/* Туман и песок */
[data-op-palette="mist-sand"] {
  --color-primary: #29454B;
  --color-primary-hover: #1C3035;
  --color-blue-soft: #C3DCF0;
  --color-page: #F7FAFC;
  --color-text: #2E3236;
  --color-text-muted: #4E585A;
  --color-bronze: #C19569;
  --color-bronze-hover: #AA835C;
  --color-bronze-active: #937150;
  --color-champagne: #C19569;
  --color-champagne-soft: #F1E6DA;
  --color-field-border: #66777C;
  --color-border: #D8DDE1;
  --color-on-primary-muted: #C9DADD;
  --color-section-tint: #C3DCF0;
  --color-decor: #765331;
  --color-footer: #E9E1D6;
  --color-footer-text: #1A1A1A;
  --color-footer-muted: #1A1A1A;
  --color-footer-heading: #1A1A1A;
  --color-footer-focus: #1A1A1A;
}

/* Тихая олива */
[data-op-palette="quiet-olive"] {
  --color-primary: #223125;
  --color-primary-hover: #17221A;
  --color-blue-soft: #E6E7EB;
  --color-page: #FBFBFB;
  --color-text: #2E3236;
  --color-text-muted: #515A52;
  --color-bronze: #223125;
  --color-bronze-hover: #1C281E;
  --color-bronze-active: #172119;
  --color-champagne: #A1C0C2;
  --color-champagne-soft: #EFF3F2;
  --color-field-border: #717B73;
  --color-border: #D5D8D6;
  --color-on-primary-muted: #D1DCD1;
  --color-section-tint: #E6E7EB;
  --color-decor: #5A4A2A;
  --color-footer: #343833;
  --color-footer-muted: #D1DCD1;
  --color-footer-heading: #E6E7EB;
}

/* Глубокий сапфир */
[data-op-palette="deep-sapphire"] {
  --color-primary: #022E5B;
  --color-primary-hover: #031725;
  --color-blue-soft: #DAEAFF;
  --color-page: #F7FAFE;
  --color-text: #022E5B;
  --color-text-muted: #526174;
  --color-bronze: #A1C6F6;
  --color-bronze-hover: #8EAED8;
  --color-bronze-active: #7A96BB;
  --color-champagne: #A1C6F6;
  --color-champagne-soft: #EEF5FF;
  --color-field-border: #6E8498;
  --color-border: #D5E1EE;
  --color-on-primary-muted: #C7DAEC;
  --color-section-tint: #DAEAFF;
  --color-decor: #735331;
  --color-footer: #2C323A;
  --color-footer-muted: #C7DAEC;
  --color-footer-heading: #DAEAFF;
}

@media (min-width: 48rem) {
  :root {
    --gutter: var(--space-6);
  }
}

@media (min-width: 80rem) {
  :root {
    --gutter: var(--space-8);
  }
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --duration-fast: 0ms;
    --duration-base: 0ms;
    --duration-slow: 0ms;
    --duration-spin: 0ms;
  }
}