/* ============================================================================
 * theme-2026.css — глобальна тема «2026» (розкатка /2026/ на весь сайт).
 * Гейт-клас: body.theme-2026 (додається посторінково/по родинах → стадійна
 * розкатка + миттєвий відкат; на головній стане дефолтом у Кроці 5).
 * Підключається ОСТАННІМ: combined.php (головна) + page-head.php (внутрішні),
 * тож виграє каскад скрізь однаково. Кеш-бастинг авто (filemtime).
 * Значення — лише з токенів (СІТКА.md §2а/§3/§4); мережеві композити (mesh-тло,
 * бренд-кольори каналів) лишаються літералами.
 * cyan-стоп поглиблено #1FA6C2 → #1483A0 (контраст; рішення Di 15.06.2026).
 * Scroll-reveal (.rv) тут НЕМАЄ — він повʼязаний із JS, додається в Кроці 5 (головна).
 * ========================================================================== */

:root{
  /* --- pop-кольори (teal-ядро = наявний --bl-blue #2F6075, не дублюємо) --- */
  --bl-cyan:#1483A0;       /* поглиблений бірюзовий (було #1FA6C2 — контраст) */
  --bl-violet:#6C5CE7;     /* електричний фіолет — pop 2026 */
  --bl-pop:#FF7A59;        /* теплий корал — людяний акцент */
  --bl-amber:#FFB020;      /* бурштин — пара до коралу */

  /* --- градієнти --- */
  --grad-accent:linear-gradient(105deg,var(--bl-cyan) 0%,var(--bl-blue) 45%,var(--bl-violet) 100%);  /* eyebrow-чипи, смужки карток, лінія футера */
  --grad-cta:linear-gradient(120deg,var(--bl-blue) 0%,var(--bl-cyan) 52%,var(--bl-violet) 100%);     /* первинні CTA-кнопки */
  --grad-warm:linear-gradient(110deg,var(--bl-pop) 0%,var(--bl-amber) 100%);                          /* тепла нотатка під CTA */
  --grad-hero:linear-gradient(100deg,var(--bl-cyan) 0%,#3A76F0 50%,var(--bl-violet) 100%);            /* слово-герой «говорите» */
  --grad-cta-zone:linear-gradient(120deg,#234A5C 0%,var(--bl-blue) 44%,#4A3FB0 100%);                 /* темна кольорова зона CTA-смуги */

  /* --- bento-радіуси (24px = наявний --bl-radius-lg) --- */
  --bl-radius-bento:24px;       /* картки (desktop) */
  --bl-radius-bento-sm:20px;    /* картки (mobile ≤768) */
  --bl-radius-bento-lg:28px;    /* контейнери (плита логотипів) */
  --bl-radius-cta:16px;         /* градієнт-кнопки */

  /* --- кольорові тіні --- */
  --bl-shadow-bento:0 18px 44px rgba(31,68,90,.12),0 2px 8px rgba(31,68,90,.05);          /* картка (rest) */
  --bl-shadow-bento-hover:0 28px 60px rgba(31,68,90,.20),0 0 0 1px rgba(31,166,194,.15);  /* картка (hover) + кольорове кільце */
  --bl-shadow-cta:0 14px 34px rgba(47,96,117,.34);          /* CTA-кнопка (rest) */
  --bl-shadow-cta-hover:0 22px 50px rgba(47,96,117,.42);    /* CTA-кнопка (hover) */
  --bl-shadow-chip:0 8px 22px rgba(47,96,117,.28);          /* eyebrow-чип */
  --bl-shadow-warm:0 8px 20px rgba(255,122,89,.30);         /* тепла нотатка */
}

/* =========================================================================
 * 1) ТЛО — насичений mesh + плавучі органічні блоби (дофамін + fluid)
 * ====================================================================== */
body.theme-2026{
  background:
    radial-gradient(55% 50% at 10% 4%,  rgba(31,166,194,.20), transparent 60%),
    radial-gradient(50% 48% at 92% 8%,  rgba(108,92,231,.18), transparent 60%),
    radial-gradient(60% 55% at 88% 96%, rgba(47,96,117,.20),  transparent 62%),
    radial-gradient(55% 50% at 6% 92%,  rgba(255,122,89,.14), transparent 60%),
    linear-gradient(180deg,#F4F8F9 0%,#EEF3F4 50%,#F1ECF7 100%)
    !important;
  background-attachment:fixed !important;
}
body.theme-2026::before{
  content:""; position:fixed; inset:-12vmax; z-index:0; pointer-events:none;
  background:
    radial-gradient(26vmax 26vmax at 16% 24%, rgba(31,166,194,.28), transparent 60%),
    radial-gradient(22vmax 22vmax at 84% 26%, rgba(108,92,231,.24), transparent 62%),
    radial-gradient(30vmax 30vmax at 72% 82%, rgba(47,96,117,.24), transparent 60%),
    radial-gradient(18vmax 18vmax at 28% 80%, rgba(255,122,89,.18), transparent 62%);
  filter:blur(10px);
}
@keyframes bl26-parallax{
  from{ transform:translate3d(-3%,-15%,0) scale(1.04); }
  to  { transform:translate3d(3%, 22%,0) scale(1.14); }
}
@supports (animation-timeline: scroll()){
  body.theme-2026::before{ animation:bl26-parallax linear both; animation-timeline:scroll(root block); }
}
body.theme-2026 .site-overflow-hidden,
body.theme-2026 main,
body.theme-2026 .main-section,
body.theme-2026 header#header,
body.theme-2026 .bl-footer{ position:relative; z-index:1; }

/* =========================================================================
 * 2) ТИПОГРАФІКА — oversized hero (home) + глобальні заголовки секцій
 * ====================================================================== */
/* Hero-блок прив'язаний до розмітки головної; на внутрішніх сторінках цих
   класів нема → правила no-op. Глобальне тут — лише .main-section h2 і eyebrow. */
/* ритм героя (QA 20 — консистентність): зачин→перелік зведено 32→24 = рівний крок із logo→H1 (24)
   і внутрішніми відступами переліку (24). Великий крок лишається тільки перед CTA (~76). */
body.theme-2026 #header .hero-claim{ line-height:1.2 !important; letter-spacing:-.02em; margin:0 0 24px !important; } /* !important: перебиває display-lh із home-fix; word/зачин успадковують 1.2 */
body.theme-2026 #header .hero-claim .hero-claim__word{
  font-size:clamp(27px,3.7vw,46px) !important; /* desktop-стеля 52→46 (Di 16.06 «трішки зменшити H1, лише desktop»); стеля діє лише ≥~1243px — mobile floor 27 / vw-щабель НЕ зачеплені */
  font-weight:700 !important;
  letter-spacing:-.02em !important;
  line-height:1.2 !important; /* QA 20: єдиний інтерліньяж hero-тексту 1.2 (desktop+mobile) */
  color:rgba(28,38,54,.90) !important;
}
body.theme-2026 #header .hero-claim .hero-claim__accent{
  background:none !important;
  -webkit-background-clip:border-box !important; background-clip:border-box !important;
  -webkit-text-fill-color:currentColor !important; color:inherit !important;
}
body.theme-2026 #header .hero-claim .hero-claim__sub{
  display:block !important; margin-top:8px !important;
  /* гармонізація шкали (QA 16.06): зачин і тези-результати в один щабель 24/20 (було 22/17) */
  /* зведення ваг (QA 16.06): зачин 600→700 — у героя лишаються 2 ваги (700 текст / 800 «говорите»+CTA);
     різниця 600↔700 на 24px майже непомітна, тож знімаємо зайвий рівень (тренд «ієрархія кеглем, не вагою») */
  font-size:clamp(22px,2vw,28px) !important; font-weight:700 !important; /* QA 20.1: 24→28 / 20→22 (апскейл) */
  line-height:1.2 !important; /* QA 20: єдиний інтерліньяж hero-тексту 1.2 */
  /* темний як H1-слово (QA 16.06): прибирає «сирітство» зачину — рядок читається як хвіст
     речення «…англійської онлайн, після яких Ви →», а не блідий підпис; було rgba(43,52,70,.72) */
  color:rgba(28,38,54,.90) !important; letter-spacing:-.01em !important;
}
body.theme-2026 .hero-results{
  display:flex !important; flex-direction:column; align-items:flex-start;
  gap:16px !important; margin:0 0 28px !important; padding-left:0 !important;
}
body.theme-2026 .hero-results::before{ display:none !important; }
body.theme-2026 .hero-result-line{
  font-size:clamp(22px,2.3vw,28px) !important; /* QA 16.06: 27→24 desktop, у щабель із зачином */
  font-weight:700 !important; line-height:1.2 !important;
  /* зведення тонів (QA 16.06): .86→.90 = той самий темний, що H1+зачин (3 тони: темний / teal / білий);
     .86 і .90 око не розрізняє — зайвий відтінок прибрано */
  color:rgba(28,38,54,.90) !important; letter-spacing:-.012em !important;
}
body.theme-2026 .hero-results .hero-result-line:first-child{
  font-size:clamp(22px,2.3vw,28px) !important;
  font-weight:700 !important; line-height:1.2 !important; /* QA 20: 1.25→1.2 (єдиний інтерліньяж) */
  letter-spacing:-.012em !important; margin-bottom:0;
  color:rgba(28,38,54,.90) !important; /* зведення тонів (QA 16.06): .86→.90 — один темний */
}
/* яскраво світиться ЛИШЕ слово «говорите»: велике + градієнт-герой */
body.theme-2026 .hl-2026{
  font-size:clamp(38px,6.2vw,70px); font-weight:800; line-height:1.0;
  letter-spacing:-.025em; vertical-align:baseline;
  background:var(--grad-hero);
  -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent;
}
/* Правки 20 (16.06): UK hero-результати — три пункти в один кегль (герой «говорите»
   тримається градієнтом+вагою 800, не розміром). Без тире-маркерів і без flex
   (flex-gap відривав кому від «говорите» → пробіл перед комою). Скоуп .hero-results--list
   (клас лише в UK hero.php) — RU/EN не чіпає.
   QA 20: розмір пунктів зведено до базового 24/20 (=зачин, =RU/EN) — окремий 28 прибрано;
   .hl-2026 успадковує кегль пункту (24), лишаючись акцентом через вагу 800 + градієнт. */
