/* MIPO — сайт тату-мастера. Токены и компоненты перенесены из макета
   Claude Design (направление A «Галерея»), 2026-09-10.
   Одна тема — тёмная, намеренно: все работы монохромные. */

/* ---------- шрифты: только кириллица + латиница, self-hosted, variable ---------- */
@font-face{font-family:"Sofia Sans Extra Condensed";font-style:normal;font-weight:400 900;font-display:swap;
  src:url("../fonts/sofia-sans-ec-cyrillic.woff2") format("woff2");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Sofia Sans Extra Condensed";font-style:normal;font-weight:400 900;font-display:swap;
  src:url("../fonts/sofia-sans-ec-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,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:100 800;font-display:swap;
  src:url("../fonts/jetbrains-mono-cyrillic.woff2") format("woff2");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:100 800;font-display:swap;
  src:url("../fonts/jetbrains-mono-latin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ---------- токены ---------- */
:root{
  --black:#000;
  --ink-0:#0A0A0A; --ink-1:#121212; --ink-2:#181818; --ink-3:#262626; --ink-4:#3A3A3A;
  --gray-1:#5C5C5C; --gray-2:#8A8A8A; --gray-3:#B4B4B4;
  --paper:#F2F2F2; --white:#FFF;
  --red-1:#E23B4E; --red-2:#FF5265; --red-3:#8E1F2C;

  --bg:var(--ink-0); --bg-raised:var(--ink-1); --surface-card:var(--ink-2); --surface-invert:var(--paper);
  --text-body:var(--paper); --text-strong:var(--white); --text-muted:var(--gray-2); --text-faint:var(--gray-1); --text-invert:var(--ink-0);
  --line:var(--ink-3); --line-strong:var(--ink-4);
  --accent:var(--red-1); --accent-hover:var(--red-2); --accent-press:var(--red-3); --accent-on:var(--white);
  --star:var(--accent); --taken:var(--gray-1);

  --font-display:"Sofia Sans Extra Condensed","Arial Narrow",sans-serif;
  --font-mono:"JetBrains Mono","SFMono-Regular",ui-monospace,monospace;
  --w-display:900; --w-regular:400; --w-medium:500; --w-bold:700;

  --fs-hero:clamp(4.5rem,22vw,15rem); --fs-d1:clamp(2.75rem,11vw,6rem); --fs-d2:clamp(2rem,7vw,3.5rem); --fs-d3:1.75rem;
  --fs-body:1rem; --fs-body-lg:1.0625rem; --fs-sm:0.8125rem; --fs-xs:0.6875rem; --fs-price:1.375rem;
  --lh-hero:0.82; --lh-display:0.9; --lh-body:1.55; --lh-tight:1.2;
  --ls-hero:-0.02em; --ls-caps:0.14em;

  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:20px; --s-6:24px; --s-8:32px; --s-10:40px; --s-12:48px; --s-16:64px; --s-20:80px; --s-24:96px; --s-32:128px;
  --gutter:var(--s-5); --section-y:var(--s-16); --grid-gap:2px; --maxw:1240px; --maxw-text:62ch; --tap:48px;

  --bw:1px; --border:var(--bw) solid var(--line); --focus-ring:2px solid var(--accent);
  --dur-1:80ms; --dur-2:140ms; --ease:linear;

  --grain-url:url("../grain.svg"); --grain-opacity:0.055; --grain-size:180px;
  --xerox:grayscale(1) contrast(1.75) brightness(1.05);
  --xerox-hard:grayscale(1) contrast(3.2) brightness(1.15);
  --photo-mono:grayscale(1) contrast(1.15);
  --img-fade:0.72; --taken-filter:grayscale(1) brightness(0.45);
}
@media (min-width:900px){:root{--gutter:var(--s-10);--section-y:var(--s-24)}}
@media (prefers-reduced-motion:reduce){:root{--dur-1:0ms;--dur-2:0ms}}

/* ---------- база ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;color-scheme:dark}
body{margin:0;background:var(--bg);color:var(--text-body);font-family:var(--font-mono);font-size:var(--fs-body);font-weight:var(--w-regular);line-height:var(--lh-body);text-wrap:pretty;-webkit-font-smoothing:antialiased;min-height:100vh;display:flex;flex-direction:column}
h1,h2,h3{font-family:var(--font-display);font-weight:var(--w-display);text-transform:uppercase;line-height:var(--lh-display);margin:0;text-wrap:balance}
h1{font-size:var(--fs-d1)} h2{font-size:var(--fs-d2)} h3{font-size:var(--fs-d3)}
p{margin:0 0 1em}
img{display:block;max-width:100%;height:auto}
a{color:var(--text-body);text-decoration:none;border-bottom:1px solid var(--line-strong);transition:color var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease)}
a:hover{color:var(--accent);border-color:var(--accent)}
a:active{color:var(--accent-press)}
button{font:inherit;color:inherit}
:focus-visible{outline:var(--focus-ring);outline-offset:2px}
::selection{background:var(--accent);color:var(--accent-on)}
[hidden]{display:none!important}
main{flex:1}

/* Один контейнер на всё. Узкие текстовые блоки не сужают контейнер,
   а ограничивают ширину содержимого — левая кромка у всех секций одна. */
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 var(--gutter)}
.wrap--text > *{max-width:var(--maxw-block)}
:root{--maxw-block:780px}
.faq{max-width:var(--maxw-block)}
.sect{padding:var(--section-y) 0}
.sect--line{border-top:var(--border)}
.muted{color:var(--text-muted)}
.caps{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase}
.star::after{content:"*";color:var(--star);font-weight:var(--w-bold)}
.mipo-grain::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:var(--grain-url);background-size:var(--grain-size);opacity:var(--grain-opacity);mix-blend-mode:screen}

/* ---------- кнопки, чипы, мета, статус ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);min-height:var(--tap);padding:0 var(--s-6);font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:var(--w-bold);letter-spacing:var(--ls-caps);text-transform:uppercase;border:var(--bw) solid transparent;border-radius:0;background:var(--accent);color:var(--accent-on);cursor:pointer;text-decoration:none;white-space:nowrap;transition:background var(--dur-1) var(--ease),color var(--dur-1) var(--ease),border-color var(--dur-1) var(--ease)}
.btn:hover{background:var(--accent-hover);color:var(--accent-on)}
.btn:active{background:var(--accent-press)}
.btn--secondary{background:transparent;color:var(--text-body);border-color:var(--line-strong)}
.btn--secondary:hover{background:transparent;color:var(--accent);border-color:var(--accent)}
.btn--invert{background:var(--surface-invert);color:var(--text-invert)}
.btn--ghost{background:transparent;color:var(--text-muted);padding:0;min-height:auto}
.btn--ghost:hover{background:transparent;color:var(--accent)}
.btn--sm{min-height:36px;padding:0 var(--s-4);font-size:var(--fs-xs)}
.btn--lg{min-height:56px;padding:0 var(--s-8);font-size:var(--fs-body)}
.btn--full{width:100%}
.btn[disabled],.btn.is-disabled{opacity:.35;pointer-events:none}

.chip{display:inline-flex;align-items:center;min-height:40px;padding:0 var(--s-4);font-family:var(--font-mono);font-size:var(--fs-xs);font-weight:var(--w-regular);letter-spacing:var(--ls-caps);text-transform:uppercase;cursor:pointer;border:var(--bw) solid var(--line);border-radius:0;background:transparent;color:var(--text-muted);white-space:nowrap;transition:all var(--dur-1) var(--ease)}
.chip:hover{border-color:var(--line-strong);color:var(--text-body)}
.chip.is-active{font-weight:var(--w-bold);border-color:var(--accent);background:var(--accent);color:var(--accent-on)}

.meta{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);font-family:var(--font-mono);font-size:var(--fs-sm);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.meta__dot{color:var(--text-faint)}

.status{display:inline-flex;align-items:center;gap:var(--s-3);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-body);border:var(--border);padding:var(--s-2) var(--s-4)}
.status::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--accent);flex:0 0 auto}

.sec-head{display:flex;flex-direction:column;gap:var(--s-3);margin-bottom:var(--s-8)}
.sec-head__idx{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);color:var(--text-faint)}
.sec-head__lead{margin:0;max-width:var(--maxw-text);color:var(--text-muted)}

/* ---------- шапка, футер, липкая панель ---------- */
:root{--header-h:64px}
.site-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:var(--s-6);justify-content:space-between;min-height:var(--header-h);padding:var(--s-3) var(--gutter);background:var(--bg);border-bottom:var(--border)}

