/*
 * Доступность сайта (ГОСТ Р 52872-2019, ПП РФ от 07.02.2026 № 102).
 *
 * Файл подключается после main.css, поэтому здесь только дополнения и
 * точечные замены цветов текста. Декоративный красный #DB775B остаётся в
 * тенях и фонах, но для мелкого текста используется #A8452A (контраст 5,9:1
 * на белом вместо 3,1:1).
 */

:root {
    --main-red-text: #A8452A;
    --focus-color: #A8452A;
}

/* ============================ Служебные классы ============================ */

.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    overflow: hidden;
    white-space: nowrap;
}

/* Ссылка «Перейти к основному содержанию»: видна только при focus с клавиатуры. */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 2000;
    background: var(--main-black);
    color: var(--main-white);
    padding: 10px 16px;
    font-family: var(--font-impact, sans-serif);
    text-transform: uppercase;
    text-decoration: none;
}

.skip-link:focus {
    left: 0;
    top: 0;
}

/* Видная рамка фокуса для клавиатуры — обязательное условие доступности. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid var(--focus-color);
    outline-offset: 2px;
}

main:focus {
    outline: none;
}

/* ===================== Переключатель настроек доступности ===================== */

.a11y-toggle {
    font-family: var(--font-impact, sans-serif);
    text-transform: uppercase;
    font-size: clamp(0.8rem, 1.1vw, 1rem);
    letter-spacing: 1px;
    color: var(--main-black);
    background: none;
    border: 2px solid var(--main-black);
    padding: 5px 10px;
    cursor: pointer;
}

.a11y-toggle:hover {
    background-color: var(--main-yellow);
    box-shadow: 4px 4px 0 var(--main-red);
}

.a11y-panel {
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
    align-items: center;
    padding: 14px 4vw;
    background: var(--main-black);
    color: var(--main-white);
    border-bottom: 4px solid var(--main-yellow);
}

.a11y-panel[hidden] {
    display: none;
}

.a11y-group {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
}

.a11y-caption {
    font-family: var(--font-impact, sans-serif);
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
}

.a11y-panel button {
    font-family: var(--font-impact, sans-serif);
    font-size: 0.9rem;
    color: var(--main-white);
    background: transparent;
    border: 2px solid var(--main-white);
    padding: 4px 10px;
    cursor: pointer;
}

.a11y-panel button[aria-pressed="true"] {
    background: var(--main-yellow);
    color: var(--main-black);
    border-color: var(--main-yellow);
}

.a11y-panel button[data-a11y-font="2"] {
    font-size: 1.05rem;
}

.a11y-panel button[data-a11y-font="3"] {
    font-size: 1.2rem;
}

.a11y-check {
    display: flex;
    gap: 6px;
    align-items: center;
    font-size: 0.9rem;
}

.a11y-check input {
    width: 18px;
    height: 18px;
}

.a11y-link {
    color: var(--main-yellow);
    font-size: 0.9rem;
}

/* ============================== Настройки пользователя ============================== */

/* Размер шрифта. Основные размеры в main.css заданы в rem и clamp(),
 * поэтому масштабирование базовой величины увеличивает и их. */
html.a11y-font-2 {
    font-size: 112.5%;
}

html.a11y-font-3 {
    font-size: 125%;
}

body.a11y-spacing p,
body.a11y-spacing li,
body.a11y-spacing dd,
body.a11y-spacing dt {
    line-height: 2;
}

body.a11y-spacing {
    letter-spacing: 0.02em;
    word-spacing: 0.08em;
}

/* Изображения скрываются, но подписи и alt остаются доступны. */
body.a11y-no-images img,
body.a11y-no-images picture,
body.a11y-no-images video,
body.a11y-no-images .decorative {
    display: none !important;
}

/* Чёрным по белому. */
body.a11y-high-contrast {
    background: #fff;
    color: #000;
}

body.a11y-high-contrast * {
    background-color: #fff !important;
    color: #000 !important;
    border-color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
}

body.a11y-high-contrast a {
    text-decoration: underline;
}

/* Жёлтым по чёрному. */
body.a11y-yellow-black {
    background: #000;
    color: #ffe38d;
}

body.a11y-yellow-black * {
    background-color: #000 !important;
    color: #ffe38d !important;
    border-color: #ffe38d !important;
    box-shadow: none !important;
}

/* Белым по синему. */
body.a11y-blue-white {
    background: #0b2a5b;
    color: #fff;
}

body.a11y-blue-white * {
    background-color: #0b2a5b !important;
    color: #fff !important;
    border-color: #fff !important;
    box-shadow: none !important;
}

/* ============================ Контраст мелкого текста ============================ */

.cookie-content a,
.cit-author,
footer a,
.legal-body a,
.info-body a,
.info-nav a,
.stub {
    color: var(--main-red-text);
}

