/* ═══════════════ ТОКЕНЫ ═══════════════ */
:root{
  --night:#14110F;
  --night2:#1C1815;
  --cream:#F7F4F0;
  --paper:#EFEAE3;
  --ink:#252525;
  --wine:#7A3045;
  --rose:#E8D8DC;

  --bg:var(--cream);--fg:var(--ink);--mut:rgba(37,37,37,.56);--rule:rgba(37,37,37,.14);--acc:var(--wine);

  --fd:"Playfair Display",Georgia,serif;
  --fu:"Onest",-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;

  --pad:clamp(20px,4.6vw,88px);
  --max:1620px;
  --sy:clamp(84px,11vw,190px);
  --e:cubic-bezier(.16,1,.3,1);
  --e2:cubic-bezier(.4,0,.2,1);
}
.t-dark{--bg:var(--night);--fg:#F2EEE9;--mut:rgba(242,238,233,.54);--rule:rgba(242,238,233,.14);--acc:var(--rose)}
.t-paper{--bg:var(--paper)}
.t-wine{--bg:var(--wine);--fg:#FBF7F5;--mut:rgba(251,247,245,.68);--rule:rgba(251,247,245,.22);--acc:#FBF7F5}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
html:focus-within{scroll-behavior:smooth}
body{margin:0;background:var(--night);color:var(--ink);font-family:var(--fu);
  font-size:clamp(15px,.34vw + 14px,17px);line-height:1.62;overflow-x:hidden;-webkit-font-smoothing:antialiased}
body.lock{overflow:hidden}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3,h4,p,ul,figure,blockquote{margin:0}
ul{padding:0;list-style:none}
h1,h2,h3,h4,p,li,a,span,b{overflow-wrap:break-word}
:focus-visible{outline:2px solid var(--acc);outline-offset:4px}

.band{background:var(--bg);color:var(--fg);position:relative}
.sec{padding-block:var(--sy)}
.wrap{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--pad)}
section[id],footer[id]{scroll-margin-top:72px}

/* типографика */
.d{font-family:var(--fd);font-weight:400;line-height:1.04;letter-spacing:-.018em}
.d em{font-style:italic;font-weight:400}
.xxl{font-size:clamp(40px,7.6vw,132px);line-height:1.02}
.xl{font-size:clamp(33px,5.4vw,88px)}
.lg{font-size:clamp(28px,3.9vw,58px)}
.size-md{font-size:clamp(22px,2.6vw,40px)}
.lead{font-size:clamp(16px,.55vw + 14px,19px);line-height:1.52;color:var(--mut);max-width:50ch}
.eyebrow{font-size:11px;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--mut)}
.bodytext{max-width:58ch;opacity:.86}

.shead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;
  padding-bottom:clamp(20px,2.4vw,34px);border-bottom:1px solid var(--rule);margin-bottom:clamp(36px,5vw,76px)}
.shead .eyebrow{white-space:nowrap}

/* ═══════════════ КНОПКИ ═══════════════ */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;
  min-height:60px;padding:17px 38px;overflow:hidden;border:1px solid currentColor;border-radius:70px;
  font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--fg);
  transition:color .55s var(--e),transform .5s var(--e),border-color .55s var(--e);will-change:transform}
.btn>span{position:relative;z-index:2;display:flex;align-items:center;gap:10px;transition:transform .5s var(--e)}
.btn::before{content:"";position:absolute;inset:0;z-index:1;background:var(--acc);
  transform:translateY(102%);transition:transform .65s var(--e)}
