/* ==========================================================================
   NOVOWEB — стили сайта
   Светлая монохромная база, крупный гротеск Onest, зелёный — только акцент.
   ========================================================================== */

/* ---------- Шрифт (локально, без Google Fonts — RGPD) ---------- */
@font-face{font-family:"Onest";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-cyrillic-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0460-052F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}
@font-face{font-family:"Onest";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-cyrillic-wght-normal.woff2) format("woff2-variations");unicode-range:U+0301,U+0400-045F,U+0490-0491,U+04B0-04B1,U+2116}
@font-face{font-family:"Onest";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-latin-ext-wght-normal.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Onest";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/onest-latin-wght-normal.woff2) format("woff2-variations");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}

/* ---------- Токены ---------- */
:root{
  --bg:#fdfdfc;
  --panel:#f3f3f1;
  --panel-2:#eaeae7;
  --line:#e2e2de;
  --ink:#121212;
  --ink-2:#55554f;
  --ink-3:#86867f;
  --dark:#111111;
  --accent:#3faf7c;
  --r-xl:28px; --r-lg:18px; --r-md:12px; --r-btn:10px;
  --gut:clamp(16px,2.4vw,36px);
  --max:1440px;
  --ease:cubic-bezier(.22,.61,.36,1);
  --font:"Onest",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.5 var(--font);-webkit-font-smoothing:antialiased;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
h1,h2,h3,h4,h5,h6{margin:0;font-weight:600;letter-spacing:-.04em;line-height:1.04;text-wrap:balance}
p{margin:0}
ul,ol{list-style:none;margin:0;padding:0}
::selection{background:var(--ink);color:#fff}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ---------- Сетка ---------- */
.wrap{width:100%;max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.band{margin-left:var(--gut);margin-right:var(--gut);border-radius:var(--r-xl)}
.sec{padding-block:clamp(72px,9vw,140px)}
.sec--tight{padding-block:clamp(48px,6vw,90px)}
.sec--top0{padding-top:0}
.panel{background:var(--panel)}

/* ---------- Типографика ---------- */
.label{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2)}
.label::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--accent)}
.on-dark .label{color:rgba(255,255,255,.65)}
.h1{font-size:clamp(46px,7.4vw,124px);letter-spacing:-.055em;line-height:.96;font-weight:600}
.h2{font-size:clamp(36px,4.8vw,76px);letter-spacing:-.05em;line-height:1}
.h3{font-size:clamp(26px,2.6vw,40px);letter-spacing:-.04em;line-height:1.08}
.h4{font-size:clamp(21px,1.7vw,26px);letter-spacing:-.035em;line-height:1.15}
.lead{font-size:clamp(18px,1.45vw,22px);line-height:1.45;letter-spacing:-.01em;color:var(--ink-2);max-width:620px}
.on-dark .lead{color:rgba(255,255,255,.68)}
.muted{color:var(--ink-2)}
.sec-head{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end;margin-bottom:clamp(36px,5vw,72px)}
.sec-head .label{margin-bottom:22px}
.sec-head__side{display:flex;flex-direction:column;align-items:flex-start;gap:24px}

/* ==========================================================================
   КНОПКИ — прямоугольные, мягкий радиус, «перекат» букв и стрелка в квадрате
   ========================================================================== */
.btn{--h:58px;position:relative;display:inline-flex;align-items:center;gap:18px;height:var(--h);padding:0 9px 0 24px;border-radius:var(--r-btn);background:var(--ink);color:#fff;font-size:16px;font-weight:500;letter-spacing:-.01em;white-space:nowrap;isolation:isolate;overflow:hidden;transition:background .35s var(--ease),color .35s var(--ease),box-shadow .35s var(--ease)}
.btn__t{display:inline-flex;overflow:hidden;line-height:1.25;height:1.25em}
.btn__t .c{display:inline-block;white-space:pre;text-shadow:0 1.25em 0 currentColor;transition:transform .5s var(--ease);transition-delay:calc(var(--i,0) * 12ms)}
.btn:hover .btn__t .c,.btn:focus-visible .btn__t .c{transform:translateY(-1.25em)}
.btn__i{width:40px;height:40px;flex:none;border-radius:7px;background:rgba(255,255,255,.12);display:grid;place-items:center;overflow:hidden;transition:background .35s var(--ease)}
.btn__i svg{width:16px;height:16px;transition:transform .45s var(--ease)}
.btn:hover .btn__i{background:var(--accent)}
.btn:hover .btn__i svg{animation:arr .55s var(--ease)}
@keyframes arr{0%{transform:none}45%{transform:translate(140%,-140%)}46%{transform:translate(-140%,140%)}100%{transform:none}}
.btn--line{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink)}
.btn--line .btn__i{background:var(--ink);color:#fff}
.btn--line:hover{background:var(--ink);color:#fff}
.btn--line:hover .btn__i{background:var(--accent)}
.btn--white{background:#fff;color:var(--ink)}
.btn--white .btn__i{background:var(--ink);color:#fff}
.btn--white:hover .btn__i{background:var(--accent)}
.btn--sm{--h:48px;font-size:15px;padding:0 7px 0 18px;gap:14px}
.btn--sm .btn__i{width:34px;height:34px}
.btn--block{width:100%;justify-content:space-between}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* текстовая ссылка */
.link{display:inline-flex;align-items:center;gap:10px;font-weight:500;font-size:16px;padding-bottom:4px;background:linear-gradient(currentColor,currentColor) 0 100%/100% 1.5px no-repeat;transition:background-size .45s var(--ease)}
.link:hover{background-size:0 1.5px;background-position:100% 100%}
.link svg{width:14px;height:14px;transition:transform .4s var(--ease)}
.link:hover svg{transform:translate(3px,-3px)}

/* метки-чипсы */
.chip{display:inline-flex;align-items:center;height:36px;padding:0 15px;border-radius:8px;background:var(--panel);font-size:14px;font-weight:500;color:var(--ink)}
.chips{display:flex;flex-wrap:wrap;gap:8px}

/* ==========================================================================
   ШАПКА
   ========================================================================== */
.header{position:fixed;top:0;left:0;right:0;z-index:60;padding:14px var(--gut);padding-top:calc(14px + env(safe-area-inset-top,0px));transition:transform .45s var(--ease),background .35s,box-shadow .35s}
.header.is-solid{background:rgba(253,253,252,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--line)}
.header.is-hidden{transform:translateY(-110%)}
.header__in{max-width:calc(var(--max) - 2*var(--gut));margin:0 auto;display:flex;align-items:center;gap:28px}
.logo{display:inline-flex;align-items:baseline;font-size:24px;font-weight:650;letter-spacing:-.06em}
.logo b{color:var(--accent);font-weight:650}
.nav{display:flex;align-items:center;gap:6px;margin-left:auto}
.nav > a,.nav__dd > a{height:44px;display:inline-flex;align-items:center;gap:6px;padding:0 14px;border-radius:8px;font-size:15px;font-weight:500;transition:background .25s}
.nav > a:hover,.nav__dd > a:hover,.nav__dd:focus-within > button{background:var(--panel)}
.nav > a.is-active{background:var(--panel)}
.nav__dd{position:relative}
.nav__dd > a svg{width:10px;height:10px;transition:transform .3s}
.nav__dd:hover > button svg,.nav__dd:focus-within > button svg{transform:rotate(180deg)}
.dd{position:absolute;top:calc(100% + 8px);left:-12px;width:340px;padding:8px;border-radius:14px;background:#fff;box-shadow:0 20px 60px rgba(0,0,0,.12),0 0 0 1px var(--line);opacity:0;visibility:hidden;transform:translateY(6px);transition:.3s var(--ease)}
.nav__dd:hover .dd,.nav__dd:focus-within .dd{opacity:1;visibility:visible;transform:none}
.dd::before{content:"";position:absolute;inset:-12px 0 auto;height:12px}
.dd a{display:flex;justify-content:space-between;gap:12px;padding:12px 14px;border-radius:9px;font-size:15px;font-weight:500;transition:background .2s}
.dd a span{font-size:13px;font-weight:400;color:var(--ink-3)}
.dd a:hover{background:var(--panel)}
.header__right{display:flex;align-items:center;gap:10px}
.header__cloud{font-size:14px;font-weight:500;color:var(--ink-2);padding:0 8px;transition:color .25s}
.header__cloud:hover{color:var(--ink)}
.burger{display:none;width:48px;height:48px;border-radius:var(--r-btn);background:var(--panel);place-items:center}
.burger i{display:block;width:18px;height:1.6px;background:var(--ink);position:relative;transition:.3s}
.burger i::before,.burger i::after{content:"";position:absolute;left:0;width:18px;height:1.6px;background:var(--ink);transition:.3s}
.burger i::before{top:-6px}.burger i::after{top:6px}
.menu-open .burger i{background:transparent}
.menu-open .burger i::before{top:0;transform:rotate(45deg)}
.menu-open .burger i::after{top:0;transform:rotate(-45deg)}

/* мобильное меню */
.mnav{position:fixed;inset:0;z-index:55;background:var(--bg);padding:calc(96px + env(safe-area-inset-top,0px)) var(--gut) 30px;display:flex;flex-direction:column;gap:30px;overflow:auto;opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
.menu-open .mnav{opacity:1;visibility:visible}
.mnav__links a{display:flex;justify-content:space-between;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);font-size:26px;font-weight:550;letter-spacing:-.04em}
.mnav__links a small{font-size:13px;font-weight:400;color:var(--ink-3);letter-spacing:0}
.mnav__sub a{font-size:19px;padding-left:16px}

/* ==========================================================================
   HERO (главная)
   ========================================================================== */
.hero{padding-top:calc(118px + env(safe-area-inset-top,0px))}
.hero__meta{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:14px;color:var(--ink-2);padding-bottom:22px;border-bottom:1px solid var(--line);margin-bottom:clamp(30px,4.5vw,64px)}
.hero__meta b{color:var(--ink);font-weight:550}
.hero__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:clamp(30px,5vw,90px);align-items:end}
.hero__side{display:flex;flex-direction:column;gap:28px;padding-bottom:10px}
.hero__side .lead{font-size:19px}
.hero__photo{position:relative;margin:clamp(40px,5vw,72px) var(--gut) 0;border-radius:var(--r-xl);overflow:hidden;aspect-ratio:21/9;background:var(--panel-2)}
.hero__photo img{width:100%;height:100%;object-fit:cover;transform:scale(1.08);transition:transform 1.8s var(--ease)}
.hero__photo.is-in img{transform:scale(1)}
.facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin:0 var(--gut);border-bottom:1px solid var(--line)}
.fact{padding:clamp(22px,2.6vw,36px) clamp(12px,1.6vw,24px) clamp(22px,2.6vw,36px) 0;display:flex;flex-direction:column;gap:8px;border-right:1px solid var(--line)}
.fact + .fact{padding-left:clamp(14px,2vw,30px)}
.fact:last-child{border-right:0}
.fact strong{font-size:clamp(40px,4.4vw,68px);font-weight:550;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
.fact span{font-size:15px;color:var(--ink-2)}

/* ==========================================================================
   «ЧТО МЫ ДЕЛАЕМ» — список-переключатель
   ========================================================================== */
.sx{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,70px);align-items:start}
.sx-item{border-top:1px solid var(--line)}
.sx-item:last-child{border-bottom:1px solid var(--line)}
.sx-btn{width:100%;display:grid;grid-template-columns:52px minmax(0,1fr) 44px;gap:12px;align-items:center;padding:clamp(18px,2vw,28px) 0;text-align:left;color:var(--ink-3);transition:color .35s}
.sx-btn small{font-size:14px;font-weight:500;align-self:start;padding-top:.7em;color:var(--ink-2)}
.sx-btn strong{font-size:clamp(30px,3.6vw,58px);font-weight:550;letter-spacing:-.05em;line-height:1;transition:transform .5s var(--ease)}
.sx-btn em{width:44px;height:44px;border-radius:9px;display:grid;place-items:center;font-style:normal;background:var(--panel);color:var(--ink);transition:.35s var(--ease)}
.sx-btn em svg{width:15px;height:15px}
.sx-btn:hover{color:var(--ink-2)}
.sx-item.is-on .sx-btn{color:var(--ink)}
.sx-item.is-on .sx-btn strong{transform:translateX(10px)}
.sx-item.is-on .sx-btn em{background:var(--ink);color:#fff}
.sx-mob{display:none}
.sx-card{position:sticky;top:100px;background:var(--panel);border-radius:var(--r-xl);padding:12px}
.sx-card__img{position:relative;border-radius:20px;overflow:hidden;aspect-ratio:4/3;background:var(--panel-2)}
.sx-card__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:clip-path .9s var(--ease),transform 1.4s var(--ease)}
.sx-card__img img.enter{clip-path:inset(0 0 100% 0);transform:scale(1.08)}
.sx-card__img img.on{clip-path:inset(0);transform:scale(1)}
.sx-card__num{position:absolute;top:14px;left:14px;z-index:2;background:rgba(253,253,252,.94);border-radius:7px;padding:6px 10px;font-size:13px;font-weight:600}
.sx-card__body{padding:24px 14px 14px;display:flex;flex-direction:column;gap:20px;transition:opacity .3s}
.sx-card__body.fade{opacity:0}
.sx-card__body p{font-size:18px;line-height:1.45;letter-spacing:-.01em}
.sx-card__body .chip{background:#fff}

/* ==========================================================================
   ТЁМНЫЙ БЛОК
   ========================================================================== */
.ink{position:relative;isolation:isolate;background:linear-gradient(180deg,#1a1a1a 0%,#0e0e0e 100%);color:#fff;overflow:hidden}
.ink::after{content:"novoweb.";position:absolute;right:-.03em;bottom:-.25em;z-index:-1;font-size:clamp(140px,22vw,360px);font-weight:650;letter-spacing:-.07em;line-height:1;color:rgba(255,255,255,.032);pointer-events:none;white-space:nowrap}
.ink--plain::after{content:none}
.about{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,380px);gap:clamp(30px,4vw,70px);align-items:end;padding:clamp(30px,4.5vw,70px)}
.about h2{margin:22px 0 26px;max-width:860px}
.values{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:clamp(36px,4vw,56px);padding-top:28px;border-top:1px solid rgba(255,255,255,.14)}
.values b{display:block;font-size:19px;font-weight:550;letter-spacing:-.02em;margin-bottom:8px}
.values p{font-size:15px;color:rgba(255,255,255,.6)}
.offer{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:28px;display:flex;flex-direction:column;gap:14px}
.offer__tag{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.offer h3{font-size:26px;letter-spacing:-.04em}
.offer p{font-size:15px;color:var(--ink-2);margin-bottom:8px}

/* ==========================================================================
   ПРЕИМУЩЕСТВА
   ========================================================================== */
.why{padding:clamp(30px,4.5vw,70px)}
.why__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.why__item{background:#fff;border-radius:var(--r-lg);padding:30px;display:flex;flex-direction:column;gap:12px;min-height:220px;transition:background .4s var(--ease),color .4s var(--ease)}
.why__item b{font-size:clamp(22px,1.9vw,28px);font-weight:600;letter-spacing:-.04em;line-height:1.1;margin-bottom:auto}
.why__item p{font-size:16px;color:var(--ink-2);transition:color .4s}
.why__item:hover{background:var(--ink);color:#fff}
.why__item:hover p{color:rgba(255,255,255,.65)}

/* ==========================================================================
   ПРОЕКТЫ
   ========================================================================== */
.works{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(14px,1.4vw,20px)}
.work{grid-column:span 6;display:flex;flex-direction:column;gap:16px}
.work--7{grid-column:span 7}.work--5{grid-column:span 5}.work--4{grid-column:span 4}
.work__img{position:relative;display:block;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:4/3;background:var(--panel-2)}
.work--7 .work__img,.work--5 .work__img{aspect-ratio:auto;height:clamp(300px,34vw,520px)}
.work__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.work:hover .work__img img{transform:scale(1.045)}
.work__go{position:absolute;right:16px;bottom:16px;height:44px;padding:0 16px;border-radius:9px;background:#fff;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:500;transform:translateY(10px);opacity:0;transition:.45s var(--ease)}
.work__go svg{width:13px;height:13px}
.work:hover .work__go,.work:focus-within .work__go{transform:none;opacity:1}
.work__meta{display:flex;justify-content:space-between;align-items:flex-start;gap:20px}
.work__meta h3{font-size:clamp(22px,1.8vw,28px);letter-spacing:-.04em}
.work__meta p{font-size:15px;color:var(--ink-2);margin-top:6px;max-width:460px}
.work__tags{display:flex;flex-wrap:wrap;gap:6px;justify-content:flex-end}
.work__tags span{font-size:13px;font-weight:500;padding:5px 10px;border-radius:7px;background:var(--panel);white-space:nowrap}
.filter{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:34px}
.filter button{height:44px;padding:0 18px;border-radius:9px;font-size:15px;font-weight:500;box-shadow:inset 0 0 0 1px var(--line);transition:.25s}
.filter button:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.filter button.is-on{background:var(--ink);color:#fff;box-shadow:none}
.work.is-off{display:none}

/* ==========================================================================
   КАК РАБОТАЕМ — раскрывающиеся колонки
   ========================================================================== */
.flow{display:flex;gap:10px;height:clamp(440px,38vw,520px)}
.flow__col{position:relative;flex:1 1 0;min-width:0;border-radius:var(--r-lg);background:var(--panel);padding:26px;display:flex;flex-direction:column;overflow:hidden;cursor:pointer;text-align:left;transition:flex-grow .7s var(--ease),background .5s var(--ease),color .5s var(--ease)}
.flow__col.is-on{flex-grow:3.6;background:var(--ink);color:#fff;cursor:default}
.flow__top{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.flow__n{font-size:clamp(44px,4.4vw,72px);font-weight:550;letter-spacing:-.06em;line-height:.9;font-variant-numeric:tabular-nums}
.flow__time{font-size:13px;font-weight:500;padding:6px 10px;border-radius:7px;background:#fff;color:var(--ink);white-space:nowrap;opacity:0;transition:opacity .4s}
.flow__col.is-on .flow__time{opacity:1;background:rgba(255,255,255,.12);color:#fff}
.flow__v{position:absolute;left:26px;bottom:26px;writing-mode:vertical-rl;transform:rotate(180deg);font-size:21px;font-weight:550;letter-spacing:-.03em;white-space:nowrap;transition:opacity .35s}
.flow__col.is-on .flow__v{opacity:0}
.flow__body{margin-top:auto;display:flex;flex-direction:column;gap:16px;max-width:520px;opacity:0;transform:translateY(16px);transition:opacity .3s,transform .5s var(--ease);pointer-events:none;min-width:300px}
.flow__col.is-on .flow__body{opacity:1;transform:none;transition-delay:.25s;pointer-events:auto}
.flow__body h3{font-size:clamp(28px,2.6vw,40px);letter-spacing:-.045em}
.flow__body p{font-size:17px;color:rgba(255,255,255,.7)}
.flow__res{display:flex;gap:10px;align-items:baseline;padding-top:16px;border-top:1px solid rgba(255,255,255,.15);font-size:15px}
.flow__res span{color:rgba(255,255,255,.5);flex:none}
.flow__bar{position:absolute;left:0;right:0;bottom:0;height:3px;background:rgba(255,255,255,.08)}
.flow__bar i{display:block;height:100%;width:0;background:var(--accent)}
.flow__col.is-on .flow__bar i{animation:bar var(--dur,6s) linear forwards}
.flow.is-paused .flow__bar i{animation-play-state:paused}
@keyframes bar{to{width:100%}}

/* ==========================================================================
   ФОРМАТЫ
   ========================================================================== */
.fmt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.fmt__card{background:var(--panel);border-radius:var(--r-xl);padding:clamp(26px,2.6vw,40px);display:flex;flex-direction:column;gap:16px;transition:transform .45s var(--ease)}
.fmt__card:hover{transform:translateY(-6px)}
.fmt__card h3{font-size:clamp(28px,2.6vw,40px);letter-spacing:-.045em}
.fmt__card > p{font-size:17px;color:var(--ink-2)}
.fmt__card.ink > p{color:rgba(255,255,255,.65)}
.fmt__card ul{margin-bottom:auto;padding-top:6px}
.fmt__card li{padding:13px 0;border-bottom:1px solid var(--line);font-size:16px;font-weight:500}
.fmt__card.ink li{border-color:rgba(255,255,255,.12)}
.fmt__card .btn{margin-top:18px}
.fmt__card.ink::after{font-size:150px}

/* ==========================================================================
   БЛОГ
   ========================================================================== */
.posts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2vw,28px)}
.post{display:flex;flex-direction:column;gap:14px}
.post__img{display:block;border-radius:var(--r-lg);overflow:hidden;aspect-ratio:3/2;background:var(--panel-2)}
.post__img img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.post:hover .post__img img{transform:scale(1.05)}
.post__meta{display:flex;gap:12px;font-size:14px;color:var(--ink-2)}
.post h3{font-size:clamp(21px,1.7vw,25px);line-height:1.2;letter-spacing:-.035em;transition:color .3s}
.post:hover h3{color:var(--ink-2)}
.post p{font-size:16px;color:var(--ink-2)}
.posts--list{grid-template-columns:repeat(2,minmax(0,1fr))}
.posts--list .post:first-child{grid-column:1/-1;display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(20px,3vw,48px);align-items:center}
.posts--list .post:first-child h3{font-size:clamp(28px,2.8vw,44px);line-height:1.08}

/* статья */
.article{max-width:760px;margin:0 auto}
.article__cover{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:21/10;margin:clamp(30px,4vw,56px) var(--gut);background:var(--panel-2)}
.article__cover img{width:100%;height:100%;object-fit:cover}
.prose{font-size:19px;line-height:1.65}
.prose > * + *{margin-top:1.1em}
.prose h2{font-size:clamp(26px,2.4vw,34px);letter-spacing:-.04em;line-height:1.15;margin-top:1.8em}
.prose ul{padding-left:0}
.prose li{position:relative;padding-left:26px;margin-top:.5em}
.prose li::before{content:"";position:absolute;left:4px;top:.68em;width:8px;height:8px;border-radius:2px;background:var(--accent)}
.prose strong{font-weight:600}
.prose .note{padding:24px 26px;border-radius:var(--r-lg);background:var(--panel);font-size:17px}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr);gap:clamp(30px,5vw,80px)}
.acc__item{border-bottom:1px solid var(--line)}
.acc__item:first-child{border-top:1px solid var(--line)}
.acc__q{width:100%;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;text-align:left;font-size:clamp(19px,1.6vw,23px);font-weight:550;letter-spacing:-.03em}
.acc__q i{position:relative;flex:none;width:40px;height:40px;border-radius:9px;background:var(--panel);transition:background .3s}
.acc__q i::before,.acc__q i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:1.6px;background:currentColor;transform:translate(-50%,-50%);transition:transform .4s var(--ease)}
.acc__q i::after{transform:translate(-50%,-50%) rotate(90deg)}
.acc__item.is-open .acc__q i{background:var(--ink);color:#fff}
.acc__item.is-open .acc__q i::after{transform:translate(-50%,-50%) rotate(0)}
.acc__a{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
.acc__a > div{overflow:hidden}
.acc__a p{padding-bottom:26px;color:var(--ink-2);max-width:640px}
.acc__item.is-open .acc__a{grid-template-rows:1fr}

/* ==========================================================================
   CTA + ФОРМЫ
   ========================================================================== */
.cta{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,90px);padding:clamp(32px,5vw,80px);align-items:center}
.cta h2{font-size:clamp(44px,6vw,96px);letter-spacing:-.055em;line-height:.98;margin-top:22px}
.cta .lead{margin-top:24px}
.cta__mail{display:inline-block;margin-top:30px;font-size:clamp(20px,1.8vw,26px);font-weight:500;letter-spacing:-.03em;border-bottom:1.5px solid rgba(255,255,255,.3);transition:border-color .3s}
.cta__mail:hover{border-color:#fff}

.form{display:flex;flex-direction:column;gap:20px}
.form__label{font-size:14px;font-weight:500;color:var(--ink-2)}
.on-dark .form__label{color:rgba(255,255,255,.6)}
.choice{display:flex;flex-wrap:wrap;gap:8px}
.choice button{height:44px;padding:0 16px;border-radius:9px;font-size:15px;font-weight:500;box-shadow:inset 0 0 0 1px var(--line);transition:.25s}
.choice button:hover{box-shadow:inset 0 0 0 1px var(--ink)}
.choice button.is-on{background:var(--ink);color:#fff;box-shadow:none}
.on-dark .choice button{box-shadow:inset 0 0 0 1px rgba(255,255,255,.22)}
.on-dark .choice button:hover{box-shadow:inset 0 0 0 1px #fff}
.on-dark .choice button.is-on{background:#fff;color:var(--ink)}
.field{position:relative}
.field input,.field textarea{width:100%;border:0;border-bottom:1.5px solid var(--line);border-radius:0;background:transparent;padding:24px 0 12px;font:inherit;font-size:18px;color:inherit;outline:0;transition:border-color .3s;resize:vertical}
.field textarea{min-height:96px}
.field label{position:absolute;left:0;top:22px;font-size:18px;color:var(--ink-3);pointer-events:none;transition:.25s var(--ease)}
.field input:focus,.field textarea:focus{border-color:var(--ink)}
.field input:focus + label,.field input:not(:placeholder-shown) + label,.field textarea:focus + label,.field textarea:not(:placeholder-shown) + label{top:0;font-size:13px}
.on-dark .field input,.on-dark .field textarea{border-color:rgba(255,255,255,.2)}
.on-dark .field input:focus,.on-dark .field textarea:focus{border-color:#fff}
.on-dark .field label{color:rgba(255,255,255,.5)}
.field.is-bad input{border-color:#d4553a}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.form__foot{display:flex;align-items:center;gap:22px;flex-wrap:wrap;margin-top:8px}
.form__note{font-size:13px;color:var(--ink-3);max-width:300px}
.form__note a{text-decoration:underline}
.on-dark .form__note{color:rgba(255,255,255,.45)}
.form__err{display:none;font-size:15px;color:#d4553a}
.form.is-error .form__err{display:block}
.form.is-busy .btn{opacity:.6;pointer-events:none}
.form__ok{display:none}
.form.is-sent > *:not(.form__ok){display:none}
.form.is-sent .form__ok{display:flex;flex-direction:column;gap:12px;padding:20px 0}
.form__ok h3{font-size:clamp(30px,3vw,44px);letter-spacing:-.045em}

/* модалка */
.modal{position:fixed;inset:0;z-index:90;display:grid;place-items:center;padding:16px;background:rgba(18,18,18,.45);opacity:0;visibility:hidden;transition:.35s}
.modal.is-open{opacity:1;visibility:visible}
.modal__box{position:relative;width:min(560px,100%);max-height:calc(100dvh - 32px);overflow:auto;background:var(--bg);border-radius:22px;padding:clamp(26px,4vw,44px);transform:translateY(24px) scale(.98);transition:transform .5s var(--ease)}
.modal.is-open .modal__box{transform:none}
.modal__x{position:absolute;top:18px;right:18px;width:44px;height:44px;border-radius:9px;background:var(--panel)}
.modal__x::before,.modal__x::after{content:"";position:absolute;left:50%;top:50%;width:16px;height:1.6px;background:var(--ink);transform:translate(-50%,-50%) rotate(45deg)}
.modal__x::after{transform:translate(-50%,-50%) rotate(-45deg)}
.modal__box h2{font-size:clamp(30px,3vw,40px);letter-spacing:-.045em;margin:16px 60px 26px 0}

/* ==========================================================================
   ФУТЕР
   ========================================================================== */
.footer{background:var(--dark);color:#fff;margin-top:clamp(60px,8vw,120px);padding-top:clamp(50px,6vw,90px);overflow:hidden}
.footer__grid{display:grid;grid-template-columns:1.4fr repeat(3,minmax(0,1fr));gap:30px;padding-bottom:50px}
.footer__about p{margin:16px 0 26px;color:rgba(255,255,255,.55);max-width:300px;font-size:16px}
.footer h4{font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:18px}
.footer li{margin-bottom:10px}
.footer li a{font-size:16px;transition:color .3s}
.footer li a:hover{color:var(--accent)}
.footer__bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid rgba(255,255,255,.12);padding:22px 0;font-size:14px;color:rgba(255,255,255,.5)}
.footer__bottom nav{display:flex;gap:20px;flex-wrap:wrap}
.footer__bottom a:hover{color:#fff}
.footer__giant{display:block;font-size:clamp(80px,19vw,310px);font-weight:650;letter-spacing:-.075em;line-height:.78;white-space:nowrap;transform:translateY(14%);user-select:none}
.footer__giant b{color:var(--accent);font-weight:650}

.float{position:fixed;right:calc(var(--gut) + env(safe-area-inset-right,0px));bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:40;display:flex;flex-direction:column;gap:10px;align-items:flex-end}
.float button{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;background:var(--ink);color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.18);transition:transform .3s var(--ease),opacity .3s,background .3s}
.float button:hover{transform:translateY(-3px)}
.float svg{width:20px;height:20px}
.float .to-top{background:#fff;color:var(--ink);opacity:0;pointer-events:none}
.float .to-top.is-on{opacity:1;pointer-events:auto}

/* ==========================================================================
   ВНУТРЕННИЕ СТРАНИЦЫ
   ========================================================================== */
.phero{padding-top:calc(130px + env(safe-area-inset-top,0px));padding-bottom:clamp(40px,5vw,72px)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:14px;color:var(--ink-2);margin-bottom:clamp(26px,3vw,40px)}
.crumbs a:hover{color:var(--ink)}
.crumbs span[aria-hidden]{color:var(--ink-3)}
.phero__grid{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:end}
.phero h1{font-size:clamp(44px,6.2vw,100px);letter-spacing:-.055em;line-height:.97}
.phero__side{display:flex;flex-direction:column;gap:28px}
.phero__img{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:21/9;margin:0 var(--gut);background:var(--panel-2)}
.phero__img img{width:100%;height:100%;object-fit:cover}

/* выгоды */
.gains{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.gain{padding-top:24px;border-top:1.5px solid var(--ink);display:flex;flex-direction:column;gap:12px}
.gain h3{font-size:clamp(22px,1.9vw,28px);letter-spacing:-.04em}
.gain p{color:var(--ink-2)}

/* карточки «что входит» */
.items{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.items--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.item{background:var(--panel);border-radius:var(--r-lg);padding:clamp(24px,2.4vw,34px);display:flex;flex-direction:column;gap:12px;min-height:240px}
.item h3{font-size:clamp(23px,2vw,30px);letter-spacing:-.04em;margin-bottom:auto;padding-bottom:20px}
.item p{color:var(--ink-2);font-size:16px}
.item .link{align-self:flex-start;margin-top:8px}
.feature-list{display:flex;flex-wrap:wrap;gap:10px;margin-top:28px}
.feature-list li{display:flex;align-items:center;gap:10px;height:46px;padding:0 18px;border-radius:9px;box-shadow:inset 0 0 0 1px var(--line);font-size:16px;font-weight:500}
.feature-list li::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--accent)}

/* большой факт */
.bigfact{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,4vw,70px);align-items:center;padding:clamp(30px,4.5vw,70px)}
.bigfact strong{font-size:clamp(110px,16vw,240px);font-weight:550;letter-spacing:-.07em;line-height:.8}
.bigfact p{font-size:clamp(22px,2.2vw,34px);letter-spacing:-.035em;line-height:1.2;max-width:700px}

/* полоса поддержки */
.strip{display:grid;grid-template-columns:minmax(0,1.3fr) auto;gap:30px;align-items:center;padding:clamp(30px,4vw,60px)}
.strip h2{font-size:clamp(30px,3.4vw,54px);letter-spacing:-.05em;line-height:1.02}
.strip p{margin-top:16px}

/* хаб услуг */
.tiles{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:16px}
.tile{grid-column:span 2;display:flex;flex-direction:column;background:var(--panel);border-radius:var(--r-xl);padding:12px;transition:background .4s}
.tile--wide{grid-column:span 3}
.tile__img{display:block;border-radius:20px;overflow:hidden;aspect-ratio:16/10;background:var(--panel-2)}
.tile__img img{width:100%;height:100%;object-fit:cover;transition:transform 1.1s var(--ease)}
.tile:hover .tile__img img{transform:scale(1.05)}
.tile__body{padding:22px 14px 14px;display:flex;flex-direction:column;gap:16px;flex:1}
.tile__top{display:flex;justify-content:space-between;align-items:baseline;gap:16px}
.tile__top small{font-size:14px;color:var(--ink-3);font-weight:500}
.tile h2{font-size:clamp(28px,2.6vw,42px);letter-spacing:-.045em}
.tile p{color:var(--ink-2)}
.tile .chips{margin-bottom:auto}
.tile .chip{background:#fff}
.tile .btn{align-self:flex-start;margin-top:10px}

/* подбор услуги */
.pick{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,48px);padding:clamp(30px,4.5vw,70px);align-items:start}
.pick__opts{display:flex;flex-direction:column;gap:8px;margin-top:30px}
.pick__opts button{display:flex;justify-content:space-between;align-items:center;gap:16px;width:100%;min-height:62px;padding:12px 20px;border-radius:12px;background:rgba(255,255,255,.06);font-size:17px;font-weight:500;text-align:left;transition:background .3s,color .3s}
.pick__opts button:hover{background:rgba(255,255,255,.12)}
.pick__opts button.is-on{background:#fff;color:var(--ink)}
.pick__opts button svg{width:14px;height:14px;flex:none}
.pick__res{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:clamp(24px,2.6vw,36px);display:flex;flex-direction:column;gap:16px;min-height:100%;transition:opacity .3s}
.pick__res.fade{opacity:0}
.pick__res small{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.pick__res h3{font-size:clamp(30px,2.8vw,44px);letter-spacing:-.045em}
.pick__res p{color:var(--ink-2)}
.pick__res .btn{align-self:flex-start;margin-top:auto}

/* контакты */
.contact{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:16px;margin:0 var(--gut)}
.contact__info{border-radius:var(--r-xl);padding:clamp(28px,3.4vw,50px);display:flex;flex-direction:column;gap:34px}
.contact__info h3{font-size:13px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.45);margin-bottom:12px}
.contact__big{display:inline-block;font-size:clamp(24px,2.3vw,34px);font-weight:500;letter-spacing:-.04em;line-height:1.15}
a.contact__big{border-bottom:1.5px solid rgba(255,255,255,.25);transition:border-color .3s}
a.contact__big:hover{border-color:#fff}
.offices{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.offices b{display:block;font-size:20px;font-weight:550;letter-spacing:-.02em;margin-bottom:4px}
.offices a,.offices span{font-size:16px;color:rgba(255,255,255,.65)}
.offices a:hover{color:#fff}
.socials{display:flex;gap:8px;flex-wrap:wrap}
.socials a{height:44px;padding:0 18px;border-radius:9px;display:inline-flex;align-items:center;font-size:15px;font-weight:500;background:rgba(255,255,255,.08);transition:background .3s}
.socials a:hover{background:rgba(255,255,255,.18)}
.contact__form{border-radius:var(--r-xl);padding:clamp(28px,3.4vw,50px)}
.next{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.next div{padding:28px;border-radius:var(--r-lg);box-shadow:inset 0 0 0 1px var(--line);display:flex;flex-direction:column;gap:10px}
.next b{font-size:15px;font-weight:600;color:var(--accent)}
.next h3{font-size:22px;letter-spacing:-.035em}
.next p{color:var(--ink-2);font-size:16px}

/* юридические страницы */
.legal{max-width:820px}
.legal h2{font-size:clamp(24px,2.2vw,30px);letter-spacing:-.04em;margin:44px 0 14px}
.legal p,.legal li{color:var(--ink-2);margin-top:10px}
.legal .todo{background:#fff4d6;color:#6b5200;padding:1px 6px;border-radius:5px}

/* 404 */
.e404{min-height:72vh;display:flex;flex-direction:column;justify-content:center;gap:28px;padding-top:120px}
.e404 strong{font-size:clamp(130px,24vw,360px);font-weight:600;letter-spacing:-.08em;line-height:.8}

/* бегущая строка отраслей */
.marquee{overflow:hidden;border-block:1px solid var(--line);padding:24px 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.marquee__track{display:flex;width:max-content;animation:marq 48s linear infinite}
.marquee:hover .marquee__track{animation-play-state:paused}
.marquee__track span{display:inline-flex;align-items:center;gap:40px;padding-right:40px;font-size:clamp(20px,1.8vw,28px);font-weight:500;letter-spacing:-.03em;white-space:nowrap}
.marquee__track span::after{content:"";width:8px;height:8px;border-radius:2px;background:var(--accent)}
@keyframes marq{to{transform:translateX(-50%)}}

/* ==========================================================================
   АНИМАЦИИ ПОЯВЛЕНИЯ (только при включённом JS)
   ========================================================================== */
.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js .reveal.is-in{opacity:1;transform:none}
.split .w{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.14em;margin-bottom:-.14em}
.js .split .w > span{display:inline-block;transform:translateY(108%);transition:transform 1s var(--ease)}
.js .split.is-in .w > span{transform:none}
.js .clip{clip-path:inset(10% 8% 10% 8% round 28px);transition:clip-path 1.3s var(--ease)}
.js .clip.is-in{clip-path:inset(0 0 0 0 round 28px)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .js .reveal,.js .split .w > span{opacity:1;transform:none}
  .js .clip{clip-path:none}
}

/* ==========================================================================
   АДАПТИВ
   ========================================================================== */
@media (max-width:1180px){
  .nav,.header__cloud{display:none}
  .burger{display:grid}
  .header__right{margin-left:auto}
  .why__grid,.items{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fmt{grid-template-columns:1fr}
  .flow{flex-direction:column;height:auto}
  .flow__col,.flow__col.is-on{flex:none;background:var(--panel);color:var(--ink);cursor:default}
  .flow__v{display:none}
  .flow__time,.flow__col.is-on .flow__time{opacity:1;background:#fff;color:var(--ink)}
  .flow__body{opacity:1;transform:none;margin-top:18px;min-width:0;pointer-events:auto}
  .flow__body p{color:var(--ink-2)}
  .flow__res{border-color:var(--line)}
  .flow__res span{color:var(--ink-3)}
  .flow__bar{display:none}
  .footer__grid{grid-template-columns:1fr 1fr}
  .tile,.tile--wide{grid-column:span 3}
}
@media (max-width:900px){
  .hero__grid,.sec-head,.sx,.about,.faq,.cta,.phero__grid,.pick,.contact,.strip,.bigfact{grid-template-columns:minmax(0,1fr)}
  .hero__photo{aspect-ratio:4/3}
  .facts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fact:nth-child(2){border-right:0}
  .fact:nth-child(3){padding-left:0}
  .fact:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .sx-card{display:none}
  .sx-btn{grid-template-columns:40px minmax(0,1fr) 44px}
  .sx-mob{display:grid;grid-template-rows:0fr;transition:grid-template-rows .5s var(--ease)}
  .sx-mob > div{overflow:hidden}
  .sx-item.is-on .sx-mob{grid-template-rows:1fr}
  .sx-mob img{border-radius:14px;aspect-ratio:16/10;object-fit:cover;width:100%;margin-bottom:16px}
  .sx-mob p{color:var(--ink-2);margin-bottom:16px}
  .sx-mob .btn{margin:6px 0 26px}
  .values,.gains,.next,.posts{grid-template-columns:minmax(0,1fr)}
  .works{grid-template-columns:minmax(0,1fr)}
  .work,.work--7,.work--5,.work--4{grid-column:auto}
  .work--7 .work__img,.work--5 .work__img{height:auto;aspect-ratio:4/3}
  .work__go{opacity:1;transform:none}
  .posts--list .post:first-child{grid-template-columns:minmax(0,1fr)}
  .tile,.tile--wide{grid-column:1/-1}
  .phero__img{aspect-ratio:4/3}
  .article__cover{aspect-ratio:4/3}
  .offices{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:560px){
  body{font-size:16px}
  .why__grid,.items,.items--2{grid-template-columns:minmax(0,1fr)}
  .footer__grid{grid-template-columns:minmax(0,1fr)}
  .btn{--h:56px}
  .btns .btn{flex:1 1 100%;justify-content:space-between}
  .header .btn{display:none}
  .work__meta{flex-direction:column;gap:12px}
  .work__tags{justify-content:flex-start}
  .item{min-height:0}
  .prose{font-size:17px}
}

/* правки */
.fmt__card.ink{background:linear-gradient(180deg,#1a1a1a 0%,#0e0e0e 100%);color:#fff}
.nav__dd > a.is-active{background:var(--panel)}
.split .w{padding-bottom:.2em;margin-bottom:-.2em}

/* ==========================================================================
   v3 — НОВАЯ СТРУКТУРА
   ========================================================================== */
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes grow{from{transform:scaleX(0)}to{transform:none}}
@keyframes pulse{50%{opacity:.35}}

/* ---------- окно браузера ---------- */
.frame{background:#fff;border-radius:14px;overflow:hidden;box-shadow:0 30px 70px -24px rgba(18,18,18,.28),0 0 0 1px rgba(18,18,18,.06);transition:transform .6s var(--ease)}
.frame__bar{display:flex;align-items:center;gap:6px;height:30px;padding:0 12px;background:#f6f6f4;border-bottom:1px solid #ececea}
.frame__bar i{width:8px;height:8px;border-radius:50%;background:#dcdcd7}
.frame__bar span{margin:0 auto;transform:translateX(-18px);font-size:12px;color:var(--ink-3);background:#fff;border-radius:6px;padding:2px 12px}
.frame__b{position:relative;container-type:inline-size}
.pv{position:relative;aspect-ratio:16/10;overflow:hidden;font-size:clamp(7px,1.75cqi,16px)}
.pv--vip{background:linear-gradient(90deg,rgba(0,0,0,.62),rgba(0,0,0,.12)),var(--img) center/cover;padding:6% 6% 7%;display:flex;flex-direction:column;justify-content:flex-end;color:#fff}
.pv-vip__t{font:600 2.7em/1.02 var(--font);letter-spacing:-.035em;max-width:62%;margin-bottom:.9em}
.pv--rz .rz-hero,.pv--cc .cc-hero{height:100%;aspect-ratio:auto;border-radius:0}
.pv--fd{background:#f2f2f2;display:grid;place-items:center;padding:6%}

/* ---------- HERO ---------- */
.hx{padding-top:calc(128px + env(safe-area-inset-top,0px));padding-bottom:clamp(40px,6vw,90px)}
.hx__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);gap:clamp(30px,4vw,70px);align-items:center}
.hx__text{display:flex;flex-direction:column;gap:28px}
.hx .h1{font-size:clamp(46px,6vw,100px)}
.hx__meta{display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;color:var(--ink-2)}
.live{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px rgba(63,175,124,.16);animation:pulse 2.4s ease-in-out infinite}
.hx__trust{display:flex;gap:26px;flex-wrap:wrap;font-size:15px;color:var(--ink-2);padding-top:22px;border-top:1px solid var(--line)}
.hx__trust b{color:var(--ink);font-weight:600;font-size:18px;margin-right:4px}
.comp{position:relative;height:clamp(380px,40vw,600px)}
.comp > *{position:absolute;transition:transform .7s var(--ease)}
.comp__w--a{top:0;right:0;width:80%}
.comp__w--b{left:0;bottom:6%;width:80%;z-index:2}
.comp__pal{right:3%;bottom:0;z-index:3;background:#fff;border-radius:14px;padding:14px 16px;box-shadow:0 20px 50px -18px rgba(0,0,0,.3),0 0 0 1px rgba(0,0,0,.05);display:flex;flex-direction:column;gap:8px}
.comp__pal small{font-size:12px;color:var(--ink-3)}
.comp__pal span{display:flex;gap:6px}
.comp__pal i{width:28px;height:28px;border-radius:7px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08)}
.comp__cc{left:6%;top:3%;z-index:3;background:#fff;border-radius:14px;padding:12px;box-shadow:0 20px 50px -18px rgba(0,0,0,.3),0 0 0 1px rgba(0,0,0,.05);font-size:12px}
.comp__cc .cc-tag,.comp__cc .cc-btn--line{display:none}

/* ---------- карточки кейсов ---------- */
.cc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:56px 20px}
.cc-card{display:flex;flex-direction:column;gap:18px}
.cc-card.is-off{display:none}
.cc-card__pv{display:block;border-radius:var(--r-xl);background:var(--panel);padding:clamp(16px,2.6vw,38px);transition:background .4s var(--ease)}
.cc-card:hover .cc-card__pv{background:var(--panel-2)}
.cc-card:hover .frame{transform:translateY(-6px)}
.cc-card__meta{display:flex;justify-content:space-between;gap:20px;align-items:flex-start}
.cc-card__meta h3{font-size:clamp(24px,2.2vw,32px);letter-spacing:-.045em}
.cc-card__meta p{color:var(--ink-2);margin-top:6px}
.cc-card__foot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-top:16px;border-top:1px solid var(--line)}
.cc-grid--one{grid-template-columns:minmax(0,1fr)}
.cc-grid--one .cc-card{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-areas:"pv meta" "pv foot";gap:18px clamp(24px,4vw,60px);align-items:end}
.cc-grid--one .cc-card__pv{grid-area:pv}
.cc-grid--one .cc-card__meta{grid-area:meta}
.cc-grid--one .cc-card__foot{grid-area:foot;align-self:start}
.dots{display:flex;padding-left:6px;flex:none}
.dots i{width:22px;height:22px;border-radius:50%;background:var(--c);box-shadow:0 0 0 2px var(--bg),inset 0 0 0 1px rgba(0,0,0,.1);margin-left:-6px}
.tags{display:flex;flex-wrap:wrap;gap:6px}
.tags span{font-size:13px;font-weight:500;padding:6px 11px;border-radius:7px;background:var(--panel)}

/* ---------- дизайн-код ---------- */
.dc-band{padding:clamp(30px,4.5vw,70px)}
.dc__tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:24px}
.dc__tabs button{height:46px;padding:0 18px;border-radius:9px;font-size:15px;font-weight:500;background:#fff;transition:background .25s,color .25s}
.dc__tabs button:hover{background:var(--panel-2)}
.dc__tabs button.is-on{background:var(--ink);color:#fff}
.dc__panel{display:none;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:14px}
.dc__panel.is-on{display:grid;animation:fadeUp .5s var(--ease)}
.dc__col{background:#fff;border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;gap:14px;min-width:0}
.dc__col h4,.case-btns h4{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-2);font-weight:500}
.dc__col .link{margin-top:auto;align-self:flex-start}
.dc__r{font-size:22px;font-weight:550;letter-spacing:-.02em}
.dc__btns{font-size:14px}
.sws{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.sw{display:flex;flex-direction:column;gap:3px;min-width:0}
.sw i{display:block;aspect-ratio:1.4/1;border-radius:10px;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.08);margin-bottom:8px}
.sw b{font-size:14px;font-weight:600}
.sw code{font:13px ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink-2)}
.sw span{font-size:12px;color:var(--ink-3);line-height:1.3}
.sws--big{grid-template-columns:repeat(6,minmax(0,1fr))}
.sws--big .sw{background:#fff;border-radius:var(--r-lg);padding:12px 12px 16px}
.sws--big .sw i{aspect-ratio:1/1.1}
.spec{display:flex;gap:18px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line);min-width:0}
.spec:last-of-type{border-bottom:0}
.spec > b{font-size:54px;font-weight:600;letter-spacing:-.05em;line-height:1;min-width:76px}
.spec strong{display:block;font-size:17px;font-weight:600}
.spec span{display:block;font-size:13px;color:var(--ink-3)}
.spec em{display:block;font-style:normal;margin-top:6px;font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.specs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.specs .spec{background:#fff;border-radius:var(--r-lg);padding:26px;border:0}
.spec--big > b{font-size:clamp(70px,8vw,120px);min-width:auto}
.case-btns{margin-top:12px;background:#fff;border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;gap:18px;font-size:15px}

/* ---------- индекс услуг ---------- */
.sidx{position:relative;border-top:1px solid var(--line)}
.sidx__row{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1.2fr) minmax(0,1fr) 48px;gap:24px;align-items:center;padding:30px 0;border-bottom:1px solid var(--line);transition:padding .45s var(--ease)}
.sidx__row h3{font-size:clamp(26px,2.6vw,40px);letter-spacing:-.045em}
.sidx__row p{color:var(--ink-2);font-size:16px}
.sidx__row .tags{justify-content:flex-end}
.sidx__go{width:48px;height:48px;border-radius:10px;background:var(--panel);display:grid;place-items:center;transition:background .3s,color .3s}
.sidx__go svg{width:15px;height:15px}
.sidx__row:hover{padding-left:16px}
.sidx__row:hover .sidx__go{background:var(--ink);color:#fff}
.sidx__float{position:absolute;left:0;top:0;width:300px;pointer-events:none;opacity:0;transform:translate(-50%,-50%) scale(.86);transition:opacity .3s,transform .4s var(--ease);z-index:5}
.sidx__float.is-show{opacity:1;transform:translate(-50%,-50%) scale(1)}
.sidx__art{display:none;container-type:inline-size;filter:drop-shadow(0 24px 40px rgba(0,0,0,.18))}
.sidx__art.is-on{display:block}

/* ---------- студия ---------- */
.studio{padding:clamp(30px,4.5vw,70px)}
.studio__top h2{margin-top:22px;max-width:900px}
.studio__nums{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(36px,4vw,60px);border-top:1px solid rgba(255,255,255,.14);border-bottom:1px solid rgba(255,255,255,.14)}
.studio__nums div{padding:26px 20px 26px 0;border-right:1px solid rgba(255,255,255,.14)}
.studio__nums div + div{padding-left:24px}
.studio__nums div:last-child{border-right:0}
.studio__nums strong{display:block;font-size:clamp(38px,4vw,62px);font-weight:550;letter-spacing:-.06em;line-height:1;font-variant-numeric:tabular-nums}
.studio__nums span{display:block;margin-top:10px;color:rgba(255,255,255,.6);font-size:15px}
.studio__vals{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-top:28px}
.studio__vals b{display:block;font-size:18px;font-weight:550;margin-bottom:6px}
.studio__vals p{color:rgba(255,255,255,.6);font-size:15px}

/* ---------- страница услуг ---------- */
.sindex{display:flex;flex-direction:column;border-top:1px solid var(--line)}
.sindex a{display:flex;justify-content:space-between;align-items:center;padding:16px 0;border-bottom:1px solid var(--line);font-size:19px;font-weight:550;letter-spacing:-.02em;transition:padding .35s var(--ease)}
.sindex a:hover{padding-left:10px}
.sindex svg{width:14px;height:14px}
.srows{display:flex;flex-direction:column;gap:clamp(56px,7vw,110px)}
.srow{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(30px,5vw,90px);align-items:center}
.srow--rev .srow__art{order:2}
.srow__art{container-type:inline-size;max-width:580px;width:100%;justify-self:center}
.srow__txt{display:flex;flex-direction:column;gap:22px}
.ticks li{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line);font-weight:500}
.ticks li::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--accent);flex:none}
.sh{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(30px,5vw,80px);align-items:center}
.sh__txt{display:flex;flex-direction:column;gap:26px}
.sh h1{font-size:clamp(42px,5.2vw,86px);letter-spacing:-.055em;line-height:.98}
.sh__art{container-type:inline-size;max-width:560px;width:100%;justify-self:end}
.phero--art{padding-bottom:clamp(40px,5vw,80px)}
.sec-head__side .feature-list{margin-top:0}

/* ---------- кейс ---------- */
.meta{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;border-top:1px solid var(--line);margin:0}
.meta div{padding:16px 0;border-bottom:1px solid var(--line)}
.meta dt{font-size:13px;color:var(--ink-3);text-transform:uppercase;letter-spacing:.06em}
.meta dd{margin:6px 0 0;font-size:16px;font-weight:500}
.case-pv{background:var(--panel);border-radius:var(--r-xl);padding:clamp(20px,5vw,80px)}
.case-pv .frame{max-width:1040px;margin:0 auto}
.ts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,5vw,90px)}
.ts__p{margin-top:20px;font-size:clamp(19px,1.6vw,24px);line-height:1.45;letter-spacing:-.015em}
.blks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.blk{margin:0;display:flex;flex-direction:column;gap:14px;min-width:0}
.blk--wide{grid-column:1/-1}
.blk__stage{container-type:inline-size;background:var(--panel);border-radius:var(--r-xl);padding:clamp(20px,4vw,56px);display:grid;place-items:center;min-height:320px;overflow:hidden}
.blk__stage > *{font-size:clamp(9px,2.4cqi,15px)}
.blk--wide .blk__stage > *{font-size:clamp(8px,1.4cqi,15px)}
.blk figcaption b{display:block;font-size:19px;font-weight:600;letter-spacing:-.02em}
.blk figcaption span{color:var(--ink-2);font-size:15px}
.blk__stage .rz-hero,.blk__stage .cc-hero{width:100%;aspect-ratio:16/8;border-radius:1em}
.blk__stage .vr-book{max-width:64em}
.tech{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.4fr);gap:clamp(30px,5vw,80px)}
.tech__list li{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:20px;padding:20px 0;border-bottom:1px solid var(--line)}
.tech__list li:first-child{border-top:1px solid var(--line)}
.tech__list b{font-size:20px;font-weight:600;letter-spacing:-.02em}
.tech__list span{color:var(--ink-2)}
.next-case{display:flex;flex-direction:column;gap:16px;padding:clamp(30px,4vw,60px);border-radius:var(--r-xl);background:var(--panel);transition:background .45s var(--ease),color .45s var(--ease)}
.next-case b{font-size:clamp(44px,6vw,96px);font-weight:600;letter-spacing:-.055em;line-height:1}
.next-case em{font-style:normal;color:var(--ink-2);display:flex;gap:10px;align-items:center}
.next-case svg{width:14px;height:14px}
.next-case:hover{background:var(--ink);color:#fff}
.next-case:hover em,.next-case:hover .label{color:rgba(255,255,255,.65)}
.olds{border-top:1px solid var(--line)}
.old{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr) auto;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line);transition:padding .35s var(--ease)}
.old:hover{padding-left:12px}
.old b{font-size:22px;font-weight:600;letter-spacing:-.03em}
.old span{color:var(--ink-2)}
.old em{font-style:normal;font-size:14px;display:flex;gap:8px;align-items:center;white-space:nowrap}
.old svg{width:13px;height:13px}
.article__cover{max-width:1200px;margin-left:auto;margin-right:auto;aspect-ratio:21/9}

/* ==========================================================================
   ИЛЛЮСТРАЦИИ (нарисованы в HTML/CSS)
   ========================================================================== */
.art{position:relative;width:100%;aspect-ratio:5/4;background:var(--panel);border-radius:var(--r-xl);overflow:hidden;font-size:clamp(8px,2.6cqi,15px);color:var(--ink)}
.art-win{background:#fff;border-radius:.9em;box-shadow:0 1.4em 3em -1.2em rgba(0,0,0,.22),0 0 0 1px rgba(0,0,0,.05);overflow:hidden}
.art-bar{display:flex;align-items:center;gap:.35em;height:2.1em;padding:0 .8em;background:#f6f6f4;font-size:.8em}
.art-bar i{width:.6em;height:.6em;border-radius:50%;background:#dcdcd7}
.art-bar span{margin-left:.8em;background:#fff;border-radius:.4em;padding:.15em .8em;color:var(--ink-3)}
.art-chip{position:absolute;z-index:2;background:#fff;border-radius:.6em;padding:.6em .9em;font-size:.85em;font-weight:500;box-shadow:0 1em 2.4em -.8em rgba(0,0,0,.28),0 0 0 1px rgba(0,0,0,.04);display:flex;gap:.5em;align-items:center;white-space:nowrap}
.art-chip i{width:.55em;height:.55em;border-radius:50%;background:var(--accent)}
.art-chip b{color:var(--accent);font-size:1.25em}
/* сайты */
.art-site .art-win{position:absolute;left:9%;right:9%;top:11%}
.art-site__b{padding:1.1em;display:flex;flex-direction:column;gap:1em}
.as-nav{display:flex;align-items:center;gap:.7em}
.as-nav b{width:3.6em;height:.8em;background:var(--ink);border-radius:.2em}
.as-nav span{width:2.2em;height:.45em;background:#e4e4e0;border-radius:.2em}
.as-nav em{margin-left:auto;width:3.8em;height:1.5em;background:var(--ink);border-radius:.35em}
.as-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:1.1em;align-items:center}
.as-hero span{display:block;height:.95em;background:var(--ink);border-radius:.2em;margin-bottom:.45em;transform-origin:left;animation:grow 1.2s var(--ease) both}
.as-hero .l1{width:96%}.as-hero .l2{width:78%;animation-delay:.15s}.as-hero .l3{width:58%;height:.5em;background:#d9d9d4;animation-delay:.3s}
.as-hero em{display:block;width:5.2em;height:1.7em;background:var(--accent);border-radius:.35em;margin-top:.9em}
.as-img{aspect-ratio:4/3;border-radius:.6em;background:linear-gradient(140deg,#ecebe6,#d6d3cb)}
.as-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:.6em}
.as-cards span{height:3.4em;background:#f3f3f1;border-radius:.5em}
.art-chip--a{left:4%;bottom:9%}
.art-chip--b{right:4%;top:6%}
/* SEO */
.art-serp{position:absolute;left:7%;right:16%;top:8%;padding:1em}
.sq{display:flex;align-items:center;justify-content:space-between;border:1px solid #e3e3df;border-radius:999px;padding:.55em 1em;margin-bottom:.8em;font-size:.85em}
.sq i{width:.9em;height:.9em;border:2px solid var(--ink-3);border-radius:50%;position:relative}
.srr{position:relative;padding:.6em .6em .6em 2.6em;border-radius:.6em;margin-bottom:.2em}
.srr small{display:block;width:5em;height:.45em;background:#e4e4e0;border-radius:.2em}
.srr b{display:block;width:72%;height:.7em;background:#dcdcd7;border-radius:.2em;margin:.35em 0}
.srr p{height:.45em;width:92%;background:#eeeeea;border-radius:.2em}
.srr em{position:absolute;left:.6em;top:.65em;width:1.5em;height:1.5em;border-radius:.4em;background:#f3f3f1;display:grid;place-items:center;font-style:normal;font-size:.8em;font-weight:600}
.srr--you{background:#eef6f1;animation:rankup 1.4s var(--ease) both .3s}
.srr--you small{width:auto;height:auto;background:none;font-size:.7em;color:var(--accent);font-weight:600}
.srr--you b{width:auto;height:auto;background:none;font-size:.95em;font-weight:600}
.srr--you em{background:var(--accent);color:#fff}
@keyframes rankup{from{transform:translateY(5.5em);opacity:.4}to{transform:none;opacity:1}}
.art-graph{position:absolute;right:5%;bottom:7%;width:46%;background:#fff;border-radius:.8em;padding:.8em 1em;box-shadow:0 1.2em 2.6em -1em rgba(0,0,0,.25);color:var(--accent)}
.art-graph small{color:var(--ink-2);font-size:.75em}
.art-graph svg{width:100%;height:4em;margin:.4em 0}
.art-graph b{color:var(--ink);font-size:.85em}
/* приложения */
.art-phone{position:absolute;left:50%;top:9%;transform:translateX(-50%);width:40%;aspect-ratio:9/18;background:#fff;border-radius:1.7em;box-shadow:0 0 0 .45em #121212,0 2em 4em -1em rgba(0,0,0,.35);padding:1.3em .9em;display:flex;flex-direction:column;gap:.6em}
.ap-top{display:flex;justify-content:space-between;align-items:center}
.ap-top b{font-size:.95em}
.ap-top span{width:1.6em;height:1.6em;border-radius:50%;background:#f3f3f1}
.ap-card--dark{background:#121212;color:#fff;border-radius:.8em;padding:.8em}
.ap-card--dark small{display:block;font-size:.62em;opacity:.6}
.ap-card--dark b{display:block;font-size:.95em;margin:.2em 0}
.ap-card--dark span{font-size:.68em;opacity:.7}
.ap-row{display:flex;gap:.6em;align-items:center}
.ap-row i{width:2em;height:2em;border-radius:.5em;background:#f3f3f1;flex:none}
.ap-row b{display:block;width:6em;height:.55em;background:#dcdcd7;border-radius:.2em;margin-bottom:.35em}
.ap-row span{display:block;width:4em;height:.45em;background:#eeeeea;border-radius:.2em}
.ap-btn{margin-top:auto;background:var(--accent);color:#fff;text-align:center;border-radius:.6em;padding:.7em;font-size:.8em;font-weight:600}
.art-chip--c{right:4%;top:34%}
/* дизайн */
.art-design{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 1fr;gap:.9em;padding:7%}
.art-design > *{border-radius:.9em;box-shadow:0 1em 2.4em -1.2em rgba(0,0,0,.2)}
.ad-logo{background:var(--ink);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.7em}
.ad-mark{position:relative;width:3.4em;height:3.4em;border-radius:.8em;background:#fff}
.ad-mark::before{content:"m";position:absolute;inset:0;display:grid;place-items:center;color:var(--ink);font-size:2em;font-weight:650;line-height:1;padding-bottom:.15em}
.ad-mark i{position:absolute;right:.45em;bottom:.45em;width:.7em;height:.7em;background:var(--accent);border-radius:.18em}
.ad-logo b{font-size:1.3em;letter-spacing:-.05em;font-weight:650}
.ad-sw{background:#fff;padding:.9em;display:grid;grid-template-columns:repeat(4,1fr);gap:.4em;align-items:stretch}
.ad-sw span{border-radius:.4em;background:var(--c);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.ad-type{background:#fff;padding:.9em 1em;display:flex;align-items:center;gap:.8em}
.ad-type b{font-size:2.8em;letter-spacing:-.05em;font-weight:600;line-height:1}
.ad-type small{display:block;color:var(--ink-3);font-size:.7em}
.ad-type span{font-size:.9em;font-weight:500}
.ad-card{background:#fff;padding:1em;display:flex;flex-direction:column;justify-content:flex-end;border-left:.35em solid var(--accent)}
.ad-card small{color:var(--ink-3);font-size:.7em;margin-bottom:auto}
.ad-card b{font-size:1em}
.ad-card span{font-size:.75em;color:var(--ink-2)}
/* поддержка */
.as2{position:absolute;left:8%;right:8%;top:10%;padding:1.2em}
.as2-h{display:flex;justify-content:space-between;align-items:center;margin-bottom:.9em}
.as2-h b{font-size:1em}
.as2-h .ok{font-size:.8em;color:var(--accent);display:flex;align-items:center;gap:.4em;font-weight:600}
.as2-h .ok i{width:.55em;height:.55em;border-radius:50%;background:var(--accent);animation:pulse 2s infinite}
.as2-bars{display:flex;gap:.18em;height:2.4em}
.as2-bars i{flex:1;background:var(--accent);border-radius:.15em;opacity:.85}
.as2-bars i.w{background:#e2b14d}
.as2-m{display:grid;grid-template-columns:repeat(3,1fr);gap:.6em;margin:1em 0}
.as2-m div{background:#f6f6f4;border-radius:.6em;padding:.6em .7em}
.as2-m small{display:block;font-size:.7em;color:var(--ink-3)}
.as2-m b{font-size:1.02em}
.as2-log{display:flex;flex-direction:column;gap:.45em;font-size:.8em;color:var(--ink-2)}
.as2-log span{display:flex;align-items:center;gap:.5em}
.as2-log i{width:1.1em;height:1.1em;border-radius:.3em;background:#eaf6ef;display:grid;place-items:center}
.as2-log i::after{content:"✓";color:var(--accent);font-size:.75em;font-style:normal;font-weight:700}

/* ==========================================================================
   ПЕРЕСОБРАННЫЕ БЛОКИ ПРОЕКТОВ
   ========================================================================== */
.vr,.rz,.cc,.fd{font-family:var(--font);text-align:left;line-height:1.3}
/* VIP Riviera Tour */
.vr{color:#111}
.vr-book{display:flex;flex-direction:column;gap:.6em;width:100%}
.vr-tabs{display:inline-flex;align-self:flex-start;background:#fff;padding:.3em;border-radius:.8em;gap:.2em}
.vr-tabs button{font:600 1em var(--font);padding:.6em 1.1em;border-radius:.6em;color:#111}
.vr-tabs button.is-on{background:#111;color:#fff}
.vr-form{display:flex;align-items:center;background:#fff;border-radius:.9em;padding:.45em .45em .45em .5em;box-shadow:0 1.2em 3em -1em rgba(0,0,0,.3)}
.vr-f{flex:1 1 0;padding:.45em .9em;border-right:1px solid #ececea;min-width:0}
.vr-f small{display:block;font-size:.72em;color:#6e6e6a}
.vr-f b,.vr-f span{display:block;font-size:.92em;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#111}
.vr-f span{color:#9a9a95;font-weight:400}
.vr-f--s{flex:.65 1 0;border-right:0}
.vr-f i{display:inline-grid;place-items:center;width:1.5em;height:1.5em;border:1px solid #d9d9d4;border-radius:50%;font-style:normal;font-size:.8em;vertical-align:middle;margin:0 .3em}
.vr-btn{display:inline-flex;align-items:center;justify-content:center;background:#0a84ff;color:#fff;font-weight:600;border-radius:.8em;padding:.95em 1.5em;white-space:nowrap;border:1px solid transparent}
.vr-btn--line{background:transparent;color:#111;border-color:#d9d9d4}
.vr-tab{display:inline-flex;background:#111;color:#fff;border-radius:.6em;padding:.7em 1.1em;font-weight:600}
.vr-wa{display:inline-flex;background:#25d366;color:#fff;border-radius:999px;padding:.85em 1.4em;font-weight:600}
.vr-btns{display:flex;flex-wrap:wrap;gap:.6em;align-items:center}
.vr-card{background:#fff;border-radius:1em;padding:1.1em;width:min(100%,26em);box-shadow:0 1.2em 3em -1.2em rgba(0,0,0,.25)}
.vr-route{display:flex;flex-direction:column;gap:.5em;padding:.2em .2em 1em;font-size:.9em}
.vr-route span{display:flex;align-items:center;gap:.6em}
.vr-route i{width:.7em;height:.7em;border-radius:50%;background:#111}
.vr-route i.o{background:#fff;border:2px solid #111}
.vr-cls{display:flex;align-items:center;gap:.9em;padding:.75em .8em;border-radius:.7em;border:1.5px solid transparent}
.vr-cls.is-on{border-color:#111}
.vr-cls b{display:block;font-size:.95em}
.vr-cls small{font-size:.72em;color:#6e6e6a}
.vr-cls em{margin-left:auto;font-style:normal;font-weight:600}
.vr-cls em i{font-weight:400;color:#6e6e6a}
.car{position:relative;width:3.6em;height:.95em;background:#1e1e1e;border-radius:.6em .9em .35em .35em;flex:none}
.car::before,.car::after{content:"";position:absolute;bottom:-.25em;width:.6em;height:.6em;border-radius:50%;background:#111;box-shadow:0 0 0 .12em #fff}
.car::before{left:.5em}.car::after{right:.55em}
.car--van{height:1.3em;border-radius:.35em .5em .3em .3em}
.car--long{width:4em;height:.85em}
.vr-board-wrap{position:relative;width:min(100%,28em);padding-bottom:3.4em}
.vr-board{background:#111;color:#e9e9e9;font:.82em/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;border-radius:.8em;padding:1.1em 1.2em}
.vr-board__h{display:flex;justify-content:space-between;color:#8a8a8a;text-transform:uppercase;letter-spacing:.12em;font-size:.85em;padding-bottom:.7em;border-bottom:1px solid #2a2a2a;margin-bottom:.4em}
.vr-row{display:grid;grid-template-columns:1fr 1.2fr auto;padding:.35em 0;text-transform:uppercase}
.vr-row b{color:#3ddc84;font-weight:500}
.vr-sign{position:absolute;left:12%;right:6%;bottom:0;background:#fff;border-radius:.6em;padding:1em;text-align:center;box-shadow:0 1.4em 3em -1em rgba(0,0,0,.35);transform:rotate(-2deg)}
.vr-sign small{display:block;font-size:.65em;letter-spacing:.25em;text-transform:uppercase;color:#6e6e6a}
.vr-sign b{display:block;font-size:1.6em;letter-spacing:-.03em;margin:.15em 0}
.vr-sign span{font-size:.72em;color:#6e6e6a}
.vr-map{position:relative;width:min(100%,28em);aspect-ratio:5/3;background:#eceeef;border-radius:.9em;overflow:hidden}
.vr-map svg{position:absolute;inset:0;width:100%;height:100%}
.vr-eta{position:absolute;left:1em;bottom:1em;background:#fff;border-radius:.6em;padding:.7em .9em;box-shadow:0 .8em 2em -.8em rgba(0,0,0,.3)}
.vr-eta b{display:block;font-size:.95em}
.vr-eta small{font-size:.72em;color:#6e6e6a}
/* Razam */
.rz{color:#202020}
.rz-hero{position:relative;width:100%;aspect-ratio:16/10;background:linear-gradient(rgba(20,19,18,.25),rgba(20,19,18,.66)),var(--img) center/cover;color:#fff;padding:4.5% 5.5%;display:flex;flex-direction:column}
.rz-nav{display:flex;justify-content:space-between;align-items:center}
.rz-logo{font-size:1.05em;letter-spacing:.42em;font-weight:500}
.rz-logo i{display:inline-block;width:1px;height:1.5em;background:rgba(255,255,255,.7);margin:0 .5em 0 .1em;vertical-align:middle}
.rz-hero h4{margin-top:auto;font-size:3.3em;font-weight:500;letter-spacing:-.045em;line-height:1;max-width:70%;color:#fff}
.rz-acts{display:flex;gap:.6em;margin-top:1.3em}
.rz-pill{display:inline-flex;align-items:center;gap:.6em;border-radius:999px;padding:1.15em 2em;font-size:.78em;font-weight:600;text-transform:uppercase;letter-spacing:.08em;background:#fff;color:#1b1a18;border:1px solid transparent;white-space:nowrap}
.rz-nav .rz-pill{padding:.85em 1.4em}
.rz-pill--dark{background:#202020;color:#fff}
.rz-pill--line{background:transparent;color:#fff;border-color:rgba(255,255,255,.65)}
.rz-pill--light{background:#fff;color:#1b1a18;border-color:#e8e3df}
.rz-pill--ghost{background:transparent;color:#202020;border-color:#202020}
.rz-btns{display:flex;flex-wrap:wrap;gap:.6em}
.rz-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4em;background:#faf8f6;border-radius:.9em;padding:2em 2em 1.6em;width:100%}
.rz-stats small{display:block;font-size:.72em;font-weight:600;text-transform:uppercase;letter-spacing:.08em}
.rz-stats b{display:block;font-size:3.6em;font-weight:400;letter-spacing:-.05em;margin-top:.25em;white-space:nowrap}
.rz-proj{position:relative;width:100%;aspect-ratio:16/11;background:linear-gradient(rgba(0,0,0,.05) 35%,rgba(0,0,0,.6)),var(--img) center/cover;border-radius:.9em;color:#fff;padding:1.2em 1.3em;display:flex;flex-direction:column}
.rz-count{font-size:1.6em;font-weight:300}
.rz-count small{font-size:.5em;opacity:.7}
.rz-proj__b{margin-top:auto}
.rz-chips{display:flex;gap:.35em;flex-wrap:wrap;margin-bottom:.6em}
.rz-chips span{border:1px solid rgba(255,255,255,.55);border-radius:999px;padding:.35em .8em;font-size:.62em;text-transform:uppercase;letter-spacing:.06em;background:rgba(0,0,0,.15)}
.rz-proj__b b{display:block;font-size:2.4em;text-transform:uppercase;font-weight:500;letter-spacing:-.03em;line-height:1}
.rz-bar{display:flex;align-items:center;gap:.8em;margin-top:1em;font-size:.8em}
.rz-bar i{flex:1;height:1px;background:rgba(255,255,255,.35);position:relative}
.rz-bar i::before{content:"";position:absolute;left:0;top:-.5px;width:14%;height:2px;background:#fff}
.rz-bar em{font-style:normal;text-transform:uppercase;letter-spacing:.12em;font-size:.75em;opacity:.8}
.rz-arr{width:2.3em;height:2.3em;border:1px solid rgba(255,255,255,.55);border-radius:50%;display:grid;place-items:center}
/* ConsultiCo */
.cc{color:#1d1d1b}
.cc-hero{width:100%;aspect-ratio:16/10;background:#f5f5f2;padding:5% 6%;display:flex;flex-direction:column;gap:1.1em}
.cc-nav{display:flex;justify-content:space-between;align-items:center;margin-bottom:auto}
.cc-logo{font-weight:600;font-size:1.25em;letter-spacing:-.02em}
.cc-logo b{color:#315b50}
.cc-navpill{background:#fff;border-radius:999px;padding:.35em;display:flex;gap:.15em}
.cc-navpill i{font-style:normal;font-size:.8em;padding:.45em .95em;border-radius:999px}
.cc-navpill i:first-child{background:#eef1ee}
.cc-hero h4{font-size:3.1em;font-weight:550;letter-spacing:-.045em;line-height:1.02;max-width:78%;color:#1d1d1b}
.cc-chips{display:flex;gap:.4em;flex-wrap:wrap}
.cc-chips span{background:#fff;border-radius:999px;padding:.5em 1em;font-size:.8em}
.cc-btn{display:inline-flex;align-items:center;gap:.9em;background:#315b50;color:#fff;border-radius:999px;padding:.35em .35em .35em 1.4em;font-weight:500;align-self:flex-start;white-space:nowrap;border:1px solid #315b50}
.cc-btn i{width:2.3em;height:2.3em;border-radius:50%;background:#fff;color:#315b50;display:grid;place-items:center;font-style:normal}
.cc-btn--line{background:transparent;color:#315b50}
.cc-btn--line i{background:#315b50;color:#fff}
.cc-btn--block{align-self:stretch;justify-content:space-between}
.cc-tag{display:inline-flex;background:#315b50;color:#fff;border-radius:999px;padding:.55em 1.1em;font-size:.85em}
.cc-btns{display:flex;flex-wrap:wrap;gap:.6em;align-items:center}
.cc-list{background:#fff;border-radius:1em;padding:.4em 1.4em;width:min(100%,30em)}
.cc-row{display:flex;justify-content:space-between;align-items:center;gap:1em;padding:1.15em 0;border-bottom:1px solid #ececea}
.cc-row:last-child{border-bottom:0}
.cc-row b{font-size:1.15em;font-weight:500}
.cc-row span{color:#315b50;font-size:.85em;white-space:nowrap}
.cc-row.is-on b{color:#315b50}
.cc-pop{background:#fff;border-radius:1.2em;padding:1.6em;width:min(100%,22em);display:flex;flex-direction:column;gap:.7em;box-shadow:0 1.4em 3em -1.2em rgba(0,0,0,.25)}
.cc-pop > b{font-size:1.2em;font-weight:550;letter-spacing:-.02em;margin-bottom:.3em}
.cc-in{border:1px solid #e4e4df;border-radius:.7em;padding:.85em 1em;color:#9a9a95;font-size:.9em}
/* Frères Dron */
.fd-serp{background:#fff;border-radius:1em;padding:1.4em;width:min(100%,40em);font-family:Arial,Helvetica,sans-serif;color:#202124;box-shadow:0 1.2em 3em -1.4em rgba(0,0,0,.2)}
.fd-q{display:flex;align-items:center;justify-content:space-between;border:1px solid #dfe1e5;border-radius:999px;padding:.75em 1.2em;margin-bottom:1em}
.fd-q i{width:.95em;height:.95em;border:2px solid #9aa0a6;border-radius:50%}
.fd-res{padding:.7em .9em;border-radius:.6em}
.fd-res small{color:#4d5156;font-size:.8em}
.fd-res b{display:block;color:#1a0dab;font-size:1.22em;font-weight:400;margin:.25em 0;line-height:1.25}
.fd-res p{color:#4d5156;font-size:.88em;line-height:1.5}
.fd-res.is-top{background:#f1f9f2}
.fd-res b.sk{height:.9em;width:60%;background:#e8eaed;border-radius:.3em}
.fd-res p.sk{height:.7em;width:88%;background:#f1f3f4;border-radius:.3em}
.fd-cities{display:grid;grid-template-columns:repeat(3,1fr);gap:.6em;width:100%;max-width:34em}
.fd-city{background:#fff;border-radius:.4em;padding:1em;border-top:3px solid #e2e2e2}
.fd-city b{display:block;font-size:1.05em}
.fd-city small{color:#666;font-size:.78em}
.fd-city.is-on{border-color:#37b34a}
.fd-city.is-tpl{background:#222;color:#fff;border-color:#37b34a}
.fd-city.is-tpl small{color:#bbb}
.fd-code{background:#222;color:#e6e6e6;border-radius:.7em;padding:1.4em 1.6em;font:.95em/1.65 ui-monospace,SFMono-Regular,Menlo,monospace;margin:0;width:min(100%,24em);white-space:pre;overflow:auto}
.fd-code s{text-decoration:none;color:#7fd28b}
.fd-code u{text-decoration:none;color:#f0c674}
.fd-code i{font-style:normal;color:#999}
.fd-btns{display:flex;flex-wrap:wrap;gap:.6em}
.fd-btn{display:inline-flex;background:#37b34a;color:#fff;padding:1.15em 2.3em;font-weight:600;font-size:.95em}
.fd-btn--w{background:#fff;color:#000;border-radius:.3em;box-shadow:0 .2em .8em rgba(0,0,0,.15)}

/* ---------- адаптив v3 ---------- */
@media (max-width:1100px){
  .hx__grid{grid-template-columns:minmax(0,1fr)}
  .comp{height:clamp(320px,74vw,560px)}
  .dc__panel.is-on{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .dc__panel .dc__col:first-child{grid-column:1/-1}
  .sidx__row{grid-template-columns:minmax(0,1fr) 48px;row-gap:12px}
  .sidx__row h3{grid-column:1}
  .sidx__row .sidx__go{grid-column:2;grid-row:1}
  .sidx__row p,.sidx__row .tags{grid-column:1/-1}
  .sidx__row .tags{justify-content:flex-start}
  .sidx__float{display:none}
  .studio__nums{grid-template-columns:repeat(2,minmax(0,1fr))}
  .studio__nums div:nth-child(2){border-right:0}
  .studio__nums div:nth-child(3){padding-left:0}
  .studio__nums div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14)}
  .sws--big{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .cc-grid{grid-template-columns:minmax(0,1fr)}
  .cc-grid--one .cc-card{display:flex}
  .srow,.sh,.ts,.tech,.blks{grid-template-columns:minmax(0,1fr)}
  .srow--rev .srow__art{order:0}
  .sh__art{justify-self:start}
  .studio__vals{grid-template-columns:minmax(0,1fr)}
  .specs{grid-template-columns:minmax(0,1fr)}
  .blk__stage > *{font-size:clamp(8px,2.6cqi,15px)}
  .blk--wide .blk__stage > *{font-size:clamp(7px,1.9cqi,15px)}
}
@media (max-width:560px){
  .comp{height:96vw}
  .comp__cc{display:none}
  .comp__w--a,.comp__w--b{width:92%}
  .dc__panel.is-on{grid-template-columns:minmax(0,1fr)}
  .sws{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sws--big{grid-template-columns:repeat(2,minmax(0,1fr))}
  .meta{grid-template-columns:minmax(0,1fr)}
  .old{grid-template-columns:minmax(0,1fr);gap:6px}
  .tech__list li{grid-template-columns:minmax(0,1fr);gap:4px}
  .cc-card__meta{flex-direction:column;gap:12px}
  .hx__trust{gap:16px}
}

.blk:last-child:nth-child(even){grid-column:1/-1}
@container (max-width:560px){.vr-form{flex-wrap:wrap}.vr-f{flex:1 1 40%;border-right:0;border-bottom:1px solid #ececea}.vr-btn{flex:1 1 100%;margin-top:.4em}}
@media (max-width:700px){
  .comp{height:auto}
  .comp > *{position:relative;transform:none!important}
  .comp__w--a,.comp__pal,.comp__cc{display:none}
  .comp__w--b{width:100%;inset:auto}
}

/* ==========================================================================
   v4 — ПРОДАЮЩАЯ ГЛАВНАЯ
   ========================================================================== */
.header__wa{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:600;padding:0 10px;white-space:nowrap}
.header__wa i{width:8px;height:8px;border-radius:50%;background:#25d366;box-shadow:0 0 0 4px rgba(37,211,102,.18)}
.btn--wa{background:#25d366;color:#fff;padding:0 24px 0 12px;gap:12px}
.btn--wa .btn__wa{width:40px;height:40px;border-radius:7px;background:rgba(255,255,255,.18);display:grid;place-items:center}
.btn--wa .btn__wa svg{width:22px;height:22px}
.btn--wa:hover{background:#1fbe5b}
.btn--block{display:flex;width:100%;justify-content:space-between}
.float .float__wa{width:52px;height:52px;border-radius:12px;display:grid;place-items:center;background:#25d366;color:#fff;box-shadow:0 12px 30px rgba(0,0,0,.18);transition:transform .3s var(--ease)}
.float .float__wa svg{width:26px;height:26px}
.float .float__wa:hover{transform:translateY(-3px)}

.sx-hero{padding-top:calc(124px + env(safe-area-inset-top,0px));padding-bottom:clamp(40px,5vw,72px)}
.sx-hero__grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(30px,5vw,80px);align-items:center}
.sx-hero__txt{display:flex;flex-direction:column;gap:28px}
.sx-hero h1{font-size:clamp(44px,5.6vw,92px);letter-spacing:-.055em;line-height:.98}
.badge{display:inline-flex;align-self:flex-start;align-items:center;gap:10px;padding:9px 14px;border-radius:9px;background:var(--panel);font-size:14px;font-weight:500}
.checks{display:flex;flex-direction:column;gap:12px}
.checks li{display:flex;align-items:center;gap:14px;font-size:clamp(17px,1.4vw,20px);font-weight:500;letter-spacing:-.01em}
.checks li::before{content:"";flex:none;width:26px;height:26px;border-radius:7px;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%233faf7c' stroke-width='2.2'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E") center/15px no-repeat}
.trust{display:flex;flex-wrap:wrap;gap:12px 32px;padding-top:24px;border-top:1px solid var(--line);font-size:15px;color:var(--ink-2)}
.trust li{display:flex;align-items:baseline;gap:6px}
.trust b{font-size:22px;font-weight:600;color:var(--ink);letter-spacing:-.03em}
.lead{max-width:none}
.sx-hero__form .lead,.final .form{max-width:none}
form.lead{background:#fff;border-radius:22px;padding:clamp(24px,2.6vw,36px);box-shadow:0 30px 80px -30px rgba(18,18,18,.25),0 0 0 1px var(--line);gap:16px;font-size:inherit;color:var(--ink);line-height:1.5;letter-spacing:0}
.lead__top{display:flex;flex-direction:column;gap:4px;margin-bottom:4px}
.lead__top b{font-size:clamp(22px,1.9vw,28px);font-weight:600;letter-spacing:-.04em}
.lead__top span{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--ink-2)}
.lead__top span::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}
.lead .choice button{height:40px;font-size:14px;padding:0 13px}
.lead .field input{font-size:17px;padding:22px 0 10px}
.lead .field label{font-size:17px;top:20px}
.lead .btn{margin-top:6px}

.clients{padding:10px 0 0}
.marquee--names .marquee__track span{font-size:clamp(22px,2vw,30px);font-weight:600;letter-spacing:-.04em;color:var(--ink)}

/* плитки проектов */
.pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.4vw,22px)}
.pgrid .pt--big{grid-column:span 1}
.pgrid > .pt:nth-child(1){grid-column:span 2;grid-row:span 2}
.pgrid--all > .pt:nth-child(1){grid-column:span 2;grid-row:span 2}
.pgrid--all > .pt:nth-child(7){grid-column:span 2}
.pgrid--one{grid-template-columns:minmax(0,1fr)}
.pgrid--one > .pt:nth-child(1){grid-column:auto;grid-row:auto}
.pgrid--one .pt__img{aspect-ratio:21/9}
.pt{position:relative;display:flex;flex-direction:column;border-radius:var(--r-xl);overflow:hidden;background:var(--ink);color:#fff;text-align:left;font:inherit;padding:0;cursor:pointer;isolation:isolate;min-height:0}
.pt.is-off{display:none}
.pt__img{position:relative;flex:1;min-height:clamp(260px,24vw,380px);aspect-ratio:4/3}
.pgrid > .pt:nth-child(1) .pt__img{aspect-ratio:auto}
.pt__img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.pt::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,0) 45%,rgba(0,0,0,.72) 100%);pointer-events:none}
.pt:hover .pt__img img{transform:scale(1.05)}
.pt__over{position:absolute;top:18px;left:18px;right:18px;z-index:2}
.pt__tags{display:flex;flex-wrap:wrap;gap:6px}
.pt__tags span{font-size:13px;font-weight:500;padding:6px 11px;border-radius:7px;background:rgba(255,255,255,.92);color:var(--ink)}
.pt__meta{position:absolute;left:0;right:0;bottom:0;z-index:2;display:flex;justify-content:space-between;align-items:flex-end;gap:16px;padding:clamp(18px,2vw,28px)}
.pt__meta h3{font-size:clamp(24px,2.2vw,34px);letter-spacing:-.045em;color:#fff}
.pgrid > .pt:nth-child(1) .pt__meta h3{font-size:clamp(32px,3.4vw,54px)}
.pt__meta p{color:rgba(255,255,255,.78);margin-top:6px;font-size:15px}
.pt__go{flex:none;width:48px;height:48px;border-radius:10px;background:#fff;color:var(--ink);display:grid;place-items:center;transition:background .3s,color .3s}
.pt__go svg{width:15px;height:15px}
.pt:hover .pt__go{background:var(--accent);color:#fff}
.pt__cta{position:absolute;right:clamp(18px,2vw,28px);bottom:clamp(18px,2vw,28px);z-index:3;height:48px;padding:0 18px;border-radius:10px;background:#fff;color:var(--ink);display:inline-flex;align-items:center;font-size:15px;font-weight:600;opacity:0;transform:translateY(8px);transition:.4s var(--ease)}
button.pt .pt__go{display:none}
button.pt:hover .pt__cta,button.pt:focus-visible .pt__cta{opacity:1;transform:none}

/* что входит */
.incl{padding:clamp(30px,4.5vw,70px)}
.incs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.inc{background:#fff;border-radius:var(--r-lg);padding:26px;display:flex;flex-direction:column;gap:10px;min-height:190px}
.inc i{width:34px;height:34px;border-radius:9px;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%233faf7c' stroke-width='2.2'%3E%3Cpath d='m3.5 8.5 3 3 6-7'/%3E%3C/svg%3E") center/17px no-repeat;margin-bottom:auto}
.inc b{font-size:20px;font-weight:600;letter-spacing:-.03em;margin-top:22px}
.inc p{font-size:15px;color:var(--ink-2)}

/* гарантии */
.guar{padding:clamp(30px,4.5vw,70px)}
.guar__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid rgba(255,255,255,.14)}
.guar__grid > div{padding:28px 24px 8px 0;border-right:1px solid rgba(255,255,255,.14)}
.guar__grid > div + div{padding-left:24px}
.guar__grid > div:last-child{border-right:0}
.guar__grid b{display:block;font-size:clamp(20px,1.7vw,24px);font-weight:600;letter-spacing:-.03em;margin-bottom:10px}
.guar__grid p{color:rgba(255,255,255,.62);font-size:15px}

/* финальная форма */
.final{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(30px,5vw,80px);align-items:center;padding:clamp(30px,4.5vw,70px)}

/* кейс: большое чёткое фото */
.case-photo{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:21/9;background:var(--panel-2)}
.case-photo img{width:100%;height:100%;object-fit:cover}

@media (max-width:1180px){
  .header__wa{display:none}
  .incs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guar__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .guar__grid > div:nth-child(2){border-right:0}
  .guar__grid > div:nth-child(3){padding-left:0}
  .guar__grid > div:nth-child(-n+2){border-bottom:1px solid rgba(255,255,255,.14);padding-bottom:24px}
}
@media (max-width:900px){
  .sx-hero__grid,.final{grid-template-columns:minmax(0,1fr)}
  .pgrid,.pgrid--all{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pgrid > .pt:nth-child(1),.pgrid--all > .pt:nth-child(1){grid-column:1/-1;grid-row:auto}
  .pgrid > .pt:nth-child(1) .pt__img{aspect-ratio:16/10}
  .pgrid--all > .pt:nth-child(7){grid-column:auto}
  .pt__cta{opacity:1;transform:none;position:relative;right:auto;bottom:auto;margin:0 18px 18px;align-self:flex-start}
  .case-photo{aspect-ratio:4/3}
}
@media (max-width:560px){
  .pgrid,.pgrid--all{grid-template-columns:minmax(0,1fr)}
  .incs,.guar__grid{grid-template-columns:minmax(0,1fr)}
  .guar__grid > div{border-right:0!important;padding-left:0!important;border-bottom:1px solid rgba(255,255,255,.14)}
  .pt__img{min-height:240px}
  .btn--wa{justify-content:flex-start}
}
.btns .btn--wa{justify-content:flex-start}