/* База сайта: шрифты, сброс, токены */
@font-face { font-family: 'Inter Tight'; src: url(../fonts/inter-tight-latin.woff2) format('woff2'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Inter Tight'; src: url(../fonts/inter-tight-cyrillic.woff2) format('woff2'); font-weight: 100 900; font-display: swap; unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116; }
@font-face { font-family: 'Instrument Serif'; src: url(../fonts/instrument-serif-latin.woff2) format('woff2'); font-style: normal; font-display: swap; }
@font-face { font-family: 'Instrument Serif'; src: url(../fonts/instrument-serif-latin-italic.woff2) format('woff2'); font-style: italic; font-display: swap; }
@font-face { font-family: 'Bricolage Grotesque'; src: url(../fonts/bricolage-latin.woff2) format('woff2'); font-weight: 200 800; font-stretch: 75% 100%; font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url(../fonts/jetbrains-mono-latin.woff2) format('woff2'); font-display: swap; }
@font-face { font-family: 'JetBrains Mono'; src: url(../fonts/jetbrains-mono-cyrillic.woff2) format('woff2'); font-display: swap; unicode-range: U+0400-045F, U+0490-0491; }

:root {
  --bg: #ece6da;
  --ink: #161412;
  --soft: rgba(22, 20, 18, .55);
  --rule: rgba(22, 20, 18, .14);
  --acc: #d9572f;
  --mustard: #e4b73f;
  --lav: #b8a9ec;
  --sage: #a3bf9c;
  --pad: clamp(18px, 2.6vw, 40px);
  --font-sans: 'Inter Tight', system-ui, sans-serif;
  --font-serif: 'Instrument Serif', Georgia, serif;
  --font-display: 'Bricolage Grotesque', 'Inter Tight', sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font-sans);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, p { margin: 0; font-weight: inherit; font-size: inherit; }

.mono { font: 500 clamp(10px, .76vw, 12px)/1.35 var(--font-mono); letter-spacing: .06em; text-transform: uppercase; }

/* плёночное зерно поверх всего сайта. Без mix-blend-mode: смешивание полноэкранного слоя считалось на каждом кадре;
   тёмное зерно с прозрачностью на светлом фоне выглядит так же, как multiply */
body::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; opacity: .3; z-index: 50; will-change: transform;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .1 0 0 0 0 .08 0 0 0 0 .06 0 0 0 .3 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* Lenis */
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth { scroll-behavior: auto !important; }
.lenis.lenis-stopped { overflow: hidden; }