.btn:hover::before{transform:translateY(0)}
.btn:hover{color:var(--night)}
.btn--fill{background:var(--wine);border-color:var(--wine);color:#FBF7F5}
.btn--fill::before{background:#F2EEE9}
.btn--fill:hover{color:var(--wine)}
.t-wine .btn--fill{background:#FBF7F5;border-color:#FBF7F5;color:var(--wine)}
.t-wine .btn--fill::before{background:var(--night)}
.t-wine .btn--fill:hover{color:#FBF7F5}
.btn.off{opacity:.42;cursor:not-allowed}
.btn.off::before{display:none}
.arrow{display:inline-block;transition:transform .5s var(--e)}
.btn:hover .arrow{transform:translateX(5px)}

.ln{position:relative;display:inline-flex;align-items:center;gap:10px;padding-bottom:6px;
  font-size:12px;font-weight:500;letter-spacing:.16em;text-transform:uppercase}
.ln::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:1px;background:currentColor;
  transform-origin:right;transition:transform .6s var(--e)}
.ln:hover::after{transform:scaleX(0);transform-origin:left}

/* ═══════════════ ШАПКА ═══════════════ */
.hdr{position:fixed;inset:0 0 auto 0;z-index:70;color:#F2EEE9;transition:background .6s var(--e2),color .5s var(--e2)}
.hdr::after{content:"";position:absolute;inset:auto 0 0;height:1px;background:transparent;transition:background .5s}
.hdr.stuck{background:rgba(20,17,15,.74);-webkit-backdrop-filter:blur(16px) saturate(150%);backdrop-filter:blur(16px) saturate(150%)}
.hdr.stuck::after{background:rgba(242,238,233,.13)}
.hdr.light{color:var(--ink)}
.hdr.light.stuck{background:rgba(247,244,240,.82)}
.hdr.light.stuck::after{background:rgba(37,37,37,.13)}
.hin{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:72px}
.bnd{font-family:var(--fd);font-size:17px;letter-spacing:.02em;white-space:nowrap}
.bnd em{font-style:italic}
.nav{display:flex;gap:clamp(14px,1.8vw,32px)}
.nav a{position:relative;font-size:13px;opacity:.74;transition:opacity .4s}
.nav a::after{content:"";position:absolute;left:0;bottom:-5px;width:100%;height:1px;background:currentColor;
  transform:scaleX(0);transform-origin:right;transition:transform .55s var(--e)}
.nav a:hover{opacity:1}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.hdr .btn{min-height:44px;padding:12px 26px;font-size:11px}
.brg{display:none;width:46px;height:46px;margin-right:-12px;align-items:center;justify-content:center}
.brg i{display:block;width:24px;height:1px;background:currentColor;position:relative;transition:background .25s}
.brg i::before,.brg i::after{content:"";position:absolute;left:0;width:24px;height:1px;background:currentColor;
  transition:transform .45s var(--e),top .3s var(--e)}
.brg i::before{top:-7px}.brg i::after{top:7px}
body.menu .brg i{background:transparent}
body.menu .brg i::before{top:0;transform:rotate(45deg)}
body.menu .brg i::after{top:0;transform:rotate(-45deg)}

.mob{position:fixed;inset:0;z-index:65;background:var(--night);color:#F2EEE9;padding:104px var(--pad) 40px;
  display:flex;flex-direction:column;justify-content:space-between;gap:34px;overflow-y:auto;overscroll-behavior:contain;
  clip-path:inset(0 0 100% 0);transition:clip-path .85s var(--e);visibility:hidden}
.mob.open{clip-path:inset(0);visibility:visible}
.mob a.mi{display:flex;align-items:baseline;gap:16px;padding:15px 0;border-bottom:1px solid rgba(242,238,233,.13);
  font-family:var(--fd);font-size:clamp(28px,8.4vw,44px);opacity:0;transform:translateY(22px);
  transition:opacity .7s var(--e),transform .7s var(--e)}
.mob.open a.mi{opacity:1;transform:none}
.mob a.mi em{font-style:italic;font-family:var(--fu);font-size:11px;letter-spacing:.2em;opacity:.4}
.mobb{display:flex;flex-direction:column;gap:18px}
.mobch{display:flex;gap:22px;flex-wrap:wrap;font-size:12px;letter-spacing:.14em;text-transform:uppercase;opacity:.7}

/* ═══════════════ РЕЛЬС ═══════════════ */
.rail{position:fixed;right:20px;top:50%;transform:translateY(-50%);z-index:52;display:flex;flex-direction:column;
  gap:15px;align-items:flex-end;mix-blend-mode:difference}
.rail a{display:flex;align-items:center;gap:8px;font-size:10px;letter-spacing:.16em;color:rgba(255,255,255,.4);transition:color .4s}
.rail a i{width:11px;height:1px;background:rgba(255,255,255,.3);transition:width .55s var(--e),background .5s}
.rail a.on{color:#fff}.rail a.on i{width:30px;background:#fff}
body.lock .rail{opacity:0;pointer-events:none}
@media(max-width:1359px){.rail{display:none}}

/* ═══════════════ HERO ═══════════════ */
.hero{position:relative;min-height:100svh;display:flex;align-items:flex-end;overflow:hidden;background:var(--night);color:#F2EEE9}
.hero__bg{position:absolute;inset:-6% 0 -6%;z-index:0}
.hero__bg .img,.hero__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero__bg picture,.fin__bg picture{display:block}
.hero__scrim{position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(to top,rgba(20,17,15,.92) 0%,rgba(20,17,15,.62) 34%,rgba(20,17,15,.28) 62%,rgba(20,17,15,.55) 100%)}
.hero__scrim::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(20,17,15,.66),transparent 58%)}
.hero__in{position:relative;z-index:2;width:100%;padding-bottom:clamp(30px,5vh,64px);padding-top:120px}
.hero__eye{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:clamp(22px,4vh,44px)}
.hero h1{margin-bottom:clamp(22px,3.4vh,40px);max-width:17ch}
.hero h1 em{color:var(--rose)}
.hero__row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:clamp(22px,4vw,64px)}
.hero__sub{max-width:40ch}
.hero__who{margin-top:clamp(18px,2.6vh,30px);padding-top:16px;border-top:1px solid rgba(242,238,233,.18);
  display:flex;flex-wrap:wrap;gap:6px 16px;align-items:baseline}
.hero__who b{font-family:var(--fd);font-weight:400;font-size:clamp(19px,1.6vw,26px)}
.hero__who span{font-size:13.5px;color:rgba(242,238,233,.6);max-width:36ch}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:clamp(22px,3vh,34px)}
.hero__side{display:flex;flex-direction:column;align-items:flex-end;gap:16px;text-align:right}
.open-badge{display:inline-flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.18em;
  text-transform:uppercase;color:rgba(242,238,233,.68)}
.pulse{width:6px;height:6px;border-radius:50%;background:var(--rose);animation:pl 2.8s var(--e2) infinite}
@keyframes pl{0%,100%{opacity:.35;transform:scale(.8)}50%{opacity:1;transform:scale(1.3)}}
.scroll-h{display:flex;align-items:center;gap:12px;font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,238,233,.5)}
.scroll-h i{display:block;width:46px;height:1px;background:rgba(242,238,233,.3);position:relative;overflow:hidden}
.scroll-h i::after{content:"";position:absolute;inset:0;background:var(--rose);animation:sl 2.6s var(--e2) infinite}
@keyframes sl{0%{transform:translateX(-100%)}60%,100%{transform:translateX(100%)}}
.mrq{position:relative;z-index:2;border-top:1px solid rgba(242,238,233,.14);overflow:hidden;padding:15px 0}
.mrq div{display:flex;width:max-content;animation:mv 48s linear infinite}
.mrq span{font-family:var(--fd);font-size:clamp(15px,1.5vw,23px);padding-right:clamp(18px,2.4vw,40px);opacity:.75;white-space:nowrap}
.mrq span i{font-style:italic;color:var(--rose);padding-left:clamp(18px,2.4vw,40px)}
@keyframes mv{to{transform:translateX(-50%)}}

/* заглушки */
.img{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;padding:22px;
  background:repeating-linear-gradient(126deg,rgba(242,238,233,.055) 0 1px,transparent 1px 14px),var(--night2);
  color:rgba(242,238,233,.42)}
.img b{font-size:10.5px;font-weight:600;letter-spacing:.22em}
.img em{font-style:normal;font-size:12px;opacity:.6;max-width:26ch;line-height:1.4}
.tile{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;
  background:repeating-linear-gradient(126deg,rgba(242,238,233,.05) 0 1px,transparent 1px 15px),var(--night2);text-align:center;padding:24px}
.tile b{font-family:var(--fd);font-weight:400;font-size:clamp(28px,4vw,56px);letter-spacing:-.02em;color:#F2EEE9}
.tile em{font-style:normal;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,238,233,.45)}
.img--l{background:repeating-linear-gradient(126deg,rgba(37,37,37,.06) 0 1px,transparent 1px 14px),#E6E0D8;color:rgba(37,37,37,.44)}

/* ═══════════════ ОБО МНЕ ═══════════════ */
.ab{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(30px,5vw,96px);align-items:start}
.ab__stack{position:relative}
.ab__p1{position:relative;aspect-ratio:3/4;overflow:hidden;width:82%}
.ab__p2{position:relative;aspect-ratio:1/1;overflow:hidden;width:46%;margin-left:auto;margin-top:-18%;
  border:8px solid var(--bg)}
.ab__p1 .img,.ab__p1 img,.ab__p2 .img,.ab__p2 img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ab__cap{margin-top:18px;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut)}
.ab__t p+p{margin-top:1.1em}
.pull{margin-top:clamp(36px,4.6vw,66px);padding-top:clamp(24px,3vw,40px);border-top:1px solid var(--rule);
  font-family:var(--fd);font-size:clamp(23px,3vw,46px);line-height:1.13;letter-spacing:-.02em;max-width:19ch}
.pull em{font-style:italic;color:var(--wine)}
.stats{display:flex;flex-wrap:wrap;gap:clamp(20px,3vw,56px);margin-top:clamp(30px,3.6vw,50px)}
.stats div{min-width:110px}
.stats b{display:block;font-family:var(--fd);font-size:clamp(30px,3.4vw,50px);line-height:1;letter-spacing:-.02em}
.stats span{display:block;margin-top:8px;font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--mut)}