/* Панель прототипа: переключатель вариантов хиро. В боевой версии её нет. */
.proto-bar{display:flex;align-items:center;gap:var(--s-2);flex-wrap:wrap;padding:var(--s-2) var(--gutter);background:var(--ink-1);border-bottom:var(--border)}
.proto-bar__label{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-faint);margin-right:var(--s-2)}
.proto-bar .chip{min-height:32px;padding:0 var(--s-3)}
.site-header__mark{font-family:var(--font-display);font-weight:var(--w-display);font-size:1.75rem;line-height:1;letter-spacing:.01em;text-transform:uppercase;color:var(--text-strong);border:0}
.site-header__mark:hover{color:var(--accent)}
.site-nav{display:none;gap:var(--s-6);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase}
.site-nav a{color:var(--text-muted);border:0}
.site-nav a:hover{color:var(--accent)}
@media (min-width:900px){.site-nav{display:flex}}

.site-footer{display:flex;flex-direction:column;gap:var(--s-4);padding:var(--s-12) var(--gutter);border-top:var(--border);font-family:var(--font-mono);font-size:var(--fs-sm);color:var(--text-muted)}
.site-footer__mark{font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--fs-d2);line-height:1;text-transform:uppercase;color:var(--text-strong)}
.site-footer__links{display:flex;gap:var(--s-5);flex-wrap:wrap}
.site-footer__links a{color:var(--text-body)}

