/* ==========================================================================
   СОБЫТИЯ РУМ — tokens
   ========================================================================== */
:root{
  --z-green:#9fe870;
  --z-green-active:#cdffad;
  --z-green-neutral:#c5edab;
  --z-green-pale:#e2f6d5;
  --z-ink:#0e0f0c;
  --z-body:#454745;
  --z-mute:#868685;
  --z-canvas:#ffffff;
  --z-canvas-soft:#e8ebe6;
  --z-negative:#d03238;
  --z-on-primary:#0e0f0c;

  --color-primary:var(--z-green);
  --color-primary-hover:var(--z-green-active);
  --color-primary-neutral:var(--z-green-neutral);
  --color-primary-pale:var(--z-green-pale);
  --color-on-primary:var(--z-on-primary);
  --text-heading:var(--z-ink);
  --text-body:var(--z-body);
  --text-mute:var(--z-mute);
  --text-on-dark:var(--z-canvas-soft);
  --surface-canvas:var(--z-canvas);
  --surface-soft:var(--z-canvas-soft);
  --surface-dark:var(--z-ink);
  --border-default:var(--z-ink);
  --color-negative:var(--z-negative);

  --radius-sm:8px;--radius-md:12px;--radius-lg:16px;--radius-xl:24px;--radius-pill:9999px;

  --font-display:'Manrope','Inter',system-ui,-apple-system,sans-serif;
  --font-body:'Inter',system-ui,-apple-system,sans-serif;

  --ease:cubic-bezier(0.16,1,0.3,1);

  /* Логотип: крупный на загрузке, к концу прокрутки шапки — обычный.
     --logo-t ведёт скрипт: 0 — крупный, 1 — обычный. */
  --logo-min:clamp(34px,3.4vw,46px);
  --logo-max:clamp(84px,9.6vw,140px);
  --logo-t:0;
}

/* ==========================================================================
   Base
   ========================================================================== */
*{box-sizing:border-box}
[hidden]{display:none !important}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--surface-soft);
  font-family:var(--font-body);
  color:var(--text-body);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%}
a{color:var(--z-ink);text-decoration:none}
input,textarea,button,select{font-family:var(--font-body)}
::selection{background:var(--z-green);color:var(--z-ink)}
h1,h2,h3,p,blockquote,figure{margin:0}

/* Уводим вверх, а не влево: сдвиг за левый край растягивал страницу
   по горизонтали и давал лишнюю прокрутку на телефоне. */
.skip-link{
  position:absolute;left:0;top:0;z-index:200;transform:translateY(-200%);
  background:var(--z-green);color:var(--z-ink);padding:12px 20px;border-radius:0 0 12px 0;font-weight:600;
}
.skip-link:focus{transform:none}

.wrap{width:100%;max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,48px)}

@keyframes marq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes marqBack{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes hint{0%,100%{transform:translateY(0);opacity:.35}50%{transform:translateY(7px);opacity:1}}
@keyframes spin{to{transform:rotate(360deg)}}

@media (prefers-reduced-motion: reduce){
  *{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
}

/* reveal-on-scroll (JS toggles .is-visible) */
.reveal, .reveal-init{opacity:0;transform:translateY(22px);transition:opacity .55s var(--ease),transform .55s var(--ease);transition-delay:var(--reveal-delay,0ms)}
.reveal.is-visible, .reveal-init.is-visible, .no-js .reveal, .no-js .reveal-init{opacity:1;transform:none}

/* ==========================================================================
   Buttons / form atoms (mirrors design-system Button/Input/Checkbox)
   ========================================================================== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:var(--font-body);font-weight:600;line-height:24px;
  border-radius:var(--radius-xl);cursor:pointer;
  transition:background-color .15s ease, transform .1s ease, border-color .2s ease;
  border:none;
}
.btn:active{transform:scale(.97)}
.btn--md{font-size:16px;padding:12px 24px}
.btn--lg{font-size:18px;padding:16px 32px}
.btn--primary{background:var(--color-primary);color:var(--color-on-primary)}
.btn--primary:hover{background:var(--color-primary-hover)}
.btn--primary:active{background:var(--color-primary-neutral)}
.btn--tertiary{background:var(--surface-canvas);color:var(--text-heading);border:1px solid var(--border-default)}
.btn--tertiary:hover{background:var(--surface-soft)}
.btn--ghost-dark{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:16px 32px;border-radius:var(--radius-xl);border:1px solid rgba(255,255,255,.35);
  font-size:18px;font-weight:600;color:var(--text-on-dark);
  transition:background-color .2s ease,border-color .2s ease,color .2s ease;
}
.btn--ghost-dark:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6);color:var(--z-canvas)}
.btn:disabled{opacity:.6;cursor:not-allowed}
.btn__spinner{
  width:16px;height:16px;border-radius:50%;display:inline-block;
  border:2px solid rgba(14,15,12,.25);border-top-color:var(--z-ink);
  animation:spin .7s linear infinite;
}

.tag{padding:6px 14px;border-radius:var(--radius-pill);border:1px solid rgba(159,232,112,.4);font-size:13px;font-weight:600;color:var(--z-green)}
.tag--pale{padding:8px 16px;border-radius:var(--radius-pill);background:var(--color-primary-pale);font-size:14px;font-weight:600;color:var(--text-heading);border:none}
.points{list-style:none;margin:0 0 28px;padding:0}
.points li{
  display:flex;gap:12px;padding:14px 0;border-top:1px solid rgba(14,15,12,.12);
  font-size:clamp(15px,1.15vw,17px);line-height:1.5;color:var(--text-body);
}
.points li::before{content:"";flex:0 0 auto;width:8px;height:8px;margin-top:.6em;border-radius:var(--radius-pill);background:var(--color-primary)}

.section-eyebrow{margin:0 0 16px;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-mute)}
.section-eyebrow--dark{color:var(--z-green)}
.section-title{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(32px,5.2vw,72px);line-height:.95;letter-spacing:-.025em;color:var(--text-heading)}
.section-title--md{font-size:clamp(30px,4.2vw,60px);line-height:.98}
/* Подзаголовок внутри блока — ниже по рангу, чем заголовок секции. */
.section-title--sm{font-size:clamp(23px,2.6vw,38px);line-height:1.02}
.section-title--contacts{font-size:clamp(30px,4.6vw,68px);line-height:.98;color:var(--z-canvas);max-width:22em}

.section-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:clamp(28px,4vw,48px)}
.section-head__main{flex:1 1 420px}
.section-head__main .section-eyebrow{margin-bottom:16px}
.section-head__note{margin:0;flex:0 1 380px;font-size:clamp(15px,1.15vw,17px);line-height:1.55;color:var(--text-body)}
.section-head--dark{margin-bottom:clamp(32px,4vw,56px)}

/* ==========================================================================
   Header
   ========================================================================== */
.header{
  position:fixed;top:0;left:0;right:0;z-index:90;
  padding:20px 0;background:transparent;border-bottom:1px solid transparent;
  transition:background-color .25s ease, border-color .25s ease, padding .25s ease, backdrop-filter .25s ease;
}
.header.is-scrolled{
  background:rgba(14,15,12,.88);border-bottom-color:rgba(255,255,255,.12);
  padding:12px 0;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
}
.header__inner{
  width:100%;max-width:1320px;margin:0 auto;padding:0 clamp(20px,4vw,48px);
  display:flex;align-items:center;justify-content:space-between;gap:24px;
}
.header__logo{flex:0 0 auto;display:block;line-height:0}
.header__logo img{
  display:block;width:auto;
  height:calc(var(--logo-max) + (var(--logo-min) - var(--logo-max)) * var(--logo-t));
}
/* Без скрипта логотип сразу обычного размера — крупный вид ожил бы навсегда. */
.no-js .header__logo img{height:var(--logo-min)}
@media (prefers-reduced-motion: reduce){
  .header__logo img{height:var(--logo-min)}
}
.header__nav{display:flex;align-items:center;gap:clamp(14px,1.4vw,22px)}
.header__nav a{font-size:14px;font-weight:600;color:var(--z-canvas);opacity:.75;transition:opacity .15s ease;white-space:nowrap}
.header__nav a:hover{opacity:1}
.header__actions{display:flex;align-items:center;gap:10px;flex:0 0 auto}
.header__phone{font-size:15px;font-weight:600;color:var(--z-canvas);white-space:nowrap}
.header__icon-link{
  width:40px;height:40px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.28);
  display:flex;align-items:center;justify-content:center;color:var(--z-canvas);
  transition:background-color .15s ease,color .15s ease,border-color .15s ease;
}
.header__icon-link:hover{background:var(--z-green);color:var(--z-ink);border-color:var(--z-green)}
.header__icon-link--max span{font-family:var(--font-display);font-weight:900;font-size:12px;letter-spacing:-.02em;line-height:1}
.header__mobile-actions{display:none;align-items:center;gap:10px}
/* Звонок и Telegram держим в шапке: закреплённая панель внизу закрывала
   содержимое на телефоне. Подписи не помещаются рядом с логотипом, поэтому
   действия сведены к значкам — название каждого читает озвучка экрана. */
