/* Layout: «монтажная». Видео с первой секунды, дальше блоки в порядке вопросов клиента.
   Точка из логотипа работает как индикатор (воспроизведение, шаг брифа, плейхед), лайм — для главных кнопок.
   Большой круг со свечением появляется один раз — у брифа, в момент решения. */
:root{
  --black:#0B0B0C;
  --light:#F4F4F0;
  --lime:#CBF24A;
  --surface:#161618;
  --gray:#8A8A86;
  --soft:#C4C4BE;
  --line:rgba(244,244,240,.10);
  --line-strong:rgba(244,244,240,.22);
  --lime-glow:rgba(203,242,74,.30);
  --lime-wash:rgba(203,242,74,.08);
  --scrim:rgba(11,11,12,.66);
  --danger:#E8735F;

  --font:"Manrope","Helvetica Neue",Helvetica,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  --fs-h1:clamp(36px,5.4vw,88px);
  --fs-h2:clamp(32px,4.4vw,64px);
  --fs-h3:clamp(22px,2.2vw,30px);
  --fs-body:17px;
  --fs-small:14px;
  --fs-caps:12px;
  --track-head:-.025em;
  --track-caps:.14em;

  --gutter:clamp(16px,4vw,56px);
  --maxw:1360px;
  --r:8px;
  --header-h:72px;
  color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{background:var(--black);-webkit-text-size-adjust:100%}
html:has(dialog[open]){overflow:hidden}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:var(--black);color:var(--light);font-family:var(--font);font-size:var(--fs-body);font-weight:500;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}
@supports (overflow:clip){body{overflow-x:clip}}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:60;background:var(--black)}
img,video,svg{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
::selection{background:var(--lime);color:var(--black)}
:focus-visible{outline:2px solid var(--lime);outline-offset:3px}
section[id]{scroll-margin-top:calc(var(--header-h) + 8px)}

.wrap{width:100%;max-width:var(--maxw);margin-inline:auto;padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px))}
.section{padding-block:clamp(88px,10vw,152px)}
.bt{border-top:1px solid var(--line)}
.mono{font-family:var(--mono);font-weight:500;letter-spacing:.04em}

/* ---------- type ---------- */
.eyebrow{display:flex;align-items:center;gap:10px;font-size:var(--fs-caps);font-weight:700;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--gray);line-height:1.2}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--lime);flex:none}
.h2{font-size:var(--fs-h2);font-weight:800;letter-spacing:var(--track-head);line-height:1.02;text-wrap:balance}
.h3{font-size:var(--fs-h3);font-weight:800;letter-spacing:-.02em;line-height:1.12;text-wrap:balance}
.pt{color:var(--lime)}
.note{color:var(--gray);font-size:16px;line-height:1.55;max-width:34em}
.body{color:var(--soft);max-width:36em}
.tnum{font-variant-numeric:tabular-nums}
.nw{white-space:nowrap}

/* ---------- buttons, pills, lists ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:54px;padding-inline:26px;border-radius:999px;border:1px solid transparent;font:700 16px/1 var(--font);letter-spacing:-.01em;text-decoration:none;white-space:nowrap;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.btn svg{width:18px;height:18px;flex:none;transition:transform .2s}
.btn:hover svg.arr{transform:translateX(3px)}
.btn-lime{background:var(--lime);color:var(--black)}
.btn-lime:hover{background:var(--light)}
.btn-light{background:var(--light);color:var(--black)}
.btn-light:hover{background:var(--lime)}
.btn-ghost{background:transparent;color:var(--light);border-color:var(--line-strong)}
.btn-ghost:hover{border-color:var(--light)}
.btn-sm{height:42px;padding-inline:18px;font-size:14px}
.btn-block{width:100%}
.btn[disabled]{opacity:.6;cursor:progress}

.pill{display:inline-flex;align-items:center;gap:8px;height:32px;padding-inline:14px;border-radius:999px;border:1px solid rgba(203,242,74,.5);color:var(--lime);font-size:13px;font-weight:600;text-decoration:none;white-space:nowrap;transition:border-color .2s}
.pill:hover{border-color:var(--lime)}
.pill svg{width:14px;height:14px}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tags li{display:inline-flex;align-items:center;height:30px;padding-inline:13px;border-radius:999px;border:1px solid var(--line-strong);color:var(--soft);font-size:13px;font-weight:600}
.ticks{display:grid;gap:10px}
.ticks li{position:relative;padding-left:22px;color:var(--soft);line-height:1.45}
.ticks li::before{content:"";position:absolute;left:2px;top:.55em;width:6px;height:6px;border-radius:50%;background:var(--light);opacity:.55}

/* ---------- header ---------- */
.site-header{position:fixed;inset:0 0 auto;z-index:50;padding-top:env(safe-area-inset-top,0px);border-bottom:1px solid transparent;transition:background-color .3s,border-color .3s}
.site-header.is-solid{background:rgba(11,11,12,.8);-webkit-backdrop-filter:blur(18px) saturate(140%);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:var(--line)}
.nav{height:var(--header-h);display:flex;align-items:center;gap:clamp(16px,2.6vw,40px)}
.logo-link{display:block;margin-right:auto;padding-block:8px}
.logo{width:140px;height:auto;overflow:visible}
.nav-links{display:flex;gap:clamp(18px,2vw,30px)}
.nav-links a{font-size:15px;font-weight:600;color:var(--soft);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--light)}
.nav-actions{display:flex;align-items:center;gap:10px}
.icon-btn{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-strong);color:var(--light);text-decoration:none;transition:border-color .2s}
.icon-btn:hover{border-color:var(--light)}
.icon-btn svg{width:18px;height:18px}
.only-sm{display:none}

/* ---------- hero ---------- */
.hero{padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(28px,5vw,72px));padding-bottom:clamp(64px,8vw,120px)}
.hero-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.hero-main{display:grid;gap:20px}
.h1{font-size:var(--fs-h1);font-weight:800;letter-spacing:var(--track-head);line-height:.98;text-wrap:balance}
.hero-side{display:grid;gap:22px;align-content:end}
.hero-sub{color:var(--soft);font-size:clamp(16px,1.25vw,19px);line-height:1.55;max-width:30em}
.hero-cta{display:flex;flex-wrap:wrap;gap:10px}
.hero-proof{font-size:var(--fs-small);line-height:1.5;color:var(--gray)}
.hero-proof b{color:var(--light);font-weight:800}
.hero-proof a{color:var(--soft)}
@media (min-width:1000px){
  .hero-grid{grid-template-columns:minmax(0,8fr) minmax(0,4fr);gap:56px;align-items:end}
}

