/* ============================================================
   БАЗА — reset, типографика, элементы. Без стилей разделов!
   Правила написания CSS в проекте:
   1. Стили пишутся по РАЗДЕЛАМ (src/styles/sections/*.css),
      у каждого раздела свой префикс классов: home-, dir-,
      sched-, events-, blog-, contacts-, admin-, login-.
   2. Общий слой (tokens/base/utilities) — только переменные,
      типографика, reset и повторяемые утилиты.
   3. Никаких стилей по тегам внутри разделов — только классы.
   ============================================================ */
*, *::before, *::after { box-sizing: border-box; }

/* scrollbar-gutter: место под вертикальную полосу прокрутки
   зарезервировано всегда — и когда её нет (короткая страница), и
   когда её убирают (модалка ставит body overflow: hidden, переход
   между разделами админки). Без этого контент прыгал на ширину
   полосы влево-вправо по всему сайту. */
html {
  background: var(--color-bg);
  scroll-behavior: smooth;
  scrollbar-gutter: stable;
}

body {
  -webkit-font-smoothing: antialiased;
  background:
    radial-gradient(circle at 50% -20%, rgba(200, 168, 90, 0.16), transparent 36rem),
    radial-gradient(circle at 8% 35%, rgba(139, 146, 105, 0.1), transparent 28rem),
    var(--color-bg);
  color: var(--color-text);
  font-family: var(--font-main);
  font-size: var(--text-base);
  line-height: var(--lh-base);
  margin: 0;
}

h1, h2, h3, h4 {
  color: var(--color-text);
  font-family: var(--font-heading);
  font-weight: 700;
  line-height: 1.1;
  margin: 0 0 var(--sp-4);
}

h1 { font-size: clamp(1.9rem, 4vw, 2.8rem); }

h2 { font-size: clamp(1.5rem, 3vw, 2.1rem); }

h3 { font-size: 1.25rem; }

p { margin: 0 0 var(--sp-4); }

a { color: var(--color-accent); transition: color var(--tr-fast); }

a:hover { color: var(--color-accent-dark); }

img { display: block; max-width: 100%; }

button { cursor: pointer; font-family: inherit; }

/* Атрибут hidden должен скрывать всегда. Браузерное правило слабее
   любого авторского, поэтому обычный `display: flex` у элемента молча
   отменяет скрытие — так однажды «залипло» открытым меню языков. */
[hidden] { display: none !important; }

input, textarea, select {
  background: var(--glass-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-s);
  color: var(--color-text);
  font-family: inherit;
  font-size: 1rem;
  padding: 10px 14px;
  transition: border-color var(--tr-fast);
  width: 100%;
}

/* Текст остаётся прокручиваемым, но нативная полоса справа не отвлекает. */
textarea {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

textarea::-webkit-scrollbar {
  display: none;
}

/* Флажки и переключатели не растягиваются на всю строку */
input[type='checkbox'], input[type='radio'] {
  accent-color: var(--color-accent);
  flex: none;
  padding: 0;
  width: auto;
}

input:focus, textarea:focus, select:focus {
  border-color: var(--color-accent);
  outline: none;
}