/* ════════════════════════════════════════════════════════════
   sarvar works. — чертёжный стиль по аватарке и вордмарку.
   Сетка 24 / 120 px от левого верхнего угла окна. Поля кратны 24,
   поэтому края контента и линейки ложатся ровно на линии сетки.
   ════════════════════════════════════════════════════════════ */

:root{
  --blue:#2463d9;
  --blue-deep:#1b52bd;
  --ink:#fff;
  --ink-2:rgba(255,255,255,.94);   /* основной текст ≈ 5:1 */
  --ink-3:rgba(255,255,255,.88);   /* подписи ≥ 4.5:1 (AA) */
  --rule:rgba(255,255,255,.8);
  --rule-soft:rgba(255,255,255,.4);

  --minor:rgba(255,255,255,.1);
  --major:rgba(255,255,255,.28);
  --grid-bg:
    linear-gradient(to right, var(--major) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(to bottom, var(--major) 1px, transparent 1px) 0 0 / 120px 120px,
    linear-gradient(to right, var(--minor) 1px, transparent 1px) 0 0 / 24px 24px,
    linear-gradient(to bottom, var(--minor) 1px, transparent 1px) 0 0 / 24px 24px;

  --f-display:'Unbounded',system-ui,sans-serif;
  --f-sans:'Onest',system-ui,-apple-system,'Segoe UI',sans-serif;
  --f-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,monospace;

  --pad:24px;
  --maxw:1440px;
  --nav-h:72px;
  --spring:cubic-bezier(.22,1,.36,1);
  --ease:cubic-bezier(.4,0,.2,1);
}
@media (min-width:768px){ :root{--pad:48px} }

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-padding-top:var(--nav-h)}
body{
  margin:0; min-height:100vh; color:var(--ink); background:var(--blue);
  font:400 1.0625rem/1.6 var(--f-sans);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:hidden;
}
/* мягкая подсветка к центру, как на аватарке */
body::before{
  content:''; position:fixed; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse 65% 55% at 50% 42%, rgba(255,255,255,.06), transparent 72%);
}
body.menu-open{overflow:hidden}
a{color:inherit; text-decoration:none}
h1,h2,h3{margin:0; font-weight:700}
p{margin:0}
ul,ol{margin:0; padding:0; list-style:none}
i{font-style:normal}
::selection{background:#fff; color:var(--blue)}
:focus-visible{outline:2px solid #fff; outline-offset:4px}
[tabindex="-1"]:focus{outline:none}
.skip{
  position:fixed; left:var(--pad); top:12px; z-index:1000; padding:10px 16px;
  background:#fff; color:var(--blue); transform:translateY(-200%); transition:transform .3s var(--spring);
}
.skip:focus{transform:none}

.mono{font-family:var(--f-mono); font-size:.75rem; line-height:1.5; letter-spacing:.02em}

/* ── Сетка ────────────────────────────────────────────── */
.grid{
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background:var(--grid-bg);
}
/* на входе сетка «прорисовывается» от центра: app.js анимирует --r */
body.is-intro .grid{
  -webkit-mask-image:radial-gradient(circle at 50% 50%, #000 var(--r,0%), transparent calc(var(--r,0%) + 16%));
          mask-image:radial-gradient(circle at 50% 50%, #000 var(--r,0%), transparent calc(var(--r,0%) + 16%));
}
main,.foot{position:relative; z-index:1}

/* ── Заголовки ────────────────────────────────────────── */
.h2{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2rem,5vw,4.25rem); line-height:1; letter-spacing:-.035em;
  margin-bottom:clamp(48px,6vw,96px);
}
.line{display:block; overflow:hidden; padding-bottom:.1em; margin-bottom:-.1em}
.line > span{display:block}

/* ── Знак на входе ────────────────────────────────────── */
.intro-mark{
  position:fixed; left:50%; top:50%; z-index:900; pointer-events:none;
  font:700 clamp(4.5rem,15vw,12rem)/1 var(--f-display); letter-spacing:-.04em;
  opacity:0;
}
body:not(.is-intro) .intro-mark{display:none}

/* ── Шапка ────────────────────────────────────────────── */
.nav{
  position:fixed; top:0; left:0; right:0; z-index:700; height:var(--nav-h);
  display:flex; align-items:center; gap:40px;
  padding-inline:max(var(--pad), calc((100% - var(--maxw)) / 2 + var(--pad)));
  border-bottom:1px solid transparent;
  transition:transform .6s var(--spring), background .4s var(--ease), border-color .4s var(--ease);
}
.nav.is-stuck{
  background:rgba(36,99,217,.78);
  -webkit-backdrop-filter:blur(14px) saturate(140%); backdrop-filter:blur(14px) saturate(140%);
  border-bottom-color:var(--rule-soft);
}
.nav.is-hidden{transform:translateY(-100%)}
.nav__logo{
  font:700 1.5rem/1 var(--f-display); letter-spacing:-.04em; margin-right:auto;
}
body.is-intro .nav__logo{opacity:0}
.nav__links{display:flex; gap:32px}
.nav__links a{position:relative; color:var(--ink-2)}
.nav__links a::after{
  content:''; position:absolute; left:0; right:0; bottom:-4px; height:1px; background:#fff;
  transform:scaleX(0); transform-origin:100% 50%; transition:transform .45s var(--spring);
}
.nav__links a[aria-current="true"]{color:#fff}
.nav__links a[aria-current="true"]::after{transform:scaleX(1)}
@media (hover:hover){
  .nav__links a:hover{color:#fff}
  .nav__links a:hover::after{transform:scaleX(1); transform-origin:0 50%}
}
@media (max-width:900px){ .nav__links{display:none} }

.burger{display:none; background:none; border:0; padding:12px; margin-right:-12px; width:48px; cursor:pointer}
.burger i{display:block; height:1px; background:#fff; transition:transform .45s var(--spring)}
.burger i+i{margin-top:7px}
.burger[aria-expanded="true"] i:first-child{transform:translateY(4px) rotate(45deg)}
.burger[aria-expanded="true"] i:last-child{transform:translateY(-4px) rotate(-45deg)}
@media (max-width:640px){
  .burger{display:block}
  .nav{gap:16px}                /* «написать» остаётся рядом с бургером — главное действие */
}
.menu{
  position:fixed; inset:0; z-index:690; background:var(--grid-bg), var(--blue);
  display:flex; flex-direction:column; justify-content:center; gap:4px; padding:var(--pad);
  clip-path:inset(0 0 100% 0); pointer-events:none; transition:clip-path .7s var(--spring);
}
.menu.is-open{clip-path:inset(0); pointer-events:auto}
.menu a{
  display:block; overflow:hidden;
  font:700 clamp(2.4rem,12vw,4rem)/1.15 var(--f-display); letter-spacing:-.04em;
}
.menu a span{display:block; transform:translateY(110%); transition:transform .6s var(--spring)}
.menu.is-open a span{transform:none}
.menu.is-open a:nth-child(2) span{transition-delay:.05s}
.menu.is-open a:nth-child(3) span{transition-delay:.1s}
.menu.is-open a:nth-child(4) span{transition-delay:.15s}
.menu.is-open a:nth-child(5) span{transition-delay:.2s}
.menu a[aria-current="true"] span::before{content:'→ '; font-weight:500}

/* ── Кнопки и ссылки ──────────────────────────────────── */
.btn{
  --h:48px;
  position:relative; isolation:isolate; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  height:var(--h); padding:0 24px; border-radius:var(--h);
  background:#fff; color:var(--blue); border:1px solid #fff;
  font:500 .9375rem/1 var(--f-sans); white-space:nowrap; cursor:pointer;
  transition:color .35s var(--ease), filter .15s var(--ease);
}
.btn::before{
  content:''; position:absolute; inset:0; z-index:-1; border-radius:inherit;
  background:var(--blue-deep); transform:translateY(101%); transition:transform .55s var(--spring);
}
.btn:active{filter:brightness(.9)}
.btn__arrow{transition:transform .45s var(--spring)}
@media (hover:hover){
  .btn:hover{color:#fff}
  .btn:hover::before{transform:none}
  .btn:hover .btn__arrow{transform:translateX(4px)}
  .btn--line:hover{color:var(--blue)}
}
.btn--sm{--h:40px; padding:0 20px; font-size:.875rem}
.btn--big{--h:64px; padding:0 32px; font-size:1.0625rem}
.btn--line{background:transparent; color:#fff}
.btn--line::before{background:#fff}
.btn--blue{background:var(--blue); border-color:var(--blue); color:#fff}

.link{position:relative; color:var(--ink-2); transition:color .3s var(--ease)}
.link::after{
  content:''; position:absolute; left:0; right:0; bottom:-3px; height:1px; background:currentColor;
  transform-origin:0 50%; transition:transform .5s var(--spring);
}
@media (hover:hover){
  .link:hover{color:#fff}
  .link:hover::after{transform:scaleX(0); transform-origin:100% 50%}
}

/* ── Лист 01. Герой ───────────────────────────────────── */
.hero{
  position:relative; min-height:100svh; cursor:crosshair;
  display:flex; flex-direction:column; justify-content:space-between; gap:48px;
  padding:calc(var(--nav-h) + 48px) max(var(--pad), calc((100% - var(--maxw)) / 2 + var(--pad))) 48px;
}
.hero > :not(.guides){position:relative; z-index:1}
.hero__top{display:flex; justify-content:space-between; gap:24px; color:var(--ink-3)}
.hero__avail{display:inline-flex; align-items:center; gap:10px; color:#fff}
.hero__avail i{
  width:7px; height:7px; border-radius:50%; background:#fff;
  animation:blink 2.4s var(--ease) infinite;
}
@keyframes blink{50%{opacity:.25}}

.hero__title{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2rem,10.3vw,10rem); line-height:.94; letter-spacing:-.045em;
}
/* на телефоне — три строки и шрифт крупнее: «делаю / сайты / и mini apps.» */
@media (max-width:480px){ .hero__title{font-size:11.4vw} }
@media (min-width:481px){ .br-m{display:none} }

.hero__bottom{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:48px}
.hero__lead{max-width:34rem}
.hero__lead p{color:var(--ink-2); font-size:clamp(1.0625rem,1.3vw,1.1875rem)}
.hero__cta{display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:32px}

/* штамп чертежа */
.stamp{border-collapse:collapse; border:1px solid var(--rule); background:rgba(36,99,217,.55); min-width:min(100%,380px)}
.stamp th,.stamp td{border:1px solid var(--rule-soft); padding:7px 14px; text-align:left; font-weight:400; vertical-align:top}
.stamp th{color:var(--ink-3); white-space:nowrap; width:1%}
.stamp__year{float:right; color:var(--ink-3)}
@media (max-width:640px){ .stamp{width:100%} }

/* направляющие, прилипают к узлам сетки */
.guides{position:absolute; inset:0; z-index:2; pointer-events:none; opacity:0; transition:opacity .35s var(--ease)}
.hero.is-guiding .guides{opacity:1}
.guides__x,.guides__y,.guides__pt,.guides__label{position:absolute; left:0; top:0; will-change:transform}
.guides__x{top:0; bottom:0; width:1px; background:rgba(255,255,255,.5)}
.guides__y{left:0; right:0; height:1px; background:rgba(255,255,255,.5)}
.guides__pt{width:9px; height:9px; margin:-4px 0 0 -4px; border:1px solid #fff; background:var(--blue)}
.guides__label{padding:3px 7px; margin:10px 0 0 10px; background:#fff; color:var(--blue); white-space:nowrap}
.guides__label.is-flip{margin-left:-10px; translate:-100% 0}
@media (pointer:coarse){ .guides{display:none} .hero{cursor:auto} }

/* ── Секции ───────────────────────────────────────────── */
.sec,.cta{
  max-width:var(--maxw); margin-inline:auto;
  padding:clamp(96px,11vw,168px) var(--pad) 0;
}
.sec__lead{color:var(--ink-2); max-width:36rem; margin:calc(clamp(48px,6vw,96px) * -.5) 0 48px}

/* подпись листа: «лист 02 — услуги ———— 02 / 05» */
.sheet{display:flex; align-items:center; gap:16px; color:var(--ink-3); margin-bottom:48px}
.sheet i{flex:1; height:1px; background:var(--rule-soft); transform-origin:0 50%}

/* ── Лист 02. Услуги ──────────────────────────────────── */
.svc{
  display:grid; grid-template-columns:72px minmax(0,1fr) minmax(0,.8fr); gap:24px 48px; align-items:start;
  padding:48px 0; border-top:1px solid var(--rule);
}
.svc:last-child{border-bottom:1px solid var(--rule)}
.svc__idx{color:var(--ink-3); padding-top:.7em}
.svc__body h3{
  font-family:var(--f-display); font-size:clamp(1.5rem,2.8vw,2.375rem); line-height:1.05; letter-spacing:-.035em;
  display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 16px; margin-bottom:16px;
}
.svc__body h3 small{color:var(--ink-3); font-weight:400}
.svc__body p{color:var(--ink-2); max-width:34rem}
.chips{display:flex; flex-wrap:wrap; gap:8px; margin-top:24px}
.chips li{padding:5px 11px; border:1px solid var(--rule-soft); transition:background .3s var(--ease), color .3s var(--ease)}
@media (hover:hover){ .svc:hover .chips li{border-color:var(--rule)} }
.svc__body .svc__live{display:flex; flex-wrap:wrap; gap:8px 24px; margin-top:24px; color:var(--ink-3); max-width:none}
.svc__live span{flex-basis:100%}
.svc__live .link{color:#fff; white-space:nowrap}
.svc--minor{padding-block:36px}
.svc--minor .svc__body h3{font-size:clamp(1.25rem,2vw,1.625rem)}
.svc--minor .svc__body p{font-size:.9688rem}

/* технические рисунки: рисуются линией при появлении */
.draw{width:100%; max-width:440px; height:auto; justify-self:end; overflow:visible}
.draw *{fill:none; stroke:#fff; stroke-width:1.25; stroke-linecap:round}
.draw .dim *{stroke:rgba(255,255,255,.55); stroke-width:1}
.draw text{fill:var(--ink-3); stroke:none; font:9.5px var(--f-mono); letter-spacing:.02em}
@media (max-width:1024px){
  .svc{grid-template-columns:48px minmax(0,1fr)}
  .draw{grid-column:2; justify-self:start; max-width:380px}
}
@media (max-width:560px){
  .svc{grid-template-columns:1fr; gap:12px}
  .svc__idx{padding:0}
  .draw{grid-column:1}
}

/* ── Лист 03. Работы ──────────────────────────────────── */
.works{border-top:1px solid var(--rule)}
.work{
  position:relative; isolation:isolate;
  display:grid; grid-template-columns:72px minmax(0,1fr) auto 48px; align-items:center; gap:12px 24px;
  padding:32px 16px; margin-inline:-16px; border-bottom:1px solid var(--rule-soft);
  transition:color .35s var(--ease);
}
.work::before{
  content:''; position:absolute; inset:0; z-index:-1; background:#fff;
  transform:scaleY(0); transform-origin:50% 100%; transition:transform .55s var(--spring);
}
.work__idx,.work__cat{color:inherit}
.work__title{
  font-family:var(--f-display); font-size:clamp(1.5rem,4vw,3.25rem); line-height:1; letter-spacing:-.04em;
  transition:transform .6s var(--spring);
}
.work__tags{display:flex; flex-wrap:wrap; gap:4px 14px; margin-top:12px; transition:transform .6s var(--spring)}
.work__tags li::before{content:'+ '}
.work__go{font-size:1.25rem; text-align:right; transition:transform .5s var(--spring)}
.work__thumb{display:none}
/* инверсия строки: мышью — по наведению, с клавиатуры — по фокусу */
@media (hover:hover){
  .work:hover{color:var(--blue)}
  .work:hover::before{transform:scaleY(1)}
  .work:hover .work__title,.work:hover .work__tags{transform:translateX(12px)}
  .work:hover .work__go{transform:translate(4px,-4px)}
}
.work:focus-visible{outline:0; color:var(--blue)}
.work:focus-visible::before{transform:scaleY(1)}
.work:active::before{transform:scaleY(1); background:rgba(255,255,255,.14)}

/* без мыши или на узком экране превью под курсором нет — показываем картинку в строке */
@media (max-width:1024px), (hover:none){
  .work{grid-template-columns:48px minmax(0,1fr) 32px; align-items:start}
  .work__main{display:contents}                         /* название → тип → теги → картинка */
  .work__title{grid-column:2; grid-row:1}
  .work__cat{grid-column:2; grid-row:2}
  .work__tags{grid-column:2; grid-row:3; margin-top:0}
  .work__go{grid-column:3; grid-row:1}
  .work__thumb{
    display:block; grid-column:2 / -1; grid-row:4; width:100%; max-width:560px; height:auto;
    aspect-ratio:4/3; object-fit:cover; margin-top:8px; border:1px solid var(--rule); background:var(--blue-deep);
  }
}
@media (max-width:560px){
  .work{grid-template-columns:32px minmax(0,1fr) 24px; gap:10px 12px; padding-block:28px}
}

.peek{
  position:fixed; top:0; left:0; z-index:400; pointer-events:none;
  width:min(28vw,360px); aspect-ratio:4/3; margin:-150px 0 0 40px;
  opacity:0; transform:scale(.9); transition:opacity .3s var(--ease);
}
.peek.is-on{opacity:1}
.peek__img{
  position:relative; width:100%; height:100%; border:1px solid #fff; background-color:var(--blue-deep);
  background-size:cover; background-position:center; box-shadow:0 30px 60px rgba(8,30,90,.35);
}
/* чертёжная заглушка: перекрестие, как «место под изображение» */
.peek__img:not(.has-img){
  background:
    linear-gradient(to top right, transparent calc(50% - .6px), rgba(255,255,255,.55) 50%, transparent calc(50% + .6px)),
    linear-gradient(to top left,  transparent calc(50% - .6px), rgba(255,255,255,.55) 50%, transparent calc(50% + .6px)),
    var(--grid-bg), var(--blue-deep);
}
.peek__img::after{
  content:attr(data-label); position:absolute; left:12px; bottom:10px;
  font:.6875rem/1 var(--f-mono); color:#fff; background:var(--blue); padding:4px 7px;
}
.peek__img.has-img::after{display:none}
@media (max-width:1024px), (pointer:coarse){ .peek{display:none} }

/* ── Лист 04. Процесс ─────────────────────────────────── */
.steps{display:grid; grid-template-columns:repeat(4,1fr); border-top:1px solid var(--rule)}
.step{padding:32px 24px 0; border-left:1px solid var(--rule-soft)}
.step:first-child{padding-left:0; border-left:0}
.step__num{
  display:block; margin-bottom:clamp(48px,6vw,96px);
  font:700 clamp(2.75rem,5vw,4.5rem)/1 var(--f-display); letter-spacing:-.04em;
  color:transparent; -webkit-text-stroke:1px #fff;
}
.step h3{font-family:var(--f-display); font-size:clamp(1.125rem,1.6vw,1.375rem); letter-spacing:-.03em; margin-bottom:12px}
.step p{color:var(--ink-2); font-size:.9688rem}
@media (max-width:960px){
  .steps{grid-template-columns:repeat(2,1fr)}
  .step:nth-child(3){padding-left:0; border-left:0}
  .step:nth-child(n+3){margin-top:48px}
}
@media (max-width:560px){
  .steps{grid-template-columns:1fr}
  .step{padding-left:0; border-left:0; border-top:1px solid var(--rule-soft); padding-bottom:32px}
  .step:first-child{border-top:0}
  .step:nth-child(n+3){margin-top:0}
  .step__num{margin-bottom:24px}
}

/* ── Лист 05. Цены ────────────────────────────────────── */
.prices{display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--rule)}
.price{display:flex; flex-direction:column; padding:clamp(24px,3vw,40px); border-left:1px solid var(--rule)}
.price:first-child{border-left:0}
.price__label{display:flex; align-items:center; gap:10px; color:var(--ink-3); margin-bottom:24px}
.price__label b{font-weight:500; padding:2px 8px; background:var(--blue); color:#fff}
.price__amount{font:700 clamp(1.75rem,3vw,2.5rem)/1 var(--f-display); letter-spacing:-.04em}
/* пункты — строками спецификации с линейкой, как в штампе, без маркеров */
.price ul{margin:32px 0 40px; flex:1}
.price li{padding:11px 0; border-top:1px solid var(--rule-soft); color:var(--ink-2); font-size:.9688rem}
.price li:last-child{border-bottom:1px solid var(--rule-soft)}
.price .btn{width:100%}
.price--main{background:#fff; color:var(--blue)}
.price--main .price__label{color:var(--blue); opacity:.8}
.price--main li{color:var(--blue); border-color:rgba(36,99,217,.25)}
@media (max-width:960px){
  .prices{grid-template-columns:1fr}
  .price{border-left:0; border-top:1px solid var(--rule)}
  .price:first-child{border-top:0}
}
.note{color:var(--ink-3); margin-top:24px}

/* ── FAQ ──────────────────────────────────────────────── */
.faq{margin-top:clamp(72px,8vw,120px); border-top:1px solid var(--rule)}
details{border-bottom:1px solid var(--rule-soft)}
summary{
  position:relative; list-style:none; cursor:pointer; padding:24px 56px 24px 0;
  font-size:clamp(1.0625rem,1.5vw,1.25rem); font-weight:500; letter-spacing:-.01em;
}
summary::-webkit-details-marker{display:none}
summary::before,summary::after{
  content:''; position:absolute; right:12px; top:50%; background:#fff;
  transition:transform .45s var(--spring);
}
summary::before{width:15px; height:1px}
summary::after{width:1px; height:15px; margin:-7px 7px 0 0}
details[open] summary::after{transform:rotate(90deg)}
details p{padding-bottom:24px; color:var(--ink-2); max-width:44rem}
@supports (interpolate-size:allow-keywords){
  :root{interpolate-size:allow-keywords}
  details::details-content{block-size:0; overflow:hidden; transition:block-size .45s var(--spring), content-visibility .45s allow-discrete}
  details[open]::details-content{block-size:auto}
}

/* ── Контакт ──────────────────────────────────────────── */
.cta{padding-bottom:clamp(96px,11vw,168px)}
.cta__title{
  font-family:var(--f-display); font-weight:700;
  font-size:clamp(2.25rem,7.4vw,7rem); line-height:.96; letter-spacing:-.045em;
}
.cta__row{
  display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:32px 48px;
  margin-top:48px; padding-top:32px; border-top:1px solid var(--rule);
}
.cta__row p{color:var(--ink-2); max-width:30rem}
.cta__actions{display:flex; flex-wrap:wrap; align-items:center; gap:24px 32px}

/* ── Подвал ───────────────────────────────────────────── */
.foot{
  max-width:var(--maxw); margin-inline:auto; padding:0 var(--pad) 24px;
  border-top:1px solid var(--rule);
}
.foot__mark{
  font:700 var(--fit,14vw)/.84 var(--f-display); letter-spacing:-.05em; white-space:nowrap;
  padding-top:.12em; margin-bottom:24px; user-select:none; display:block; width:100%;
  transition:opacity .3s var(--ease);
}
@media (hover:hover){ .foot__mark:hover{opacity:.85} }
.foot__row{display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px 24px; color:var(--ink-3)}

/* ── Появление (только если анимации включены) ────────── */
.anim [data-reveal]{opacity:0; transform:translateY(24px)}
.anim [data-reveal-mask] .line > span{transform:translateY(120%)}
body.is-intro .hero__title .line > span{transform:translateY(120%)}
body.is-intro [data-intro]{opacity:0}
/* страховка: если скрипт так и не запустился, через 6 с показываем героя */
body.is-intro .hero__title .line > span,
body.is-intro [data-intro]{animation:failsafe 0s 6s forwards}
@keyframes failsafe{to{transform:none; opacity:1}}

/* ── Доступность ──────────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.12s !important}
  .guides,.peek{display:none !important}
}
@media (prefers-reduced-transparency:reduce){
  .nav.is-stuck{background:var(--blue); -webkit-backdrop-filter:none; backdrop-filter:none}
}
@media (prefers-contrast:more){
  :root{--ink-2:#fff; --ink-3:rgba(255,255,255,.92); --rule-soft:rgba(255,255,255,.8); --minor:rgba(255,255,255,.06)}
}