/* ═══════════════ РАБОТЫ ═══════════════ */
.feat{position:relative;cursor:pointer}
.feat__media{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--night2)}
.feat__media .img,.feat__media img,.feat__media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feat__media img{transition:transform 1.5s var(--e)}
.feat:hover .feat__media img{transform:scale(1.04)}
.feat__media video{display:block;will-change:transform}
/* portrait cards (4:5) */
.feat--portrait{aspect-ratio:4/5}
/* preview also shows video */
.prev video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.feat__over{position:absolute;inset:auto 0 0;z-index:2;padding:clamp(20px,3vw,48px);
  background:linear-gradient(to top,rgba(20,17,15,.88),transparent);color:#F2EEE9;pointer-events:none}
.feat__over h3{font-family:var(--fd);font-size:clamp(30px,5vw,74px);line-height:1;letter-spacing:-.025em}
.feat__over h3 button{font:inherit;letter-spacing:inherit;padding:0;pointer-events:auto;color:inherit}
.feat__meta{display:flex;flex-wrap:wrap;gap:8px 20px;margin-bottom:14px}
.feat__meta span{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,238,233,.66)}
.feat__low{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 40px;align-items:end;
  margin-top:clamp(16px,2vw,28px);padding-top:clamp(14px,1.8vw,24px);border-top:1px solid var(--rule)}