.sticky-cta{position:sticky;bottom:0;z-index:60;display:flex;flex-direction:column;gap:var(--s-2);padding:var(--s-3) var(--gutter);background:var(--bg);border-top:var(--bw) solid var(--line-strong)}
.sticky-cta__note{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-faint)}
.sticky-cta__row{display:flex;gap:var(--s-2)}
@media (min-width:900px){.sticky-cta{display:none}}

/* ---------- хиро с видео: четыре варианта подачи, data-hero="1…4" ----------
   Общее: видео на всю высоту экрана под шапкой, без кромки снизу. */
.hero{position:relative;overflow:hidden;background:var(--ink-0);min-height:calc(100svh - var(--header-h));display:flex;align-items:flex-end}
.hero__media{position:absolute;inset:0}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%;background:var(--ink-0) center/cover no-repeat}
.hero__tint{position:absolute;inset:0;display:none}
.hero__shade{position:absolute;inset:0}
.hero__body{position:relative;width:100%;padding-top:clamp(140px,26vh,280px);padding-bottom:var(--s-12)}
.hero__title{font-size:var(--fs-hero);line-height:var(--lh-hero);letter-spacing:var(--ls-hero);color:var(--text-strong);margin:0}
.hero__spec{margin-top:var(--s-3);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.hero__promise{margin-top:var(--s-5);max-width:46ch;font-size:var(--fs-body-lg);color:var(--text-body)}
.hero__actions{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-6);align-items:center}
.hero__facts{margin-top:var(--s-6);display:flex;flex-wrap:wrap;gap:var(--s-4);align-items:center}
.hero__live{position:absolute;top:var(--s-4);right:var(--gutter);display:inline-flex;align-items:center;gap:var(--s-2);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.hero__live::before{content:"";width:7px;height:7px;border-radius:999px;background:var(--accent);animation:mipoBlink 1.6s steps(1) infinite}
@media (prefers-reduced-motion:reduce){.hero__video{display:none}.hero__live::before{animation:none}}

/* 1 «Плёнка»: приглушённое видео, снизу уходит в чёрное под текстом */
.hero[data-hero="1"] .hero__video{opacity:.55;filter:contrast(1.1)}
.hero[data-hero="1"] .hero__shade{background:linear-gradient(to bottom,rgba(10,10,10,.15) 0%,rgba(10,10,10,.55) 45%,rgba(10,10,10,.93) 80%,var(--ink-0) 100%)}

/* 2 «Кадр»: видео в полную яркость, текст на чёрной плашке с жёстким краем */
.hero[data-hero="2"] .hero__video{opacity:1;filter:contrast(1.15) brightness(.95)}
.hero[data-hero="2"] .hero__shade{background:linear-gradient(to bottom,rgba(10,10,10,.25),rgba(10,10,10,0) 30%)}
.hero[data-hero="2"] .hero__body{max-width:none;padding:0;margin-top:clamp(240px,52vh,560px)}
.hero[data-hero="2"] .hero__plate{background:var(--ink-0);border-top:2px solid var(--paper);padding:var(--s-8) var(--gutter) var(--s-12)}
.hero[data-hero="2"] .hero__inner{max-width:calc(var(--maxw) - 2 * var(--gutter));margin:0 auto}

/* 3 «Красное»: дуотон — ч/б видео под слоем акцента */
.hero[data-hero="3"] .hero__video{opacity:1;filter:contrast(1.35) brightness(.9)}
.hero[data-hero="3"] .hero__tint{display:block;background:var(--accent);mix-blend-mode:multiply;opacity:.85}
.hero[data-hero="3"] .hero__shade{background:linear-gradient(to bottom,rgba(10,10,10,.1) 0%,rgba(10,10,10,.6) 55%,var(--ink-0) 100%)}
.hero[data-hero="3"] .hero__live{color:var(--paper)}
.hero[data-hero="3"] .hero__live::before{background:var(--paper)}

/* 4 «Рамка»: видео не фоном, а кадром в жёсткой рамке рядом с заголовком */
.hero[data-hero="4"]{min-height:0;display:block;border-bottom:var(--border)}
.hero[data-hero="4"] .hero__media{position:relative;inset:auto}
.hero[data-hero="4"] .hero__video{position:relative;width:100%;height:auto;aspect-ratio:4 / 3;opacity:1;filter:grayscale(1) contrast(2.2) brightness(1.1);border:var(--border)}
.hero[data-hero="4"] .hero__shade{display:none}
.hero[data-hero="4"] .hero__live{top:auto;bottom:calc(-1 * var(--s-6));right:0}
.hero[data-hero="4"] .hero__body{padding-top:var(--s-10)}
@media (min-width:900px){
  .hero[data-hero="4"]{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s-10);align-items:end;max-width:var(--maxw);margin:0 auto;padding:var(--s-16) var(--gutter) var(--s-12);border-bottom:0}
  .hero[data-hero="4"] .hero__media{order:2;padding-bottom:var(--s-8)}
  .hero[data-hero="4"] .hero__body{order:1;padding:0}
  .hero[data-hero="4"] .hero__title{font-size:clamp(4.5rem,12vw,11rem)}
}
@media (max-width:899px){
  .hero[data-hero="4"] .hero__media{margin:0}
  .hero[data-hero="4"] .hero__video{border-left:0;border-right:0}
  .hero[data-hero="4"] .hero__live{display:none}
}

