@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:swap;src:url(/fonts/inter-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}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-cyrillic.woff) format('woff');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:500;font-display:swap;src:url(/fonts/jetbrains-mono-latin.woff) format('woff');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}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/source-serif-4-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Source Serif 4';font-style:normal;font-weight:200 900;font-display:swap;src:url(/fonts/source-serif-4-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}

/* ---------- tokens ---------- */
:root{
  --bg:#FAF8F3; --bg-tint:#F1EEE6; --surface:#FFFFFF;
  --ink:#0F1A3C; --ink-2:#4A5472; --ink-3:#7B8299;
  --line:#E3DFD3;
  --blue:#254BAA; --blue-hover:#1C3C8C; --orange:#FE3A09;
  --on-blue:#FFFFFF;
  --shadow:0 1px 2px rgba(15,26,60,.06),0 12px 32px -8px rgba(15,26,60,.18);
  --serif:'Source Serif 4',Georgia,'Times New Roman',serif;
  --sans:'Inter',-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;
  --sa-t:env(safe-area-inset-top,0px); --sa-b:env(safe-area-inset-bottom,0px);
  --sa-l:env(safe-area-inset-left,0px); --sa-r:env(safe-area-inset-right,0px);
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0A1230; --bg-tint:#0E1940; --surface:#12204F;
    --ink:#EEF1FA; --ink-2:#B3BBD6; --ink-3:#7F89AD;
    --line:#1E2D63;
    --blue:#3F66D6; --blue-hover:#5578E3; --orange:#FF5A2E;
    --shadow:0 1px 2px rgba(0,0,0,.3),0 16px 36px -8px rgba(0,0,0,.55);
  }
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-behavior:smooth;background:var(--bg)}
body{
  margin:0;min-height:100vh;min-height:100dvh;
  font-family:var(--sans);font-size:1rem;line-height:1.65;color:var(--ink);background:var(--bg);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
  padding-left:var(--sa-l);padding-right:var(--sa-r);
}
img{display:block;max-width:100%;height:auto}
a{color:var(--blue);text-decoration-thickness:1px;text-underline-offset:3px}
a:hover{color:var(--blue-hover)}
:focus-visible{outline:2px solid var(--orange);outline-offset:3px;border-radius:4px}
h1,h2,h3,p,ol,dl,dd,figure{margin:0}
.wrap{width:100%;max-width:68rem;margin-inline:auto;padding-inline:clamp(1.25rem,5vw,2.5rem)}

/* ---------- header ---------- */
.top{padding-top:var(--sa-t);position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);border-bottom:1px solid transparent;transition:border-color .2s}
.top.is-stuck{border-bottom-color:var(--line)}
.top__in{display:flex;align-items:center;justify-content:space-between;min-height:56px}
.brand{display:inline-flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none;min-height:44px}
.brand__logo{border-radius:50%}
.brand__name{font-family:var(--mono);font-weight:500;font-size:.95rem;letter-spacing:-.01em}
.brand__name b{color:var(--orange);font-weight:500}
.top__link{display:inline-flex;align-items:center;min-height:44px;padding-inline:.25rem;font-size:.9rem;font-weight:500;color:var(--ink-2);text-decoration:none}
.top__link:hover{color:var(--ink)}

/* ---------- hero ---------- */
.hero{display:grid;gap:2.5rem;padding-block:clamp(1.5rem,5vw,3.5rem) clamp(2.5rem,6vw,5rem);align-items:center}
.eyebrow{font-family:var(--mono);font-size:.78rem;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-3);margin-bottom:1rem}
.inf{color:var(--orange);font-size:1.1em;margin-right:.35em}
h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.1rem,8.2vw,3.9rem);line-height:1.08;letter-spacing:-.02em;text-wrap:balance}
h1 em{font-style:normal;color:var(--blue);display:block}
@media (prefers-color-scheme:dark){h1 em{color:#8FA9FF}}
.lede{margin-top:1.25rem;font-size:1.0625rem;line-height:1.65;color:var(--ink-2);max-width:34rem;text-wrap:pretty}
.cta{margin-top:1.75rem}
.cta__meta{display:flex;flex-wrap:wrap;gap:.25rem .9rem;margin-top:.9rem;font-family:var(--mono);font-size:.78rem;color:var(--ink-3)}
.cta__meta span+span::before{content:"\00b7";margin-right:.9rem;color:var(--ink-3)}

.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.6rem;
  min-height:52px;padding:.85rem 1.6rem;border-radius:14px;border:0;cursor:pointer;
  background:var(--blue);color:var(--on-blue);
  font:600 1rem/1.2 var(--sans);text-decoration:none;
  box-shadow:0 1px 0 rgba(255,255,255,.18) inset,0 8px 20px -6px color-mix(in srgb,var(--blue) 70%,transparent);
  transition:transform .15s ease,background-color .15s ease,box-shadow .15s ease;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;
}
.btn:hover{background:var(--blue-hover);color:var(--on-blue)}
.btn:active{transform:scale(.97)}
.btn__ico{flex:none}
.btn--lg{min-height:58px;padding-inline:2rem;font-size:1.0625rem}

.hero__cover{justify-self:center;width:min(100%,19rem);position:relative}
.hero__cover img{border-radius:10px;box-shadow:var(--shadow);transform:rotate(2deg);transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.hero__cover:hover img{transform:rotate(0)}

/* ---------- sections ---------- */
.sec{padding-block:clamp(2.5rem,6vw,4.5rem)}
.sec--tint{background:var(--bg-tint);border-block:1px solid var(--line)}
h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.5rem,5vw,2.1rem);line-height:1.2;letter-spacing:-.015em;margin-bottom:1.75rem;display:flex;align-items:baseline;gap:.75rem}
.h-mark{font-family:var(--mono);font-size:.8rem;font-weight:500;color:var(--orange);letter-spacing:.04em;transform:translateY(-.15em)}

