/* Брендбук v2 «Лучше звоните Диме» (осьминог), 30.09.2026 — тот же язык, что на сайте
   new.ashenkruel.ru и в админке: палитра «чернила / кость / кровь», Bebas в заголовках,
   скругления 10–12 px, красный росчерк. Подключается ПОСЛЕ встроенного <style> страницы
   и перекрывает только оформление — разметку и скрипты форм не трогает. */

@font-face {
    font-family: "AA Bebas Neue";
    /* Dharma Type Free Font EULA: веб-использование через @font-face, файл без модификаций. */
    src: local("AA Bebas Neue"), url("fonts/AA-BebasNeue.ttf") format("truetype");
    font-display: swap;
}

:root {
    --ink: #0E0E0F;
    --ink2: #17171A;
    --line: #2E2E33;
    --bone: #F4EFE6;
    --silver: #999CA0;
    --caption: #8A8C91;
    --blood: #790E1F;
    --blood-hover: #8F1526;
    --blood-light: #B42D42;
    --error: #FF6B7D;
    --head: "AA Bebas Neue", "Arial Narrow", sans-serif;
    --radius: 12px;
    --radius-sm: 10px;
    color-scheme: dark;
}

body { background: var(--ink); color: var(--bone); }

/* Шапка: логотип-композиция, заголовок, росчерк */
.logo { width: min(100%, 340px); height: auto; margin: 0 auto 6px; }
h1 {
    font-family: var(--head);
    font-weight: normal;
    font-size: 30px;
    letter-spacing: 1px;
    color: var(--bone);
    margin-bottom: 0;
}
.swash {
    width: 70%;
    margin: 6px auto 26px;
    aspect-ratio: 600 / 36;
    background: url("swash.svg") center / 100% auto no-repeat;
}

.notice {
    background: var(--ink2);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    color: var(--silver);
}
.notice strong { color: var(--bone); }
.busy-warning { border-left: 0; border-radius: var(--radius-sm); }

.section-title {
    font-family: var(--head);
    font-size: 17px;
    letter-spacing: 2.5px;
    color: var(--silver);
}
label.field-label { color: var(--silver); }
.hint { color: var(--caption); }

input[type="text"], input[type="email"], input[type="tel"], input[type="date"], textarea, select {
    background: var(--ink2);
    border-color: var(--line);
    color: var(--bone);
    border-radius: var(--radius-sm);
}
select option { background: var(--ink2); color: var(--bone); }
input:focus, textarea:focus, select:focus { border-color: var(--blood-light); }
input::placeholder, textarea::placeholder { color: #55565B; }
.time-row span { color: var(--caption); }
.divider { border-top-color: #222226; }

.radio-option {
    background: var(--ink2);
    border-color: var(--line);
    border-radius: var(--radius-sm);
}
.radio-option:has(input:checked) {
    border-color: var(--blood-light);
    background: rgba(121, 14, 31, 0.16);
}
.radio-option input[type="radio"], .consent input[type="checkbox"] { accent-color: var(--blood-light); }

.consent label { color: var(--silver); }
.consent label a { color: var(--bone); }

.error-msg { color: var(--error); }
.field.invalid input, .field.invalid textarea, .field.invalid select { border-color: var(--error) !important; }
.field.invalid .radio-group, .field.invalid .consent { outline-color: var(--error); border-radius: var(--radius-sm); }

.submit-wrap {
    background: rgba(14, 14, 15, 0.95);
    border-top-color: #222226;
}
.submit-btn {
    background: var(--blood);
    color: var(--bone);
    font-family: var(--head);
    font-weight: normal;
    font-size: 21px;
    letter-spacing: 1.5px;
    padding: 13px 14px 11px;
    border-radius: var(--radius-sm);
    transition: background 0.15s, opacity 0.15s;
}
@media (hover: hover) { .submit-btn:not(:disabled):hover { background: var(--blood-hover); } }
.submit-btn:disabled { opacity: 0.45; }

/* Экран «заявка отправлена»: ссылка на уведомление в Telegram создаётся скриптом со
   встроенным стилем — перекрашиваем её в фирменную кнопку. */
.submit-wrap a[href^="https://t.me/"] {
    border-color: var(--blood) !important;
    background: var(--blood);
    color: var(--bone) !important;
    border-radius: var(--radius-sm) !important;
}

/* Дата: год (4 цифры) не должен обрезаться на узком экране */
.time-row select { padding-left: 12px; padding-right: 8px; }
#date_y { flex: 1.35; }