/* ═══════════════════════════════════════════════════════════
   DOMKIT — главная страница
   Токены взяты из библиотеки стилей Figma (файл domkit).
   ═══════════════════════════════════════════════════════════ */

:root{
  /* Цвета */
  --c-dark:      #44444E;   /* «черный» */
  --c-darker:    #21232A;   /* «b2b фон черный» */
  --c-orange:    #F26A21;
  --c-cyan:      #31CFE8;
  --c-white:     #FCFCFC;   /* «белый темнее» */
  --c-bg:        #F1F1F1;   /* «белый светлее» */
  --c-gray:      #D9D9D9;
  --c-pure:      #FFFFFF;

  --c-dark-40:   rgba(68,68,78,.4);
  --c-white-60:  rgba(252,252,252,.6);
  --c-white-40:  rgba(252,252,252,.4);
  --c-white-20:  rgba(252,252,252,.2);

  /* Шрифты */
  --f-head: 'Manrope', system-ui, sans-serif;
  --f-body: 'Inter', system-ui, sans-serif;
  --f-ui:   'Figerona', 'Inter', system-ui, sans-serif;

  --radius:  10px;
  --radius-s: 5px;
  --header-h: 80px;
  --ease: cubic-bezier(.22,.61,.36,1);
}

@font-face{
  font-family:'Figerona';
  font-style:normal;
  font-weight:100 900;
  font-display:swap;
  src:url('fonts/Figerona-VF.ttf') format('truetype');
}

/* ─── Сброс ─────────────────────────────────────────────── */
*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; scroll-padding-top:calc(var(--header-h) + 16px); }
body{
  margin:0;
  background:var(--c-bg);
  color:var(--c-dark);
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
body.is-locked{ overflow:hidden; }
img{ display:block; max-width:100%; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; background:none; border:0; cursor:pointer; }
h1,h2,h3,p,ul{ margin:0; }
ul{ padding:0; list-style:none; }

.skip-link{
  position:absolute; left:-9999px; top:0; z-index:200;
  background:var(--c-orange); color:#fff; padding:10px 16px; border-radius:0 0 6px 0;
}
.skip-link:focus{ left:0; }

:focus-visible{ outline:2px solid var(--c-orange); outline-offset:3px; }

/* ─── Сетка ─────────────────────────────────────────────── */
.container{ position:relative; width:100%; max-width:1180px; margin-inline:auto; padding-inline:24px; }
.section{ padding-block:40px; }

/* ─── Типографика ───────────────────────────────────────── */
.section-title{
  font-family:var(--f-head);
  font-weight:800;
  font-size:26px;
  line-height:1.2;
  text-transform:uppercase;
  color:var(--c-dark);
}
.section-title .num{ color:var(--c-dark-40); }
.section-title--light{ color:var(--c-white); }
.section-title--light .num{ color:var(--c-white-40); }

.list li{ position:relative; padding-left:18px; line-height:1.6; font-size:15px; }
.list li + li{ margin-top:2px; }
.list li::before{ content:'•'; position:absolute; left:0; }
.list--light{ color:var(--c-white); }

/* ─── Кнопки ────────────────────────────────────────────── */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:40px; padding:10px 20px;
  border-radius:var(--radius-s);
  font-family:var(--f-ui); font-weight:600; font-size:16px; line-height:1;
  color:var(--c-white); text-align:center;
  transition:transform .18s var(--ease), filter .18s var(--ease), box-shadow .18s var(--ease);
  will-change:transform;
}
.btn--orange{ background:var(--c-orange); }
.btn--dark{ background:var(--c-darker); }
.btn--block{ width:100%; }
.btn:hover{ transform:translateY(-2px); filter:brightness(1.06); box-shadow:0 6px 18px rgba(0,0,0,.18); }
.btn:active{ transform:translateY(0); }

