/* база: переменные бренда, сброс, типографика, шапка */

:root{
  /* палитра брендбука */
  --ink:#111111;
  --ink-deep:#0A0A0A;
  --ink-card:#181818;
  --ink-card-2:#1E1E1E;
  --hair:rgba(255,255,255,.10);

  --red:#E3001E;
  --red-dark:#890002;
  --orange:#FF9F32;
  --sand:#F7C472;
  --white:#FFFFFF;

  --tx:#FFFFFF;
  --tx-2:#BDBDBD;
  --tx-3:#8A8A8A;

  /* шрифты бренда */
  --f:"Inter Tight",system-ui,-apple-system,sans-serif;
  --f-alt:"Afacad Flux","Inter Tight",sans-serif;

  --hud-h:78px;
  --gut:clamp(16px,4vw,64px);
  --maxw:1360px;
  --r:16px;
  --r-sm:10px;

  --e-out:cubic-bezier(.16,1,.3,1);
  --e-in-out:cubic-bezier(.65,0,.35,1);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--ink)}
body{
  margin:0;background:var(--ink);color:var(--tx);
  font-family:var(--f);font-size:clamp(15px,1.05vw,17px);
  font-weight:400;line-height:1.6;
  overflow-x:clip;-webkit-font-smoothing:antialiased;
}
body.is-locked{overflow:hidden;height:100vh}
img,svg,video{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
h1,h2,h3,h4,p{margin:0}
::selection{background:var(--red);color:#fff}
:focus-visible{outline:2px solid var(--orange);outline-offset:4px}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut)}
.sec{position:relative;padding-block:clamp(56px,7vw,116px)}

/* иерархия из брендбука: subheader → headline → highlight */
.sub{
  font-style:italic;font-weight:600;text-transform:uppercase;
  font-size:clamp(13px,1.15vw,18px);letter-spacing:.04em;color:var(--tx-2);
}
.hl{
  font-style:italic;font-weight:900;text-transform:uppercase;
  line-height:.94;letter-spacing:-.015em;
}
.h1{font-size:clamp(34px,5.4vw,84px)}
.h2{font-size:clamp(30px,4.2vw,62px)}
.h3{font-size:clamp(19px,1.7vw,27px);font-style:italic;font-weight:800;text-transform:uppercase;line-height:1.12}
.lead{font-size:clamp(16px,1.3vw,20px);color:var(--tx-2);max-width:62ch}
.txt{color:var(--tx-2)}
.mono{
  font-weight:600;font-style:italic;text-transform:uppercase;
  font-size:clamp(11px,.82vw,13px);letter-spacing:.1em;line-height:1.5;
}
.dim{color:var(--tx-3)}
.hot{color:var(--red)}
.gold{color:var(--orange)}
.num{font-variant-numeric:tabular-nums}

.head{
  display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(20px,4vw,70px);
  align-items:end;margin-bottom:clamp(28px,3.6vw,58px);
}
.head__k{display:block;color:var(--orange);margin-bottom:14px}
.head h2{max-width:17ch}
.head p{color:var(--tx-2);max-width:52ch}

/* шапка */
.hud{
  position:fixed;top:0;left:0;right:0;height:var(--hud-h);z-index:600;
  display:flex;align-items:center;
  background:rgba(17,17,17,.66);
  backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid transparent;
  transition:transform .5s var(--e-out),background .4s,border-color .4s;
}
.hud.is-stuck{background:rgba(10,10,10,.94);border-bottom-color:var(--hair)}
.hud__in{
  width:100%;max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gut);
  display:flex;align-items:center;gap:clamp(14px,2vw,34px);
}
.hud__logos{display:flex;align-items:center;gap:clamp(10px,1.2vw,18px);flex:0 0 auto}
.hud__logo{width:auto;transition:filter .35s var(--e-out)}
.hud__logo--pinco{height:clamp(19px,1.7vw,24px)}
.hud__logo--omad{height:clamp(28px,2.6vw,38px)}
.hud__sep{width:1px;height:26px;background:var(--hair)}
.hud__logos:hover .hud__logo--pinco{filter:drop-shadow(0 0 12px rgba(227,0,30,.85))}
.hud__logos:hover .hud__logo--omad{filter:drop-shadow(0 0 12px rgba(255,159,50,.7))}

.hud__nav{display:flex;align-items:center;gap:clamp(6px,1.1vw,18px);margin-left:auto}
.hud__nav a{
  position:relative;padding:9px 4px;font-size:14px;font-weight:600;font-style:italic;
  color:var(--tx-2);transition:color .25s;white-space:nowrap;
}
.hud__nav a::after{
  content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--red);
  transform:scaleX(0);transform-origin:0 50%;transition:transform .35s var(--e-out);
}
.hud__nav a:hover,.hud__nav a.is-current{color:var(--tx)}
.hud__nav a:hover::after,.hud__nav a.is-current::after{transform:scaleX(1)}
.hud__cta{margin-left:clamp(10px,1.4vw,22px)}

/* страховка от «минискролла» вбок на телефоне */
@media (max-width:900px){
  html,body{overflow-x:hidden;max-width:100%}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.14s!important;
  }
}