.toc{list-style:none;padding:0;display:grid;gap:0;border-top:1px solid var(--line)}
.toc li{display:grid;grid-template-columns:2.25rem 1fr;gap:.75rem;padding:1.1rem 0;border-bottom:1px solid var(--line)}
.toc__n{font-family:var(--mono);font-size:.8rem;font-weight:500;color:var(--ink-3);padding-top:.3rem}
.toc h3{font-family:var(--sans);font-weight:600;font-size:1.0625rem;line-height:1.35;color:var(--ink)}
.toc p{margin-top:.2rem;font-size:.95rem;color:var(--ink-2);line-height:1.55}

.peek{display:flex;gap:1rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;
  padding:.25rem max(1.25rem,calc((100% - 68rem)/2 + 2.5rem)) 1.75rem;scroll-padding-inline:1.25rem}
.peek::-webkit-scrollbar{display:none}
.peek figure{flex:0 0 min(72vw,16.5rem);scroll-snap-align:start}
.peek img{border-radius:8px;box-shadow:var(--shadow)}
.peek figcaption{margin-top:.75rem;font-size:.85rem;color:var(--ink-2)}

.spec{display:grid;border-top:1px solid var(--line)}
.spec>div{display:grid;gap:.15rem;padding:1rem 0;border-bottom:1px solid var(--line)}
.spec dt{font-family:var(--mono);font-size:.76rem;font-weight:500;letter-spacing:.05em;text-transform:uppercase;color:var(--ink-3)}
.spec dd{color:var(--ink);line-height:1.6}

.end{text-align:center;padding-bottom:clamp(3.5rem,8vw,6rem)}
.end__t{display:block;text-wrap:balance;margin-bottom:1.5rem}
.end__sub{margin-top:1.25rem;color:var(--ink-2);font-size:.95rem}

.foot{border-top:1px solid var(--line);padding-block:1.25rem calc(1.25rem + var(--sa-b));font-size:.85rem;color:var(--ink-3)}
.foot__in{display:flex;justify-content:space-between;gap:1rem}
.foot a{color:var(--ink-2)}

/* ---------- sticky dock (mobile) ---------- */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:30;padding:.75rem calc(1rem + var(--sa-r)) calc(.75rem + var(--sa-b)) calc(1rem + var(--sa-l));
  display:flex;justify-content:center;pointer-events:none;
  transform:translateY(120%);transition:transform .3s cubic-bezier(.2,.7,.2,1)}
.dock.is-on{transform:none}
.dock .btn{pointer-events:auto;width:100%;max-width:26rem;box-shadow:0 10px 30px -6px rgba(10,18,48,.55)}
.dock:not(.is-on) .btn{pointer-events:none}

/* ---------- breakpoints ---------- */
@media (min-width:48rem){
  .hero{grid-template-columns:1.25fr 1fr;gap:4rem}
  .hero__cover{width:min(100%,21rem)}
  .toc{grid-template-columns:1fr 1fr;column-gap:3rem}
  .toc li:nth-last-child(2){border-bottom:1px solid var(--line)}
  .spec>div{grid-template-columns:11rem 1fr;gap:1.5rem;align-items:baseline}
  .dock{display:none}
  .peek figure{flex-basis:17rem}
}
@media (max-width:47.99rem){
  .hero__text{display:flex;flex-direction:column}
  .btn:not(.btn--dock){width:100%}
  .cta__meta{justify-content:center}
  .hero__cover{order:2}
  body{padding-bottom:calc(76px + var(--sa-b))}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;scroll-behavior:auto!important}
}
@media print{.dock,.top{display:none}}