body.theme-2026 .hero-results--list{ gap:24px !important; }
body.theme-2026 .hero-results--list .hl-2026{
  font-size:inherit !important; line-height:inherit !important; /* кегль = пункт (24); акцент — вага 800 + градієнт */
}
/* МОБІЛЬНИЙ ФІКС (QA 16.06): на дрібному кеглі (38px) градієнт через background-clip:text
   «вимивається» (бліде «говорите») — відома крихкість прийому. Суцільний бренд-teal #1483A0
   (=початковий стоп градієнта) рендериться чітко на всіх пристроях. Десктоп (70px) лишає градієнт. */
@media (max-width:768px){
  body.theme-2026 .hl-2026{
    background:none !important;
    -webkit-text-fill-color:#1483A0 !important; color:#1483A0 !important;
  }
}
body.theme-2026 .hero-kicker{ margin-bottom:24px !important; }
body.theme-2026 .heroK-wrap{ margin-top:0 !important; }
/* заголовки секцій — крупніше (ГЛОБАЛЬНО) */
body.theme-2026 .main-section h2,
body.theme-2026 .main-section-article h2{
  font-size:clamp(28px,3.6vw,46px) !important;
  letter-spacing:-.02em !important; line-height:1.06 !important;
}
/* виняток: bl-h2-sub — це інтро-РЕЧЕННЯ, а не заголовок (напр. «Нам також довіряють 100+
   компаній…»). Розмір H2 (46px) на довгий рядок = диспропорція → підзаголовок-щабель 20/18. */
