/* ====== БАЗА И ТЕМА (MicMotion Audio) ====== */
@font-face {
  font-family: "Russo One";
  src: url("../fonts/RussoOne.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Oswald";
  font-weight: 500;
  src: url("../fonts/Oswald-Medium.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  font-weight: 400;
  src: url("../fonts/Manrope-Regular.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "Manrope";
  font-weight: 500;
  src: url("../fonts/Manrope-Medium.ttf") format("truetype");
  font-display: swap;
}
@font-face {
  font-family: "JetBrains Mono";
  font-weight: 600;
  src: url("../fonts/JetBrainsMono-SemiBold.ttf") format("truetype");
  font-display: swap;
}

:root {
  --mma-bg: #0A0D12;
  --mma-header: #0F1320;
  --mma-footer: #070A10;
  --mma-surface-1: #121826;
  --mma-surface-2: #1A2235;
  --mma-line: #23314F;

  --mma-text: #E6EEF7;
  --mma-text-2: #A7B5CC;
  --mma-muted: #7E8AA6;

  --mma-accent: #15E6C3;
  --mma-accent-2: #20A4FF;
  --mma-hot: #FF4D8F;

  --mma-grad-primary: linear-gradient(90deg,#15E6C3 0%,#20A4FF 100%);
  --mma-grad-hot: linear-gradient(90deg,#FF4D8F 0%,#20A4FF 100%);

  --wrap: min(1160px, 100% - 32px);
  --radius: 16px;
  --shadow: 0 16px 40px rgba(0,0,0,.35);
  --header-h: 72px;
}

/* Reset / нормализация */
* { box-sizing: border-box; }
html, body { height: 100%; }
body {
  margin: 0;
  background: var(--mma-bg);
  color: var(--mma-text);
  font-family: "Manrope", system-ui, -apple-system, Segoe UI, Roboto, Arial, "Noto Sans", sans-serif;
  line-height: 1.6;
}
img, picture, video, canvas { display: block; max-width: 100%; }
img { height: auto; }

/* Доступность + helper */
.visually-hidden {
  position: absolute !important;
  clip: rect(1px,1px,1px,1px);
  clip-path: inset(50%);
  width: 1px; height: 1px; overflow: hidden; white-space: nowrap;
}

/* Контейнер */
.wrap { width: var(--wrap); margin-inline: auto; }

/* ====== HEADER ====== */
.mma-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 200;
  height: var(--header-h);
  background: var(--mma-header);
  border-bottom: 1px solid #19233A;
  display: grid; align-items: center;
  transition: backdrop-filter .2s ease, background-color .2s ease, box-shadow .2s ease;
}
.mma-header.mma-header--scrolled {
  background: rgba(15,19,32,.9);
  backdrop-filter: blur(6px);
  box-shadow: 0 6px 20px rgba(0,0,0,.3);
}
.mma-header__bar {
  display: flex; justify-content: space-between; align-items: center;
}
.mma-logo {
  display: inline-flex; align-items: center; gap: 10px; color: var(--mma-text); text-decoration: none;
  font-family: "Russo One", system-ui; letter-spacing: .5px;
}
.mma-logo__mark {
  width: 18px; height: 18px; border-radius: 50%;
  background: var(--mma-grad-primary);
  box-shadow: 0 0 18px rgba(32,164,255,.45);
}
.mma-nav a {
  color: var(--mma-text-2); text-decoration: none; padding: 10px 14px; border-radius: 999px; font-weight: 500;
  transition: color .15s ease, box-shadow .15s ease, background-color .15s ease;
}
.mma-nav a:hover { color: var(--mma-text); }
.mma-nav a[aria-current="page"] {
  background: var(--mma-surface-2);
  box-shadow: 0 0 0 2px rgba(21,230,195,.25) inset;
  color: var(--mma-text);
}

/* Отступ сверху под фикс-хедер */
.mma-main { padding-top: calc(var(--header-h) + 24px); }

/* Кнопки */
.mma-btn {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 12px 18px; border-radius: 999px; border: 0; cursor: pointer;
  background: var(--mma-grad-primary); color: #0B0F17; font-weight: 800;
  box-shadow: 0 0 0 0 rgba(21,230,195,0);
  transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
  text-decoration: none;
}
.mma-btn:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(32,164,255,.25); }
.mma-btn:focus-visible { outline: 2px solid var(--mma-accent); outline-offset: 2px; }

.mma-btn--ghost {
  background: transparent; color: var(--mma-text);
  border: 1px solid var(--mma-line);
}
.mma-btn--ghost:hover { box-shadow: 0 12px 28px rgba(0,0,0,.35); }

/* Карточные поверхности (на будущее) */
.mma-card {
  background: var(--mma-surface-1); border: 1px solid var(--mma-line); border-radius: var(--radius);
  padding: 20px; transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.mma-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: #2C3B5C; }

/* Изображения: ≤350px */
.mma-img { width: 100%; max-width: 350px; height: auto; border-radius: 12px; }

/* ====== FOOTER ====== */
.mma-footer { background: var(--mma-footer); color: var(--mma-text-2); border-top: 1px solid #101826; margin-top: 56px; }
.mma-footer__vu { height: 3px; background: var(--mma-grad-primary); }
.mma-footer__grid {
  display: grid; gap: 24px;
  grid-template-columns: 1.3fr 1fr 1fr;
  padding: 28px 0;
}
.mma-foot__brand strong { display: block; font-family: "Russo One"; margin-bottom: 6px; color: var(--mma-text); }
.mma-contact, .mma-links { margin: 0; padding: 0; list-style: none; }
.mma-plain { color: var(--mma-text); text-decoration: none; border-bottom: 1px dashed transparent; }
.mma-plain:hover { border-bottom-color: var(--mma-text); }
.mma-links a { color: var(--mma-text-2); text-decoration: none; }
.mma-links a:hover { color: var(--mma-text); }

/* ====== Анимации и reveal ====== */
.reveal { opacity: 0; transform: translateY(12px); }
.reveal.reveal--visible { opacity: 1; transform: none; transition: opacity .5s ease, transform .5s ease; }

@media (prefers-reduced-motion: reduce) {
  .reveal, .reveal.reveal--visible { transition: none; transform: none; }
  .mma-btn, .mma-card { transition: none; }
}

/* ====== Адаптив ====== */
@media (max-width: 1024px) {
  :root { --wrap: min(980px, 100% - 28px); }
  .mma-footer__grid { grid-template-columns: 1.2fr 1fr; }
}
@media (max-width: 768px) {
  :root { --wrap: min(680px, 100% - 24px); }
  .mma-footer__grid { grid-template-columns: 1fr; }
  .mma-nav a { padding: 8px 10px; }
}
@media (max-width: 480px) {
  :root { --wrap: min(420px, 100% - 20px); }
  .mma-main { padding-top: calc(var(--header-h) + 16px); }
}
/* ===== GLOBAL: плотная стыковка контента к фикс-хеддеру ===== */

/* 1) единая высота хеддера через переменную */
:root { --header-h: 64px; }
@media (max-width: 720px){ :root { --header-h: 56px; }}

/* 2) контент отступает ровно на высоту хеддера (без лишних полей) */
.mma-main { padding-top: var(--header-h); }

/* 3) у первого h1 под хеддером не должно быть собственного верхнего отступа */
.mma-main > h1 { margin-top: 0 !important; }

/* 4) если где-то заданы «страничные» отступы у h1 — погасим их этим селектором */
.cat-h1, .cnt-h1, .home-h1 { margin-top: 0 !important; }

/* 5) защита от «залипания» первого секшена (чуть-чуть воздуха, но не «дыра») */
.mma-main > section:first-of-type { padding-top: 6px; }

/* 6) якоря прокручиваются с учётом фикс-хеддера */
[id] { scroll-margin-top: calc(var(--header-h) + 6px); }
/* ===== Text links inside content (fix default purple) ===== */
:root{
  --link: #20A4FF;          /* основной цвет ссылок */
  --link-visited: #8BC6FF;  /* для :visited */
  --link-bg-hover: rgba(32,164,255,.08);
}

/* Ссылки только внутри основного контента, чтобы не трогать header/footer навигацию */
.mma-main a:not(.mma-plain):not(.mma-btn):not(.btn):not(.tag){
  color: var(--link);
  text-decoration: underline;
  text-decoration-color: rgba(32,164,255,.45);
  text-underline-offset: 2px;
  border-radius: 6px;
  padding: 1px 2px;                 /* лёгкая зона для hover/focus */
  transition: color .15s ease, background-color .15s ease,
              text-decoration-color .15s ease, box-shadow .15s ease;
}
.mma-main a:visited:not(.mma-plain):not(.mma-btn):not(.btn):not(.tag){
  color: var(--link-visited);
}
.mma-main a:hover:not(.mma-plain):not(.mma-btn):not(.btn):not(.tag){
  background: var(--link-bg-hover);
  text-decoration-color: var(--link);
}
.mma-main a:focus-visible:not(.mma-plain):not(.mma-btn):not(.btn):not(.tag){
  outline: 2px solid var(--link);
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(32,164,255,.2);
}
.mma-main a:active:not(.mma-plain):not(.mma-btn):not(.btn):not(.tag){
  transform: translateY(1px);
}

/* Небольшой акцент именно для блока с примечанием в legal */
.legal-note a{
  font-weight: 700;
  text-decoration-thickness: 2px;
}
/* ===== Small gap under fixed header (all pages) ===== */
:root { --header-gap: 8px; }              /* десктоп */
@media (max-width: 720px){
  :root { --header-gap: 6px; }            /* мобилки */
}

/* контент стартует с крошечным отступом от хеддера */
.mma-main{ padding-top: calc(var(--header-h) + var(--header-gap)); }

/* убираем прежнюю подкладку у первого секшена, чтобы не было двойного отступа */
.mma-main > section:first-of-type{ padding-top: 0; }

/* якоря учитывают новый зазор */
[id]{ scroll-margin-top: calc(var(--header-h) + var(--header-gap)); }