.header__action{
  width:44px;height:44px;flex:0 0 auto;border-radius:var(--radius-pill);
  border:1px solid rgba(255,255,255,.28);display:flex;align-items:center;justify-content:center;
  color:var(--z-canvas);transition:background-color .15s ease,border-color .15s ease;
}
.header__action:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.6)}
.header__action--tg{background:var(--color-primary);border-color:var(--color-primary);color:var(--z-ink)}
.header__action--tg:hover{background:var(--color-primary-hover);border-color:var(--color-primary-hover)}

.header__burger{
  width:44px;height:44px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.28);
  background:transparent;color:var(--z-canvas);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;cursor:pointer;padding:0;
}
.header__burger span{display:block;width:18px;height:1.8px;background:currentColor}

/* Крупный логотип съедает ширину шапки, поэтому полное меню показываем только
   там, где всё помещается в строку: иконки мессенджеров — от 1400px (они
   продублированы в контактах и футере), само меню — от 1200px. */
@media (max-width:1399px){
  .header__icon-link{display:none}
}
@media (max-width:1199px){
  .header__nav,.header__actions{display:none}
  .header__mobile-actions{display:flex}
}
/* На узких телефонах логотип и три круглых действия идут вплотную —
   поджимаем расстояние между ними, чтобы бургер не уехал за край. */
@media (max-width:419px){
  .header__mobile-actions{gap:6px}
}

/* ==========================================================================
   Mobile menu overlay
   ========================================================================== */
.mobile-menu{
  position:fixed;inset:0;z-index:95;background:var(--surface-dark);color:var(--text-on-dark);
  display:flex;flex-direction:column;padding:24px clamp(20px,5vw,40px) 40px;
  animation:fadeUp .3s var(--ease) both;
}
.mobile-menu[hidden]{display:none}
.mobile-menu__top{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:auto}
.mobile-menu__logo{display:block;height:42px;width:auto}
.mobile-menu__close{
  width:44px;height:44px;border-radius:var(--radius-pill);border:1px solid rgba(255,255,255,.25);
  background:transparent;color:var(--text-on-dark);font-size:22px;line-height:1;cursor:pointer;
}
.mobile-menu__nav{display:flex;flex-direction:column;gap:8px;padding:40px 0}
.mobile-menu__nav a{font-family:var(--font-display);font-weight:900;font-size:clamp(30px,9vw,44px);line-height:1.1;color:var(--text-on-dark)}
.mobile-menu__bottom{display:flex;flex-direction:column;gap:16px;margin-top:auto}
.mobile-menu__phone{font-size:20px;font-weight:600;color:var(--z-green)}

/* ==========================================================================
   Hero
   ========================================================================== */
.hero{
  position:relative;background:var(--surface-dark);color:var(--text-on-dark);
  min-height:100svh;display:flex;flex-direction:column;justify-content:flex-end;
  overflow:hidden;isolation:isolate;
}
/* Под видео лежит его же первый кадр. Пока ролик открывается — и в редком
   случае, когда браузер наотрез отказался его играть, — шапка выглядит так
   же, только без движения. Чёрной она не бывает никогда. */
