/* ============ Шрифты ============ */
@font-face{font-family:"Golos Text";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/fonts/GolosText-400-700-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"Golos Text";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/fonts/GolosText-400-700-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:"Golos Text";font-style:normal;font-weight:400 700;font-display:swap;
  src:url("/fonts/GolosText-rouble.woff2") format("woff2");unicode-range:U+20BD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/IBMPlexMono-400-cyrillic.woff2") format("woff2");
  unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/IBMPlexMono-400-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+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;
  src:url("/fonts/IBMPlexMono-rouble.woff2") format("woff2");unicode-range:U+20BD;}

/* ============ Токены (утверждённая палитра «Бланк») ============ */
:root{
  --sans:"Golos Text",-apple-system,"Segoe UI",sans-serif;
  --mono:"IBM Plex Mono","SF Mono",Consolas,monospace;
  --ease:cubic-bezier(0.23,1,0.32,1);
  --maxw:1104px;
  /* единая шкала вертикального воздуха: любой margin-top берётся отсюда,
     чтобы отступы не подбирались поблочно и одинаково читались на всех страницах */
  --sp-1:8px; --sp-2:16px; --sp-3:24px; --sp-4:32px;
  --sp-5:40px; --sp-6:64px; --sp-7:96px;
  --rule-gap:16px;  /* воздух под верхней линейкой записи документа */
}
:root{
  --btn-bg:var(--accent); --btn-hover:var(--accent-deep);
  --display:var(--sans);
}
/* «Бланк»: отчёт на белой бумаге, который директор подписал ручкой.
   Чернильная кнопка, миллиметровка в hero, рукописное подчёркивание. */