.screen{position:relative;margin-top:clamp(28px,4vw,56px);aspect-ratio:16/9;max-width:100%;border-radius:var(--r);overflow:hidden;background:var(--surface);cursor:pointer}
.screen video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hud{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:40px clamp(12px,2vw,24px) clamp(12px,2vw,20px);background:linear-gradient(to top,rgba(11,11,12,.72),rgba(11,11,12,0));pointer-events:none}
.hud > *{pointer-events:auto}
.hud-tc{display:inline-flex;align-items:center;gap:10px;font-size:12px;color:var(--light);font-variant-numeric:tabular-nums}
.hud-tc i{width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 10px var(--lime-glow)}
.hud-tc .dim{color:var(--gray)}
.screen-label{position:absolute;top:clamp(12px,2vw,20px);left:clamp(12px,2vw,24px);font-size:11px;color:var(--soft);padding:6px 10px;border-radius:999px;background:var(--scrim);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.screen-progress{position:absolute;left:0;bottom:0;height:2px;width:0;background:var(--lime);pointer-events:none}
@media (prefers-reduced-motion:no-preference){.screen.is-playing .hud-tc i{animation:blink 1.4s ease-in-out infinite}}
@keyframes blink{50%{opacity:.25}}

/* ---------- section heads ---------- */
.sec-head{display:grid;gap:20px;margin-bottom:clamp(36px,5vw,64px)}
.sec-head.split{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 64px}
.sec-head.split > div{display:grid;gap:20px}

/* ---------- works: монтажные дорожки ---------- */
.clips{display:grid;gap:14px}
.clip-row{display:flex;gap:14px}
.clip{position:relative;display:block;flex:var(--r) 1 0%;min-width:0;aspect-ratio:var(--r);padding:0;border:0;border-radius:var(--r);overflow:hidden;background:var(--surface);color:var(--light);text-align:left;cursor:pointer}
.clip img,.clip video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.clip img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.clip:hover img{transform:scale(1.04)}
.clip video{opacity:0;transition:opacity .35s}
.clip.is-previewing video{opacity:1}
.clip-cap{position:absolute;left:0;right:0;bottom:0;display:grid;gap:4px;padding:48px 16px 14px;background:linear-gradient(to top,rgba(11,11,12,.86),rgba(11,11,12,0));pointer-events:none}
.clip-cap .mono{font-size:11px;color:var(--soft);letter-spacing:.08em}
.clip-cap b{font-size:17px;font-weight:700;line-height:1.2;letter-spacing:-.01em}
.play-dot{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--light);color:var(--black);transition:background-color .2s}
.play-dot svg{width:15px;height:15px;margin-left:2px}
.clip:hover .play-dot,.vframe-btn:hover{background:var(--lime)}
.works-foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:clamp(36px,4vw,56px);padding-top:28px;border-top:1px solid var(--line)}
.works-foot p{color:var(--gray);max-width:36em}
@media (max-width:699px){
  .clips{display:flex;flex-wrap:wrap;gap:12px}
  .clip-row{display:contents}
  .clip.h{flex:1 1 100%;aspect-ratio:16/9}
  .clip.v{flex:1 1 calc(50% - 6px)}
  .clip-cap{padding:36px 12px 12px}
  .clip-cap b{font-size:15px}
}