.hero__bg{
  position:absolute;inset:0;z-index:0;opacity:.42;will-change:transform;
  background:var(--surface-dark) url('media/hero-still.jpg') center/cover no-repeat;
}
.hero__video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s ease}
.hero__video.is-ready{opacity:1}
.hero__veil{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:linear-gradient(180deg,rgba(14,15,12,.86) 0%,rgba(14,15,12,.5) 42%,rgba(14,15,12,.94) 100%);
}
.hero__content{position:relative;z-index:2;width:100%;max-width:1320px;margin:0 auto;padding:140px clamp(20px,4vw,48px) clamp(32px,4vw,56px)}
.hero__eyebrow{margin:0 0 clamp(20px,3vw,32px);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--z-green)}
.hero__title{
  margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(34px,5.6vw,80px);
  line-height:.96;letter-spacing:-.025em;color:var(--z-canvas);max-width:20em;text-wrap:balance;
}
.hero__row{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:clamp(24px,4vw,64px);margin-top:clamp(28px,4vw,52px)}
.hero__lead{margin:0;flex:1 1 380px;max-width:600px;font-size:clamp(16px,1.35vw,20px);line-height:1.5;color:var(--text-on-dark)}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px}
.hero__foot{
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(14px,2vw,28px);
  margin-top:clamp(32px,4vw,56px);padding-top:24px;border-top:1px solid rgba(255,255,255,.14);
}
.hero__foot-label{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:rgba(232,235,230,.5)}
.hero__foot .marquee-mask{flex:1 1 260px;min-width:0}
.hero__scroll-hint{
  margin-left:auto;display:flex;flex-direction:column;align-items:center;gap:6px;
  color:rgba(232,235,230,.5);animation:hint 2.2s ease-in-out infinite;
}
.hero__scroll-hint span{font-size:11px;letter-spacing:.1em;text-transform:uppercase}

