/* ===== ШРИФТ (вариативный: один файл — все начертания 100…900) ===== */
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../assets/fonts/unbounded-cyrillic.woff2') format('woff2');
  unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
  font-family: 'Unbounded';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('../assets/fonts/unbounded-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ===== ДИЗАЙН-СИСТЕМА ===== */
:root {
  --bg: #19191b;
  --text: #ffffff;
  --pink: #E755AE;
  --blue: #3A7AC4;
  --font: 'Unbounded', Arial, sans-serif;

  /* Слои: загрузка > кнопки > меню > контент */
  --z-preloader: 100;
  --z-fixed: 50;
  --z-menu: 40;
}

*, *::before, *::after { box-sizing: border-box; }

html { scroll-behavior: smooth; }
html.is-loading { overflow: hidden; }

body {
  margin: 0;
  background: var(--bg);
  color: var(--text);
  font-family: var(--font);
  font-weight: 300;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

img { display: block; max-width: none; }
a { color: inherit; }

:focus-visible { outline: 2px solid var(--pink); outline-offset: 3px; }

.visually-hidden {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap;
}

/* Временные заглушки экранов, которых ещё нет */
.stub {
  min-height: 100vh;
  display: grid;
  place-items: center;
  border-top: 1px dashed rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.25);
  font-size: 14px;
}

/* Режим для снимка превью ссылки (?shot) — без кнопок */
.is-shot .tg, .is-shot .sound, .is-shot .menu, .is-shot .preloader,
.is-shot .hero__size, .is-shot .hero__mark, .is-shot .hero__guide, .is-shot .you, .is-shot .away { display: none; }
.is-shot .hero__frame { scale: none !important; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}