body.a11y-high-contrast .cookie-content a,
body.a11y-high-contrast .cit-author,
body.a11y-high-contrast footer a,
body.a11y-high-contrast .legal-body a,
body.a11y-high-contrast .info-body a,
body.a11y-high-contrast .info-nav a,
body.a11y-high-contrast .stub {
    color: #000;
}

body.a11y-yellow-black .cookie-content a,
body.a11y-yellow-black .cit-author,
body.a11y-yellow-black footer a,
body.a11y-yellow-black .legal-body a,
body.a11y-yellow-black .info-body a,
body.a11y-yellow-black .info-nav a,
body.a11y-yellow-black .stub {
    color: #ffe38d;
}

body.a11y-blue-white .cookie-content a,
body.a11y-blue-white .cit-author,
body.a11y-blue-white footer a,
body.a11y-blue-white .legal-body a,
body.a11y-blue-white .info-body a,
body.a11y-blue-white .info-nav a,
body.a11y-blue-white .stub {
    color: #fff;
}

/* Подчёркивание у ссылок в тексте — цвет не должен быть единственным признаком. */
.legal-body a,
.info-body a {
    text-decoration: underline;
}

/* ===================== Мобильная кнопка меню как настоящая кнопка ===================== */

@media (max-width: 958px) {
    .mobile-menu-btn svg {
        width: 34px;
        height: 34px;
        fill: var(--main-black);
    }

    .mobile-menu-btn .mobile-menu-label {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        clip: rect(0 0 0 0);
        clip-path: inset(50%);
        overflow: hidden;
        white-space: nowrap;
    }

    .head_right .a11y-toggle {
        width: 90%;
        margin: 0 auto;
        text-align: center;
    }
}

/* ============================ Cookie-баннер: кнопки ============================ */

.cookie-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
}

.cookie-btn-secondary {
    background: var(--main-white);
    color: var(--main-black);
    border: 2px solid var(--main-black);
}

/* ============================ раздел «Сведения» ============================ */

.info-layout {
    display: flex;
    flex-wrap: wrap;
    gap: 32px;
    align-items: flex-start;
    padding: 24px 4vw 64px;
}

.info-nav {
    flex: 0 0 260px;
    position: sticky;
    top: 16px;
    display: flex;
    flex-direction: column;
    gap: 6px;
    border: 2px solid var(--main-black);
    padding: 14px;
    background: var(--main-cream);
}

.info-nav-title {
    font-family: var(--font-impact, sans-serif);
    text-transform: uppercase;
    font-size: 0.85rem;
    letter-spacing: 1px;
    margin-bottom: 6px;
}

.info-nav ol {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.info-nav a {
    display: block;
    padding: 4px 6px;
    font-size: 0.95rem;
    text-decoration: underline;
}

.info-nav a[aria-current="page"] {
    background: var(--main-yellow);
    color: var(--main-black);
    font-weight: 700;
    text-decoration: none;
}

.info-body {
    flex: 1 1 420px;
    min-width: 0;
}

.info-body h2 {
    margin-top: 32px;
}

.info-body h3 {
    margin-top: 24px;
}

.info-fields {
    margin: 0 0 24px;
    border-collapse: collapse;
    width: 100%;
}

.info-fields dt {
    font-weight: 700;
    margin-top: 12px;
}

.info-fields dd {
    margin: 2px 0 12px;
}

.info-table {
    width: 100%;
    border-collapse: collapse;
    margin: 12px 0 24px;
}

.info-table th,
.info-table td {
    border: 1px solid #8a8a8a;
    padding: 8px 10px;
    text-align: left;
    vertical-align: top;
}

.info-table caption {
    text-align: left;
    font-weight: 700;
    margin-bottom: 8px;
}

.stub {
    font-style: italic;
    border-bottom: 1px dashed var(--main-red-text);
}

.info-list {
    list-style: disc;
    padding-left: 22px;
}

.info-note {
    border-left: 4px solid var(--main-yellow);
    padding: 10px 14px;
    background: var(--main-cream);
    margin: 16px 0 24px;
}

/* Правовые страницы и страницы ошибок. */
.legal-body {
    padding: 24px 4vw 64px;
    max-width: 960px;
}

.legal-body h2 {
    margin-top: 28px;
}

.legal-body ol,
.legal-body ul {
    padding-left: 22px;
}

.legal-meta {
    color: #3d3d3d;
    font-size: 0.95rem;
    margin-bottom: 20px;
}

/* ============================ Уважение к prefers-reduced-motion ============================ */

@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.001s !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001s !important;
        scroll-behavior: auto !important;
    }
}

/* Печать: убрать декоративные блоки, которые мешают прочитать текст. */
@media print {
    .a11y-panel,
    .cookie-banner,
    .mobile-menu-btn,
    .skip-link {
        display: none !important;
    }
}