.feat__low p{color:var(--mut);max-width:48ch}
.feat__act{display:flex;gap:26px;flex-wrap:wrap}

/* сетка приглашений и коммерческих проектов */
.inv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:clamp(20px,3vw,40px)}
.inv-grid .feat__media{aspect-ratio:1/1}
.inv-grid .feat__low{margin-top:clamp(10px,1.2vw,16px);padding-top:clamp(10px,1.2vw,16px)}
.inv-grid .feat__act{gap:14px}
@media(min-width:900px){.inv-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:599px){.inv-grid{grid-template-columns:repeat(2,1fr);gap:12px}
.inv-grid .feat__low{display:block}
.inv-grid .feat__low p{margin-bottom:8px}}

/* коммерческая сетка — портретные карточки */
.comm-grid .feat--portrait .feat__media{aspect-ratio:4/5}

/* подписи между группами работ */
.works-label{display:block;margin-bottom:14px;margin-top:clamp(52px,7vw,100px)}
.works-label:first-child{margin-top:0}
.works-sub{margin-bottom:clamp(20px,3vw,36px);margin-top:6px;color:var(--mut);max-width:60ch}
.works-group{margin-bottom:0}

/* название карточки снизу */
.card-title{font-family:var(--fd);font-size:clamp(15px,1vw,18px);letter-spacing:-.01em;color:var(--fg);font-weight:400}
.inv-grid .feat__low{margin-top:clamp(10px,1.2vw,16px);padding-top:clamp(10px,1.2vw,16px)}
.inv-grid .feat__act{gap:14px}

/* список концептов + превью за курсором */
.cl{border-top:1px solid var(--rule);position:relative}
.cr{position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) auto;gap:clamp(10px,2vw,32px);
  align-items:center;padding:clamp(18px,2.4vw,32px) 0;border-bottom:1px solid var(--rule);cursor:pointer}
.cr::before{content:"";position:absolute;left:-2vw;right:-2vw;top:0;bottom:0;background:rgba(242,238,233,.045);
  opacity:0;transition:opacity .55s var(--e);pointer-events:none}
.cr:hover::before{opacity:1}
.cr__n{font-size:11px;letter-spacing:.18em;color:var(--mut);transition:color .5s var(--e)}
.cr__t{font-family:var(--fd);font-size:clamp(22px,3.2vw,48px);line-height:1.06;letter-spacing:-.02em;
  transition:transform .65s var(--e)}
.cr__t button{font:inherit;letter-spacing:inherit;padding:0;text-align:left;color:inherit}
.cr:hover .cr__t{transform:translateX(clamp(6px,1.2vw,20px))}
.cr:hover .cr__n{color:var(--acc)}
.cr__m{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);white-space:nowrap}
.cr__thumb{display:none}
.prev{position:fixed;top:0;left:0;z-index:60;width:clamp(240px,23vw,380px);aspect-ratio:16/10;overflow:hidden;
  pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.92);
  transition:opacity .5s var(--e),transform .7s var(--e);margin-top:0}
