/*
 * Sputnik design tokens — single fixed source (handoff README §5).
 * NOT wired through Spree theme preferences: the accessibility version
 * (contracts/a11y-state.md) overrides every --c-* via html[data-scheme=…],
 * so the palette lives here as a plain :root, not in the DB.
 */

:root {
  /* Colors (handoff §5) */
  --c-bg: #ffffff;        /* main background */
  --c-bg-soft: #eef5f8;   /* soft section background, table row striping */
  --c-bg-blue: #dbe9f0;   /* icon plates, table headers */
  --c-navy: #012648;      /* brand nav, buttons, dark sections, footer (from logo) */
  --c-navy-2: #0a3f63;    /* navy hover, announcement bar, gradients */
  --c-gold: #b79e5e;      /* thin warm accent, slogan (from logo) */
  --c-heading: #012648;   /* TEXT color of headings/nav/phone (kept separate from --c-navy) */
  --c-teal: #178fa0;      /* chips, dates, diamond bullets, active pills (large/decor only) */
  --c-teal-ink: #0f6e7c;  /* teal for LINK text on white (contrast ≥ AA) */
  --c-sun: #e8a13c;       /* CTA buttons, heading underline accent */
  --c-sun-deep: #b9751a;  /* CTA hover */
  --c-ink: #1e2a30;       /* main body text */
  --c-soft: #556069;      /* secondary text */
  --c-line: #dde7ec;      /* borders, dividers */
  --c-white: #ffffff;     /* card surfaces */

  /* Button semantics — kept SEPARATE from the surface tokens above so the a11y
   * schemes can invert surfaces without collapsing the buttons (a11y-state.md).
   * Primary = solid; outline uses --c-btn-line for text+border. */
  --c-btn-bg: #012648;       /* primary button background */
  --c-btn-bg-hover: #0a3f63; /* primary button hover */
  --c-btn-fg: #ffffff;       /* text on primary / outline-hover */
  --c-btn-line: #012648;     /* outline button text + border */

  /* Typography */
  --font-serif: "PT Serif", Georgia, "Times New Roman", serif;
  --font-sans: "PT Sans", "Segoe UI", system-ui, sans-serif;
  --fs: 16px;             /* root size; a11y steps override to 19/23 (contracts/a11y-state.md) */
  --lh-text: 1.6;
  --lh-heading: 1.2;

  /* Radii (handoff §5) */
  --r-button: 8px;        /* buttons, inputs */
  --r-card: 16px;         /* cards (12–16px) */
  --r-form: 20px;         /* forms */
  --r-pill: 100px;        /* pills, chips */
  --r-hero: 100px 8px;    /* hero photo (asymmetric brand corner) */
  --r-portrait: 80px 7px; /* director portrait */

  /* Shadows (handoff §5) */
  --sh-header: 0 1px 12px rgba(1, 38, 72, 0.06);
  --sh-card-hover: 0 12px 30px rgba(1, 38, 72, 0.10);
  --sh-hero: 0 20px 50px rgba(1, 38, 72, 0.16);
  --sh-form: 0 20px 50px rgba(1, 38, 72, 0.10);

  /* Container (handoff §5) */
  --container: 1280px;
  --container-text: 820px; /* narrow article column (760–900px) */
}

/* Root font size drives em/rem so the a11y font-size steps scale the whole page */
html {
  font-size: var(--fs);
}

body {
  font-family: var(--font-sans);
  line-height: var(--lh-text);
  color: var(--c-ink);
  background: var(--c-bg);
  /* Inherited: long unbroken words (staff-entered URLs, long RU words) wrap
     instead of forcing horizontal scroll. `anywhere` (not `break-word`) so the
     break opportunity also shrinks min-content — otherwise a long word still
     stretches its grid/flex column and overflows the page. */
  overflow-wrap: anywhere;
}

/* Links (handoff §8) */
a {
  color: var(--c-teal-ink);
}

a:hover {
  color: var(--c-heading);
  text-decoration: underline;
}

/* Visible focus in every scheme (handoff §6; contracts/a11y-state.md) */
:focus-visible {
  outline: 3px solid var(--c-sun);
  outline-offset: 2px;
}

/* Кнопки — отдельным правилом, и это не дублирование.
 *
 * Собранный tailwind.css витрины Spree содержит `button:focus { outline: none }`.
 * Его специфичность (0,1,1) выше, чем у `:focus-visible` (0,1,0), поэтому обводка
 * фокуса пропадала на ВСЕХ кнопках сайта — при том что пункт C2 чек-листа
 * доступности считался выполненным. Ссылки не задеты: правило про button.
 *
 * Здесь специфичность уравнена, а tokens.css подключается позже tailwind (layout
 * рендерит `spree/shared/head`, а затем `custom_head`), поэтому побеждает наше.
 * Обводка только на :focus-visible — мышиный клик её не показывает.
 *
 * Найдено спекой consent_banner_a11y_spec 2026-08-02: браузер отдавал
 * `outline-style: none` при `matches(':focus-visible') === true`. */
button:focus-visible,
[role="button"]:focus-visible {
  outline: 3px solid var(--c-sun);
  outline-offset: 2px;
}