body.theme-2026 .main-section h2.bl-h2-sub{
  font-size:clamp(18px,2vw,20px) !important;
  line-height:1.35 !important; letter-spacing:-.01em !important;
}

/* eyebrow секцій — сміливий градієнт-чип (filled). width:max-content → стиск під текст */
body.theme-2026 .section-eyebrow{
  display:block !important; width:max-content !important; max-width:100% !important;
  margin:0 auto 10px !important;
  padding:6px 14px; border-radius:999px;
  background:var(--grad-accent); color:#fff !important;
  font-weight:800; letter-spacing:.04em; text-transform:uppercase;
  box-shadow:var(--bl-shadow-chip); border:0 !important;
}

/* =========================================================================
 * 3) HERO-КАРТКА + кольоровий веаль на фото (лише home — #header hero)
 * ====================================================================== */
body.theme-2026 #header::after{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:linear-gradient(115deg, rgba(31,166,194,.18), rgba(108,92,231,.14) 60%, transparent);
  mix-blend-mode:multiply;
}
body.theme-2026 .hero-copy{ position:relative; z-index:2; }
@media (min-width:769px){
  body.theme-2026 .hero-kicker{ margin-top:48px !important; }
}
body.theme-2026 .heroK-note{
  color:#fff !important; font-weight:700; line-height:1.2 !important; /* QA 20: 1.5→1.2 (єдиний інтерліньяж тексту) */
  background:var(--grad-warm); display:inline-block;
  padding:4px 12px; border-radius:999px;
  box-shadow:var(--bl-shadow-warm);
}