/* ---------- craft: таймлайн доводки ---------- */
.nle{position:relative;border-radius:12px;background:var(--surface);border:1px solid var(--line);padding:clamp(16px,2.4vw,28px);overflow:hidden}
.nle-top,.trk{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
.nle-top{padding-bottom:14px;border-bottom:1px solid var(--line);font-size:11px;color:var(--gray)}
.ruler{display:flex;justify-content:space-between;font-variant-numeric:tabular-nums}
.trk{padding-block:16px;border-bottom:1px solid var(--line)}
.trk:last-of-type{border-bottom:0;padding-bottom:4px}
.trk-head{display:grid;grid-template-columns:28px minmax(0,1fr);column-gap:6px;align-items:baseline}
.trk-head .mono{font-size:11px;color:var(--gray)}
.trk-head b{font-weight:700;line-height:1.3}
.trk-head .tool{grid-column:2;font-size:13px;color:var(--gray)}
.lane{position:relative;height:30px;border-radius:4px;background-image:linear-gradient(to right,var(--line) 1px,transparent 1px);background-size:25% 100%}
.lane i{position:absolute;top:4px;bottom:4px;left:calc(var(--s) * 1%);width:calc((var(--e) - var(--s)) * 1% - 3px);border-radius:4px;background:rgba(244,244,240,.07);border:1px solid rgba(244,244,240,.14);transition:background-color .4s,border-color .4s}
.lane i.on{background:rgba(244,244,240,.86);border-color:transparent}
.trk-note{font-size:14px;color:var(--soft);line-height:1.45}
.nle-ph{position:absolute;top:0;bottom:0;left:0;width:2px;background:var(--lime);box-shadow:0 0 14px var(--lime-glow);pointer-events:none;will-change:transform}
.nle-ph::before{content:"";position:absolute;top:18px;left:-5px;width:12px;height:12px;border-radius:50%;background:var(--lime)}
@media (min-width:900px){
  .nle-top,.trk{grid-template-columns:220px minmax(0,1fr) 270px;gap:28px;align-items:center}
}
@media (max-width:899px){.nle-ph{display:none}}
.principles{display:grid;grid-template-columns:minmax(0,1fr);gap:0 clamp(24px,3vw,48px);margin-top:clamp(40px,5vw,64px)}
.principles li{display:grid;gap:8px;padding-block:22px 26px;border-top:1px solid var(--line)}
.principles h3{font-size:20px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.principles p{color:var(--soft);font-size:16px;line-height:1.5}
@media (min-width:800px){.principles{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- services ---------- */
.svc-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:960px){.svc-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.svc{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,3vw,44px);border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.svc-k{font-size:11px;color:var(--gray);letter-spacing:.1em}
.svc .body{font-size:17px}
.svc-when{font-size:var(--fs-caps);font-weight:700;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--gray);margin-bottom:-8px}
.svc-foot{margin-top:auto;padding-top:22px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}
.svc-foot p{font-size:15px;color:var(--soft)}
.svc-foot b{color:var(--light);font-weight:800}
.formats{margin-top:clamp(56px,7vw,96px)}
.formats > .h3{margin-bottom:28px}
.fmt-grid{display:grid;grid-template-columns:minmax(0,1fr);column-gap:clamp(24px,3vw,48px)}
.fmt-grid li{padding-block:20px 24px;border-top:1px solid var(--line)}
.fmt-grid h4{font-size:18px;font-weight:700;letter-spacing:-.01em;line-height:1.3}
.fmt-grid p{margin-top:6px;color:var(--gray);font-size:15px;line-height:1.5}
@media (min-width:640px){.fmt-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.fmt-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}

/* ---------- case ---------- */
.case-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
.vframe{position:relative;aspect-ratio:9/16;max-width:100%;border-radius:var(--r);overflow:hidden;background:var(--surface);border:1px solid var(--line)}
.vframe video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.handle{position:absolute;left:14px;bottom:14px;display:inline-flex;align-items:center;gap:8px;height:34px;padding-inline:12px;border-radius:999px;background:var(--scrim);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:13px;font-weight:700}
.handle svg{width:15px;height:15px}
.case-media .vframe{width:min(100%,320px)}
.case-text{display:grid;gap:26px;align-content:center}
.case-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;max-width:560px}
.case-stats div{display:flex;flex-direction:column-reverse;gap:6px;padding-block:18px;border-top:1px solid var(--line)}
.case-stats dd{font-size:clamp(32px,3.6vw,52px);font-weight:800;letter-spacing:var(--track-head);line-height:1;font-variant-numeric:tabular-nums}
.case-stats dt{font-size:var(--fs-small);color:var(--gray)}
.case-stats .lime{color:var(--lime)}
@media (min-width:900px){
  .case-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(48px,7vw,120px);align-items:center}
  .case-media .vframe{width:min(100%,380px);margin-left:auto}
}

/* ---------- process ---------- */
.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:0 24px}
.step{position:relative;padding-block:24px 28px;border-top:1px solid var(--line-strong);display:grid;gap:10px;align-content:start}
.step::before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--lime)}
.step .mono{font-size:12px;color:var(--gray)}
.step h3{font-size:21px;font-weight:700;letter-spacing:-.01em;line-height:1.25}
.step p{color:var(--soft);font-size:16px;line-height:1.5}
@media (min-width:640px){.steps{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1000px){.steps{grid-template-columns:repeat(4,minmax(0,1fr))}}
.guarantees{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;margin-top:clamp(28px,3vw,40px)}
.guarantees li{display:flex;align-items:flex-start;gap:12px;padding:18px 20px;border-radius:10px;border:1px solid var(--line);font-weight:600;line-height:1.4}
.guarantees svg{width:20px;height:20px;flex:none;color:var(--lime);margin-top:1px}
@media (min-width:640px){.guarantees{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1100px){.guarantees{grid-template-columns:repeat(4,minmax(0,1fr))}}

.timing{margin-top:clamp(40px,5vw,72px);padding:clamp(24px,4vw,52px);border-radius:12px;background:var(--surface)}
.timing-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:20px 48px;margin-bottom:28px}
.timing-head > div{display:grid;gap:12px;max-width:38em}
.timing-head p{color:var(--gray)}
.g-row,.g-axis{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px 28px;align-items:center}
.g-row{padding-block:18px;border-top:1px solid var(--line)}
.g-name{font-weight:700}
.g-val{color:var(--soft);font-size:15px;text-align:right;font-variant-numeric:tabular-nums}
.g-track{grid-column:1/-1;order:3;position:relative;height:12px;background-image:linear-gradient(to right,var(--line) 1px,transparent 1px);background-size:25% 100%;border-right:1px solid var(--line)}
.g-bar{position:absolute;top:0;bottom:0;left:calc(var(--a) / 20 * 100%);width:calc((var(--b) - var(--a)) / 20 * 100%);border-radius:6px;background:var(--light)}
.g-bar::before{content:"";position:absolute;right:100%;top:50%;height:1px;width:calc(var(--a) / (var(--b) - var(--a)) * 100%);background:var(--line-strong)}
.g-axis{padding-top:10px;border-top:1px solid var(--line)}
.g-ticks{grid-column:1/-1;position:relative;height:18px;font-size:11px;color:var(--gray);font-variant-numeric:tabular-nums}
.g-ticks span{position:absolute;top:0;left:calc(var(--t) / 20 * 100%);transform:translateX(-50%)}
.g-ticks span:first-child{transform:none}
.g-ticks span:last-child{transform:translateX(-100%)}
.g-unit{grid-column:1/-1;font-size:12px;color:var(--gray);text-align:right}
@media (min-width:900px){
  .g-row,.g-axis{grid-template-columns:15rem minmax(0,1fr) 12rem}
  .g-track,.g-ticks{grid-column:auto}
  .g-row .g-track{order:2}
  .g-row .g-val{order:3}
  .g-axis::before{content:""}
  .g-axis .g-unit{grid-column:auto;text-align:left}
  .g-axis{border-top:0;padding-top:4px}
}

/* ---------- pricing ---------- */
.group-label{font-size:var(--fs-caps);font-weight:700;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--gray);margin-bottom:18px}
.plans{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:1000px){.plans{grid-template-columns:repeat(3,minmax(0,1fr))}}
.plan{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,2.6vw,36px);border-radius:12px;background:var(--surface);border:1px solid var(--line);transition:border-color .25s}
.plan:hover{border-color:var(--line-strong)}
.plan-top{display:grid;gap:12px}
.plan-name{font-size:24px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.dur{display:flex;align-items:center;gap:12px;font-size:13px;font-weight:600;color:var(--gray)}
.dur i{position:relative;width:84px;height:3px;border-radius:2px;background:var(--line-strong);flex:none}
.dur i::after{content:"";position:absolute;inset:0 auto 0 0;width:calc(var(--s) / 60 * 100%);border-radius:2px;background:var(--light)}
.plan-desc{color:var(--soft);line-height:1.5}
.plan .ticks li{font-size:15px}
.plan-foot{margin-top:auto;padding-top:22px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.price{font-size:clamp(30px,2.6vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums;white-space:nowrap}
.price small{font-size:15px;font-weight:600;color:var(--gray);letter-spacing:0}
.fine{margin-top:18px;font-size:var(--fs-small);color:var(--gray);max-width:52em;line-height:1.55}
.group-gap{margin-top:clamp(48px,6vw,80px)}
.plan-wide{display:grid;grid-template-columns:minmax(0,1fr);gap:24px}
.plan-wide .plan-foot{margin-top:0}
@media (min-width:1000px){
  .plan-wide{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr) minmax(0,.85fr);gap:clamp(32px,4vw,64px);align-items:start}
  .plan-wide .plan-foot{flex-direction:column;align-items:flex-start;border-top:0;padding-top:0;height:100%;justify-content:space-between}
}
.pick{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px 32px;margin-top:clamp(40px,5vw,64px);padding:clamp(22px,3vw,32px);border-radius:12px;border:1px dashed var(--line-strong)}
.pick p{font-size:18px;font-weight:700;letter-spacing:-.01em;max-width:30em}
.pick p span{display:block;font-size:15px;font-weight:500;color:var(--gray);margin-top:4px}

/* ---------- faq ---------- */
.faq-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:40px}
.faq-head{display:grid;gap:20px;align-content:start}
@media (min-width:1000px){.faq-grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(48px,6vw,104px)}}
.faq-list details{border-top:1px solid var(--line)}
.faq-list details:last-child{border-bottom:1px solid var(--line)}
.faq-list summary{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:24px;cursor:pointer;list-style:none;font-size:clamp(17px,1.4vw,20px);font-weight:700;line-height:1.35;letter-spacing:-.01em}
.faq-list summary::-webkit-details-marker{display:none}
.plus{position:relative;flex:none;width:32px;height:32px;border-radius:50%;border:1px solid var(--line-strong);transition:border-color .2s}
.plus::before,.plus::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--light);transition:transform .25s,opacity .25s}
.plus::after{transform:rotate(90deg)}
details[open] .plus{border-color:var(--light)}
details[open] .plus::after{transform:rotate(0);opacity:0}
.faq-list summary:hover .plus{border-color:var(--light)}
.ans{padding-bottom:28px;padding-right:56px;color:var(--soft);max-width:44em}