/* marquee */
.marquee-mask{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.marquee-track{display:flex;width:max-content}
.marquee-track:hover{animation-play-state:paused}
#clients-track,.marquee-track--clients{gap:clamp(32px,4.5vw,72px);animation:marq 34s linear infinite}
#venues-track{gap:clamp(14px,2vw,28px);animation:marqBack 46s linear infinite}
.marquee-group{display:flex;align-items:center;gap:clamp(14px,2vw,28px);flex:0 0 auto}
#clients-track .marquee-group,.marquee-track--clients .marquee-group{gap:clamp(32px,4.5vw,72px)}
.venue-item{display:flex;align-items:center;gap:clamp(14px,2vw,28px);flex:0 0 auto}
.venue-item span:first-child{font-family:var(--font-display);font-weight:800;font-size:clamp(14px,1.25vw,18px);white-space:nowrap;color:var(--text-on-dark)}
.venue-item span:last-child{color:rgba(255,255,255,.25)}
.client-item{font-family:var(--font-display);font-weight:800;font-size:clamp(20px,2.4vw,34px);letter-spacing:-.02em;white-space:nowrap;color:rgba(232,235,230,.42);transition:color .2s ease}
.client-item:hover{color:var(--z-green)}

/* ==========================================================================
   Clients strip
   ========================================================================== */
.clients{background:var(--surface-dark);padding:clamp(40px,5vw,64px) 0;border-top:1px solid rgba(255,255,255,.1)}
.clients .section-eyebrow{padding:0 clamp(20px,4vw,48px);max-width:1320px;margin-left:auto;margin-right:auto;margin-bottom:clamp(24px,3vw,40px)}

/* ==========================================================================
   Services / bento
   ========================================================================== */
.services{padding:clamp(56px,8vw,112px) 0}
.bento{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(12px,1.2vw,20px);grid-auto-rows:minmax(180px,auto)}
@media (min-width:700px){.bento{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.bento{grid-template-columns:repeat(4,minmax(0,1fr))}}

.service-card{
  position:relative;overflow:hidden;text-align:left;border:none;cursor:pointer;
  border-radius:var(--radius-xl);padding:clamp(20px,2vw,32px);
  display:flex;flex-direction:column;justify-content:space-between;gap:24px;
  transition:transform .22s var(--ease),background-color .2s ease;font-family:inherit;
}
.service-card:hover,.service-card:focus-visible{transform:translateY(-4px);outline:none}
/* Фото видно всегда. При наведении оно чуть ярче: затемнение слабее,
   яркость выше, лёгкое приближение. */
.service-card__photo{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none;
  opacity:1;transform:scale(1);filter:brightness(1);
  transition:transform .8s var(--ease),filter .45s ease;
}
.service-card:hover .service-card__photo,.service-card:focus-visible .service-card__photo{transform:scale(1.06);filter:brightness(1.08)}
.service-card__veil{
  position:absolute;inset:0;pointer-events:none;opacity:1;transition:opacity .45s ease;
  background:linear-gradient(180deg,rgba(14,15,12,.5) 0%,rgba(14,15,12,.76) 52%,rgba(14,15,12,.93) 100%);
}
.service-card:hover .service-card__veil,.service-card:focus-visible .service-card__veil{opacity:.82}
.service-card__top{position:relative;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;z-index:1}
.service-card__num{font-family:var(--font-display);font-weight:900;font-size:13px;letter-spacing:.1em;transition:color .35s ease}
.service-card__icon{flex:0 0 auto;transition:color .35s ease}
.service-card__bottom{position:relative;z-index:1}
.service-card__title{display:block;margin:0 0 8px;line-height:1.2;letter-spacing:-.02em;transition:color .35s ease}
.service-card__title--body{font-family:var(--font-body);font-weight:600;font-size:clamp(20px,1.7vw,26px)}
.service-card__title--display{font-family:var(--font-display);font-weight:900}
.service-card__title--display:not(.service-card__title--md){font-size:clamp(26px,3vw,44px);margin-bottom:12px;line-height:1.02}
.service-card__title--md{font-size:clamp(22px,2.2vw,32px);line-height:1.05}
.service-card__body{display:block;margin:0;font-size:15px;line-height:1.5;transition:color .35s ease,opacity .35s ease}
/* Подробности внутри карточки услуги: по кнопке, чтобы плитка оставалась
   ровной, а детали были под рукой у того, кому они нужны. */
.card-more{display:block;margin-top:18px}
.card-more__toggle{
  display:inline-flex;align-items:center;gap:7px;padding:0;border:none;background:none;
  font-family:inherit;font-size:14px;font-weight:700;color:var(--z-green);cursor:pointer;
}
.card-more__toggle:hover{text-decoration:underline;text-underline-offset:3px}
.card-more__chevron{flex:0 0 auto;transition:transform .2s ease}
.card-more__toggle[aria-expanded="true"] .card-more__chevron{transform:rotate(180deg)}
.card-more__body{display:flex;flex-direction:column;gap:10px;margin-top:14px}
.card-more__body[hidden]{display:none}
.card-more__row{display:block;font-size:14px;line-height:1.5;color:var(--text-on-dark)}
.card-more__row b{font-weight:700;color:var(--z-canvas)}
@media (prefers-reduced-motion:reduce){.card-more__chevron{transition:none}}

.service-card__tags{position:relative;z-index:1;display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}

.service-card--wide{grid-column:auto}
@media (min-width:700px){.service-card--wide{grid-column:span 2}}

.service-card--build{
  background:var(--surface-dark);color:var(--z-green);min-height:280px;grid-column:auto;
}
@media (min-width:700px){.service-card--build{grid-column:span 2}}
@media (min-width:1024px){.service-card--build{grid-row:span 2}}
.service-card--build .service-card__num{color:var(--z-green)}
.service-card--build .service-card__icon{color:var(--z-green)}
.service-card--build .service-card__title{color:var(--z-canvas)}
.service-card--build .service-card__body{color:var(--text-on-dark)}

/* Фон виден только пока грузится фото — держим его тёмным, чтобы светлый
   текст был читаем с первой отрисовки. */
.service-card--white{background:var(--surface-dark)}
.service-card--white .service-card__num{color:var(--z-green)}
.service-card--white .service-card__icon{color:var(--z-canvas)}
.service-card--white .service-card__title{color:var(--z-canvas)}
.service-card--white .service-card__body{color:var(--text-on-dark)}
.service-card__body--catering{color:inherit;opacity:.92}

.service-card--lime{background:var(--surface-dark);min-height:220px}
.service-card--lime .service-card__num{color:var(--z-green)}
.service-card--lime .service-card__icon{color:var(--z-canvas)}
.service-card--lime .service-card__title{color:var(--z-canvas)}
.service-card--lime .service-card__body{color:var(--text-on-dark)}

.service-card--wide:not(.service-card--build){min-height:220px}

/* Продолжение блока услуг: дополнительные зоны, подпись под плиткой. */
.services__extra{margin-top:clamp(32px,4vw,52px);padding-top:clamp(28px,3.4vw,44px);border-top:1px solid rgba(14,15,12,.14)}
.services__extra .section-title{margin:0 0 clamp(18px,2vw,26px)}
.services__note{margin:clamp(24px,2.8vw,36px) 0 0;max-width:52em;font-size:clamp(15px,1.15vw,17px);line-height:1.55;color:var(--text-body)}
/* Подпись в шапке блока заявки — фон тёмный. */
.section-head--dark .section-head__note{color:var(--text-on-dark)}

/* ==========================================================================
   Why us
   ========================================================================== */
.why{padding:0 0 clamp(56px,8vw,112px)}
.why__grid{display:flex;flex-wrap:wrap;gap:clamp(20px,2.4vw,40px);align-items:stretch}
.why__list{flex:1 1 520px;min-width:300px;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,20px)}
.why__item{background:var(--surface-canvas);border-radius:var(--radius-xl);padding:clamp(20px,1.8vw,28px);display:flex;gap:20px;align-items:flex-start}
.why__item svg{color:var(--text-heading);flex:0 0 auto;margin-top:2px}
.why__item h3{margin:0 0 6px;font-size:20px;font-weight:600;letter-spacing:-.02em;color:var(--text-heading)}
.why__item p{margin:0;font-size:15px;line-height:1.5;color:var(--text-body)}
.why__quote{
  flex:1 1 420px;min-width:300px;margin:0;background:var(--color-primary-pale);border-radius:var(--radius-xl);
  padding:clamp(28px,3vw,48px);display:flex;flex-direction:column;justify-content:center;gap:24px;
}
.why__quote svg{flex:0 0 auto}
.why__quote blockquote{font-family:var(--font-display);font-weight:900;font-size:clamp(21px,2.1vw,32px);line-height:1.18;letter-spacing:-.02em;color:var(--text-heading)}
.why__quote figcaption{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-body)}

/* ==========================================================================
   Stats
   ========================================================================== */