:root{
  --bg:#ffffff; --surface:#ffffff; --surface2:#f2f3f6; --ink:#15171b;
  --muted:#585f69; --accent:#2440ce; --accent-deep:#1a2f9e; --accent-soft:#e7eafc;
  --line:#dfe2e8; --ok:#187a4e; --btn-ink:#ffffff;
  --btn-bg:#15171b; --btn-hover:#000000;
  --logo-filter:none; --mark-filter:none;
}
:root .calc,:root .chat{border-color:#c9cdd5;}
:root .uline{position:relative; white-space:nowrap;}
:root .uline::after{
  content:""; position:absolute; left:-2px; right:-4px; bottom:-7px; height:9px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 9' preserveAspectRatio='none'%3E%3Cpath d='M2 6 C 30 1.5, 62 8, 118 3' fill='none' stroke='%232440ce' stroke-width='2.6' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%;
}
/* «Бланк», продолжение: язык документа на каждом экране.
   Один инструмент - синяя ручка; пометки живут там, где их оставил бы директор. */
:root .pain b{display:flex; gap:10px; align-items:baseline;}
:root .pain b::before{
  content:""; flex:none; width:14px; height:14px; align-self:center;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 2 C 6 5.5, 9.5 9, 13.5 14 M13.5 2.5 C 9.5 6, 6 9.5, 2 14' fill='none' stroke='%232440ce' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
:root .bridge{padding-left:30px; position:relative;}
:root .bridge::before{
  content:""; position:absolute; left:0; top:7px; width:19px; height:17px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M2 10 C 4.5 12, 6.5 15, 7.5 16 C 10 10, 14 4, 18 1.5' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
:root .part .n{
  font-size:0; width:22px; height:22px; margin-top:2px;
  border:1.5px solid #b7bcc6; border-radius:4px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M3 10 C 5.5 12, 7 14.5, 8 15.5 C 10.5 9.5, 14.5 4, 19 0.5' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 3px 2px/16px 14px;
}
:root .price .amount .uline::after{bottom:-4px;}
:root .circled{position:relative; white-space:nowrap;}
:root .circled::after{
  content:""; position:absolute; left:-12px; right:-8px; top:-8px; bottom:-8px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 170 44' preserveAspectRatio='none'%3E%3Cpath d='M85 3.5 C 138 1.5, 166 9, 165 22 C 164 35.5, 126 41.5, 82 40.5 C 32 39.5, 5 33.5, 6 21 C 7 9, 44 3, 103 4.5' fill='none' stroke='%232440ce' stroke-width='2.3' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%;
  pointer-events:none;
}
:root .sphere{
  display:inline-block; align-self:flex-start; padding:5px 10px 4px;
  border:1.6px solid var(--accent); border-radius:3px; color:var(--accent);
  transform:rotate(-2deg); letter-spacing:0.1em;
}
:root .photo{
  position:relative; border:1px solid #c9cdd5; border-radius:2px;
  background:#fff; transform:rotate(-1.2deg); max-width:280px;
  aspect-ratio:auto; padding:8px;
}
:root .photo img{aspect-ratio:3/4; height:auto; border-radius:1px;}
:root .photo::before{
  content:""; position:absolute; top:-14px; left:50%; transform:translateX(-50%) rotate(4deg);
  width:22px; height:34px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 22 34'%3E%3Cpath d='M7 8 v16 a4.5 4.5 0 0 0 9 0 V7 a3 3 0 0 0 -6 0 v15' fill='none' stroke='%23707784' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
:root .founder .name{display:inline-block; position:relative;}
:root .founder .name::after{
  content:""; position:absolute; left:0; right:-26px; bottom:-13px; height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 14' preserveAspectRatio='none'%3E%3Cpath d='M2 10 C 22 2, 36 13, 54 6 C 68 1, 76 10, 92 5 C 106 1, 116 8, 127 4' fill='none' stroke='%232440ce' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/100% 100%;
}
:root .form{border-color:#c9cdd5;}
:root .form input{
  background:transparent; border:0; border-bottom:1.5px solid #b7bcc6;
  border-radius:0; padding-left:2px; padding-right:2px;
  transition:border-color 150ms ease;
}
:root .form input:hover{border-color:var(--muted);}
:root .form input:focus-visible{outline:none; border-bottom-color:var(--accent);}
:root .form select:focus-visible,:root .form textarea:focus-visible{
  outline:none; box-shadow:inset 0 -2px 0 var(--accent);
}
:root .form select,:root .form textarea{background:var(--surface2); border-color:transparent;}
/* ============ База ============ */
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; min-height:100svh; display:flex; flex-direction:column;
  background-color:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:17px; line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
/* клетка - только на первом экране: на всей странице она конкурирует с текстом */
.hero{
  background-image:
    repeating-linear-gradient(0deg,transparent 0 31px,#eef0f4 31px 32px),
    repeating-linear-gradient(90deg,transparent 0 31px,#eef0f4 31px 32px);
}
.wrap{max-width:var(--maxw); margin:0 auto; padding:0 24px;}
section{padding:88px 0; scroll-margin-top:76px;}
section+section{padding-top:0;}
h1,h2,h3{line-height:1.15; text-wrap:balance; margin:0;}
h2{font-size:clamp(26px,3.4vw,34px); font-weight:700; letter-spacing:-0.01em;}
h3{font-size:20px; font-weight:600;}
p{margin:0;}
a{color:var(--accent); text-decoration:none;}
a:hover{text-decoration:underline;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid var(--accent); outline-offset:2px; border-radius:4px;
}
.eyebrow{
  font-family:var(--mono); font-size:13px; letter-spacing:0.08em; text-transform:uppercase;
  color:var(--accent); margin-bottom:14px; display:block;
}
.lead{color:var(--muted); max-width:62ch;}
.vh{position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap;}
.num{font-variant-numeric:tabular-nums;}

/* появление при скролле */
.rv{opacity:0; transform:translateY(14px);}
.rv.in{opacity:1; transform:none; transition:opacity 420ms var(--ease),transform 420ms var(--ease);}

/* ============ Шапка ============ */
header{
  position:sticky; top:0; z-index:40;
  background:color-mix(in srgb,var(--bg) 88%,transparent);
  -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.hd{display:flex; align-items:center; gap:28px; height:64px;}
.brand{display:flex; align-items:center; gap:10px; color:var(--ink); font-weight:700; font-size:18px; letter-spacing:-0.01em;}
.brand:hover{text-decoration:none;}
.brand img{height:30px; width:auto; filter:var(--mark-filter);}
.hd nav{display:flex; gap:20px; margin-left:auto; font-size:15px;}
.hd nav a{color:var(--muted);}
.hd nav a:hover{color:var(--ink); text-decoration:none;}
.hd .btn{margin-left:8px;}

/* ============ Кнопки ============ */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  font:inherit; font-size:16px; font-weight:600; line-height:1;
  padding:14px 22px; border-radius:10px; border:1px solid transparent;
  background:var(--btn-bg); color:var(--btn-ink); cursor:pointer;
  transition:background-color 150ms ease,transform 150ms var(--ease);
}
.btn:hover{background:var(--btn-hover); text-decoration:none;}
.btn:active{transform:scale(0.97);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line);}
.btn-ghost:hover{background:var(--surface2); border-color:var(--muted);}
.btn-sm{padding:10px 16px; font-size:15px; border-radius:8px;}
.btn[disabled]{background:var(--surface2); color:var(--muted); cursor:not-allowed;}
.btn[disabled]:active{transform:none;}

/* ============ Первый экран ============ */
.hero{padding:72px 0 88px;}
.hero-grid{display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,0.9fr); gap:56px; align-items:center;}
.hero h1{font-size:clamp(32px,4.6vw,50px); font-weight:700; letter-spacing:-0.02em;}
.hero .sub{margin-top:var(--sp-3); font-size:19px; color:var(--muted); max-width:56ch;}
.hero .cta{margin-top:var(--sp-4); display:flex; gap:12px; flex-wrap:wrap;}
.hero .fine{margin-top:var(--sp-2); font-size:14px; color:var(--muted);}
.hero h1 .line{display:block; overflow:hidden;}
.hero h1 .line>span{display:block; transform:translateY(110%);}
.hero.play h1 .line>span{transform:none; transition:transform 560ms var(--ease);}
.hero.play h1 .line:nth-child(2)>span{transition-delay:70ms;}

/* карточка расчёта */
.calc{
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  padding:26px 26px 22px; font-family:var(--mono); font-size:14px;
}
.calc .cap{font-size:12px; letter-spacing:0.1em; text-transform:uppercase; color:var(--muted); margin-bottom:18px;}
.calc .row{display:flex; justify-content:space-between; align-items:baseline; gap:16px; padding:7px 0;}
.calc .row .v{font-variant-numeric:tabular-nums; white-space:nowrap; font-size:15px;}
.calc .who{color:var(--muted);}
.calc .big{font-size:22px; font-weight:400; color:var(--ink);}
.calc .big.acc{color:var(--accent);}
.calc hr{border:0; border-top:1px solid var(--line); margin:14px 0;}
.calc .note{font-family:var(--sans); font-size:14px; color:var(--muted); line-height:1.5; margin-top:var(--sp-1);}
.calc .save{color:var(--ok);}

/* ============ Знакомая ситуация ============ */
.pains{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:var(--sp-5);}
.pain{
  background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:24px;
}
.pain b{display:block; font-size:18px; font-weight:600; margin-bottom:8px;}
.pain p{color:var(--muted); font-size:16px;}
.bridge{margin-top:var(--sp-4); font-size:19px; max-width:60ch;}

/* ============ Что вы получаете ============ */
.parts{margin-top:var(--sp-5); display:flex; flex-direction:column;}
.part{
  display:grid; grid-template-columns:64px 260px 1fr; gap:24px; align-items:start;
  padding:26px 0; border-top:1px solid var(--line);
}
.part:last-child{border-bottom:1px solid var(--line);}
.part .n{font-family:var(--mono); font-size:15px; color:var(--muted); padding-top:3px;}
.part h3{font-size:19px;}
.part p{color:var(--muted); font-size:16px;}

/* ============ ИИ-аналитик ============ */
.ai-grid{display:grid; grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr); gap:56px; align-items:center; margin-top:var(--sp-1);}
.chat{
  background:var(--surface); border:1px solid var(--line); border-radius:14px;
  overflow:hidden; isolation:isolate;
}
.chat-head{
  display:flex; align-items:center; gap:10px; padding:12px 18px;
  border-bottom:1px solid var(--line); font-size:14px; color:var(--muted);
}
.chat-head .dot{width:8px; height:8px; border-radius:50%; background:var(--ok);}
.chat-body{padding:20px 18px 22px; min-height:300px; display:flex; flex-direction:column; gap:12px;}
.msg{max-width:88%; padding:12px 16px; border-radius:12px; font-size:15px; line-height:1.55;}
.msg.you{align-self:flex-end; background:var(--accent); color:var(--btn-ink); border-bottom-right-radius:4px;}
.msg.bot{align-self:flex-start; background:var(--surface2); border-bottom-left-radius:4px; font-family:var(--mono); font-size:13.5px;}
.msg.enter,.verify.enter{opacity:0; transform:translateY(8px);}
.msg.enter.in,.verify.enter.in{opacity:1; transform:none; transition:opacity 300ms var(--ease),transform 300ms var(--ease);}
.typing{display:inline-flex; gap:4px; padding:4px 2px;}
.typing i{width:6px; height:6px; border-radius:50%; background:var(--muted); animation:tp 900ms ease-in-out infinite;}
.typing i:nth-child(2){animation-delay:150ms;}
.typing i:nth-child(3){animation-delay:300ms;}
@keyframes tp{0%,60%,100%{opacity:0.3; transform:translateY(0);}30%{opacity:1; transform:translateY(-3px);}}
.caret{display:inline-block; width:7px; height:14px; margin-left:2px; vertical-align:-2px; background:var(--accent); animation:blink 900ms steps(1) infinite;}
@keyframes blink{50%{opacity:0;}}
.chat-note{margin-top:var(--sp-2); font-size:13.5px; color:var(--muted);}
.chat-cta{margin-top:var(--sp-3);}
.ai-copy p+p{margin-top:var(--sp-2);}
.msg.wide{max-width:100%;}
.verify{
  display:flex; gap:9px; align-items:center; padding:2px 2px 0;
  font-family:var(--mono); font-size:12.5px; color:var(--accent);
}
.verify::before{
  content:""; flex:none; width:16px; height:14px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M2 10 C 4.5 12, 6.5 15, 7.5 16 C 10 10, 14 4, 18 1.5' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
/* цепочка ценности ИИ: где он работает на самом деле */
.ai-chain{margin:26px 0 0; padding:0; list-style:none; counter-reset:chain;}
.ai-chain li{
  counter-increment:chain; display:grid; grid-template-columns:30px 1fr; gap:2px 12px;
  padding:14px 0; border-top:1px solid var(--line); font-size:15.5px;
}
.ai-chain li::before{
  content:counter(chain) "."; grid-row:1/3; font-family:var(--mono);
  font-size:14px; color:var(--accent); padding-top:2px;
}
.ai-chain b{font-size:16.5px; font-weight:600;}
.ai-chain span{grid-column:2; color:var(--muted); font-size:15px;}

/* ============ Внедрение ============ */
.steps{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-top:var(--sp-5); counter-reset:step;}
.step{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:22px;}
.step .wk{font-family:var(--mono); font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--accent); display:block; margin-bottom:10px;}
.step h3{font-size:18px; margin-bottom:8px;}
.step p{font-size:15px; color:var(--muted);}

/* ============ Цены ============ */
.prices{display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:var(--sp-5);}
.price{background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:30px;}
.price .tag{font-family:var(--mono); font-size:13px; letter-spacing:0.07em; text-transform:uppercase; color:var(--muted);}
.price .amount{font-size:clamp(26px,3vw,32px); font-weight:700; margin:10px 0 4px; font-variant-numeric:tabular-nums; letter-spacing:-0.01em;}
.price .amount small{font-size:16px; font-weight:400; color:var(--muted);}
.price ul{margin:var(--sp-2) 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:10px;}
.price li{padding-left:26px; position:relative; font-size:16px; color:var(--muted);}
.price li::before{content:""; position:absolute; left:2px; top:9px; width:12px; height:7px; border-left:2px solid var(--ok); border-bottom:2px solid var(--ok); transform:rotate(-45deg);}
.cmp-scroll{overflow-x:auto; margin-top:var(--sp-3); border:1px solid var(--line); border-radius:14px; background:var(--surface);}
.cmp-cap{margin-top:var(--sp-6); font-size:19px; font-weight:600;}
table.cmp{width:100%; border-collapse:collapse; min-width:640px; font-size:16px;}
.cmp th,.cmp td{padding:16px 22px; text-align:left; vertical-align:top; border-top:1px solid var(--line);}
.cmp thead th{border-top:0; font-family:var(--mono); font-size:13px; letter-spacing:0.07em; text-transform:uppercase; color:var(--muted); font-weight:400;}
.cmp td:first-child{color:var(--muted); font-size:15px; width:26%;}
.cmp td b{font-variant-numeric:tabular-nums;}
.cmp .pv{background:var(--accent-soft);}
/* подчёркивание длинной фразы: в отличие от .uline переносится по строкам,
   поэтому не растягивает страницу на узком экране */
.uline-flow{
  /* паттерн бесшовный: концы кривой на одной высоте и с одинаковым наклоном,
     иначе на стыке повторов линия рвётся */
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 8' preserveAspectRatio='none'%3E%3Cpath d='M0 4.6 C 7.5 2.6, 22.5 2.6, 30 4.6 C 37.5 6.6, 52.5 6.6, 60 4.6' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='square'/%3E%3C/svg%3E") repeat-x 0 100%/90px 8px;
  padding-bottom:7px;
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}
/* справочное примечание: один вид на всю страницу - отчёркивание ручкой слева,
   ширина по контейнеру, без карточки */
.note-side{
  margin-top:var(--sp-3); padding:3px 0 3px 18px;
  border-left:3px solid var(--accent);
  color:var(--muted); font-size:15.5px; line-height:1.6;
  max-width:75ch; /* мера чтения: craft требует 65-75 символов */
}
.price-cta{margin-top:var(--sp-4);}

/* ============ Клиенты и кейсы ============ */
.mq{overflow:hidden; margin-top:var(--sp-5); position:relative;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.mq-inner{display:flex; width:max-content; animation:mq 48s linear infinite;}
.mq:hover .mq-inner{animation-play-state:paused;}
.mq-track{display:flex; align-items:center; gap:64px; padding-right:64px;}
.mq-track img{height:40px; width:auto; filter:var(--logo-filter); opacity:0.85;}
@keyframes mq{to{transform:translateX(-50%);}}
.mq-cap{margin-top:var(--sp-3); color:var(--muted); font-size:15px;}
.cases{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:var(--sp-4);}
.case{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:26px; display:flex; flex-direction:column; gap:12px;}
.sphere{font-family:var(--mono); font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--accent);}
.case h3{font-size:18px;}
.case p{font-size:15px; color:var(--muted); flex-grow:1;}
.case .more{font-size:15px; font-weight:600;}
.all-cases{margin-top:var(--sp-4);}

/* ============ Технологии ============ */
.tech-note{color:var(--muted); max-width:64ch; margin-top:var(--sp-2);}
.tech{margin-top:var(--sp-4); border-top:1px solid var(--line);}
.tech .trow{display:grid; grid-template-columns:280px 1fr; gap:24px; padding:16px 0; border-bottom:1px solid var(--line); font-size:15px;}
.tech .trow .k{color:var(--muted);}
.tech .trow .v{font-family:var(--mono); font-size:13.5px; line-height:1.8;}

/* ============ Кто делает ============ */
.team{display:grid; grid-template-columns:300px 1fr; gap:48px; align-items:start; margin-top:var(--sp-5);}
.photo{
  aspect-ratio:3/4; border-radius:14px; background:var(--surface2);
  border:1px solid var(--line);
}
.photo img{display:block; width:100%; height:100%; object-fit:cover; border-radius:inherit;}
.founder p+p{margin-top:var(--sp-2);}
.founder .name{font-size:20px; font-weight:700; margin-bottom:4px;}
.founder .role{color:var(--muted); margin-bottom:20px;}
.founder .legal{margin-top:var(--sp-3); font-size:14px; color:var(--muted); font-family:var(--mono);}

/* ============ FAQ ============ */
.faq{margin-top:var(--sp-5); border-top:1px solid var(--line);}
.qa{border-bottom:1px solid var(--line);}
.qa>button{
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:24px;
  background:none; border:0; font:inherit; font-size:17px; font-weight:600; color:var(--ink);
  text-align:left; padding:20px 0; cursor:pointer;
}
.qa .chev{flex:none; width:20px; height:20px; position:relative; transition:transform 220ms var(--ease);}
.qa .chev::before,.qa .chev::after{content:""; position:absolute; top:9px; width:11px; height:2px; background:var(--muted); border-radius:1px;}
.qa .chev::before{left:1px; transform:rotate(45deg);}
.qa .chev::after{right:1px; transform:rotate(-45deg);}
.qa.open .chev{transform:rotate(180deg);}
.qa .panel{display:grid; grid-template-rows:0fr; transition:grid-template-rows 240ms var(--ease);}
.qa.open .panel{grid-template-rows:1fr;}
.qa .panel>div{overflow:hidden;}
.qa .panel p{color:var(--muted); padding:0 40px 20px 0; max-width:70ch;}

/* ============ Форма ============ */
.contact-grid{display:grid; grid-template-columns:minmax(0,0.9fr) minmax(0,1.1fr); gap:56px; margin-top:var(--sp-5); align-items:start;}
.contact-copy p+p{margin-top:var(--sp-2);}
.contact-list{margin-top:var(--sp-3); font-family:var(--mono); font-size:14px; line-height:2.1;}
.contact-list a{color:var(--ink);}
.contact-list a:hover{color:var(--accent);}
.form{
  background:var(--surface); border:1px solid var(--line); border-radius:14px; padding:30px;
  display:flex; flex-direction:column; gap:16px;
}
.form label{font-size:14px; font-weight:600; display:flex; flex-direction:column; gap:6px;}
.form label .opt{font-weight:400; color:var(--muted);}
.form input,.form select,.form textarea{
  font:inherit; font-size:16px; color:var(--ink);
  background:var(--bg); border:1px solid var(--line); border-radius:8px; padding:11px 14px;
  transition:border-color 150ms ease;
  /* select иначе не сжимается ниже своей длинной опции и растягивает страницу */
  min-width:0; width:100%;
}
.contact-grid>*,.form label,.form .row2>*{min-width:0;}
.form input:hover,.form select:hover,.form textarea:hover{border-color:var(--muted);}
.form input::placeholder,.form textarea::placeholder{color:var(--muted); opacity:0.7;}
.form textarea{resize:vertical; min-height:88px;}
.form .row2{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.consent-row{display:flex; justify-content:space-between; align-items:flex-end; gap:20px;}
/* .form label выше ставит column и по специфичности сильнее .consent - отсюда .form .consent */
.form .consent{display:flex; flex-flow:row nowrap; gap:10px; align-items:flex-start; font-size:14px; color:var(--muted); font-weight:400;}
.form .consent input{flex:none; width:17px; height:17px; margin-top:3px; accent-color:var(--accent);}
/* линия-подпись: при согласии на ней появляется росчерк */
.sign{flex:none; width:132px; font-family:var(--mono); font-size:11px; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); text-align:center;}
.sign i{display:block; height:20px; border-bottom:1.5px solid #b7bcc6; margin-bottom:5px;}
.sign.signed i{
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 130 14' preserveAspectRatio='none'%3E%3Cpath d='M2 10 C 22 2, 36 13, 54 6 C 68 1, 76 10, 92 5 C 106 1, 116 8, 127 4' fill='none' stroke='%232440ce' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center bottom 2px/92% 11px;
}
@media (max-width:520px){.consent-row{flex-wrap:wrap;} .sign{width:110px;}}
.form .btn{margin-top:4px;}

/* ============ Футер ============ */
main{flex:1 0 auto; padding-bottom:var(--sp-7);}
main:focus{outline:none;}
footer{border-top:1px solid var(--line); padding:32px 0 96px;}
.ft{display:flex; flex-wrap:wrap; gap:8px 24px; font-size:13.5px; color:var(--muted); font-family:var(--mono);}
.ft a{color:var(--muted);}
.proto-note{margin-top:var(--sp-2); font-size:13.5px; color:var(--muted);}

/* ============ Тост ============ */
.toast{
  position:fixed; right:24px; bottom:24px; z-index:60; max-width:340px;
  background:rgba(10,10,10,0.88); color:#fff; font-size:14px; line-height:1.5;
  padding:14px 18px; border-radius:12px;
  box-shadow:0 8px 24px rgba(0,0,0,0.24),0 2px 6px rgba(0,0,0,0.12);
  opacity:0; transform:translateY(8px); pointer-events:none;
  transition:opacity 250ms var(--ease),transform 250ms var(--ease);
}
.toast.show{opacity:1; transform:none;}

/* ============ Компоновка «Документ» (утверждена владельцем 30.08.2026):
   разделы как пункты бланка, боли и цены - записи на бумаге, не карточки.
   Блок стоит после базовых стилей карточек намеренно - он их перекрывает. ============ */
body{counter-reset:sec;}
section .wrap>.eyebrow{
  counter-increment:sec;
  border-top:2px solid var(--ink); padding-top:var(--rule-gap); color:var(--ink);
}
section .wrap>.eyebrow::before{
  content:counter(sec,decimal-leading-zero) " · "; color:var(--accent);
}
.calc,.chat,.form{border-radius:3px;}
/* сравнение с наймом - отдельный пункт документа, а не карточка вплотную к ценам */
.cmp-scroll{
  margin-top:var(--sp-2); border:0; border-radius:0; background:transparent;
}
.cmp th:first-child,.cmp td:first-child{padding-left:0;}
.cmp tbody tr:last-child td{border-bottom:1.5px solid var(--line);}
.cmp-scroll+.note-side{margin-top:var(--sp-5);}
.pain{background:transparent; border:0; border-radius:0; padding:0;}
.pains{gap:30px 48px;}
.price,.step{
  background:transparent; border:0; border-top:2px solid var(--ink);
  border-radius:0; padding:var(--rule-gap) 8px 0 0;
}
.prices{gap:44px;}
/* кейсы - такие же записи документа, как боли и цены, а не карточки */
.case{
  background:transparent; border:0; border-top:2px solid var(--ink);
  border-radius:0; padding:var(--rule-gap) 8px 0 0;
}
.cases{gap:var(--sp-5) 44px;}
/* воздух до примечания должен быть больше, чем между кейсами */
.cases+.note-side{margin-top:var(--sp-6);}

/* ============ Заглушка утренней сводки ============
   до попадания панели в вид тело сводки пустое; вместо пустого прямоугольника
   показываем, чего именно ждём */
.chat-idle{
  font-family:var(--mono); font-size:13.5px; line-height:1.6; color:var(--muted);
  max-width:40ch;
}
.chat-idle-bars{display:flex; flex-direction:column; gap:10px; margin-top:var(--sp-3);}
.chat-idle-bars i{display:block; height:10px; border-radius:3px; background:var(--surface2);}
.chat-idle-bars i:nth-child(1){width:78%;}
.chat-idle-bars i:nth-child(2){width:92%;}
.chat-idle-bars i:nth-child(3){width:54%;}

/* ============ Страницы кейсов ============ */
.crumbs{
  font-family:var(--mono); font-size:12.5px; letter-spacing:0.04em;
  color:var(--muted); margin-bottom:var(--sp-3);
}
.crumbs a{color:var(--muted);}
.crumbs a:hover{color:var(--accent);}
.crumbs [aria-current]{color:var(--ink);}

.case-hero{padding:48px 0 88px;}
.case-hero h1{
  font-size:clamp(28px,4vw,42px); font-weight:700; letter-spacing:-0.02em;
  margin-top:var(--sp-3); max-width:20ch;
}
.case-hero .lead{margin-top:var(--sp-3); font-size:19px; max-width:64ch;}

/* штамп проекта: три факта, которые отвечают на «а это вообще про нас?» */
.case-facts{
  margin:var(--sp-5) 0 0; display:grid; grid-template-columns:repeat(3,1fr);
  gap:24px; border-top:2px solid var(--ink); padding-top:var(--rule-gap);
}
.case-facts dt{
  font-family:var(--mono); font-size:12px; letter-spacing:0.08em;
  text-transform:uppercase; color:var(--muted);
}
.case-facts dd{margin:var(--sp-1) 0 0; font-size:16px; line-height:1.5;}
.case-facts .v{font-family:var(--mono); font-size:13.5px; line-height:1.7;}

.ticks{margin:var(--sp-5) 0 0; padding:0; list-style:none; max-width:70ch;}
/* сетка тут не годится: текст рядом со ссылкой стал бы отдельной ячейкой.
   Галочку держим у первой строки фиксированным отступом, а не по центру пункта. */
.ticks li{
  position:relative; font-size:16.5px; border-top:1px solid var(--line);
  padding:var(--sp-2) 0 0 32px; margin-top:var(--sp-2);
}
.ticks li:first-child{border-top:0; margin-top:0; padding-top:0;}
.ticks li::before{
  content:""; position:absolute; left:0; top:calc(var(--sp-2) + 5px);
  width:19px; height:17px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M2 10 C 4.5 12, 6.5 15, 7.5 16 C 10 10, 14 4, 18 1.5' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat center/contain;
}
.ticks li:first-child::before{top:5px;}

/* было и стало - две записи документа рядом */
.ba{display:grid; grid-template-columns:1fr 1fr; gap:44px; margin-top:var(--sp-5);}
.ba-col{border-top:2px solid var(--ink); padding:var(--rule-gap) 8px 0 0;}
.ba-col h3{
  font-family:var(--mono); font-size:13px; letter-spacing:0.08em;
  text-transform:uppercase; font-weight:400; color:var(--muted);
}
.ba-col.now h3{color:var(--accent);}
.ba-col ul{margin:var(--sp-2) 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:14px;}
.ba-col li{position:relative; padding-left:26px; font-size:16px; line-height:1.55;}
.ba-col li::before{content:""; position:absolute; left:0; top:5px; width:14px; height:14px; background-repeat:no-repeat; background-position:center; background-size:contain;}
.ba-col.was li{color:var(--muted);}
.ba-col.was li::before{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2.5 2 C 6 5.5, 9.5 9, 13.5 14 M13.5 2.5 C 9.5 6, 6 9.5, 2 14' fill='none' stroke='%232440ce' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.ba-col.now li::before{
  top:3px; width:17px; height:15px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 18'%3E%3Cpath d='M2 10 C 4.5 12, 6.5 15, 7.5 16 C 10 10, 14 4, 18 1.5' fill='none' stroke='%232440ce' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E");
}

/* скриншоты дашбордов - вклеенные в документ распечатки */
.shots{margin-top:var(--sp-5); display:flex; flex-direction:column; gap:var(--sp-6);}
.shot{margin:0;}
.shot img{
  display:block; width:100%; height:auto;
  border:1px solid #c9cdd5; border-radius:2px; background:#fff;
}
.shot figcaption{
  margin-top:var(--sp-2); font-size:15px; color:var(--muted); max-width:72ch;
  padding-left:16px; border-left:3px solid var(--accent);
}
.shot.narrow img{max-width:400px;}
/* на узком экране дашборд, сжатый до 350px, нечитаем: даём прокрутку вбок,
   как у сравнительной таблицы на главной */
/* дашборд, сжатый до ширины экрана, нечитаем: на узком экране показываем его
   в натуральную величину и даём прокрутку вбок */
@media (max-width:760px){
  .shot .frame{overflow-x:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain;}
  .shot:not(.narrow) .frame img{width:auto; max-width:none;}
}
.shot .frame:focus-visible{outline:2px solid var(--accent); outline-offset:3px;}
.shot .full{display:inline-block; margin-top:var(--sp-1); font-size:14px;}
/* длинный список технологий не должен обрываться разделителем */
.case-facts .v{display:flex; flex-wrap:wrap; gap:0 6px;}

.how p{max-width:70ch; margin-top:var(--sp-3);}

/* короткая форма в конце кейса */
.case-cta{display:grid; grid-template-columns:minmax(0,1fr) minmax(0,0.85fr); gap:56px; align-items:start;}
.case-cta .lead{margin-top:var(--sp-3);}
.case-cta .contacts-line{margin-top:var(--sp-4); font-size:16px; line-height:1.9;}
.form.short{margin-top:0;}
/* колонка узкая: согласие занимает всю ширину, линия подписи уходит под него */
.form.short .consent-row{flex-wrap:wrap; align-items:flex-start;}
.form.short .consent{flex:1 1 100%;}
.form.short .sign{margin-left:auto; margin-top:var(--sp-1);}

/* соседние кейсы */
.case-nav{
  margin-top:var(--sp-6); border-top:1px solid var(--line); padding-top:var(--rule-gap);
  display:flex; flex-wrap:wrap; gap:12px 32px; font-size:15.5px;
}
.case-nav .k{font-family:var(--mono); font-size:12.5px; letter-spacing:0.06em; text-transform:uppercase; color:var(--muted);}

/* ============ Юридические тексты ============ */
.updated{margin-top:var(--sp-3); font-family:var(--mono); font-size:13px; color:var(--muted);}
.legal-doc{max-width:76ch;}
.legal-doc h2{
  font-size:19px; font-weight:700; letter-spacing:0;
  margin-top:var(--sp-6); padding-top:var(--rule-gap); border-top:2px solid var(--ink);
}
.legal-doc h2:first-child{margin-top:0;}
.legal-doc p{margin-top:var(--sp-2); font-size:15.5px; line-height:1.65; color:var(--muted);}
.legal-doc p strong{color:var(--ink); font-weight:600;}
.legal-doc ul{margin:var(--sp-2) 0 0; padding-left:22px; font-size:15.5px; line-height:1.65; color:var(--muted);}
.legal-doc li{margin-top:var(--sp-1);}

/* ============ Мобильная версия ============ */
@media (max-width:960px){
  section{padding:64px 0;}
  .hd nav{display:none;}
  .hero{padding:48px 0 64px;}
  .hero-grid,.ai-grid,.contact-grid{grid-template-columns:1fr; gap:40px;}
  .pains,.prices,.form .row2{grid-template-columns:1fr;}
  .ba,.case-facts,.case-cta{grid-template-columns:1fr;}
  .ba{gap:32px;}
  .case-facts{gap:20px;}
  .case-cta{gap:40px;}
  .case-hero{padding:32px 0 64px;}
  .steps{grid-template-columns:1fr 1fr;}
  .cases{grid-template-columns:1fr;}
  .part{grid-template-columns:44px 1fr; grid-template-rows:auto auto;}
  .part p{grid-column:2;}
  .team{grid-template-columns:1fr; gap:32px;}
  .photo{max-width:260px;}
  .tech .trow{grid-template-columns:1fr; gap:6px;}
  footer{padding-bottom:110px;}
}
@media (max-width:520px){
  .hd{gap:12px;}
  .hd .btn{white-space:nowrap; padding:10px 14px; font-size:14px;}
  .steps{grid-template-columns:1fr;}
  .mq-track img{height:32px;}
  .mq-track{gap:40px; padding-right:40px;}
  /* росчерк-подпись не должен расширять страницу на узком экране */
  .founder .name::after{right:-6px;}
}

/* ============ Reduced motion ============ */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  .rv,.hero h1 .line>span,.msg.enter,.verify.enter{opacity:1; transform:none; transition:none;}
  .mq-inner{animation:none; flex-wrap:wrap; width:auto;}
  /* без движения второй трек - просто дубль логотипов */
  .mq-inner .mq-track+.mq-track{display:none;}
  .mq{-webkit-mask-image:none; mask-image:none;}
  .typing i{animation:none; opacity:0.6;}
  .caret{animation:none;}
}

/* ============ Прод-обвязка ============ */
.skip{position:absolute; left:-9999px; top:0; z-index:100; background:var(--ink); color:#fff; padding:10px 16px;}
.skip:focus{left:8px; top:8px;}
.hp{position:absolute; left:-9999px; width:1px; height:1px; opacity:0;}