.prev.on{opacity:1;transform:translate(-50%,-50%) scale(1)}
.prev .img,.prev img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
@media(hover:none),(pointer:coarse){.prev{display:none}}

/* ═══════════════ УСЛУГИ / ШКАЛА ═══════════════ */
.scale{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(26px,4vw,80px);align-items:start}
.scale__vis{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--night2)}
.scale__vis .img,.scale__vis img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.scale__q{font-family:var(--fd);font-size:clamp(22px,2.8vw,42px);line-height:1.1;letter-spacing:-.02em;margin-bottom:clamp(24px,3vw,40px);max-width:17ch}
.sl{margin-bottom:clamp(24px,3vw,38px)}
.sl input{-webkit-appearance:none;appearance:none;width:100%;height:36px;background:transparent;cursor:pointer;display:block}
.sl input::-webkit-slider-runnable-track{height:1px;background:var(--rule)}
.sl input::-moz-range-track{height:1px;background:var(--rule)}
.sl input::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:var(--wine);
  margin-top:-10px;border:0;transition:transform .35s var(--e),box-shadow .35s var(--e);box-shadow:0 0 0 0 rgba(122,48,69,.18)}
.sl input::-moz-range-thumb{width:20px;height:20px;border:0;border-radius:50%;background:var(--wine)}
.sl input:hover::-webkit-slider-thumb,.sl input:focus-visible::-webkit-slider-thumb{transform:scale(1.18);box-shadow:0 0 0 10px rgba(122,48,69,.12)}
.sl__marks{display:flex;justify-content:space-between;gap:10px;margin-top:6px}
.sl__marks button{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--mut);
  text-align:left;transition:color .4s;padding:0}
.sl__marks button:last-child{text-align:right}
.sl__marks button.on{color:var(--wine)}
.sc__ttl{font-family:var(--fd);font-size:clamp(24px,2.6vw,38px);line-height:1.1;margin-bottom:12px;letter-spacing:-.02em}
.sc__d{color:var(--mut);max-width:44ch;min-height:3.1em}
.sc__p{display:flex;flex-wrap:wrap;gap:clamp(18px,3vw,48px);margin-top:clamp(22px,2.6vw,34px);
  padding-top:22px;border-top:1px solid var(--rule)}
.sc__p div span{display:block;font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--mut);margin-bottom:8px}
.sc__p div b{font-family:var(--fd);font-weight:400;font-size:clamp(22px,2.2vw,32px);letter-spacing:-.01em;white-space:nowrap}
.fade-sw{transition:opacity .4s var(--e2),transform .4s var(--e2)}
.fade-sw.out{opacity:0;transform:translateY(8px)}

.plist{margin-top:clamp(52px,6vw,96px);border-top:1px solid var(--rule)}
.pr{display:grid;grid-template-columns:minmax(0,150px) minmax(0,1fr) auto;gap:14px clamp(14px,2.4vw,40px);
  align-items:baseline;padding:clamp(14px,1.8vw,24px) 0;border-bottom:1px solid var(--rule)}
.pr__l{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--wine)}
.pr__n{font-size:clamp(15px,1.1vw,18px)}
.pr__v{font-family:var(--fd);font-size:clamp(20px,2vw,30px);letter-spacing:-.01em;white-space:nowrap;
  transition:transform .55s var(--e),color .5s var(--e)}
.pr:hover .pr__v{transform:translateX(-6px);color:var(--wine)}
.snote{margin-top:clamp(26px,3vw,44px);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:22px 44px;align-items:center}
.snote p{color:var(--mut);max-width:50ch}
.incl{margin-top:clamp(52px,6vw,96px);padding-top:clamp(24px,3vw,42px);border-top:1px solid var(--rule);
  display:grid;grid-template-columns:minmax(0,190px) minmax(0,1fr);gap:clamp(16px,2vw,44px)}
.incl ul{columns:3;column-gap:clamp(20px,3vw,56px)}
.incl li{break-inside:avoid;position:relative;padding-left:22px;margin-bottom:12px;font-size:14.5px;line-height:1.42;color:var(--mut)}
.incl li::before{content:"";position:absolute;left:0;top:9px;width:9px;height:1px;background:var(--wine)}

/* ═══════════════ ПРОЦЕСС ═══════════════ */
.st{display:grid;grid-template-columns:minmax(0,110px) minmax(0,1fr) minmax(0,1.25fr);gap:clamp(12px,2.4vw,46px);
  padding-block:clamp(22px,3vw,44px);border-top:1px solid var(--rule);align-items:start}