/* ---------- эскизы ---------- */
.flash-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--s-4)}
@media (max-width:520px){.flash-grid{grid-template-columns:repeat(2,1fr);gap:var(--s-2)}}
.flash-card{display:flex;flex-direction:column;border:var(--border);background:var(--surface-card)}
.flash-card__pic{position:relative;aspect-ratio:3 / 4;overflow:hidden;background:var(--paper)}
.flash-card__pic img{width:100%;height:100%;object-fit:cover;filter:grayscale(1) contrast(1.2)}
.flash-card.is-taken .flash-card__pic img{filter:var(--taken-filter)}
.flash-card__taken{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(10,10,10,.55);font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:var(--w-bold);letter-spacing:var(--ls-caps);color:var(--paper)}
.flash-card__body{display:flex;flex-direction:column;gap:var(--s-3);padding:var(--s-4)}
.flash-card__name{margin:0;font-size:var(--fs-d3);line-height:1;color:var(--text-strong)}
.flash-card.is-taken .flash-card__name{color:var(--text-faint)}
.flash-card__line{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-3);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.flash-card__price{color:var(--text-body);font-weight:var(--w-bold)}
.flash-card.is-taken .flash-card__price{color:var(--text-faint);text-decoration:line-through}
.flash-card__unique{color:var(--accent)}
.flash-card.is-taken .flash-card__unique{color:var(--text-faint)}
@media (max-width:520px){.flash-card__body{padding:var(--s-3)}.flash-card__name{font-size:1.25rem}.btn--flash{min-height:40px;padding:0 var(--s-3);font-size:var(--fs-xs)}}