.stats{background:var(--surface-canvas);padding:clamp(40px,5vw,72px) 0}
.stats__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:clamp(20px,2.5vw,40px)}
.stat{display:flex;flex-direction:column;gap:8px;padding-top:20px;border-top:1px solid var(--border-default)}
.stat__row{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.stat__num{font-family:var(--font-display);font-weight:900;font-size:clamp(40px,5vw,72px);line-height:.9;letter-spacing:-.03em;color:var(--text-heading)}
.stat__unit{font-family:var(--font-display);font-weight:800;font-size:clamp(16px,1.6vw,24px);color:var(--text-heading)}
.stat__label{font-size:15px;line-height:1.45;color:var(--text-body)}

/* ==========================================================================
   Cases
   ========================================================================== */
.cases{padding:clamp(56px,8vw,112px) 0}
.cases__list{display:flex;flex-direction:column;border-top:1px solid var(--border-default)}
.case{border-bottom:1px solid rgba(14,15,12,.14)}
.case__row{
  display:flex;align-items:center;gap:clamp(14px,2vw,32px);width:100%;text-align:left;
  padding:clamp(16px,1.8vw,26px) clamp(8px,1.5vw,20px);cursor:pointer;
  background:transparent;border:none;font-family:inherit;
  transition:background-color .2s ease;
}
.case__row:hover{background:var(--surface-canvas)}
.case.is-open .case__row{background:var(--surface-canvas)}
.case__n{font-family:var(--font-display);font-weight:900;font-size:clamp(13px,1.1vw,15px);letter-spacing:.06em;color:var(--text-mute);flex:0 0 auto;min-width:2.2em}
.case__title{margin:0;flex:1 1 auto;font-family:var(--font-display);font-weight:900;font-size:clamp(19px,2.5vw,36px);line-height:1.08;letter-spacing:-.025em;color:var(--text-heading)}
.case__year{font-size:clamp(12px,1vw,14px);font-weight:600;letter-spacing:.04em;color:var(--text-mute);flex:0 0 auto;white-space:nowrap}
.case__chevron{
  flex:0 0 auto;width:36px;height:36px;border-radius:var(--radius-pill);border:1px solid var(--border-default);
  display:flex;align-items:center;justify-content:center;color:var(--text-heading);
  transition:transform .25s var(--ease),background-color .2s ease;
}
.case.is-open .case__chevron{transform:rotate(180deg);background:var(--color-primary)}
/* На телефонах длинное название и год «2024, 2025, 2026» распирали строку
   шире экрана и давали горизонтальную прокрутку страницы. */
@media (max-width:600px){
  .case__row{gap:10px}
  .case__title{min-width:0;overflow-wrap:anywhere}
  .case__year{white-space:normal;text-align:right}
}
/* Кейсы на страницах направлений собраны в разметке, а не скриптом:
   текст виден поисковику и читается, даже если скрипт не загрузился.
   Раскрытие — штатное <details>, поэтому состояние держит сам браузер. */
.case > .case__row{list-style:none}
.case > .case__row::-webkit-details-marker{display:none}
.case > .case__row::marker{content:""}
.case[open] > .case__row{background:var(--surface-canvas)}
.case[open] .case__chevron{transform:rotate(180deg);background:var(--color-primary)}
.case[open] > .case__panel{display:flex}
.case__note{
  font-size:clamp(12px,1vw,14px);font-weight:600;letter-spacing:.04em;
  color:var(--text-mute);flex:0 0 auto;
}
@media (max-width:600px){.case__note{white-space:normal;text-align:right}}
.case__list{list-style:none;margin:6px 0 0;padding:0;display:flex;flex-direction:column;gap:8px}
.case__list li{
  display:flex;gap:10px;font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:var(--text-body);
}
.case__list li::before{
  content:"";flex:0 0 auto;width:6px;height:6px;margin-top:.62em;
  border-radius:var(--radius-pill);background:var(--color-primary);
}
.case__link{margin:0}
.case__link a{
  font-weight:700;color:var(--text-heading);text-decoration:underline;
  text-underline-offset:3px;transition:color .15s ease;
}
.case__link a:hover{color:var(--z-green)}
/* На телефоне название занимает всю ширину строки. Иначе номер, пометка
   и стрелка отъедают место, и длинный заголовок сжимается в столбик
   по одной букве. */
@media (max-width:600px){
  details.case > .case__row{flex-wrap:wrap;row-gap:10px}
  details.case > .case__row .case__n{order:1}
  details.case > .case__row .case__note{order:2;margin-left:auto;text-align:right}
  details.case > .case__row .case__chevron{order:3;margin-left:auto}
  details.case > .case__row .case__note + .case__chevron{margin-left:0}
  details.case > .case__row .case__title{order:4;flex:1 1 100%;overflow-wrap:break-word}
}

/* Отступ сверху такой же, как снизу: раскрытая карточка дышит одинаково. */
.case__panel{display:none;flex-wrap:wrap;gap:clamp(20px,2.4vw,40px);padding:clamp(24px,2.6vw,40px) clamp(8px,1.5vw,20px);animation:fadeUp .4s var(--ease) both}
.case.is-open .case__panel{display:flex}
.case__info{flex:1 1 380px;min-width:280px;display:flex;flex-direction:column;gap:clamp(16px,1.6vw,24px)}
.case__fields{display:flex;flex-wrap:wrap;gap:clamp(16px,2vw,32px)}
.case__field{flex:1 1 160px}
.case__field-label{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute)}
.case__field-value{margin:0;font-size:17px;font-weight:600;line-height:1.35;color:var(--text-heading)}
.case__tasks p{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute)}
.case__tasks span{display:block;font-size:clamp(15px,1.15vw,18px);line-height:1.5;color:var(--text-body)}
.case__cta{margin-top:auto;padding-top:8px}
.case__media{flex:1 1 380px;min-width:280px;aspect-ratio:3/2;border-radius:var(--radius-xl);overflow:hidden;background:var(--surface-canvas)}
.case__media img{width:100%;height:100%;object-fit:cover;display:block}
.case__placeholder{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;
  background:var(--surface-dark);color:var(--z-green);font-family:var(--font-display);font-weight:800;font-size:clamp(16px,1.6vw,20px);
}
.cases__more{display:flex;justify-content:center;margin-top:clamp(28px,3vw,44px)}
.cases__filters{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(20px,2.4vw,32px)}
.cases__empty{margin:0;padding:32px 0;font-size:16px;color:var(--text-mute)}

/* ==========================================================================
   Reviews
   ========================================================================== */
.reviews{background:var(--surface-dark);padding:clamp(56px,8vw,112px) 0;overflow:hidden}
.reviews__nav{display:flex;gap:10px;flex:0 0 auto}
.reviews__arrow{
  width:52px;height:52px;border-radius:var(--radius-pill);background:transparent;cursor:pointer;
  border:1px solid rgba(255,255,255,.28);color:var(--text-on-dark);
  display:flex;align-items:center;justify-content:center;
  transition:background-color .15s ease,color .15s ease,border-color .15s ease,opacity .15s ease;
}
.reviews__arrow:hover:not(:disabled){background:var(--color-primary);color:var(--z-ink);border-color:var(--color-primary)}
.reviews__arrow:disabled{opacity:.3;cursor:default}