.st:last-of-type{border-bottom:1px solid var(--rule)}
.st__n{font-family:var(--fd);font-size:clamp(30px,4vw,62px);line-height:.85;color:var(--wine);opacity:.32}
.st h3{font-family:var(--fd);font-weight:400;font-size:clamp(20px,2vw,32px);line-height:1.1;letter-spacing:-.02em}
.st p{color:var(--mut);max-width:48ch}
.pf{margin-top:clamp(32px,4vw,58px);display:flex;flex-wrap:wrap;gap:20px 48px;justify-content:space-between;align-items:center}
.pf p{max-width:44ch;color:var(--mut)}

/* ═══════════════ ПОЧЕМУ ═══════════════ */
.wy{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,5vw,92px);align-items:start}
.wy__c{position:sticky;top:clamp(92px,15vh,140px)}
.wy__c p{max-width:15ch}
.wy__i{padding-block:clamp(20px,2.4vw,34px);border-top:1px solid var(--rule)}
.wy__i:last-child{border-bottom:1px solid var(--rule)}
.wy__i h3{display:flex;gap:16px;font-size:clamp(16px,1.25vw,20px);font-weight:500;margin-bottom:10px}
.wy__i h3 i{font-style:normal;font-size:11px;letter-spacing:.16em;opacity:.5;padding-top:5px}
.wy__i p{color:var(--mut);padding-left:38px;max-width:46ch}

/* ═══════════════ ОТЗЫВЫ ═══════════════ */
.rv{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:clamp(18px,2.6vw,44px)}
.rv__c{border-top:1px solid var(--rule);padding-top:22px}
.rv__c p{font-family:var(--fd);font-size:clamp(19px,1.5vw,26px);line-height:1.25;margin-bottom:18px}
.rv__w{display:flex;align-items:center;gap:12px}
.rv__w img{width:44px;height:44px;border-radius:50%;object-fit:cover}
.rv__w b{display:block;font-size:14px;font-weight:500}
.rv__w em{font-style:normal;font-size:12px;color:var(--mut)}

/* ═══════════════ FAQ ═══════════════ */
.fq{display:grid;grid-template-columns:minmax(0,.4fr) minmax(0,1.6fr);gap:clamp(22px,4vw,84px);align-items:start}
.ac{border-top:1px solid var(--rule)}
.ac:last-child{border-bottom:1px solid var(--rule)}
.ac__q{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:28px;text-align:left;
  padding:clamp(20px,2.4vw,32px) 0;font-family:var(--fd);font-size:clamp(18px,1.7vw,29px);line-height:1.18;
  letter-spacing:-.015em;transition:color .5s var(--e)}
.ac__q:hover{color:var(--wine)}
.ac__q i{flex:none;position:relative;width:16px;height:16px;margin-top:9px}
.ac__q i::before,.ac__q i::after{content:"";position:absolute;left:0;top:7px;width:16px;height:1px;
  background:var(--wine);transition:transform .6s var(--e)}
.ac__q i::after{transform:rotate(90deg)}
.ac__q[aria-expanded="true"] i::after{transform:rotate(0)}
.ac__a{height:0;overflow:hidden;transition:height .6s var(--e)}
.ac__a p{padding:0 0 clamp(22px,2.4vw,34px);color:var(--mut);max-width:62ch}

/* ═══════════════ ФИНАЛ ═══════════════ */
.fin{position:relative;min-height:clamp(560px,86svh,900px);display:flex;align-items:center;
  overflow:hidden;background:var(--night);color:#F2EEE9;text-align:center}
.fin__bg{position:absolute;inset:-6% 0}
.fin__bg .img,.fin__bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.fin__scrim{position:absolute;inset:0;background:linear-gradient(to top,rgba(20,17,15,.86),rgba(20,17,15,.4) 48%,rgba(20,17,15,.72))}
.fin .wrap{position:relative;z-index:2}
.fin h2{margin:18px auto 22px;max-width:16ch}
.fin h2 em{color:var(--rose)}
.fin p{color:rgba(242,238,233,.66);max-width:42ch;margin:0 auto clamp(30px,4vw,48px)}
.fin__ch{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 32px;margin-top:32px}
.fin__ch a{font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:rgba(242,238,233,.6);transition:color .4s}
.fin__ch a:hover{color:#F2EEE9}

/* ═══════════════ ПОДВАЛ ═══════════════ */
.ftr{padding-block:clamp(44px,5vw,78px)}
.ftr__g{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(22px,3vw,54px)}
.ftr__g h4{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--mut);margin-bottom:14px}
.ftr p,.ftr li{font-size:13.5px;color:var(--mut);line-height:1.75}
.ftr .bnd{font-size:21px;margin-bottom:12px;display:block}
.ftr a{transition:color .4s}.ftr a:hover{color:var(--fg)}
.ftr__bt{margin-top:clamp(34px,4vw,60px);padding-top:20px;border-top:1px solid var(--rule);
  display:flex;flex-wrap:wrap;gap:10px 26px;justify-content:space-between;font-size:12px;color:var(--mut)}

/* ═══════════════ МОДАЛКА ═══════════════ */
.md{position:fixed;inset:0;z-index:90}
.md[hidden]{display:none}
.md__bd{position:absolute;inset:0;background:rgba(20,17,15,.62);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);
  opacity:0;transition:opacity .6s var(--e)}