/* ---------- бегущая строка ---------- */
.band{overflow:hidden;border-top:var(--border);border-bottom:var(--border)}
.band__track{display:flex;width:max-content;gap:var(--s-4);padding:var(--s-2) 0;font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--fs-d3);line-height:1;text-transform:uppercase;color:var(--ink-4);white-space:nowrap;animation:mipoDrift 42s linear infinite}
.band__track span{padding-right:var(--s-4)}

/* ---------- работы ---------- */
.filters{display:flex;gap:var(--s-2);overflow-x:auto;padding-bottom:var(--s-4);margin-bottom:var(--s-5);scrollbar-width:none}
.filters::-webkit-scrollbar{display:none}
.works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--grid-gap)}
@media (max-width:520px){.works-grid{grid-template-columns:repeat(2,1fr)}}
.work-tile{position:relative;display:block;width:100%;padding:0;border:0;background:var(--ink-1);cursor:pointer;overflow:hidden;text-align:left}
.work-tile img{width:100%;aspect-ratio:var(--ratio,1 / 1);object-fit:cover;filter:var(--xerox);opacity:var(--img-fade);transition:opacity var(--dur-2) var(--ease)}
.work-tile:hover img,.work-tile:focus-visible img{opacity:1}
.work-tile__cap{position:absolute;left:0;bottom:0;padding:var(--s-2) var(--s-3);font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--paper);background:var(--ink-0)}
.works-foot{display:flex;gap:var(--s-4);align-items:center;flex-wrap:wrap;margin-top:var(--s-6)}
.works-count{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-faint)}

.lightbox{position:fixed;inset:0;z-index:90;background:rgba(10,10,10,.94);display:flex;align-items:center;justify-content:center;padding:var(--gutter)}
.lightbox__box{max-width:720px;width:100%;animation:mipoPop 140ms linear both}
.lightbox__box img{width:100%;max-height:62vh;object-fit:contain;filter:var(--photo-mono)}
.lightbox__row{display:flex;flex-wrap:wrap;gap:var(--s-4);justify-content:space-between;align-items:center;margin-top:var(--s-5)}

/* ---------- цены ---------- */
.price-list{border-top:var(--border)}
.price-row{display:grid;grid-template-columns:1fr auto;gap:var(--s-3) var(--s-6);align-items:baseline;padding:var(--s-5) 0;border-bottom:var(--border)}
.price-row__title{font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--fs-d3);line-height:1;text-transform:uppercase;color:var(--text-strong)}
.price-row__detail{margin-top:var(--s-2);color:var(--text-muted);font-size:var(--fs-sm);max-width:52ch}
.price-row__price{font-family:var(--font-mono);font-size:var(--fs-price);font-weight:var(--w-bold);white-space:nowrap;color:var(--text-strong);font-variant-numeric:tabular-nums}
.price-row--free .price-row__price{color:var(--accent)}
.price-notes{display:grid;gap:var(--s-6);grid-template-columns:repeat(auto-fit,minmax(260px,1fr));margin-top:var(--s-8)}
.price-notes p{margin:0}
.deal{margin-bottom:var(--s-3);font-size:var(--fs-sm)}
.deal b{color:var(--text-strong)}
.deal span{color:var(--text-muted)}

/* ---------- обо мне, шаги, faq ---------- */
.about{display:grid;gap:var(--s-8);grid-template-columns:minmax(220px,1fr) 2fr;align-items:start}
@media (max-width:760px){.about{grid-template-columns:1fr}}
.about__photo{width:100%;aspect-ratio:3 / 4;object-fit:cover;filter:var(--photo-mono)}
.about p{max-width:var(--maxw-text)}
.sketch-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:2px;margin-top:var(--s-6)}
.sketch-strip img{width:100%;aspect-ratio:1 / 1;object-fit:cover;filter:var(--xerox)}