/* ---------- brief section ---------- */
.brief{position:relative;overflow:hidden;isolation:isolate}
.brief-orb{position:absolute;z-index:-1;width:min(900px,120vw);aspect-ratio:1;right:max(-300px,-30vw);bottom:min(-420px,-50vw);transform:translateY(var(--rise,0%));will-change:transform}
.brief-orb .core{position:absolute;inset:0}
.ring{position:absolute;border-radius:50%;border:1px solid rgba(244,244,240,.07);pointer-events:none}
.ring.r1{inset:-12%}
.ring.r2{inset:-28%}
.ball{border-radius:50%;background:var(--lime);box-shadow:0 0 140px 30px var(--lime-glow)}
.ball::before{content:"";position:absolute;inset:-40%;border-radius:50%;pointer-events:none;background:radial-gradient(closest-side,rgba(203,242,74,.18),rgba(203,242,74,.06) 58%,rgba(203,242,74,0))}
.brief-head{display:grid;gap:22px;max-width:900px;margin-bottom:clamp(36px,5vw,64px)}
.brief-head .h2{font-size:clamp(38px,5.6vw,88px);line-height:.98}
.brief-head .body{font-size:19px}
.brief-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
@media (min-width:1000px){.brief-cards{grid-template-columns:repeat(3,minmax(0,1fr))}}
.bcard{display:flex;flex-direction:column;gap:14px;padding:clamp(22px,2.6vw,32px);border-radius:12px;background:var(--surface);border:1px solid var(--line)}
.bcard .mono{font-size:11px;color:var(--gray);letter-spacing:.1em}
.bcard h3{font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.1}
.bcard > p:not(.mono):not(.form-status):not(.form-legal){color:var(--soft);line-height:1.5}
.bcard .btn{margin-top:auto}
.bcard.main{border-color:rgba(203,242,74,.45)}
.quick{gap:12px}
.quick .btn{margin-top:4px}
.next{display:grid;grid-template-columns:minmax(0,1fr);gap:0 24px;margin-top:clamp(40px,5vw,64px)}
.next li{display:grid;grid-template-columns:auto minmax(0,1fr);gap:14px;padding-block:18px;border-top:1px solid var(--line);color:var(--soft);line-height:1.45}
.next .mono{font-size:12px;color:var(--lime);padding-top:3px}
@media (min-width:900px){.next{grid-template-columns:repeat(3,minmax(0,1fr))}}
.contacts-row{display:flex;flex-wrap:wrap;gap:12px 28px;margin-top:28px}
.contacts-row a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:600;color:var(--soft);transition:color .2s}
.contacts-row a:hover{color:var(--light)}
.contacts-row a b{color:var(--light)}
.contacts-row svg{width:18px;height:18px;color:var(--gray)}