.md__p{position:absolute;top:0;right:0;bottom:0;width:min(860px,100%);background:var(--cream);color:var(--ink);
  overflow-y:auto;overscroll-behavior:contain;padding:clamp(54px,5vw,88px) clamp(20px,3.6vw,68px) clamp(40px,5vw,76px);
  transform:translateX(100%);transition:transform .85s var(--e)}
.md.open .md__bd{opacity:1}
.md.open .md__p{transform:none}
.md__x{position:fixed;top:16px;right:16px;z-index:3;width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(37,37,37,.16);display:flex;align-items:center;justify-content:center;font-size:18px;
  background:var(--cream);transition:background .45s,color .45s,transform .6s var(--e)}
.md__x:hover{background:var(--wine);color:#fff;border-color:var(--wine);transform:rotate(90deg)}
.md__t{font-family:var(--fd);font-size:clamp(32px,4.4vw,64px);line-height:1;letter-spacing:-.025em;margin:12px 0 18px}
.md__d{font-size:clamp(16px,1.1vw,19px);color:rgba(37,37,37,.62);max-width:46ch}
.md__s{margin-top:clamp(26px,3vw,44px);padding-top:22px;border-top:1px solid rgba(37,37,37,.14)}
.md__s h4{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:rgba(37,37,37,.44);margin-bottom:12px}
.md__s p{color:rgba(37,37,37,.82);max-width:54ch}
.md__s li{position:relative;padding-left:22px;margin-bottom:9px;color:rgba(37,37,37,.82);font-size:15px;line-height:1.45}
.md__s li::before{content:"";position:absolute;left:0;top:10px;width:9px;height:1px;background:var(--wine)}
.md__vid{position:relative;aspect-ratio:1/1;max-width:480px;margin:0 auto;overflow:hidden;background:var(--night2)}
.md__vid video{width:100%;height:100%;object-fit:cover;display:block}
.md__gal{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.md__gal figure{margin:0}
.md__gal img{width:100%;aspect-ratio:16/10;object-fit:cover}
.md__gal .img{aspect-ratio:16/10}
.md__gal figcaption{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:rgba(37,37,37,.44);margin-top:8px}
.md__e{border:1px dashed rgba(37,37,37,.18);padding:30px;text-align:center;font-size:12px;
  letter-spacing:.14em;text-transform:uppercase;color:rgba(37,37,37,.4)}

/* ═══════════════ АНИМАЦИИ ═══════════════ */
.rl{display:block;overflow:hidden}
.rl>span{display:block;transition:transform 1.05s var(--e)}
.anim .rl>span{transform:translateY(105%)}
.rl.in>span{transform:none}
.fu{transition:opacity 1s var(--e),transform 1s var(--e)}
.anim .fu{opacity:0;transform:translateY(26px)}
.fu.in{opacity:1;transform:none}
.mk{transition:clip-path 1.25s var(--e)}
.anim .mk{clip-path:inset(0 0 100% 0)}
.mk.in{clip-path:inset(0 0 0 0)}
.mk>img,.mk>.img,.mk>picture>img{transition:transform 1.7s var(--e)}
.anim .mk>img,.anim .mk>.img,.anim .mk>picture>img{transform:scale(1.14)}
.mk.in>img,.mk.in>.img,.mk.in>picture>img{transform:scale(1)}
[data-par]{will-change:transform}
.doc__body{max-width:68ch}
.doc__body h4{font-family:var(--fd);font-size:clamp(17px,1.4vw,22px);font-weight:400;letter-spacing:-.01em;margin:clamp(24px,2.4vw,34px) 0 10px;color:var(--ink)}
.doc__body p{font-size:15.5px;line-height:1.62;color:rgba(37,37,37,.8);margin-bottom:12px}
.doc__body li{position:relative;padding-left:22px;margin-bottom:9px;font-size:15px;line-height:1.5;color:rgba(37,37,37,.8)}
.doc__body li::before{content:"";position:absolute;left:0;top:10px;width:9px;height:1px;background:var(--wine)}
.doc__body b{font-weight:600;color:var(--ink)}
.doc__meta{margin-top:clamp(28px,3vw,44px);padding-top:20px;border-top:1px solid rgba(37,37,37,.14);font-size:12.5px;color:rgba(37,37,37,.5)}
.ck{
  position:fixed;bottom:clamp(16px,2vw,28px);left:50%;transform:translateX(-50%);z-index:80;
  width:min(680px,calc(100% - 32px));background:var(--night);color:#F2EEE9;border-radius:3px;
  padding:clamp(14px,2vw,20px) clamp(16px,2.4vw,28px);
  display:flex;align-items:center;gap:clamp(14px,2vw,28px);flex-wrap:wrap;
  box-shadow:0 8px 40px rgba(0,0,0,.36);transition:opacity .6s var(--e),transform .6s var(--e);
}
.ck.gone{opacity:0;transform:translateX(-50%) translateY(14px);pointer-events:none}
.ck p{font-size:13.5px;line-height:1.5;color:rgba(242,238,233,.78);flex:1;min-width:200px;margin:0}
.ck p a{color:var(--rose);border-bottom:1px solid rgba(232,216,220,.4);transition:border-color .3s}
.ck p a:hover{border-bottom-color:var(--rose)}
.ck button{flex:none;min-height:42px;padding:10px 24px;border-radius:40px;
  background:var(--wine);color:#FBF7F5;font-size:13px;font-weight:500;letter-spacing:.06em;
  border:0;cursor:pointer;transition:background .4s var(--e)}
.ck button:hover{background:#632637}
.cur{position:fixed;top:0;left:0;z-index:95;width:100px;height:100px;margin:-50px 0 0 -50px;border-radius:50%;
  background:var(--wine);color:#FBF7F5;display:flex;align-items:center;justify-content:center;pointer-events:none;
  font-size:10px;font-weight:500;letter-spacing:.16em;text-transform:uppercase;text-align:center;
  opacity:0;transform:scale(0);transition:opacity .4s,transform .55s var(--e)}
.cur.on{opacity:1;transform:scale(1)}
@media(hover:none),(pointer:coarse){.cur{display:none}}

/* ═══════════════ АДАПТИВ ═══════════════ */
@media(max-width:1100px){.incl ul{columns:2}.ftr__g{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){
  .nav,.hdr .btn{display:none}.brg{display:flex}
  .hero__in{padding-top:110px}
  .hero__row{flex-direction:column;align-items:flex-start}
  .hero__side{align-items:flex-start;text-align:left}
  .ab{grid-template-columns:1fr;gap:28px}
  .ab__stack{max-width:440px}
  .scale{grid-template-columns:1fr;gap:26px}
  .scale__vis{order:-1;aspect-ratio:16/10}
  .pr{grid-template-columns:minmax(0,1fr) auto;gap:6px 20px}
  .pr__l{grid-column:1/-1}
  .incl{grid-template-columns:1fr;gap:18px}
  .feat__low{grid-template-columns:1fr}
  .st{grid-template-columns:minmax(0,58px) minmax(0,1fr);gap:10px 18px}
  .st p{grid-column:2}
  .wy{grid-template-columns:1fr;gap:24px}.wy__c{position:static}.wy__c p{max-width:22ch}
  .fq{grid-template-columns:1fr;gap:18px}
  .cr{grid-template-columns:44px minmax(0,1fr);gap:8px 14px}
  .cr__m{grid-column:2;font-size:10.5px}
}
@media(max-width:640px){
  .incl ul{columns:1}
  .md__p{width:100%;padding-top:78px}
  .md__gal{grid-template-columns:1fr}
  .ftr__g{grid-template-columns:1fr}
  .btn{width:100%}
  .hero__cta .btn,.pf .btn,.snote .btn,.fin .btn{width:auto;flex:1 1 220px}
  .snote{grid-template-columns:1fr}
  .stats{gap:18px 26px}
  .ab__p1{width:100%}.ab__p2{width:52%;margin-top:-22%}
}
@media(prefers-reduced-motion:reduce){
  html:focus-within{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .rl>span{transform:none!important}.fu{opacity:1!important;transform:none!important}.mk{clip-path:none!important}
  .cur,.prev{display:none}
}