/* =========================================================================
 * 4) КНОПКИ / CTA — filled-градієнт + світіння + 3D-hover (дофамін)
 * ====================================================================== */
body.theme-2026 .heroK-cta{
  background:var(--grad-cta) !important; color:#fff !important; border:0 !important;
  border-radius:var(--bl-radius-cta) !important; font-weight:800 !important;
  box-shadow:var(--bl-shadow-cta), 0 2px 0 rgba(255,255,255,.25) inset !important;
  transition:transform .18s cubic-bezier(.2,.7,.2,1), box-shadow .18s ease, filter .18s ease;
}
body.theme-2026 .heroK-cta:hover,
body.theme-2026 .heroK-cta:focus-visible{
  transform:translateY(-3px) scale(1.02);
  box-shadow:var(--bl-shadow-cta-hover), 0 2px 0 rgba(255,255,255,.3) inset !important;
  filter:saturate(1.12);
}
/* первинна кнопка у прайсі/формах — теж градієнт (ГЛОБАЛЬНО: форми всюди) */
body.theme-2026 .cta-unified button[type=submit],
body.theme-2026 .bl-ctaband--sand .cta-unified button[type=submit]{
  background:var(--grad-cta) !important; color:#fff !important; border:0 !important;
  box-shadow:0 12px 30px rgba(47,96,117,.30) !important;
}

/* =========================================================================
 * 5) КАРТКИ — bento-радіуси, кольорова тінь, верхня смужка, 3D-hover (ГЛОБАЛЬНО)
 * ====================================================================== */