/* Лента прокручивается пальцем и колесом; стрелки и точки — для мыши. */
/* Сколько карточек видно разом. Ширина карточки считается от этого числа,
   поэтому лента всегда делится на целые экраны и не застревает на полкарточке. */
.reviews__viewport{
  --per:1;--gap:clamp(16px,2vw,28px);
  display:flex;gap:var(--gap);overflow-x:auto;overscroll-behavior-x:contain;
  scroll-snap-type:x mandatory;scroll-padding-left:0;
  padding-bottom:4px;scrollbar-width:none;-ms-overflow-style:none;
}
@media (min-width:768px){.reviews__viewport{--per:2}}
@media (min-width:1180px){.reviews__viewport{--per:3}}
.reviews__viewport::-webkit-scrollbar{display:none}
.reviews__viewport:focus-visible{outline:2px solid var(--color-primary);outline-offset:6px}

.review{
  flex:0 0 calc((100% - (var(--per) - 1) * var(--gap)) / var(--per));scroll-snap-align:start;
  display:flex;flex-direction:column;gap:clamp(20px,2.4vw,32px);
  padding:clamp(24px,2.6vw,40px);border-radius:var(--radius-xl);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
}
.review__mark{flex:0 0 auto;color:var(--color-primary)}
.review__quote{
  margin:0;flex:1 1 auto;font-family:var(--font-display);font-weight:800;
  font-size:clamp(17px,1.5vw,22px);line-height:1.35;letter-spacing:-.02em;color:var(--z-canvas);
}
.review__author{display:flex;flex-direction:column;gap:4px}
.review__name{font-size:16px;font-weight:600;color:var(--text-on-dark)}
.review__role{font-size:13px;line-height:1.45;color:rgba(232,235,230,.6)}

/* Пока отзыв не заполнен — видно, что это рыба, а не чей-то настоящий отзыв. */
.review--placeholder{background:transparent;border-style:dashed;border-color:rgba(255,255,255,.24)}
.review--placeholder .review__quote{color:rgba(232,235,230,.55);font-weight:600}
.review--placeholder .review__mark{color:rgba(159,232,112,.45)}

.reviews__dots{display:flex;flex-wrap:wrap;gap:8px;margin-top:clamp(20px,2.4vw,32px)}
.reviews__dot{
  width:28px;height:4px;border-radius:var(--radius-pill);border:none;padding:0;cursor:pointer;
  background:rgba(255,255,255,.22);transition:background-color .2s ease,width .2s ease;
}
.reviews__dot.is-active{background:var(--color-primary);width:44px}
.reviews__dot:focus-visible{outline:2px solid var(--color-primary);outline-offset:4px}

@media (max-width:767px){
  .reviews__nav{display:none}
}
/* Все карточки на виду — прятать нечего, органы управления лишние. */
.reviews--static .reviews__nav,.reviews--static .reviews__dots{display:none}

/* ==========================================================================
   Process / timeline
   ========================================================================== */