/* ---------- fields ---------- */
.field{display:grid;gap:8px}
.field label,.q-l{font-size:13px;font-weight:600;color:var(--gray)}
.field input,.field textarea,.q input[type="text"],.q input[type="url"],.q textarea{width:100%;padding:14px 16px;border-radius:8px;border:1px solid var(--line-strong);background:var(--black);color:var(--light);font:500 16px/1.4 var(--font);transition:border-color .2s}
.field textarea,.q textarea{min-height:96px;resize:vertical}
.field input::placeholder,.field textarea::placeholder,.q input::placeholder,.q textarea::placeholder{color:#5E5E5B}
.field input:focus,.field textarea:focus,.q input:focus,.q textarea:focus{outline:none;border-color:var(--lime)}
.hp{position:absolute!important;left:-10000px!important;width:1px;height:1px;overflow:hidden}
.form-legal{font-size:12px;color:var(--gray);line-height:1.5}
.form-legal a{color:var(--soft)}
.form-status{font-size:var(--fs-small);line-height:1.45;color:var(--gray)}
.form-status:empty{display:none}
.form-status[data-tone="ok"]{color:var(--lime)}
.form-status[data-tone="err"]{color:var(--danger)}

/* ---------- brief wizard ---------- */
dialog{padding:0;border:0;background:transparent;color:var(--light);max-width:none;max-height:none;overflow:visible}
dialog::backdrop{background:rgba(11,11,12,.82);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.x{display:grid;place-items:center;flex:none;width:42px;height:42px;border-radius:50%;border:1px solid var(--line-strong);background:var(--black);cursor:pointer;transition:border-color .2s}
.x:hover{border-color:var(--light)}
.x svg{width:16px;height:16px}
.wiz{width:min(800px,calc(100vw - 32px));height:min(900px,calc(100dvh - 48px))}
.wiz-card{height:100%;display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.wiz-head{display:grid;gap:14px;padding:18px clamp(18px,3vw,32px) 16px;border-bottom:1px solid var(--line)}
.wiz-top{display:flex;align-items:center;gap:12px}
.wiz-top .x{margin-left:auto}
.segm{display:inline-flex;padding:4px;border-radius:999px;background:var(--black);border:1px solid var(--line)}
.segm label{position:relative}
.segm input{position:absolute;opacity:0;width:1px;height:1px}
.segm span{display:block;padding:9px 16px;border-radius:999px;font-size:14px;font-weight:700;color:var(--soft);cursor:pointer;white-space:nowrap;transition:background-color .2s,color .2s}
.segm input:checked + span{background:var(--light);color:var(--black)}
.segm input:focus-visible + span{outline:2px solid var(--lime);outline-offset:2px}
.wiz-prog{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
.wiz-prog i{height:3px;border-radius:2px;background:var(--line-strong);transition:background-color .3s}
.wiz-prog i.on{background:var(--lime)}
.wiz-meta{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:var(--gray)}
.wiz-meta b{color:var(--light);font-weight:500}
.wiz-body{flex:1;overflow:auto;padding:26px clamp(18px,3vw,32px) 36px;overscroll-behavior:contain}
.st{display:grid;gap:26px}
.st-title{font-size:clamp(24px,3vw,32px);font-weight:800;letter-spacing:-.02em;line-height:1.1}
.st-lead{color:var(--soft);margin-top:-14px;max-width:36em}
.wiz-plan{display:inline-flex;flex-wrap:wrap;gap:6px;width:fit-content;padding:8px 14px;border-radius:999px;border:1px solid rgba(203,242,74,.4);font-size:13px;color:var(--soft)}
.wiz-plan b{color:var(--light)}
.q{display:grid;gap:10px}
.q-l{font-size:15px;font-weight:700;color:var(--light)}
.q-l .req{color:var(--lime);font-style:normal}
.q-h{font-size:13px;color:var(--gray);margin-top:-4px;line-height:1.45}
.wiz[data-type="video"] .only-persona,.wiz[data-type="persona"] .only-video{display:none}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{position:relative}
.chip input{position:absolute;opacity:0;width:1px;height:1px}
.chip span{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid var(--line-strong);font-size:14px;font-weight:600;color:var(--soft);cursor:pointer;line-height:1.25;transition:border-color .2s,color .2s,background-color .2s}
.chip span::before{content:"";flex:none;width:8px;height:8px;border-radius:50%;border:1px solid var(--gray);transition:background-color .2s,border-color .2s}
.chip span:hover{border-color:var(--light);color:var(--light)}
.chip input:checked + span{border-color:var(--lime);color:var(--light);background:var(--lime-wash)}
.chip input:checked + span::before{background:var(--lime);border-color:var(--lime)}
.chip input:focus-visible + span{outline:2px solid var(--lime);outline-offset:2px}
.q .chips .chip-other{flex:1 1 180px;width:auto;min-width:0;height:40px;padding:8px 16px;border-radius:999px;border:1px dashed var(--line-strong);background:transparent;color:var(--light);font:500 14px/1.2 var(--font)}
.q .chips .chip-other:focus{outline:none;border-style:solid;border-color:var(--lime)}
.q.bad input[type="text"],.q.bad textarea,.q.bad .chip span{border-color:var(--danger)}
.q.bad .q-l::after{content:" — заполните";color:var(--danger);font-weight:600}
.sent-note{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:14px 16px;border-radius:10px;background:var(--lime-wash);border:1px solid rgba(203,242,74,.35);font-size:14px;line-height:1.45}
.link-btn{padding:0;border:0;background:none;color:var(--lime);font-weight:700;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.wiz-foot{display:flex;align-items:center;gap:12px;padding:14px clamp(18px,3vw,32px) calc(14px + env(safe-area-inset-bottom,0px));border-top:1px solid var(--line)}
.wiz-status{flex:1;min-width:0;font-size:13px;line-height:1.4;color:var(--gray)}
.wiz-status[data-tone="err"]{color:var(--danger)}
.done{display:grid;gap:22px;justify-items:start}
.done .ball{position:relative;width:64px;height:64px;box-shadow:0 0 40px 6px var(--lime-glow)}
.done .ball::before{display:none}
@media (max-width:759px){
  .wiz{width:100vw;height:100dvh;margin:0}
  .wiz-card{border-radius:0;border:0}
  .wiz-head{padding-top:calc(14px + env(safe-area-inset-top,0px))}
  .segm span{padding:8px 12px;font-size:13px}
  .wiz-foot .btn{height:50px;padding-inline:20px}
}

/* ---------- lightbox ---------- */
.lightbox{width:min(1280px,calc(100vw - 32px))}
.lightbox.is-vertical{width:min(calc(78vh * 9 / 16),calc(100vw - 32px))}
.lightbox video{width:100%;max-height:80vh;border-radius:8px;background:#000;accent-color:var(--lime)}
.lb-bar{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-top:14px;font-size:var(--fs-small);color:var(--gray)}
.lb-bar b{color:var(--light);font-weight:700}
.lightbox .x{position:absolute;top:-54px;right:0}
.lb-err{position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:24px;color:var(--soft);font-size:15px}

/* ---------- footer ---------- */
.site-footer{border-top:1px solid var(--line);padding-block:clamp(56px,7vw,96px) 32px}
.foot-top{display:grid;grid-template-columns:minmax(0,1fr);gap:32px}
.foot-tag{font-size:20px;font-weight:700;letter-spacing:-.01em;line-height:1.35;max-width:18em}
.foot-col{display:grid;gap:10px;align-content:start}
.foot-col h4{font-size:var(--fs-caps);font-weight:700;letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--gray);margin-bottom:6px}
.foot-col a{color:var(--soft);text-decoration:none;width:fit-content;transition:color .2s}
.foot-col a:hover{color:var(--light)}
@media (min-width:800px){.foot-top{grid-template-columns:minmax(0,2fr) minmax(0,1fr) minmax(0,1fr)}}
.foot-logo{width:100%;height:auto;margin-block:clamp(56px,8vw,112px) clamp(28px,3vw,40px);overflow:visible}
.foot-legal{display:flex;flex-wrap:wrap;align-items:center;gap:10px 28px;font-size:13px;color:var(--gray)}
.foot-legal a{color:var(--gray)}
.foot-legal .pill{margin-left:auto}

/* ---------- mobile bar & cookie ---------- */
.mbar{position:fixed;left:0;right:0;bottom:0;z-index:45;display:none;gap:10px;padding-top:24px;padding-bottom:calc(12px + env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:linear-gradient(to top,var(--black) 55%,rgba(11,11,12,0));transform:translateY(110%);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.mbar.is-on{transform:none}
.mbar .btn-lime{flex:1}
.mbar .icon-btn{width:54px;height:54px;flex:none;background:var(--black)}
.cookie{position:fixed;z-index:46;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:space-between;gap:10px 24px;padding-top:10px;padding-bottom:calc(10px + env(safe-area-inset-bottom,0px));padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));background:rgba(22,22,24,.96);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--line-strong);font-size:13px;line-height:1.4;color:var(--soft)}
.cookie p{min-width:0}
.cookie a{color:var(--light)}
.cookie-actions{display:flex;gap:8px;flex:none}
.cookie .btn-sm{height:34px;padding-inline:14px;font-size:13px}
@media (max-width:759px){.cookie{font-size:11.5px;gap:10px}.cookie .btn-sm{height:32px;padding-inline:11px;font-size:12px}.cookie-actions{gap:6px}}

/* ---------- responsive ---------- */
@media (max-width:1079px){.nav-links{display:none}}
@media (max-width:759px){
  :root{--header-h:64px}
  .logo{width:120px}
  .nav-actions .btn{height:40px;padding-inline:16px}
  .nav-actions .icon-btn{width:40px;height:40px}
  .only-lg{display:none}
  .only-sm{display:inline}
  .hero-cta{flex-wrap:nowrap}
  .hero-cta .btn{height:52px;padding-inline:18px}
  .hero-cta .btn-lime{flex:1}
  .mbar{display:flex}
  .site-footer{padding-bottom:110px}
  .ans{padding-right:0}
  .screen-label{display:none}
  .hud-tc .dim{display:none}
  .hud .btn{height:38px;padding-inline:14px}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:.01ms!important;animation:none!important}
}

/* ---------- страницы кейсов ---------- */
.clip{text-decoration:none}
.case-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px}
.case-hero{padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + clamp(24px,4vw,56px));padding-bottom:clamp(28px,4vw,48px)}
.crumbs{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:clamp(24px,3vw,36px);font-size:var(--fs-small);color:var(--gray)}
.crumbs a{display:inline-flex;align-items:center;gap:8px;color:var(--soft);text-decoration:none;transition:color .2s}
.crumbs a:hover{color:var(--light)}
.crumbs svg{width:16px;height:16px}
.case-title{margin-top:18px;font-size:clamp(36px,6vw,96px);font-weight:800;letter-spacing:var(--track-head);line-height:.98;text-wrap:balance;max-width:15em}
.case-lead{margin-top:24px;font-size:clamp(17px,1.4vw,21px);line-height:1.55;color:var(--soft);max-width:38em}
.facts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin-top:clamp(32px,4vw,48px)}
.facts div{display:flex;flex-direction:column-reverse;gap:6px;padding-block:16px;border-top:1px solid var(--line)}
.facts dt{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--gray)}
.facts dd{font-size:clamp(17px,1.6vw,22px);font-weight:700;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
@media (min-width:800px){.facts{grid-template-columns:repeat(4,minmax(0,1fr))}}
.film{max-width:100%;border-radius:var(--r);overflow:hidden;background:#000}
.film video{display:block;width:100%;height:auto;max-height:84vh;background:#000;accent-color:var(--lime)}
.film-fig.v{width:min(440px,100%);margin-inline:auto}
.film-cap{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 20px;margin-top:14px;font-size:var(--fs-small);color:var(--gray)}
.film-cap b{color:var(--light);font-weight:700}
.films{display:grid;grid-template-columns:minmax(0,1fr);gap:28px}
@media (min-width:900px){.films.two{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}}
.draft{display:flex;gap:12px;align-items:flex-start;margin-top:28px;padding:14px 16px;border-radius:10px;border:1px dashed rgba(203,242,74,.5);font-size:var(--fs-small);line-height:1.5;color:var(--soft);max-width:52em}
.draft b{color:var(--lime);font-weight:700;white-space:nowrap}
.story-row{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;padding-block:clamp(24px,3vw,36px);border-top:1px solid var(--line)}
.story-row h2{font-size:clamp(22px,2.2vw,30px);font-weight:800;letter-spacing:-.02em;line-height:1.15}
.story-row p{color:var(--soft);font-size:18px;line-height:1.6;max-width:40em}
@media (min-width:900px){.story-row{grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:48px}}
.frames{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.frames.v{grid-template-columns:repeat(3,minmax(0,1fr))}
@media (min-width:900px){.frames{grid-template-columns:repeat(3,minmax(0,1fr))}.frames.v{grid-template-columns:repeat(6,minmax(0,1fr))}}
.frame{position:relative;border-radius:6px;overflow:hidden;background:var(--surface)}
.frame img{width:100%;height:auto}
.frame .mono{position:absolute;left:8px;bottom:8px;padding:4px 8px;border-radius:999px;background:var(--scrim);font-size:11px;font-variant-numeric:tabular-nums}
.pipe{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pipe li{display:inline-flex;align-items:center;gap:8px;height:34px;padding-inline:14px;border-radius:999px;border:1px solid var(--line-strong);font-size:14px;font-weight:600;color:var(--soft)}
.pipe li span{color:var(--gray);font-weight:500}
.pipe-link{display:inline-flex;margin-top:20px;color:var(--soft);font-weight:600;text-underline-offset:4px}
.pipe-link:hover{color:var(--light)}
.cta-band{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:20px 40px;padding:clamp(24px,4vw,48px);border-radius:12px;background:var(--surface);border:1px solid rgba(203,242,74,.35)}
.cta-band h2{font-size:clamp(26px,3vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.1;max-width:16em;text-wrap:balance}
.cta-band p{margin-top:10px;color:var(--soft);max-width:34em}
.cta-band .acts{display:flex;flex-wrap:wrap;gap:10px}
.wgrid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 14px}
@media (min-width:900px){.wgrid{grid-template-columns:repeat(5,minmax(0,1fr))}}
.wcard{display:grid;gap:10px;align-content:start;color:inherit;text-decoration:none}
.wcard .media{display:block;position:relative;aspect-ratio:4/5;border-radius:var(--r);overflow:hidden;background:var(--surface)}
.wcard img,.wcard video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wcard img{transition:transform .9s cubic-bezier(.2,.7,.2,1)}
.wcard:hover img{transform:scale(1.04)}
.wcard video{opacity:0;transition:opacity .35s}
.wcard.is-previewing video{opacity:1}
.wcard b{font-size:16px;font-weight:700;line-height:1.3}
.wcard .mono{font-size:11px;color:var(--gray)}
.next-case{display:grid;gap:12px;padding-block:clamp(48px,7vw,96px);border-top:1px solid var(--line);color:inherit;text-decoration:none}
.next-case .mono{font-size:12px;color:var(--gray)}
.next-case b{display:flex;align-items:center;gap:.3em;font-size:clamp(32px,5.4vw,80px);font-weight:800;letter-spacing:var(--track-head);line-height:1;transition:color .2s}
.next-case b svg{width:.7em;height:.7em;flex:none;transition:transform .25s}
.next-case:hover b{color:var(--lime)}
.next-case:hover b svg{transform:translateX(.12em)}
.sec-md{padding-block:clamp(56px,7vw,104px)}
.sec-title{font-size:clamp(26px,3vw,40px);font-weight:800;letter-spacing:-.02em;line-height:1.1;margin-bottom:clamp(20px,3vw,32px)}
@media (max-width:899px){
  .wgrid{grid-auto-flow:column;grid-auto-columns:62%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:10px;overscroll-behavior-x:contain}
  .wcard{scroll-snap-align:start}
}

/* ---------- доверие на первом экране ---------- */
.trust{display:grid;gap:14px;padding-top:20px;border-top:1px solid var(--line)}
.trust-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.trust-stats div{display:flex;flex-direction:column-reverse;gap:4px}
.trust-stats dd{font-size:clamp(24px,2.2vw,32px);font-weight:800;letter-spacing:-.02em;line-height:1;font-variant-numeric:tabular-nums}
.trust-stats dt{font-size:13px;line-height:1.3;color:var(--gray)}
.trust-cap{font-size:13px;color:var(--gray);margin-top:-4px}
.trust-cap a{color:var(--soft)}
.trust-list{display:grid;gap:8px}
.trust-list li{display:flex;align-items:flex-start;gap:10px;font-size:15px;font-weight:600;line-height:1.35}
.trust-list svg{width:18px;height:18px;flex:none;margin-top:1px;color:var(--lime)}
.fmt-line{display:grid;gap:12px;margin-top:clamp(28px,3vw,40px)}
.fmt-line .group-label{margin-bottom:0}
#persona .ticks{margin-top:-4px}

/* ---------- v2.3: клиенты ---------- */
.clients{padding-block:clamp(22px,3vw,34px)}
.clients-in{display:grid;gap:16px;align-items:center}
.logos{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.logo-slot{display:grid;place-items:center;height:56px;padding-inline:10px;border:1px dashed var(--line-strong);border-radius:8px;color:var(--gray);font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;text-align:center;line-height:1.3}
.logo-slot img{max-width:100%;max-height:28px;width:auto;filter:grayscale(1) brightness(0) invert(1);opacity:.75}
@media (min-width:900px){
  .clients-in{grid-template-columns:auto minmax(0,1fr);gap:48px}
  .logos{grid-template-columns:repeat(6,minmax(0,1fr))}
}

/* ---------- v2.3: работы — вертикали 9:16 целиком ---------- */
.clip-row.mix{display:grid;grid-template-columns:minmax(0,344fr) minmax(0,344fr) minmax(0,532fr);gap:14px}
.clip-row.mix > .clip.v{aspect-ratio:9/16}
.clip-stack{display:grid;grid-template-rows:minmax(0,1fr) minmax(0,1fr);gap:14px;min-width:0}
.clip-stack .clip{aspect-ratio:auto;height:100%}
@media (max-width:699px){
  .clip-row.mix,.clip-stack{display:contents}
  .clip-stack .clip{aspect-ratio:16/9;height:auto}
}
.touch-only{display:none}
@media (hover:none){.hover-only{display:none}.touch-only{display:inline}}

/* ---------- v2.3: цены ---------- */
.group-gap{margin-top:clamp(72px,9vw,128px)}
.plan.plan-wide{border-color:rgba(203,242,74,.45)}
@media (max-width:759px){
  .plans{grid-auto-flow:column;grid-auto-columns:84%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;overscroll-behavior-x:contain;margin-inline:-16px;padding-inline:16px;scroll-padding-inline:16px;padding-bottom:10px}
  .plans .plan{scroll-snap-align:start}
}

/* ---------- v2.4: бриф — три карточки одной высоты, кнопки внизу, форма компактнее ---------- */
.brief-cards{align-items:stretch}
.bcard .btn,.quick .btn{margin-top:auto}
@media (min-width:1000px){
  .quick{gap:10px}
  .quick .field label{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .quick .field input{padding-block:12px}
  .quick .form-legal{font-size:11.5px}
}

/* ---------- v2.3: отступы секций на десктопе −28% ---------- */
@media (min-width:1000px){
  .section{padding-block:clamp(64px,7.2vw,110px)}
  .sec-md{padding-block:clamp(40px,5vw,75px)}
}
.logo-slot.is-named{color:var(--light);font-size:14px;font-weight:600;letter-spacing:.1em;border-style:solid;border-color:var(--line)}
.brief-legal{padding-inline:4px}
@media (min-width:1000px){.brief-legal{grid-column:3;margin-top:-4px}}

/* ---------- v2.5: тарифы и цена персонажа ---------- */
.plan{position:relative}
.plan.plan-hot,.plan.plan-hot:hover{border-color:rgba(203,242,74,.45)}
.plan-badge{position:absolute;top:0;right:clamp(20px,2.4vw,32px);transform:translateY(-50%);display:inline-flex;align-items:center;height:26px;padding-inline:12px;border-radius:999px;border:1px solid rgba(203,242,74,.6);background:var(--black);color:var(--lime);font-size:12px;font-weight:700;letter-spacing:.02em;white-space:nowrap}
.fine-list{display:grid;gap:4px;margin-top:18px}
.fine-list .fine{margin-top:0}
.persona-price{font-size:18px;color:var(--soft)}
.persona-price b{color:var(--light);font-weight:800}
@media (max-width:759px){.plans{padding-top:14px}}

/* ---------- v2.6: мобильная версия ---------- */
.burger{display:none}
.mnav{position:fixed;inset:0;z-index:49;display:flex;flex-direction:column;justify-content:space-between;gap:24px;overflow:auto;padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + 12px);padding-bottom:calc(24px + env(safe-area-inset-bottom,0px));padding-left:max(var(--gutter),env(safe-area-inset-left,0px));padding-right:max(var(--gutter),env(safe-area-inset-right,0px));background:var(--black)}
.mnav-links{display:grid}
.mnav-links a{padding-block:14px;border-bottom:1px solid var(--line);font-size:26px;font-weight:800;letter-spacing:-.02em;line-height:1.15;text-decoration:none}
.mnav-foot{display:grid}
.mnav-foot a{padding-block:10px;color:var(--soft);font-weight:600;text-decoration:none}
html.menu-open{overflow:hidden}
@media (max-width:1079px){.burger{display:grid}}
@media (min-width:1080px){.mnav{display:none!important}}
@media (max-width:759px){
  /* шапка: логотип, «Рассчитать», меню; когда видна нижняя кнопка — без дубля сверху */
  .nav-actions > a.icon-btn{display:none}
  .nav-actions{gap:8px}
  .nav-actions .btn-lime{transition:opacity .2s,visibility .2s}
  html.mbar-on .nav-actions .btn-lime,html.menu-open .nav-actions .btn-lime{opacity:0;visibility:hidden}

  /* ритм: меньше пустоты между блоками */
  .section{padding-block:56px}
  .sec-md{padding-block:44px}
  .sec-head{margin-bottom:28px}
  .hero{padding-bottom:48px}
  :root{--fs-h1:clamp(30px,8.4vw,38px)}

  /* ручная доводка: компактный список вместо длинного таймлайна */
  .nle{padding:4px 16px}
  .nle-top,.lane,.nle-ph{display:none}
  .trk{gap:4px;padding-block:14px}
  .trk-note{font-size:14px}

  /* как работаем */
  .step{padding-block:18px 20px;gap:6px}

  /* персонаж: видео не на весь экран */
  #persona .case-media .vframe{width:min(62%,240px);margin-inline:auto}
  .case-grid{gap:28px}

  /* цены: кнопка во всю ширину под ценой */
  .plan{padding:22px}
  .plan-foot .btn{flex:1 1 100%}

  /* подвал и контакты: удобные зоны нажатия */
  .foot-col{gap:0}
  .foot-col a{padding-block:9px}
  .foot-legal a,.contacts-row a{padding-block:8px}
  .foot-logo{margin-block:48px 24px}
}
button.icon-btn{background:transparent;padding:0;cursor:pointer}
/* цифры в статистике на одной линии, даже если подпись в две строки */
.case-stats div,.trust-stats div,.facts div,.stat{justify-content:flex-end}
@media (max-width:759px){.film-fig.v{width:min(72%,300px)}}

/* ---------- v2.7: живее, как в КП «Вечер дизайнеров» ---------- */
/* первый экран: круг со свечением справа, текст слева */
.hero{position:relative;overflow:hidden}
.hero .wrap{position:relative;z-index:1}
.lime{color:var(--lime)}
.hero{--orb:clamp(440px,46vw,800px)}
.hero-orb{position:absolute;z-index:0;width:var(--orb);height:var(--orb);top:calc(var(--header-h) + env(safe-area-inset-top,0px) + 8px);right:calc(var(--orb) * -.36);pointer-events:none}
.hero-orb .core{position:absolute;inset:0}
.ring.r3{inset:-46%}
.hero-copy{display:grid;gap:22px;max-width:min(820px,60%)}
.hero-copy .h1{margin-top:-4px}
.hero-price{margin-top:-12px}
.hero-price b{color:var(--light);font-weight:700}
.hero-tag{margin-top:-8px;font-size:clamp(17px,1.4vw,21px);font-weight:700;letter-spacing:-.01em;line-height:1.3}
.hero-pills{display:flex;flex-wrap:wrap;gap:8px}
.hero-pills li{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 14px;border-radius:999px;border:1px solid var(--line-strong);font-size:14px;font-weight:600;color:var(--light);line-height:1.3}
.hero-pills svg{width:15px;height:15px;flex:none;color:var(--lime)}
.stat-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;max-width:820px;margin-top:clamp(32px,4vw,52px)}
.stat-cards div{display:flex;flex-direction:column-reverse;justify-content:flex-end;gap:8px;padding:clamp(16px,2vw,26px);border-radius:12px;background:var(--surface)}
.stat-cards dd{font-size:clamp(28px,3.6vw,56px);font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--lime);font-variant-numeric:tabular-nums}
.stat-cards dt{font-size:14px;line-height:1.3;color:var(--gray)}
.hero .trust-cap{margin-top:12px}
.hero .screen{margin-top:clamp(40px,5vw,72px)}

/* номера разделов лаймом вместо точки */
.eyebrow[data-n]::before{content:attr(data-n);width:auto;height:auto;border-radius:0;background:none;color:var(--lime);font-family:var(--mono);font-weight:500;letter-spacing:.06em}

/* лаймовые цифры и цены */
.price{color:var(--lime)}
.price small{color:var(--gray)}
.case-stats dd{color:var(--lime)}
.plan-badge{background:var(--lime);border-color:var(--lime);color:var(--black)}

/* как работаем: карточки с крупным номером */
.steps{gap:12px}
.step{padding:clamp(20px,2vw,26px);border-top:0;border-radius:12px;background:var(--surface)}
.step::before{display:none}
.step-n{font-size:clamp(32px,3vw,44px);font-weight:800;letter-spacing:-.02em;line-height:1;color:var(--lime);font-variant-numeric:tabular-nums}
.step .mono{font-size:11px;color:var(--gray);letter-spacing:.08em}

/* бриф: большой круг справа от заголовка, как на последнем слайде КП */
@media (min-width:1000px){
  .brief-orb{width:min(760px,50vw);top:clamp(24px,4vw,72px);bottom:auto;right:calc(min(760px,50vw) * -.38)}
  .brief-head{max-width:min(820px,60%)}
}

/* на телефоне круг в углу над заголовком, подзаголовок «AI-видеостудия» рядом с ним */
@media (max-width:899px){
  .hero{--orb:clamp(130px,38vw,260px);padding-top:calc(var(--header-h) + env(safe-area-inset-top,0px) + var(--orb) * .8)}
  .hero-orb{top:calc(var(--header-h) + env(safe-area-inset-top,0px) + 6px);right:calc(var(--orb) * -.28)}
  .hero-orb .ball{box-shadow:0 0 70px 12px var(--lime-glow)}
  .hero-copy{max-width:none}
}
@media (max-width:759px){
  .stat-cards{gap:8px}
  .stat-cards div{padding:14px 12px}
  .stat-cards dd{font-size:clamp(24px,7vw,32px)}
  .stat-cards dt{font-size:12.5px}
  .hero-pills li{font-size:13px;min-height:34px}
  .step-n{font-size:30px}
}