.how{display:grid;gap:var(--s-8);grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.step{display:grid;grid-template-columns:auto 1fr;gap:var(--s-4);padding:var(--s-5) 0;border-top:var(--border)}
.step__n{font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--fs-d3);line-height:1;color:var(--accent)}
.step__t{font-family:var(--font-mono);font-size:var(--fs-sm);font-weight:var(--w-bold);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-strong)}
.step__d{margin-top:var(--s-2);max-width:var(--maxw-text);color:var(--text-muted)}
.side-label{font-weight:var(--w-bold);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-strong);margin-bottom:var(--s-3);font-size:var(--fs-sm)}
.side-text{color:var(--text-muted);font-size:var(--fs-sm)}

.faq{border-top:var(--border)}
.faq__item{border-bottom:var(--border)}
.faq__q{display:flex;width:100%;gap:var(--s-4);align-items:baseline;justify-content:space-between;min-height:var(--tap);padding:var(--s-4) 0;background:none;border:0;cursor:pointer;text-align:left;font-family:var(--font-mono);font-size:var(--fs-body);font-weight:var(--w-medium);color:var(--text-strong)}
.faq__q span{color:var(--accent);flex:0 0 auto}
.faq__a{padding:0 0 var(--s-5);max-width:var(--maxw-text);color:var(--text-muted)}

/* ---------- форма ---------- */
.intent{display:flex;flex-direction:column;gap:var(--s-3)}
.intent__row{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.form{display:grid;gap:var(--s-5);grid-template-columns:repeat(auto-fit,minmax(240px,1fr));margin-top:var(--s-4)}
.field{display:flex;flex-direction:column;gap:var(--s-2)}
.field--wide{grid-column:1 / -1}
.field__label{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--text-muted)}
.field__label i{color:var(--accent);font-style:normal}
.field input,.field textarea{width:100%;min-height:var(--tap);padding:var(--s-3) var(--s-4);font-family:var(--font-mono);font-size:var(--fs-body);color:var(--text-body);background:var(--ink-1);border:var(--bw) solid var(--line-strong);border-radius:0;outline:none}
.field textarea{resize:vertical;line-height:var(--lh-body)}
.field input:focus,.field textarea:focus{border-color:var(--accent)}
.field.is-error input{border-color:var(--accent)}
.field__hint{font-size:var(--fs-xs);color:var(--text-faint)}
.field__err{font-size:var(--fs-xs);color:var(--accent)}
.form__actions{grid-column:1 / -1;display:flex;gap:var(--s-3);flex-wrap:wrap}
.sent{border:1px solid var(--accent);padding:var(--s-6);font-size:var(--fs-body-lg);animation:mipoPop 140ms linear both}

/* ---------- служебные страницы ---------- */
.page{animation:mipoRise 180ms linear both}
.page-list{border-top:var(--border)}
.care-block{padding:var(--s-5) 0;border-bottom:var(--border)}
.care-block__t{font-family:var(--font-display);font-weight:var(--w-display);font-size:var(--fs-d3);text-transform:uppercase;color:var(--text-strong);line-height:1}
.care-block p{margin:var(--s-3) 0 0;max-width:var(--maxw-text);color:var(--text-muted)}
.rule{display:grid;grid-template-columns:minmax(120px,180px) 1fr;gap:var(--s-5);padding:var(--s-5) 0;border-bottom:var(--border)}
@media (max-width:520px){.rule{grid-template-columns:1fr;gap:var(--s-2)}}
.rule__t{font-family:var(--font-mono);font-size:var(--fs-xs);letter-spacing:var(--ls-caps);text-transform:uppercase;color:var(--accent)}
.rule p{margin:0;max-width:var(--maxw-text)}

/* ---------- движение: только чтобы нажатие ощущалось физически ---------- */
@keyframes mipoRise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes mipoWipe{from{clip-path:inset(0 0 102% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes mipoDrift{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes mipoPop{from{opacity:0;transform:scale(.985)}to{opacity:1;transform:none}}
@keyframes mipoBlink{0%,60%{opacity:1}61%,100%{opacity:.25}}
[data-reveal]{animation:mipoRise 260ms linear both}
[data-letter]{display:inline-block;animation:mipoWipe 380ms linear backwards}
[data-letter]:nth-child(2){animation-delay:70ms}[data-letter]:nth-child(3){animation-delay:140ms}[data-letter]:nth-child(4){animation-delay:210ms}
@media (prefers-reduced-motion:reduce){*{animation:none!important}}