.process{background:var(--surface-canvas);padding:clamp(56px,8vw,112px) 0}
.process .section-head{margin-bottom:clamp(32px,4vw,56px)}
.process .section-title{max-width:20em}
.timeline{display:grid;grid-template-columns:minmax(0,1fr);gap:clamp(20px,2vw,28px)}
@media (min-width:700px){.timeline{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (min-width:1024px){.timeline{grid-template-columns:repeat(4,minmax(0,1fr))}}
.timeline__step{display:flex;flex-direction:column;gap:16px}
.timeline__head{display:flex;align-items:center;gap:10px}
.timeline__dot{width:14px;height:14px;border-radius:var(--radius-pill);flex:0 0 auto;background:var(--surface-soft);box-shadow:0 0 0 1px rgba(14,15,12,.2);transition:background-color .35s ease,box-shadow .35s ease}
.timeline__line{flex:1 1 auto;height:1px;background:rgba(14,15,12,.14);transition:background-color .35s ease}
.timeline__step.is-active .timeline__dot{background:var(--color-primary);box-shadow:0 0 0 4px rgba(159,232,112,.35)}
.timeline__step.is-active .timeline__line{background:var(--color-primary)}
.timeline__num{margin:0 0 8px;font-family:var(--font-display);font-weight:900;font-size:13px;letter-spacing:.08em;color:var(--text-mute);transition:color .35s ease}
.timeline__step.is-active .timeline__num{color:var(--text-heading)}
.timeline__step h3{margin:0 0 8px;font-size:clamp(17px,1.5vw,21px);font-weight:600;line-height:1.25;letter-spacing:-.02em;color:var(--text-heading)}
.timeline__step p{margin:0;font-size:15px;line-height:1.5;color:var(--text-body)}

/* ==========================================================================
   Production
   ========================================================================== */
.production{padding:clamp(56px,8vw,112px) 0}
.production__grid{display:flex;flex-wrap:wrap;gap:clamp(24px,3vw,56px);align-items:center}
.production__media{flex:1 1 440px;min-width:300px;aspect-ratio:4/3;border-radius:var(--radius-xl);overflow:hidden;background:var(--surface-canvas)}
.production__placeholder{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;
  background:var(--color-primary-pale);color:var(--text-heading);font-family:var(--font-display);font-weight:800;font-size:clamp(18px,2vw,24px);
}
.production__text{flex:1 1 420px;min-width:300px}
.production__text .section-title{margin:0 0 20px}
.production__lead{margin:0 0 24px;font-size:clamp(16px,1.25vw,19px);line-height:1.55;color:var(--text-body)}
.production__tags{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.production__extra{margin-top:clamp(36px,4.5vw,64px);padding-top:clamp(32px,4vw,52px);border-top:1px solid rgba(14,15,12,.14)}
/* Пока блок с медиа скрыт, продолжение не начинается с линейки. */
.production__grid[hidden] + .wrap .production__extra:first-child{margin-top:0;padding-top:0;border-top:none}
.production__extra .section-title{margin:0 0 20px}
.production__extra .points{margin-bottom:0}
.production__extra .production__tags{margin-bottom:0}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{background:var(--surface-canvas);padding:clamp(56px,8vw,112px) 0}
.faq__grid{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,72px)}
.faq__head{flex:0 1 340px;min-width:260px}
.faq__list{flex:1 1 480px;min-width:300px;display:flex;flex-direction:column;border-top:1px solid rgba(14,15,12,.14)}
.faq__item{border-bottom:1px solid rgba(14,15,12,.14)}
.faq__q{
  width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  padding:clamp(18px,1.8vw,24px) 0;cursor:pointer;background:transparent;border:none;text-align:left;font-family:inherit;
}
.faq__q h3{margin:0;font-size:clamp(17px,1.5vw,21px);font-weight:600;line-height:1.35;letter-spacing:-.02em;color:var(--text-heading)}
.faq__toggle{
  flex:0 0 auto;width:32px;height:32px;border-radius:var(--radius-pill);border:1px solid var(--border-default);
  display:flex;align-items:center;justify-content:center;color:var(--text-heading);
  transition:transform .25s var(--ease),background-color .2s ease;
}
.faq__item.is-open .faq__toggle{transform:rotate(180deg);background:var(--color-primary)}
.faq__a{display:none;padding:clamp(20px,2vw,28px) 52px clamp(20px,2vw,28px) 0;animation:fadeUp .35s var(--ease) both}
.faq__a p{margin:0;font-size:clamp(15px,1.15vw,18px);line-height:1.55;color:var(--text-body)}
.faq__item.is-open .faq__a{display:block}

/* ==========================================================================
   Contacts / form
   ========================================================================== */
.contacts{background:var(--surface-dark);color:var(--text-on-dark);padding:clamp(56px,8vw,112px) 0 clamp(56px,7vw,96px)}
.contacts__grid{display:flex;flex-wrap:wrap;gap:clamp(20px,2.4vw,40px);align-items:flex-start}
.form-card{flex:1 1 560px;min-width:300px;background:var(--surface-canvas);border-radius:var(--radius-xl);padding:clamp(24px,2.6vw,40px);scroll-margin-top:110px}
.form-card[hidden]{display:none}

form#lead-form{display:flex;flex-direction:column;gap:clamp(16px,1.6vw,22px)}
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:clamp(14px,1.4vw,20px)}
.field{display:flex;flex-direction:column;gap:6px;font-family:var(--font-body)}
.field__label{font-size:14px;font-weight:600;color:var(--text-heading)}
.field input,.field textarea{
  font-family:var(--font-body);font-size:16px;line-height:24px;color:var(--text-heading);
  padding:12px 16px;border-radius:var(--radius-md);background:var(--surface-canvas);
  border:1px solid var(--border-default);outline:none;
}
.field textarea{resize:vertical}
.field input:focus,.field textarea:focus{border:2px solid var(--text-heading);padding:11px 15px}
.field.has-error input{border:1px solid var(--color-negative)}
.field__error{font-size:12px;color:var(--color-negative);min-height:0}
.field__error:empty{display:none}

.channel-block__label{margin:0 0 10px;font-size:14px;font-weight:600;color:var(--text-heading)}
.channel-block__options{display:flex;flex-wrap:wrap;gap:8px}
.chip{
  padding:10px 20px;border-radius:var(--radius-pill);font-size:14px;font-weight:600;cursor:pointer;
  background:var(--surface-canvas);border:1px solid var(--border-default);color:var(--text-heading);
  transition:background-color .15s ease,border-color .15s ease;font-family:inherit;
}
.chip.is-active{background:var(--color-primary);border-color:var(--color-primary)}

/* Необязательные поля прячем под кнопку: форму открывают ради контактов,
   подробности дописывают по желанию. */
.form-more__toggle{
  display:inline-flex;align-items:center;gap:8px;align-self:flex-start;
  padding:10px 18px;border-radius:var(--radius-pill);cursor:pointer;
  background:var(--surface-canvas);border:1px solid var(--border-default);
  color:var(--text-heading);font-family:inherit;font-size:15px;font-weight:600;
  transition:background-color .15s ease,border-color .15s ease;
}
.form-more__toggle:hover{background:var(--surface-soft)}
.form-more__chevron{transition:transform .2s ease;flex:0 0 auto}
.form-more__toggle[aria-expanded="true"] .form-more__chevron{transform:rotate(180deg)}
.form-more{display:flex;flex-direction:column;gap:clamp(14px,1.4vw,20px)}
.form-more[hidden]{display:none}
@media (prefers-reduced-motion:reduce){.form-more__chevron{transition:none}}

.file-field{
  display:flex;align-items:center;gap:14px;padding:16px;border-radius:var(--radius-md);
  border:1px dashed var(--border-default);cursor:pointer;transition:background-color .15s ease;color:var(--text-heading);
}
.file-field:hover{background:var(--surface-soft)}
.file-field span{flex:1 1 auto;font-size:15px;color:var(--text-body)}

.checkbox{display:flex;align-items:center;gap:10px;font-size:16px;color:var(--text-heading);cursor:pointer}
.checkbox__input{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;
  clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.checkbox__box{
  width:22px;height:22px;border-radius:6px;background:var(--surface-canvas);border:1px solid var(--border-default);
  display:flex;align-items:center;justify-content:center;transition:background-color .15s ease;flex:0 0 auto;
}
.checkbox__mark{font-size:14px;color:var(--color-on-primary);display:none}
/* Ссылка на политику внутри подписи — подчёркиваем, иначе её не отличить
   от обычного текста и никто по ней не нажмёт. */
.checkbox a{color:inherit;text-decoration:underline;text-underline-offset:2px;transition:color .15s ease}
.checkbox a:hover{color:var(--text-body)}
.checkbox__input:focus-visible + .checkbox__box{outline:2px solid var(--text-heading);outline-offset:2px}
.checkbox.is-checked .checkbox__box,.checkbox:has(input:checked) .checkbox__box{background:var(--color-primary)}
.checkbox.is-checked .checkbox__mark,.checkbox:has(input:checked) .checkbox__mark{display:inline}

#err-agree{margin:-8px 0 0;font-size:12px;color:var(--color-negative)}
#err-agree[hidden]{display:none}

.form-submit{display:flex;flex-wrap:wrap;align-items:center;gap:16px;padding-top:4px}
.form-submit__note{margin:0;font-size:13px;line-height:1.45;color:var(--text-mute);flex:1 1 200px}
.form-submit__note a{text-decoration:underline}
#submit-btn{gap:10px}

.form-error{padding:16px;border-radius:var(--radius-md);background:var(--color-primary-pale);font-size:15px;line-height:1.5;color:var(--text-heading)}
.form-error[hidden]{display:none}
.form-error a{font-weight:600;text-decoration:underline}

.form-success{display:flex;flex-direction:column;gap:20px;align-items:flex-start;animation:fadeUp .45s var(--ease) both}
.form-success[hidden]{display:none}
.form-success__icon{width:64px;height:64px;border-radius:var(--radius-pill);background:var(--color-primary);display:flex;align-items:center;justify-content:center;color:var(--z-ink)}
.form-success h3{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(26px,3vw,40px);line-height:1.05;letter-spacing:-.02em;color:var(--text-heading)}
.form-success p{margin:0;font-size:clamp(16px,1.2vw,19px);line-height:1.55;color:var(--text-body);max-width:34em}
.form-success__actions{display:flex;flex-wrap:wrap;gap:12px}

.contacts__aside{flex:1 1 320px;min-width:280px;display:flex;flex-direction:column;gap:clamp(12px,1.2vw,18px)}
.contacts__badge{background:var(--color-primary);border-radius:var(--radius-xl);padding:clamp(22px,2.2vw,32px)}
.contacts__badge p:first-child{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--z-ink);opacity:.6}
.contacts__badge-big{margin:0;font-family:var(--font-display);font-weight:900;font-size:clamp(34px,3.6vw,52px);line-height:.95;letter-spacing:-.03em;color:var(--z-ink)}
.contacts__card{background:var(--surface-canvas);border-radius:var(--radius-xl);padding:clamp(22px,2.2vw,32px);display:flex;flex-direction:column;gap:18px}
.contacts__label{margin:0 0 8px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--text-mute)}
.contacts__phone{display:block;font-size:19px;font-weight:600;color:var(--text-heading);margin-bottom:4px}
.contacts__phone span{font-weight:400;color:var(--text-mute)}
.contacts__email{font-size:19px;font-weight:600;color:var(--text-heading)}
.contacts__office{margin:0;font-size:15px;line-height:1.5;color:var(--text-body)}
.contacts__links{display:flex;flex-wrap:wrap;gap:8px}
.contacts__links a{
  flex:1 1 130px;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 18px;
  border-radius:var(--radius-xl);border:1px solid var(--border-default);font-size:15px;font-weight:600;color:var(--text-heading);
  transition:background-color .15s ease;
}
.contacts__links a:hover{background:var(--surface-soft)}

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{background:var(--surface-dark);color:var(--text-on-dark);padding:clamp(40px,5vw,64px) 0 clamp(88px,7vw,48px);border-top:1px solid rgba(255,255,255,.12)}
.footer__grid{display:flex;flex-wrap:wrap;gap:clamp(24px,4vw,64px);justify-content:space-between;padding-bottom:clamp(28px,3vw,48px)}
.footer__about{flex:0 1 300px}
.footer__about img{display:block;height:clamp(56px,5vw,76px);width:auto;margin:0 0 20px}
.footer__about p{margin:0;font-size:15px;line-height:1.55;color:rgba(232,235,230,.7);max-width:26em}
.footer__col{flex:0 1 auto;display:flex;flex-direction:column;gap:10px}
.footer__col p{margin:0 0 6px;font-size:12px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--z-green)}
.footer__col a,.footer__col span{font-size:15px;color:var(--text-on-dark);transition:color .15s ease}
.footer__col span{color:rgba(232,235,230,.7);line-height:1.5;max-width:20em}
.footer__col a:hover{color:var(--z-green)}
.footer__bottom{display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between;align-items:center;padding-top:24px;border-top:1px solid rgba(255,255,255,.12)}
.footer__bottom span{font-size:13px;color:rgba(232,235,230,.5)}
.footer__bottom a{font-size:13px;color:rgba(232,235,230,.5);text-decoration:underline;transition:color .15s ease}
.footer__bottom a:hover{color:var(--z-green)}

