/* ============================================================
   BASE — шрифты, сброс, контейнер, типографика, reveal, зерно
   ============================================================ */

/* ---- Локальные шрифты (замена Google Fonts CDN, БРИФ §5 / САЙТ-ДИЗАЙН §7) ---- */
@font-face{
  font-family:'Inter';
  src:url('../fonts/Inter-Variable.woff2') format('woff2');
  font-weight:100 900;
  font-style:normal;
  font-display:swap;
}
@font-face{
  font-family:'Unbounded';
  src:url('../fonts/Unbounded-Variable.woff2') format('woff2');
  font-weight:200 900;
  font-style:normal;
  font-display:swap;
}

*{box-sizing:border-box;margin:0;padding:0}
html{
  scroll-behavior:smooth;
  overflow-x:clip; /* без горизонтального «щипка» из‑за лент/тикера */
  max-width:100%;
}
body{
  font-family:var(--font-body);
  /* Космос рисует #cosmos; body — запасной тон и смена темы */
  background:var(--bg);
  color:var(--text);
  overflow-x:clip;
  max-width:100%;
  line-height:1.5;
  transition:background var(--dur-enter) var(--ease-enter),color var(--dur-enter) var(--ease-enter);
}
html.has-cosmos{background:#020408}
html.has-cosmos[data-mode="day"]{background:var(--bg)}
html.has-cosmos body{background:transparent}
/* Зерно перенесено в .cosmos — иначе ::after перекрывает маски */
html.has-cosmos body::after{display:none}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}
::selection{background:var(--accent);color:var(--on-accent)}

/* data-g: скрытый род не занимает место */
[data-g][hidden]{display:none!important}

/* ---- Зерно L0 — только ночь (2.3) ---- */
body::after{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:url('../img/grain.webp');background-repeat:repeat;background-size:128px 128px;
  opacity:0;transition:opacity var(--dur-enter) var(--ease-enter);
}
html[data-mode="night"] body::after{opacity:.03}

/* ---- Контейнер (2.3): максимум 1120, поля 24/20, слева=справа ---- */
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--container-pad)}
section{position:relative;padding:var(--section-pad-y) 0}

/* ---- Типографика — утилитарные классы по шкале §2.2 ---- */
.t-display{font-family:var(--font-head);font-size:var(--t-display-size);line-height:var(--t-display-line);font-weight:var(--t-display-weight)}
.t-h2{font-family:var(--font-head);font-size:var(--t-h2-size);line-height:var(--t-h2-line);font-weight:var(--t-h2-weight)}
.t-h3{font-family:var(--font-head);font-size:var(--t-h3-size);line-height:var(--t-h3-line);font-weight:var(--t-h3-weight)}
.t-body-l{font-family:var(--font-body);font-size:var(--t-body-l-size);line-height:var(--t-body-l-line);font-weight:var(--t-body-l-weight)}
.t-body{font-family:var(--font-body);font-size:var(--t-body-size);line-height:var(--t-body-line);font-weight:var(--t-body-weight)}
.t-label{font-family:var(--font-body);font-size:var(--t-label-size);line-height:var(--t-label-line);font-weight:var(--t-label-weight);letter-spacing:var(--t-label-tracking)}
.t-caption{font-family:var(--font-body);font-size:var(--t-caption-size);line-height:var(--t-caption-line);font-weight:var(--t-caption-weight);letter-spacing:var(--t-caption-tracking)}
.t-tag{font-family:var(--font-body);font-size:var(--t-tag-size);line-height:var(--t-tag-line);font-weight:var(--t-tag-weight);letter-spacing:var(--t-tag-tracking);text-transform:uppercase}

/* ---- Шапка секции: рубрика → h2: 12, h2 → лид: 16, шапка → контент: 40 (2.3) ---- */
.sec-head{text-align:left;margin-bottom:var(--gap-head-content)}
.sec-head .t-tag{color:var(--accent)}
.sec-head .t-h2{margin-top:var(--gap-tag-h2)}
.sec-head .t-body-l{margin-top:var(--gap-h2-lead);color:var(--text-2);max-width:560px}

/* ---- Reveal — появление один раз; на мобилке ещё слева/справа ---- */
.reveal{
  opacity:0;transform:translateY(14px);
  transition:opacity .45s var(--ease-enter),transform .45s var(--ease-enter);
}
.reveal.reveal-y8{transform:translateY(8px)}
.reveal.reveal-x-left{transform:translate3d(-32px,8px,0)}
.reveal.reveal-x-right{transform:translate3d(32px,8px,0)}
.reveal.in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:60ms}
.reveal[data-delay="2"]{transition-delay:120ms}
.reveal[data-delay="3"]{transition-delay:180ms}
.reveal[data-delay="4"]{transition-delay:240ms}
/* Таймлайн конкурсов §5.3: 0 / 240 / 480 мс */
.reveal[data-delay="tl1"]{transition-delay:0ms}
.reveal[data-delay="tl2"]{transition-delay:240ms}
.reveal[data-delay="tl3"]{transition-delay:480ms}

/* ---- Фокус с клавиатуры — виден везде (ПРИЁМКА §4) ---- */
a:focus-visible,button:focus-visible,input:focus-visible{
  outline:2px solid var(--accent);outline-offset:2px;border-radius:var(--r-sm);
}

@media(prefers-reduced-motion:reduce){
  *{animation:none!important;transition-duration:.001s!important}
  .reveal{opacity:1!important;transform:none!important}
}