/* ─── Переключатель языка ──────────────────────────────── */
.lang-switch{
  position:relative;
  width:max-content;
  font-family:var(--f-ui); font-weight:600; font-size:13px; line-height:1;
}
.lang-switch--header{ display:none; }
.lang-switch--menu{ margin:18px 24px 0; }
.lang-switch__button{
  display:flex; align-items:center; gap:8px;
  min-width:84px; height:36px;
  padding:0 10px;
  border:1px solid rgba(68,68,78,.18);
  border-radius:var(--radius-s);
  color:rgba(68,68,78,.82);
  cursor:pointer;
  list-style:none;
  user-select:none;
  transition:border-color .18s var(--ease), color .18s var(--ease), background .18s var(--ease);
}
.lang-switch__button::-webkit-details-marker{ display:none; }
.lang-switch__button:hover{ border-color:rgba(242,106,33,.45); color:var(--c-orange); }
.lang-switch__chevron{
  width:7px; height:7px; margin-left:auto;
  border-right:1.6px solid currentColor;
  border-bottom:1.6px solid currentColor;
  transform:translateY(-1px) rotate(45deg);
  transition:transform .18s var(--ease);
}
.lang-switch[open] .lang-switch__chevron{ transform:translateY(2px) rotate(225deg); }
.lang-switch__menu{
  position:absolute; z-index:80;
  top:calc(100% + 8px); right:0;
  min-width:172px;
  padding:6px;
  border:1px solid rgba(68,68,78,.14);
  border-radius:var(--radius-s);
  background:var(--c-pure);
  box-shadow:0 14px 34px rgba(33,35,42,.16);
}
.lang-switch--menu .lang-switch__menu{ left:0; right:auto; }
.lang-switch__link{
  display:grid; grid-template-columns:22px 28px 1fr; align-items:center; gap:8px;
  min-height:36px; padding:6px 8px;
  border-radius:4px;
  color:rgba(68,68,78,.74);
  transition:background .18s var(--ease), color .18s var(--ease), transform .18s var(--ease);
}
.lang-switch__link:hover{ background:rgba(242,106,33,.08); color:var(--c-orange); transform:translateX(2px); }
.lang-switch__link.is-active{
  background:rgba(242,106,33,.12);
  color:var(--c-orange);
}
.lang-switch__name{ font-weight:500; color:rgba(68,68,78,.54); }
.flag{
  display:inline-block; width:22px; height:15px;
  border-radius:3px;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.12);
  overflow:hidden;
}
.flag--ru{ background:linear-gradient(#fff 0 33.333%, #2453a6 33.333% 66.666%, #d52b1e 66.666%); }
.flag--uz{
  background:
    linear-gradient(#1eb4e9 0 27%, #fff 27% 32%, #ce2029 32% 37%, #fff 37% 63%, #ce2029 63% 68%, #fff 68% 73%, #1eb53a 73%);
}
.flag--en{
  background:
    linear-gradient(33deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%),
    linear-gradient(-33deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%),
    linear-gradient(90deg, transparent 0 42%, #fff 42% 47%, #c8102e 47% 53%, #fff 53% 58%, transparent 58%),
    linear-gradient(0deg, transparent 0 38%, #fff 38% 45%, #c8102e 45% 55%, #fff 55% 62%, transparent 62%),
    #012169;
}

/* ═══════════ ШАПКА ═══════════ */
.header{
  position:sticky; top:0; z-index:60;
  background:var(--c-bg);
  transition:box-shadow .25s var(--ease);
}
.header.is-stuck{ box-shadow:0 2px 20px rgba(0,0,0,.08); }
.header__inner{
  display:flex; align-items:center; justify-content:space-between; gap:24px;
  height:var(--header-h);
  max-width:1180px; margin-inline:auto; padding-inline:24px;
}
.header__logo img{ height:32px; width:auto; }
.nav, .header__actions{ display:none; }

.burger{ width:40px; height:40px; display:grid; place-items:center; }
.burger img{ width:100%; height:100%; }

/* ═══════════ МОБИЛЬНОЕ МЕНЮ ═══════════ */
.mmenu{ position:fixed; inset:0; z-index:90; display:flex; flex-direction:column; }
.mmenu[hidden]{ display:none; }
.mmenu__panel{
  background:var(--c-bg); color:var(--c-dark);
  box-shadow:0 12px 40px rgba(0,0,0,.2);
  transform:translateY(-100%);
  transition:transform .32s var(--ease);
}
.mmenu.is-open .mmenu__panel{ transform:translateY(0); }
.mmenu__head{
  display:flex; align-items:center; justify-content:space-between;
  height:var(--header-h); padding-inline:24px;
}
.mmenu__logo{ height:32px; width:auto; }
.mmenu__close{ width:40px; height:40px; display:grid; place-items:center; }
.mmenu__list{ padding:12px 0; }
.mmenu__link{
  display:flex; align-items:center; justify-content:space-between;
  height:48px; padding-inline:24px;
  font-family:var(--f-head); font-weight:600; font-size:16px;
  transition:background .18s var(--ease), padding-left .18s var(--ease);
}
.mmenu__link:hover{ background:rgba(68,68,78,.06); padding-left:30px; }
.mmenu__chevron{
  width:16px; height:16px;
  border-top:2px solid currentColor; border-right:2px solid currentColor;
  transform:rotate(45deg) scale(.6); opacity:.5;
}
.mmenu__actions{
  display:flex; flex-direction:column; gap:12px;
  padding:24px; border-top:1px solid rgba(68,68,78,.15);
}
.mmenu__actions .btn{ min-height:48px; }
.mmenu__backdrop{
  flex:1; display:block; width:100%;
  background:rgba(33,35,42,.55);
  opacity:0; transition:opacity .32s var(--ease);
  font-size:13px; color:var(--c-white-60);
  padding-top:18px;
}
.mmenu.is-open .mmenu__backdrop{ opacity:1; }

/* ═══════════ 01 · HERO ═══════════ */
.hero__decoration{ display:none; }
.hero__title{ font-size:28px; }
.hero__title .num{ color:var(--c-orange); }
.hero__stage{ display:none; }

.hero__mobile{ display:flex; flex-direction:column; gap:16px; margin-top:24px; }
.hero__mtext{ font-size:16px; line-height:1.5; }
.hero__mimg{ width:100%; height:240px; object-fit:cover; border-radius:8px; }

/* ═══════════ 02 · О КОМПАНИИ ═══════════ */
.about{ background:var(--c-gray); }
.about__col{ display:flex; flex-direction:column; gap:24px; }
.about__subtitle{
  font-family:var(--f-head); font-weight:700; font-size:18px; line-height:normal;
  text-transform:uppercase;
}
.about__text{ font-size:16px; line-height:1.5; }
.about__text br{ display:none; }

.about__benefits{
  background:var(--c-pure); border-radius:var(--radius); padding:24px;
  display:flex; flex-direction:column; gap:16px;
}
.about__benefits-title{ font-family:var(--f-head); font-weight:800; font-size:20px; }
.about__photo{ width:100%; height:260px; object-fit:cover; border-radius:8px; margin-top:24px; }

/* ═══════════ 03 · АУДИТОРИЯ ═══════════ */
.audience__title{ margin-bottom:24px; }
.audience__card{
  position:relative; overflow:hidden;
  background:var(--c-darker); border-radius:var(--radius); padding:24px;
  display:flex; flex-direction:column; gap:20px; align-items:flex-start;
}
.audience__bg, .audience__shade, .audience__icon{ display:none; }
.audience__text{ color:var(--c-white); font-size:15px; line-height:1.6; }
.audience__text-gap{ display:block; height:1.6em; }
.audience__btn{ min-height:32px; padding:8px 16px; font-size:14px; }

/* ═══════════ 04 · НАПРАВЛЕНИЯ ═══════════ */
.directions__title{ margin-bottom:32px; }
.directions__grid{ display:flex; flex-direction:column; gap:32px; }
.direction{ display:flex; flex-direction:column; gap:16px; }
.direction__media{ position:relative; border-radius:8px; overflow:hidden; }
.direction__media img{
  width:100%; height:220px; object-fit:cover;
  transition:transform .5s var(--ease);
}
.direction:hover .direction__media img{ transform:scale(1.04); }
.direction__caption{
  font-family:var(--f-head); font-weight:800; font-size:20px; line-height:normal;
  text-transform:uppercase; color:var(--c-dark);
}
.direction__text{ font-size:15px; line-height:1.5; }
.direction__btn{ width:100%; }
.directions__divider{ border:0; border-top:1px solid rgba(68,68,78,.25); margin:0; }

/* ═══════════ 05 · ПОЧЕМУ DOMKIT ═══════════ */
.why{ background:var(--c-dark); color:var(--c-white); }
.why__panel{ display:none; }
.why__title{ margin-bottom:24px; }
.why__list{ margin-bottom:24px; }
.why__gallery{ overflow:hidden; }
.why__track{ display:flex; transition:transform .45s var(--ease); }
.why__slide{ flex:0 0 100%; display:flex; flex-direction:column; gap:12px; }
.why__photo{ width:100%; border-radius:6px; object-fit:cover; }
.why__photo--a{ height:180px; }
.why__photo--b{ height:381px; }
.why__controls{ display:flex; gap:12px; justify-content:center; margin-top:24px; }

.arrow{
  width:46px; height:46px; border-radius:var(--radius-s);
  background:var(--c-orange); border:1px solid #fff;
  display:grid; place-items:center;
  transition:transform .18s var(--ease), filter .18s var(--ease);
}
.arrow img{ width:18px; height:auto; }
.arrow:hover{ transform:scale(1.08); filter:brightness(1.08); }
.arrow[disabled]{ opacity:.4; cursor:default; transform:none; }

/* ═══════════ 06 · ФУТЕР ═══════════ */
.footer{
  background:var(--c-dark); color:var(--c-white);
  padding-block:40px;
  border-radius:var(--radius) var(--radius) 0 0;
}
.footer .container{ display:flex; flex-direction:column; gap:32px; }
.footer__grid{ display:flex; flex-direction:column; gap:32px; }
.footer__info{ display:flex; flex-direction:column; gap:24px; }
.footer__item{ display:flex; flex-direction:column; gap:8px; }
.footer__label{
  font-family:var(--f-head); font-weight:700; font-size:18px; color:var(--c-white-40);
}
.footer__value{ font-size:16px; }
.footer__value a{ transition:color .18s var(--ease); }
.footer__value a:hover{ color:var(--c-orange); }
.footer__socials{ display:flex; gap:16px; }
.footer__socials img{
  width:40px; height:40px; border-radius:20px; object-fit:cover;
  transition:transform .18s var(--ease);
}
.footer__socials a:hover img{ transform:scale(1.1); }

.footer__form-wrap{ display:flex; flex-direction:column; gap:16px; }
.footer__form-title{ font-family:var(--f-head); font-weight:800; font-size:20px; }
.form{ display:flex; flex-direction:column; gap:16px; }
.field{ display:flex; flex-direction:column; gap:6px; }
.field__input{
  width:100%; min-height:44px; padding:12px 16px;
  background:var(--c-white-20); border:1px solid transparent; border-radius:8px;
  color:var(--c-white); font-family:var(--f-body); font-size:14px;
  transition:background .18s var(--ease), border-color .18s var(--ease);
}
.field__input::placeholder{ color:var(--c-white-60); }
.field__input:focus{ outline:none; background:rgba(252,252,252,.28); border-color:var(--c-orange); }
.field__input--area{ min-height:110px; resize:vertical; }
.field__input.is-invalid{ border-color:#ff6b6b; }
.field__error{ font-size:12px; color:#ff9b9b; min-height:0; }
.field__error:empty{ display:none; }
.field__honeypot{ position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }

.form__foot{ display:flex; flex-direction:column; gap:12px; }
.form__submit{ min-height:44px; align-self:stretch; }
.form__submit[disabled]{ opacity:.6; cursor:progress; transform:none; }
.form__status{ font-size:14px; min-height:0; }
.form__status:empty{ display:none; }
.form__status.is-ok{ color:#7ee0a0; }
.form__status.is-err{ color:#ff9b9b; }

.footer__copy{ font-size:13px; color:var(--c-white-40); text-align:center; }

/* ═══════════ Кнопка «наверх» ═══════════ */
.scroll-up{
  position:fixed; right:20px; bottom:20px; z-index:50;
  width:64px; height:64px; display:grid; place-items:center;
  opacity:0; transform:translateY(12px); pointer-events:none;
  transition:opacity .25s var(--ease), transform .25s var(--ease);
}
.scroll-up[hidden]{ display:none; }
.scroll-up.is-visible{ opacity:1; transform:translateY(0); pointer-events:auto; }
.scroll-up:hover{ transform:translateY(-4px); }
.scroll-up__bg{ position:absolute; inset:0; width:100%; height:100%; }
.scroll-up__arrow{ position:relative; width:26%; transform:rotate(-90deg); }

/* ═══════════ Анимации появления ═══════════ */
[data-reveal]{
  opacity:0; transform:translateY(24px);
  transition:opacity .6s var(--ease), transform .6s var(--ease);
}
[data-reveal].is-visible{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.001s !important; transition-duration:.001s !important; }
  [data-reveal]{ opacity:1; transform:none; }
}


/* ═══════════════════════════════════════════════════════════
   ДЕСКТОП  ≥ 1024px — раскладка по фрейму page/main (1280px)
   ═══════════════════════════════════════════════════════════ */
@media (min-width:1024px){

  :root{ --header-h:90px; }

  .container{ padding-inline:50px; max-width:1280px; }
  .section{ padding-block:0; margin-bottom:60px; }
  .section:first-of-type{ padding-top:60px; }

  .section-title{ font-size:39px; line-height:1.1; }
  .list li{ font-size:16px; line-height:normal; }

  .btn{ min-height:32px; padding:8px 14px; font-size:16px; line-height:.9; }

  /* ─── Шапка ─── */
  .header__inner{ max-width:1280px; padding-top:30px; align-items:flex-start; }
  .header__logo{ display:none; }
  .burger{ display:none; }
  .nav{
    display:flex; gap:42px; align-items:center; height:28px;
    font-family:var(--f-ui); font-size:16px; line-height:.9;
  }
  .nav__link{ position:relative; padding-block:6px; transition:color .18s var(--ease); }
  .nav__link::after{
    content:''; position:absolute; left:0; right:100%; bottom:0; height:2px;
    background:var(--c-orange); transition:right .25s var(--ease);
  }
  .nav__link:hover{ color:var(--c-orange); }
  .nav__link:hover::after, .nav__link.is-active::after{ right:0; }
  .lang-switch--header{ display:flex; }
  .lang-switch--menu{ display:none; }
  .header__actions{ display:flex; gap:10px; }
  .header__actions .btn{ width:188px; }

  .mmenu{ display:none !important; }

  /* ─── 01 · Hero ─── */
  .hero .container{ padding-bottom:0; }
  .hero__decoration{
    display:block; position:absolute; left:53px; top:-18px;
    width:382px; height:100px; z-index:3; pointer-events:none;
  }
  .hero__title{
    font-size:39px;
    margin-left:calc(496 / 1180 * 100%);
    width:calc(614 / 1180 * 100%);
  }
  .hero__title .num{ color:var(--c-dark-40); }
  .hero__mobile{ display:none; }

  .hero__stage{
    display:block; position:relative;
    margin-top:20px;
    aspect-ratio:1180 / 545;
    background:var(--c-gray);
    border-radius:var(--radius);
    overflow:hidden;
    container-type:inline-size;
    /* 1 «дизайнерский» пиксель = --u; весь коллаж масштабируется пропорционально */
    --u:0.08474576cqw;
  }
  .hero__deco{ position:absolute; inset:0; }
  .hero__poly{ position:absolute; }
  .hero__poly span{ position:absolute; top:0; bottom:25%; left:6.7%; right:6.7%; }
  .hero__poly span img{ width:100%; height:100%; }

  .hero__poly--1{ left:calc(143 * var(--u)); top:calc(398 * var(--u)); width:calc(320 * var(--u)); height:calc(196 * var(--u)); }
  .hero__poly--2{ left:calc(134 * var(--u)); top:calc(372 * var(--u)); width:calc(370 * var(--u)); height:calc(231 * var(--u)); }
  .hero__poly--3{
    left:calc(501 * var(--u)); top:calc(-317 * var(--u));
    width:calc(997.728 * var(--u)); height:calc(997.728 * var(--u));
    display:flex; align-items:center; justify-content:center;
  }
  .hero__poly-rot{ transform:rotate(45deg); width:calc(893 * var(--u)); height:calc(518 * var(--u)); position:relative; }
  .hero__poly-rot span{ position:absolute; top:0; bottom:25%; left:6.7%; right:6.7%; }
  .hero__poly-rot span img{ width:100%; height:100%; }

  .hero__deco-icon{
    position:absolute;
    left:calc(264 * var(--u)); top:calc(165.07 * var(--u));
    width:calc(209.237 * var(--u)); height:calc(220.19 * var(--u));
    display:flex; align-items:center; justify-content:center;
  }
  .hero__deco-icon span{
    transform:rotate(47deg);
    width:calc(262.88 * var(--u)); height:calc(40.956 * var(--u));
  }
  .hero__deco-icon span img{ width:100%; height:100%; }

  .hero__panel{
    position:absolute; top:0; height:100%;
    left:calc(432 * var(--u)); width:calc(450 * var(--u));
    background:var(--c-dark);
  }

  .hero__lead{
    position:absolute;
    font-size:max(13px, calc(16 * var(--u)));
    line-height:normal;
  }
  .hero__lead--dark{
    left:calc(100 * var(--u)); top:calc(31 * var(--u)); width:calc(285 * var(--u));
    color:var(--c-dark);
  }
  .hero__lead--light{
    left:calc(466 * var(--u)); top:calc(429 * var(--u)); width:calc(346 * var(--u));
    color:var(--c-white);
  }

  .hero__photo{ position:absolute; object-fit:cover; }
  .hero__photo--1{
    left:0; top:calc(193 * var(--u));
    width:calc(215 * var(--u)); height:calc(191 * var(--u));
    border-radius:0 var(--radius-s) var(--radius-s) 0;
  }
  .hero__photo--2{
    left:calc(469 * var(--u)); top:calc(38 * var(--u));
    width:calc(204 * var(--u)); height:calc(250 * var(--u));
    border-radius:var(--radius-s);
  }
  .hero__photo3{
    position:absolute;
    left:calc(641.42 * var(--u)); top:calc(-2.12 * var(--u));
    width:calc(529.033 * var(--u)); height:calc(360.75 * var(--u));
    -webkit-mask-image:url('../assets/hero-mask-3.svg');
            mask-image:url('../assets/hero-mask-3.svg');
    -webkit-mask-repeat:no-repeat;  mask-repeat:no-repeat;
    -webkit-mask-size:calc(332 * var(--u)) calc(357 * var(--u));
            mask-size:calc(332 * var(--u)) calc(357 * var(--u));
    -webkit-mask-position:calc(117.582 * var(--u)) calc(2.125 * var(--u));
            mask-position:calc(117.582 * var(--u)) calc(2.125 * var(--u));
    overflow:hidden;
  }
  .hero__photo3 img{ width:112.38%; height:109.87%; margin-top:-9.82%; object-fit:cover; }

  /* ─── 02 · О компании ─── */
  .about{ background:transparent; }
  .about__card{
    display:grid;
    grid-template-columns:minmax(0,585fr) minmax(0,387fr);
    column-gap:10px;
    background:var(--c-gray); border-radius:var(--radius);
    padding:37px 99px 58px;
  }
  .about__col{ gap:0; }
  .about__col .section-title{ margin-bottom:20px; }
  .about__subtitle{
    font-family:var(--f-head); font-weight:600; font-size:22px; text-transform:none;
    margin-bottom:10px;
  }
  .about__text{ font-size:16px; line-height:normal; }
  .about__text br{ display:inline; }
  .about__benefits{ background:transparent; border-radius:0; padding:0; margin-top:67px; gap:20px; }
  .about__benefits-title{
    font-family:var(--f-head); font-weight:800; font-size:39px; line-height:1.1; text-transform:uppercase;
  }
  .about__photo{
    margin-top:0; align-self:start;
    height:455px; border-radius:var(--radius-s);
  }

  /* ─── 03 · Аудитория ─── */
  .audience__title{ margin:0 0 0 calc(97 / 1180 * 100%); width:calc(835 / 1180 * 100%); padding-top:36px; }
  .audience__card{
    margin-top:20px; padding:0;
    aspect-ratio:1180 / 470;
    background:transparent; border-radius:var(--radius);
    display:block;
    container-type:inline-size;
    --u:0.08474576cqw;
  }
  .audience__bg{
    display:block; position:absolute; inset:0;
    width:100%; height:calc(467 * var(--u)); object-fit:cover; border-radius:var(--radius);
  }
  .audience__shade{
    display:block; position:absolute; left:0; right:0; top:0; height:calc(467 * var(--u));
    border-radius:var(--radius);
    background:linear-gradient(to bottom, rgba(102,102,102,0), rgba(0,0,0,.2));
  }
  .audience__icon{ display:block; position:absolute; }
  .audience__icon--1{ left:calc(1 * var(--u));   top:calc(138 * var(--u)); width:calc(311 * var(--u));   height:calc(329 * var(--u)); }
  .audience__icon--2{ left:calc(8.5 * var(--u)); top:0;                    width:calc(171.5 * var(--u)); height:calc(178.5 * var(--u)); }
  .audience__icon--3{ left:calc(1 * var(--u));   top:calc(212 * var(--u)); width:calc(240 * var(--u));   height:calc(255 * var(--u)); }
  .audience__icon--4{ left:calc(825 * var(--u)); top:0;                    width:calc(355.5 * var(--u)); height:calc(390.5 * var(--u)); }

  .audience__text{
    position:absolute;
    left:calc(20 * var(--u)); top:calc(322 * var(--u)); width:calc(886 * var(--u));
    font-family:var(--f-head); font-weight:700;
    font-size:max(15px, calc(20 * var(--u)));
    line-height:normal; color:var(--c-white);
  }
  .audience__text-gap{ height:1em; }
  .audience__btn{
    position:absolute;
    left:calc(942 * var(--u)); top:calc(395 * var(--u));
    width:calc(188 * var(--u)); min-height:calc(32 * var(--u));
    font-size:max(12px, calc(16 * var(--u))); padding:0;
  }

  /* ─── 04 · Направления ─── */
  .directions__title{
    margin:0 0 0 calc(494 / 1180 * 100%); width:calc(660 / 1180 * 100%);
    padding-top:31px; margin-bottom:0;
  }
  .directions__grid{
    display:grid; grid-template-columns:minmax(0,585fr) minmax(0,581fr);
    column-gap:11px; margin-top:20px;
  }
  .directions__divider{ display:none; }
  .direction{ gap:17px; align-items:center; }
  .direction__media{ width:100%; border-radius:6px; }
  .direction__media::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,0) 45%, rgba(0,0,0,.48) 100%);
    pointer-events:none;
  }
  .direction__media img{ height:auto; aspect-ratio:585 / 359; }
  .direction__caption{
    position:absolute; left:5%; right:15%; bottom:8.4%;
    z-index:1;
    font-family:var(--f-head); font-weight:600; font-size:22px;
    text-transform:none; color:var(--c-white);
  }
  .direction__text{ font-size:16px; line-height:normal; width:100%; }
  .direction__btn{ width:188px; }

  /* ─── 05 · Почему DOMKIT ─── */
  .why{ background:transparent; color:inherit; }
  .why__card{
    position:relative; aspect-ratio:1180 / 590;
    container-type:inline-size; --u:0.08474576cqw;
  }
  .why__panel{
    display:block; position:absolute; left:0; right:0; top:0; height:81.73%;
    background:var(--c-dark); border-radius:var(--radius);
  }
  .why__title{
    position:absolute; left:8.39%; top:6.26%; margin:0;
    font-size:max(20px, calc(39 * var(--u)));
  }
  .why__list{
    position:absolute; left:8.39%; right:39.32%; top:16.92%; margin:0;
  }
  .why__list li{ font-size:max(12px, calc(16 * var(--u))); }

  .why__gallery{ position:absolute; inset:0; overflow-x:clip; overflow-y:visible; }
  .why__track{ height:100%; }
  .why__slide{ position:relative; flex:0 0 100%; display:block; }
  .why__photo{ position:absolute; border-radius:7px; }
  .why__photo--a{ /* image-27 — левое фото */
    left:33.64%; right:36.36%; top:calc(237 * var(--u)); height:calc(354 * var(--u)); width:auto;
  }
  .why__photo--b{ /* image-26 — правое фото */
    left:64.66%; right:5.34%; top:40.1%; height:calc(354 * var(--u)); width:auto; object-fit:cover;
  }
  .why__controls{
    position:absolute; left:11.78%; top:77.83%; margin:0; gap:calc(20 * var(--u));
    justify-content:flex-start;
  }
  .arrow{
    width:calc(46 * var(--u)); height:calc(46 * var(--u));
    min-width:32px; min-height:32px; border-radius:3px; border:0;
  }

  /* ─── 06 · Футер ─── */
  .footer{ padding:37px 0 60px; margin-bottom:0; }
  .footer .container{ gap:20px; }
  .footer__grid{
    display:grid; grid-template-columns:545px 584px; gap:51px;
    justify-content:center;
  }
  .footer__info{ gap:20px; }
  .footer__item{ gap:11px; }
  .footer__label{ font-weight:800; font-size:22px; }
  .footer__socials img{ width:50px; height:50px; border-radius:0; }
  .footer__form-wrap{ gap:13px; }
  .footer__form-title{ font-size:22px; }
  .form{ gap:13px; }
  .field__input{ min-height:40px; border-radius:20px; padding:8px 27px; font-size:18px; }
  .field__input--area{ min-height:158px; padding-top:12px; }
  .form__foot{ flex-direction:row; align-items:center; justify-content:flex-end; gap:16px; }
  .form__submit{ width:175px; min-height:31px; align-self:flex-end; }
  .footer__copy{ text-align:right; }

  .scroll-up{ right:50px; bottom:40px; width:86px; height:86px; }
}

/* Крупные экраны: коллаж не растягиваем сверх макета */
@media (min-width:1400px){
  .container{ max-width:1280px; }
}


/* ═══════════════════════════════════════════════════════════
   ВНУТРЕННИЕ СТРАНИЦЫ (b2c / b2b)
   Мобильная раскладка по page/mobile-b2c и page/mobile-b2b
   ═══════════════════════════════════════════════════════════ */

/* ─── Hero ─── */
.ihero__media{
  position:relative; margin-top:24px;
  height:240px; border-radius:var(--radius); overflow:hidden;
}
.ihero__img{ width:100%; height:100%; object-fit:cover; }
.ihero__shade{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(0,0,0,.28) 17.6%, rgba(102,102,102,0) 100%);
}
.ihero__lead{ display:none; }
.ihero__mtext{ margin-top:24px; font-size:16px; line-height:1.5; }

/* тёмный hero на b2b */
.ihero--dark .ihero__media{ background:var(--c-darker); }

/* ─── Кнопки CTA ─── */
.cta__row{ display:flex; flex-direction:column; gap:12px; }
.cta__btn{ width:100%; }

/* ─── 02 · Технологии (b2c) / Риски (b2b) ─── */
.tech__card{
  position:relative; overflow:hidden;
  background:var(--c-gray); border-radius:var(--radius);
  padding:40px 24px;
  display:flex; flex-direction:column; gap:24px;
}
.tech__wm{ display:none; }
.tech__title{ order:1; }
.tech__lead{ order:2; font-size:18px; line-height:1.4; }
.tech__img{ width:100%; border-radius:var(--radius-s); object-fit:cover; }
.tech__img--side1{ order:3; height:150px; object-position:50% 67%; }
.tech__img--side2{ order:4; height:160px; object-position:50% 95%; }
.tech__img--main{ order:5; height:444px; object-position:59% 50%; }
.tech__bar{
  order:6; display:block; width:100%; height:10px;
  border-radius:var(--radius-s); background:var(--c-orange);
}
.tech__caption{ order:7; font-size:16px; color:rgba(68,68,78,.6); line-height:1.4; }

/* тёмная карточка (b2b «риски») */
.tech__card--dark{ background:var(--c-darker); color:var(--c-white); }
.tech__card--dark .tech__caption{ color:var(--c-white-60); }

/* ─── 03 · Направления ─── */
.dirs__card{ position:relative; margin-top:24px; }
.dirs__panel{ display:none; }
.dirs .dirs__title{
  position:static; margin-bottom:24px;
  color:var(--c-dark);
}
.dirs .dirs__title .num{ color:var(--c-dark-40); }
.dirs__gallery{ overflow:hidden; border-radius:var(--radius); }
.dirs__track{ display:flex; transition:transform .45s var(--ease); }
.dirs__slide{
  flex:0 0 100%;
  background:var(--c-dark); color:var(--c-white);
  border-radius:var(--radius); padding:24px 24px 94px;
  display:flex; flex-direction:column; gap:20px;
}
.dirs__name{ font-family:var(--f-head); font-weight:600; font-size:22px; }
.dirs__desc{ font-size:16px; opacity:.8; margin-top:10px; }
.dirs__img{ width:100%; height:180px; object-fit:cover; border-radius:var(--radius); }
.dirs__img + .dirs__img{ margin-top:-8px; }
.dirs__controls{
  position:absolute; left:0; right:0; bottom:24px;
  display:flex; gap:12px; justify-content:center;
}

/* ─── 04 · Услуги / 05 · Кейсы ─── */
.svc{ position:relative; }
.svc__wm{
  position:absolute; left:0; top:7px; width:100%; height:100px;
  object-fit:cover; pointer-events:none;
}
.svc__grid{ display:flex; flex-direction:column; gap:16px; margin-top:24px; }
.svc__card{ position:relative; height:240px; border-radius:var(--radius-s); overflow:hidden; }
.svc__card img{ width:100%; height:100%; object-fit:cover; }
.svc__card--shade::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(102,102,102,0) 62%, rgba(0,0,0,.33) 100%);
}
.svc__caption{
  position:absolute; left:16px; right:16px; bottom:16px; z-index:1;
  font-family:var(--f-head); font-weight:700; font-size:22px; line-height:normal;
  color:var(--c-white);
}

.cases .container{ position:relative; }
.cases__wm{ display:none; }
.cases__grid{ display:flex; flex-direction:column; gap:20px; margin-top:24px; }
.cases__card{ height:335px; }

/* ─── Модалка «Расчёт стоимости проекта» ─── */
.modal{
  position:fixed; inset:0; z-index:100;
  display:flex; align-items:center; justify-content:center;
  padding:16px;
}
.modal[hidden]{ display:none; }
.modal__backdrop{
  position:absolute; inset:0;
  background:rgba(33,35,42,.55);
  opacity:0; transition:opacity .32s var(--ease);
}
.modal.is-open .modal__backdrop{ opacity:1; }
.modal__card{
  position:relative; z-index:1;
  width:min(614px, 100%);
  max-height:calc(100dvh - 32px); overflow:auto;
  background:var(--c-dark); border-radius:17px;
  padding:30px 15px 15px;
  opacity:0; transform:translateY(16px);
  transition:opacity .32s var(--ease), transform .32s var(--ease);
}
.modal.is-open .modal__card{ opacity:1; transform:none; }
.modal__close{
  position:absolute; top:5px; right:5px;
  width:28px; height:28px; display:grid; place-items:center;
  color:var(--c-white);
}
.modal__title{
  font-family:var(--f-head); font-weight:800; font-size:22px;
  text-transform:uppercase; color:var(--c-white);
  text-align:center; margin-bottom:10px;
}
.modal__form{ gap:13px; }
.modal__pair{ display:flex; flex-direction:column; gap:13px; }
.modal .field__input{
  min-height:40px; border-radius:20px; padding:8px 18px;
  font-size:16px;
}
.modal .field__input--area{ min-height:158px; padding-top:10px; }
.modal .form__foot{ margin-top:2px; }
.modal .form__submit{ min-height:36px; }

/* ─── Тёмная тема (b2b) ─── */
.theme-dark{ background:var(--c-darker); color:var(--c-white); }
.theme-dark .header{ background:var(--c-darker); }
.theme-dark .header.is-stuck{ box-shadow:0 2px 20px rgba(0,0,0,.4); }
.theme-dark .section-title{ color:var(--c-white); }
.theme-dark .section-title .num{ color:var(--c-cyan); }
.theme-dark .mmenu__panel{ background:var(--c-darker); color:var(--c-white); }
.theme-dark .mmenu__link:hover{ background:rgba(252,252,252,.06); }
.theme-dark .mmenu__actions{ border-top-color:rgba(252,252,252,.15); }
.theme-dark .lang-switch__button{ border-color:rgba(252,252,252,.2); color:rgba(252,252,252,.78); }
.theme-dark .lang-switch__button:hover{ border-color:rgba(49,207,232,.5); color:var(--c-cyan); }
.theme-dark .lang-switch__menu{ background:#2A2C34; border-color:rgba(252,252,252,.12); box-shadow:0 14px 34px rgba(0,0,0,.34); }
.theme-dark .lang-switch__link{ color:rgba(252,252,252,.74); }
.theme-dark .lang-switch__link:hover{ background:rgba(49,207,232,.1); color:var(--c-cyan); }
.theme-dark .lang-switch__link.is-active{ background:rgba(49,207,232,.14); color:var(--c-cyan); }
.theme-dark .lang-switch__name{ color:rgba(252,252,252,.52); }

.btn--cyan{ background:var(--c-cyan); color:var(--c-darker); font-weight:700; }
.btn--cyan-outline{
  background:transparent; color:var(--c-cyan);
  border:1.5px solid var(--c-cyan); font-weight:700;
}
.cta__btn--ghost{ background:transparent; color:var(--c-cyan); border:1.5px solid var(--c-cyan); }
@media (max-width:1023.9px){
  .cta__btn--ghost{ font-weight:700; }
}

/* ─── b2b · Hero ─── */
.ihero__wm{ display:none; }
.ihero--b2b .ihero__card{ display:flex; flex-direction:column; gap:24px; }
.ihero__btitle{ font-size:28px; }
.ihero__bimg{
  width:100%; height:240px; object-fit:cover; object-position:50% 28%;
  border-radius:8px;
}
.ihero__btext{ display:flex; flex-direction:column; gap:16px; }
.ihero__btext p{ font-size:15px; line-height:1.5; color:var(--c-white-60); }

/* ─── b2b · 02 Риски ─── */
.risks{ position:relative; }
.risks__bg{ display:none; }
.risks__lead{ margin-top:16px; font-size:16px; color:var(--c-white-60); }
.risks__grid{ margin-top:24px; }
.risks__row{ display:flex; flex-direction:column; gap:12px; }
.risks__row + .risks__row{ margin-top:12px; }
.risk{
  background:var(--c-dark); border-radius:var(--radius-s);
  padding:14px 16px;
  display:flex; flex-direction:column; gap:8px;
}
.risk__num{
  font-family:var(--f-head); font-weight:800; font-size:28px; line-height:1;
  color:var(--c-cyan);
}
.risk__num span{ color:rgba(49,207,232,.4); }
.risk__text{
  font-family:var(--f-head); font-weight:700; font-size:15px; line-height:1.35;
  color:var(--c-white);
}

/* ─── b2b · Направления (бирюзовая карточка) ─── */
.dirs--b2b .dirs__title{ color:var(--c-white); }
.dirs--b2b .dirs__title .num{ color:var(--c-cyan); }
.dirs--b2b .dirs__slide{ background:var(--c-cyan); color:var(--c-dark); }
.dirs--b2b .dirs__desc{ opacity:1; }

/* ─── b2b · Услуги/Кейсы ─── */
.svc__card--dim::after{
  content:''; position:absolute; inset:0; background:rgba(0,0,0,.2);
}
.svc__card--dim img{ object-position:57% 50%; }
.cases__bcard--1 img{ object-position:63% 50%; }
.theme-dark .svc__caption{ z-index:1; }
.cases__btitle{ }
.cases__bcard{
  height:auto; overflow:visible; border-radius:var(--radius);
  background:rgba(68,68,78,.4); padding:16px;
}
.cases__bcard img{
  height:200px; border-radius:6px;
}
.cases__bcard::after{ content:none; }
.cases__bcard .svc__caption{
  position:static; margin-top:12px;
  font-family:var(--f-head); font-weight:800; font-size:18px; line-height:1.3;
  text-transform:uppercase;
}
.cases__bcard--2{ border:1.5px solid #8a38f5; }
.cases__note{
  margin-top:8px; font-size:14px; line-height:1.4; color:var(--c-white-60);
}

/* ═══════════ Внутренние страницы: десктоп ≥1024px ═══════════ */
@media (min-width:1024px){

  /* ─── Hero ─── */
  .ihero__title{ width:min(614px, 60%); }
  .ihero__media{
    margin-top:20px; height:auto;
    aspect-ratio:1178 / 569;
    container-type:inline-size; --u:0.08488964cqw; /* 100/1178 */
  }
  .ihero__lead{
    display:block; position:absolute;
    left:calc(99 * var(--u)); top:calc(431 * var(--u));
    width:calc(551 * var(--u));
    color:var(--c-white);
    font-size:max(14px, calc(24 * var(--u))); line-height:normal;
  }
  .ihero__mtext{ display:none; }

  /* ─── CTA ─── */
  .cta__row{ flex-direction:row; justify-content:space-between; gap:12px; }
  .cta__btn{ width:calc(584 / 1180 * 100%); min-height:40px; font-size:18px; font-weight:500; }

  /* ─── Технологии / Риски ─── */
  .tech__card{
    display:block; padding:0; background:var(--c-gray); overflow:visible;
    aspect-ratio:1180 / 600;
    container-type:inline-size; --u:0.08474576cqw;
  }
  .tech__card--dark{ background:var(--c-darker); }
  .tech__wm{
    display:block; position:absolute; z-index:1; pointer-events:none;
    left:calc(-50 * var(--u)); top:calc(115 * var(--u));
    width:calc(1280 * var(--u)); aspect-ratio:1280 / 330; height:auto;
    object-fit:contain;
  }
  .tech__title{
    position:absolute; z-index:2;
    left:calc(496 * var(--u)); top:calc(37 * var(--u));
    width:calc(640 * var(--u));
    font-size:max(20px, calc(39 * var(--u)));
  }
  .tech__lead{
    position:absolute; z-index:2;
    left:calc(494 * var(--u)); top:calc(143 * var(--u));
    width:calc(686 * var(--u));
    font-size:max(14px, calc(24 * var(--u))); line-height:normal;
  }
  .tech__img{ position:absolute; z-index:2; }
  .tech__img--main{
    left:calc(99 * var(--u)); top:0;
    width:calc(289 * var(--u)); height:calc(336 * var(--u));
  }
  .tech__img--side1{
    left:calc(793 * var(--u)); top:calc(311 * var(--u));
    width:calc(290 * var(--u)); height:calc(121 * var(--u));
  }
  .tech__img--side2{
    left:calc(793 * var(--u)); top:calc(452 * var(--u));
    width:calc(288 * var(--u)); height:calc(121 * var(--u));
    transform:scaleY(-1);
  }
  .tech__bar{
    position:absolute; z-index:2;
    left:0; top:calc(454 * var(--u));
    width:calc(684 * var(--u)); height:calc(25 * var(--u));
    border-radius:0;
  }
  .tech__caption{
    position:absolute; z-index:2;
    left:0; top:calc(504 * var(--u));
    width:calc(710 * var(--u));
    font-size:max(11px, calc(16 * var(--u))); line-height:normal;
    color:rgba(68,68,78,.7);
  }
  .tech__card--dark .tech__caption{ color:var(--c-white-60); }

  /* ─── Направления ─── */
  .dirs__card{
    margin-top:0;
    aspect-ratio:1180 / 600;
    container-type:inline-size; --u:0.08474576cqw;
  }
  .dirs__panel{
    display:block; position:absolute; left:0; right:0; top:0;
    height:calc(485 * var(--u));
    background:var(--c-dark); border-radius:var(--radius);
  }
  .dirs .dirs__title{
    position:absolute; z-index:2; margin:0;
    left:calc(99 * var(--u)); top:calc(37 * var(--u));
    color:var(--c-white);
    font-size:max(20px, calc(39 * var(--u)));
  }
  .dirs .dirs__title .num{ color:var(--c-white-40); }
  .dirs__gallery{ position:absolute; inset:0; overflow:visible; border-radius:0; }
  .dirs__track{ height:100%; }
  .dirs__slide{ position:relative; display:block; padding:0; background:transparent; border-radius:0; }
  .dirs__text{
    position:absolute;
    left:calc(99 * var(--u)); top:calc(100 * var(--u));
    width:calc(360 * var(--u));
  }
  .dirs__name{ font-size:max(15px, calc(22 * var(--u))); }
  .dirs__desc{ font-size:max(12px, calc(16 * var(--u))); opacity:1; }
  .dirs__img{
    position:absolute; top:calc(246 * var(--u));
    width:calc(354 * var(--u)); height:calc(354 * var(--u));
    margin:0 !important;
  }
  .dirs__img--1{ left:calc(397 * var(--u)); }
  .dirs__img--2{ left:calc(763 * var(--u)); }
  .dirs__controls{
    left:calc(99 * var(--u)); right:auto; bottom:auto;
    top:calc(464 * var(--u));
    gap:calc(46 * var(--u)); justify-content:flex-start;
    z-index:2;
  }

  /* ─── Услуги ─── */
  .svc__wm{ display:none; }
  .svc__grid{ flex-direction:row; gap:10px; justify-content:flex-end; margin-top:20px; }
  .svc__card{ height:335px; flex:0 0 24.35%; }
  .svc__card--wide{ flex-basis:41.2%; }
  .svc__caption{ left:4.4%; right:9%; bottom:4.2%; }

  /* ─── Кейсы ─── */
  .cases__title{ margin-left:auto; width:calc(684 / 1180 * 100%); }
  .cases__wm{
    display:block; position:absolute; z-index:-1; pointer-events:none;
    left:0; top:-103px; width:536px; aspect-ratio:536 / 573; height:auto;
  }
  .cases__grid{ flex-direction:row; gap:10px; justify-content:flex-end; margin-top:20px; }
  .cases__card{ flex:0 0 32.75%; height:335px; }
  .cases__card .svc__caption{ left:5.2%; right:12.8%; bottom:2.4%; }

  /* ─── Модалка ─── */
  .modal__title{ text-align:left; }
  .modal__pair{ flex-direction:row; }
  .modal__pair .field{ flex:1; }
  .modal .field__input{ font-size:18px; padding:8px 26px; }
  .modal .form__submit{ width:175px; min-height:31px; }

  /* ─── b2b: тёмная тема, десктоп ─── */
  .theme-dark .section-title .num{ color:var(--c-white-40); }
  .cta__btn--ghost{ background:var(--c-cyan); color:var(--c-darker); border:0; }

  .ihero--b2b .ihero__card{
    display:block; position:relative;
    aspect-ratio:1180 / 690;
    container-type:inline-size; --u:0.08474576cqw;
  }
  .ihero__wm{
    display:block; position:absolute; z-index:0; pointer-events:none;
    left:calc(-50 * var(--u)); top:calc(-20 * var(--u));
    width:calc(1032 * var(--u)); aspect-ratio:1032 / 271; height:auto;
  }
  .ihero__btitle{
    position:absolute; z-index:1;
    left:0; top:calc(19 * var(--u)); width:calc(615 * var(--u));
    font-size:max(20px, calc(39 * var(--u)));
  }
  .ihero__bimg{
    position:absolute; z-index:1;
    right:0; top:calc(35 * var(--u));
    width:calc(507 * var(--u)); height:calc(655 * var(--u));
    object-fit:cover;
    border-radius:var(--radius);
  }
  .ihero__btext{
    position:absolute; z-index:1;
    left:0; top:calc(445 * var(--u)); width:calc(615 * var(--u));
    gap:calc(30 * var(--u));
  }
  .ihero__btext p{
    font-size:max(13px, calc(24 * var(--u))); line-height:normal;
    color:var(--c-white);
  }

  .risks{ position:relative; padding-block:25px 20px; }
  .risks__bg{ display:block; position:absolute; inset:0; overflow:hidden; }
  .risks__bg img{ width:100%; height:100%; object-fit:cover; }
  .risks .container{ position:relative; z-index:1; }
  .risks__title{ width:614px; }
  .risks__lead{ margin-top:14px; font-size:24px; color:var(--c-white); width:443px; }
  .risks__grid{ margin-top:30px; }
  .risks__row{ flex-direction:row; gap:10px; }
  .risks__row + .risks__row{ margin-top:10px; }
  .risks__row--end{ justify-content:flex-end; }
  .risk{ width:288px; height:164px; padding:10px 15px; gap:10px; }
  .risk--wide{ width:320px; }
  .risk__num{ font-size:81px; }
  .risk__text{ font-size:18px; line-height:normal; }

  .dirs--b2b .dirs__title{
    left:calc(397 * var(--u)); top:calc(37 * var(--u));
    width:calc(684 * var(--u));
    color:var(--c-dark);
  }
  .dirs--b2b .dirs__title .num{ color:var(--c-dark-40); }
  .dirs--b2b .dirs__panel{ background:var(--c-cyan); }
  .dirs--b2b .dirs__slide{ background:transparent; color:var(--c-dark); }
  .dirs--b2b .dirs__text{
    left:calc(397 * var(--u)); top:calc(143 * var(--u));
    width:calc(684 * var(--u));
  }
  .dirs--b2b .dirs__img--1{
    left:calc(10 * var(--u)); top:calc(10 * var(--u));
    width:calc(360 * var(--u)); height:calc(354 * var(--u));
    object-position:left center;
  }
  .dirs--b2b .dirs__img--2{
    left:auto; right:calc(10 * var(--u)); top:calc(246 * var(--u));
    width:calc(360 * var(--u)); height:calc(354 * var(--u));
  }

  .theme-dark .svc__card{ flex-basis:22.6%; }
  .svc__card--wide-b2b{ flex-basis:38.3% !important; }

  .cases--b2b{ overflow-x:clip; }
  .cases--b2b .cases__btitle{ margin-left:calc(446 / 1180 * 100%); }
  .cases__grid--b2b{ margin-right:calc(-163 / 1180 * 100%); }
  .cases__bcard{
    padding:0; background:transparent; border-radius:var(--radius-s);
    height:336px; overflow:hidden;
  }
  .cases__bcard::after{
    content:''; position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(102,102,102,0) 48%, rgba(0,0,0,.5) 100%);
  }
  .cases__bcard img{ height:100%; border-radius:0; }
  .cases__bcard .svc__caption{
    position:absolute; margin:0;
    left:5%; right:10%; bottom:5%;
    font-weight:700; font-size:22px; text-transform:none;
  }
  .cases__bcard--1{ flex-basis:22.6%; }
  .cases__bcard--2{ flex-basis:38.3%; border:0; }
  .cases__bcard--3{ flex-basis:48.6%; }
  .cases__note{ display:none; }
}