/* ==========================================================================
   Mobile sticky call bar
   ========================================================================== */
/* Поле-ловушка для ботов: убрано с глаз, но остаётся в разметке. */
.form-hp{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* ==========================================================================
   Cookie notice
   ========================================================================== */
/* Скрыт по умолчанию; скрипт показывает его, если согласия ещё не было. */
.cookie{display:none}
.cookie.is-visible{
  display:flex;flex-wrap:wrap;align-items:center;gap:clamp(12px,1.6vw,20px);
  position:fixed;z-index:90;left:clamp(12px,3vw,24px);right:clamp(12px,3vw,24px);
  bottom:calc(clamp(12px,3vw,24px) + env(safe-area-inset-bottom));
  max-width:720px;margin:0 auto;padding:clamp(16px,1.8vw,22px) clamp(18px,2vw,26px);
  background:var(--surface-dark);border:1px solid rgba(255,255,255,.22);border-radius:var(--radius-xl);
  animation:fadeUp .35s var(--ease) both;
}
@media (prefers-reduced-motion: reduce){
  .cookie.is-visible{animation:none}
}
.cookie__text{flex:1 1 320px;margin:0;font-size:14px;line-height:1.5;color:rgba(232,235,230,.78)}
.cookie__text a{color:var(--text-on-dark);text-decoration:underline;transition:color .15s ease}
.cookie__text a:hover{color:var(--z-green)}
.cookie__ok{flex:0 0 auto}