body.theme-2026 #досягнення .achv-card,
body.theme-2026 .no-item,
body.theme-2026 #faq .faq-card,
body.theme-2026 .faq-cards-grid .faq-card,
body.theme-2026 .price-card,
body.theme-2026 .bl-lt__card,
body.theme-2026 .bl-cn__card,
body.theme-2026 .school-experience__card,
body.theme-2026 #відгуки-англійська .featured-work,
body.theme-2026 .Portfolio-box{
  position:relative; overflow:hidden;
  background:#fff !important;
  border:1px solid rgba(47,96,117,.10) !important;
  border-radius:var(--bl-radius-bento) !important;
  box-shadow:var(--bl-shadow-bento) !important;
  transition:transform .22s cubic-bezier(.2,.7,.2,1), box-shadow .22s ease, border-color .22s ease;
}
/* верхня градієнт-смужка — ЛИШЕ на ключових картках (рівні + ціни) */
body.theme-2026 .bl-lt__card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:4px;
  background:var(--grad-accent); opacity:.9;
}
body.theme-2026 .price-card::before{
  content:""; position:absolute; left:0; right:0; top:0; height:5px;
  background:var(--grad-cta);
}
/* hover: підняття + кольорова тінь */
body.theme-2026 #досягнення .achv-card:hover,
body.theme-2026 .no-item:hover,
body.theme-2026 #faq .faq-card:hover,
body.theme-2026 .faq-cards-grid .faq-card:hover,
body.theme-2026 .price-card:hover,
body.theme-2026 .bl-lt__card:hover,
body.theme-2026 .bl-cn__card:hover{
  transform:translateY(-6px);
  border-color:rgba(31,166,194,.4) !important;
  box-shadow:var(--bl-shadow-bento-hover) !important;
}
/* акцентна картка — заливка градієнтом */
body.theme-2026 .bl-cn__card--accent{
  background:var(--grad-accent) !important; border-color:transparent !important;
}
body.theme-2026 .bl-cn__card--accent .bl-cn__name,
body.theme-2026 .bl-cn__card--accent .bl-cn__desc,
body.theme-2026 .bl-cn__card--accent .bl-cn__go{ color:#fff !important; }

/* контейнер логотипів — м'яка градієнт-плита */
body.theme-2026 .portfolioContainer{
  background:linear-gradient(135deg,#fff,rgba(238,243,244,.9)) !important;
  border:1px solid rgba(47,96,117,.08); border-radius:var(--bl-radius-bento-lg);
  box-shadow:0 18px 44px rgba(31,68,90,.10);
}
body.theme-2026 .Portfolio-box{ box-shadow:none !important; border:0 !important; }

/* =========================================================================
 * 6) НАВІГАЦІЯ — світле скло з кольоровою тінню (ГЛОБАЛЬНО, не темнити)
 * ====================================================================== */
body.theme-2026 .bl-nav{
  background:linear-gradient(180deg, rgba(255,255,255,.7), rgba(255,255,255,.52)) !important;
  -webkit-backdrop-filter:blur(26px) saturate(1.5); backdrop-filter:blur(26px) saturate(1.5);
  border:1px solid rgba(255,255,255,.65) !important;
  box-shadow:0 12px 34px rgba(31,68,90,.14), inset 0 1px 0 rgba(255,255,255,.85) !important;
}

/* =========================================================================
 * 7) CTA-СМУГА — теплий дофаміновий градієнт-фон (home + footer-cta)
 * ====================================================================== */
body.theme-2026 .bl-cta .bl-ctaband--sand{
  background:var(--grad-cta-zone) !important;
  border:1px solid rgba(255,255,255,.14) !important;
  box-shadow:0 24px 60px rgba(31,68,90,.30) !important;
  -webkit-backdrop-filter:none !important; backdrop-filter:none !important;
}
body.theme-2026 .bl-cta .bl-ctaband--sand .bl-ctaband__title2{ color:#fff !important; }
body.theme-2026 .bl-cta .bl-ctaband--sand .bl-ctaband__or,
body.theme-2026 .bl-cta .bl-ctaband--sand .bl-ctaband__next{ color:rgba(255,255,255,.82) !important; }

/* Канали: на hover — бренд-колір іконки + світлий бренд-тінт фону */
body.theme-2026 .bl-chrow__btn{ transition:background .16s ease, transform .16s ease, box-shadow .16s ease; }
body.theme-2026 .bl-chrow__btn svg{ transition:color .16s ease, transform .16s ease; transform-origin:center; }
body.theme-2026 .bl-chrow__btn:hover{ transform:translateY(-2px); }
body.theme-2026 .bl-chrow__btn:hover svg{ transform:scale(1.12); }
body.theme-2026 .bl-chrow__btn[data-track-messenger="telegram"]:hover{ background:#E8F5FB !important; box-shadow:0 10px 24px rgba(34,158,217,.40) !important; }
body.theme-2026 .bl-chrow__btn[data-track-messenger="telegram"]:hover svg{ color:#229ED9; }
body.theme-2026 .bl-chrow__btn[data-track-messenger="whatsapp"]:hover{ background:#E9FBF1 !important; box-shadow:0 10px 24px rgba(37,211,102,.40) !important; }
body.theme-2026 .bl-chrow__btn[data-track-messenger="whatsapp"]:hover svg{ color:#1FB457; }
body.theme-2026 .bl-chrow__btn[data-track-messenger="signal"]:hover{ background:#EAF0FE !important; box-shadow:0 10px 24px rgba(58,118,240,.40) !important; }
body.theme-2026 .bl-chrow__btn[data-track-messenger="signal"]:hover svg{ color:#3A76F0; }
body.theme-2026 .bl-chrow__btn[data-track-event="phone_click"]:hover{ background:#EAF1F3 !important; box-shadow:0 10px 24px rgba(47,96,117,.40) !important; }
body.theme-2026 .bl-chrow__btn[data-track-event="phone_click"]:hover svg{ color:#2F6075; }

/* ФУТЕР: Signal — верхня смужка + бренд-синя іконка (просування альтернативи) */
body.theme-2026 .bl-footer .bl-chrow__btn[data-track-messenger="signal"]{ position:relative; overflow:hidden; }
body.theme-2026 .bl-footer .bl-chrow__btn[data-track-messenger="signal"]::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px; background:#3A76F0;
}
body.theme-2026 .bl-footer .bl-chrow__btn[data-track-messenger="signal"] svg{ color:#3A76F0; }

/* футер — світла плита з тонкою градієнт-лінією зверху */
body.theme-2026 .bl-footer{ position:relative; }
body.theme-2026 .bl-footer::before{
  content:""; position:absolute; left:0; right:0; top:0; height:3px;
  background:var(--grad-accent);
}

/* модалки — світле скло */
body.theme-2026 .contact-modal__inner{
  border-radius:var(--bl-radius-bento) !important;
  box-shadow:0 30px 80px rgba(31,68,90,.28) !important;
}

/* CTA-форма «Готові почати?» — поле+кнопка в одному світлому пілюлі */
body.theme-2026 .bl-cta .bl-ctaband--sand .cta-unified{
  background:#fff !important; border-radius:var(--bl-radius-cta) !important; padding:5px !important;
  box-shadow:0 12px 30px rgba(31,68,90,.14) !important;
}
body.theme-2026 .bl-cta .bl-ctaband--sand .cta-unified .cta-row{ gap:6px !important; }
body.theme-2026 .bl-cta .bl-ctaband--sand .cta-unified input{
  background:transparent !important; border:0 !important; box-shadow:none !important;
}
body.theme-2026 .bl-cta .bl-ctaband--sand .cta-unified button[type=submit]{ border-radius:12px !important; }

/* =========================================================================
 * 8) SCROLL-REVEAL (depth/motion) — клас .rv додає reveal-скрипт (new.js, home).
 *    .rv лишається прихованим ЛИШЕ коли скрипт його додав → без JS усе видиме.
 * ====================================================================== */
body.theme-2026 .rv{ opacity:0; transform:translateY(28px); transition:opacity .6s ease, transform .6s cubic-bezier(.2,.7,.2,1); }
body.theme-2026 .rv-in{ opacity:1; transform:none; }
body.theme-2026 .rv:nth-child(2){ transition-delay:.05s; }
body.theme-2026 .rv:nth-child(3){ transition-delay:.10s; }
body.theme-2026 .rv:nth-child(4){ transition-delay:.15s; }

/* =========================================================================
 * ДОСТУПНІСТЬ / МОБАЙЛ
 * ====================================================================== */
@media (prefers-reduced-motion:reduce){
  body.theme-2026::before{ animation:none; }
  body.theme-2026 .rv{ opacity:1; transform:none; transition:none; }
  body.theme-2026 .heroK-cta{ transition:none; }
}
@media (max-width:768px){
  body.theme-2026 .bl-nav{ -webkit-backdrop-filter:blur(16px) saturate(1.4); backdrop-filter:blur(16px) saturate(1.4); }
  body.theme-2026 #досягнення .achv-card,
  body.theme-2026 .no-item,
  body.theme-2026 #faq .faq-card,
  body.theme-2026 .faq-cards-grid .faq-card,
  body.theme-2026 .price-card,
  body.theme-2026 .bl-lt__card,
  body.theme-2026 .bl-cn__card{ border-radius:var(--bl-radius-bento-sm) !important; box-shadow:0 12px 30px rgba(31,68,90,.12) !important; }
}

/* ============================================================================
 * HERO 2026 — фото-фон + текст (гейт body.home-hero2026).
 * Desktop: фото праворуч (object-position), текст ліворуч на беж-градієнті.
 * Mobile : вертикальне фото фоном праворуч, текст ліворуч на посиленому беж-градієнті.
 * Раніше було inline у hero-exp.php; винесено сюди для прод hero.php (uk/ru/en).
 * ========================================================================== */
body.home-hero2026 .header{position:relative!important;min-height:92vh!important;height:auto!important;display:flex!important;align-items:center!important;padding:0!important;overflow:hidden!important;background:#DDCBBF!important}
body.home-hero2026 .header::before,body.home-hero2026 .header::after{display:none!important;content:none!important;background:none!important}
body.home-hero2026 .hx-bg{position:absolute;inset:0;z-index:0}
body.home-hero2026 .hx-bg img{width:100%;height:100%;object-fit:cover;object-position:78% center;display:block}
body.home-hero2026 .hx-bg::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(to right,#DDCBBF 0%,rgba(221,203,191,.88) 28%,rgba(221,203,191,0) 58%),linear-gradient(to top,rgba(34,43,52,.22),rgba(34,43,52,0) 45%),linear-gradient(rgba(34,43,52,.10),rgba(34,43,52,.10))} /* десктоп: бокова беж-розтяжка + scrim знизу + загальне затемнення (вар.1, посилено .22/.10); на mobile повністю перекривається у @media нижче — обличчя лишається яскравим */
body.home-hero2026 .hero-container{position:relative;z-index:2;width:100%;display:block!important;min-height:0!important;height:auto!important}
body.home-hero2026 .hero-copy{display:block!important;max-width:560px;padding:24px clamp(20px,3vw,40px)}
body.home-hero2026 .hero-kicker{display:inline-block;margin-bottom:18px}
body.home-hero2026 .hero-kicker img{width:240px;height:auto;display:block}
body.home-hero2026 .hero-claim{margin:0;letter-spacing:-.02em;font-weight:800;line-height:1.12;color:#222b34;font-size:clamp(30px,3.3vw,46px)}
body.home-hero2026 .hero-claim__word{display:block}
body.home-hero2026 .hero-claim__accent{color:inherit!important}
body.home-hero2026 .hero-claim__sub{display:block;margin-top:6px;font-size:.62em;font-weight:600;color:rgba(43,52,70,.78)}
body.home-hero2026 .hl-2026{color:#1483A0}
body.home-hero2026 .hero-results{display:flex;flex-direction:column;gap:8px;margin:16px 0 0;padding:0}
body.home-hero2026 .hero-result-line{font-size:clamp(17px,1.6vw,23px);font-weight:600;color:rgba(43,52,70,.74);line-height:1.3}
body.home-hero2026 .hero-result-line:first-child{font-weight:700;color:rgba(43,52,70,.92)}
body.home-hero2026 .heroK-wrap{margin-top:20px}
/* DESKTOP центрування hero (фікс перекосу «текст притиснутий догори»):
   .header — flex-column + justify-content:center; падінг-топ резервує фіксовану нав (~70px),
   щоб кікер не ховався під нею; знято легасі-хак translateY(-110px) з body.home-experiment
   та зайвий margin-top кікера й padding-top контейнера — центрування рахується по чистому контенту.
   Mobile (max-width:767) НЕ чіпається — окремий блок нижче. */
@media(min-width:769px){
  body.home-hero2026 .header{flex-direction:column!important;justify-content:center!important;padding:90px 0 40px!important;box-sizing:border-box!important}
  body.home-hero2026 .hero-copy{transform:none!important}
  body.home-hero2026 .hero-container{padding-top:0!important}
  body.home-hero2026 .hero-kicker{margin-top:0!important}
}
@media(max-width:767px){
  body.home-hero2026 .header{min-height:100vh!important;min-height:100svh!important;align-items:center!important}
  body.home-hero2026 .hx-bg img{object-position:right center}
  body.home-hero2026 .hx-bg::after{background:linear-gradient(to right,#C4BCB7 0%,#C4BCB7 50%,rgba(196,188,183,.93) 68%,rgba(196,188,183,.55) 83%,rgba(196,188,183,0) 97%)}
  body.home-hero2026 .hero-copy{max-width:none;padding:0 22px}
  body.home-hero2026 .hero-kicker{margin-bottom:14px}
  body.home-hero2026 .hero-kicker img{width:160px}
  body.home-hero2026 .hero-claim{font-size:26px;line-height:1.12}
  body.home-hero2026 .hl-2026{font-size:inherit}
  body.home-hero2026 .hero-results{margin-top:16px;gap:8px}
  body.home-hero2026 .hero-result-line{font-size:15px;line-height:1.3}
  body.home-hero2026 .heroK-wrap{margin-top:22px}
  body.home-hero2026 .heroK-note{color:rgba(43,52,70,.92);text-shadow:0 1px 7px rgba(255,255,255,.7)}
}
