/* ==========================================================================
   ОФОРМЛЕНИЕ s03 — «Кинолента»
   чёрно-белый высокий контраст и один красный — киноплакат
   Меняет только цвет и шрифт. Структуру задаёт отдельный файл в layouts/.
   ========================================================================== */
@import url("https://fonts.googleapis.com/css2?family=Oswald:wght@400;600;700&family=Inter:wght@400;500;600&display=swap");

:root {
  --sand:        #0a0a0a;
  --sand-deep:   #141414;
  --surface:     #161616;
  --ink:         #f2f2f2;
  --ink-2:       #b8b8b8;
  --muted:       #858585;
  --line:        #2a2a2a;
  --line-soft:   #202020;

  --accent:      #e30613;
  --accent-dark: #b8040f;
  --accent-soft: #2a0d0f;
  --sea:         #f2f2f2;
  --sea-soft:    #1e1e1e;
  --green:       #f2f2f2;
  --green-soft:  #1e1e1e;
  --gold:        #f2f2f2;

  --font-display: "Oswald", sans-serif;
  --font-text:    "Inter", sans-serif;
  --font-num:     "Oswald", sans-serif;
}

.booking__amount, .spec__value, .rating__value, .mobile-bar__price strong,
.dist__count, .gallery__counter {
  font-family: var(--font-num);
  font-variant-numeric: tabular-nums;
}

/* Тёмное оформление: меняем начертание логотипа и фон подвала */
.logo__img--dark  { display: none; }
.logo__img--light { display: block; }
.site-footer { background: #141414; }
.site-footer__logo { filter: none; }
.field input, .field select, .field textarea { background: #0a0a0a; color: var(--ink); }
.booking__total { background: #0a0a0a; }
.dist__bar { background: #0a0a0a; }
.gallery__nav { background: #161616; color: var(--ink); }

/* Инверсные состояния: в тёмной схеме --ink светлый, поэтому правила базы
   («тёмный фон + белый текст») дали бы белое по белому. */
.lang.is-active        { background: var(--accent); color: var(--sand); }
.btn--outline          { border-color: var(--line); color: var(--ink); }
.btn--outline:hover    { background: var(--accent); color: var(--sand); border-color: var(--accent); }
.btn--ghost            { border-color: var(--line); color: var(--ink); }
.btn--ghost:hover      { background: var(--surface); }
.modal__close          { background: var(--surface); color: var(--ink); }
.modal__close:hover    { background: var(--line); }
.review__avatar--initials { background: var(--surface); color: var(--accent); }
.term__icon            { background: var(--accent-soft); color: var(--accent); }
.booking__hint, .form__note, .booking__note { color: var(--muted); }