/* ============================================================
   xh-hero.css — ЕДИНЫЙ ИСТОЧНИК ПРАВДЫ для hero-блока раздела.
   Грузится ОБОИМИ движками: портал (head.php) + форум (IPB globalTemplate).
   Одна правка здесь меняет шапку на сайте И на форуме сразу.

   Самодостаточен: значения, которые должны быть ОДИНАКОВЫМИ на обоих
   движках, заданы литералами (не через --xh-* токены, которые на форуме
   и портале расходятся). Цвет фона страницы (конец затухания картинки)
   — единственное, что отличается по движкам, вынесен в --xhh-bg
   (портал: #060a14 по умолчанию; форум переопределяет на свой #0a0f1c).

   Партиал портала: pages/_partials/section-hero.php
   @since 2026-06-11 (единый источник правды hero — портал+форум)
   ============================================================ */

/* Токены значений, которые должны совпадать на портале и форуме. Меняешь тут —
   меняется на обоих движках (форум использует их же через #content-мост). */
:root{--xhh-bg:#060a14;--xhh-title:#ffffff;--xhh-desc:#a4b3c8;}

.xh-shero{position:relative;z-index:1;overflow:hidden;min-height:288px;padding:28px 0 48px;display:flex;align-items:flex-start;}
.xh-shero--split{align-items:center;}

/* Full-bleed для форума (IPB оборачивает контент в узкую колонку).
   На портале секция и так на всю ширину — модификатор не нужен. */
.xh-shero--bleed{width:100vw;margin-left:calc(50% - 50vw);}

.xh-shero-bg{position:absolute;inset:0;z-index:0;}
.xh-shero-bg picture,.xh-shero-bg img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 30%;}
.xh-shero-bg::after{content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(180deg,rgba(6,10,20,.45) 0%,rgba(6,10,20,.86) 72%,var(--xhh-bg,#060a14) 100%);}

.xh-shero-inner{position:relative;z-index:2;max-width:1200px;margin:0 auto;padding:0 32px;width:100%;}
/* В режиме --bleed центрируем контент с учётом полосы прокрутки, чтобы левый
   край текста совпадал с порталом (145px при 1440) — calc откалиброван. */
.xh-shero--bleed .xh-shero-inner{max-width:none;margin:0;padding:0 max(32px, calc(50vw - 576px));}

.xh-shero--split .xh-shero-inner{display:grid;grid-template-columns:1fr 400px;gap:48px;align-items:center;}
.xh-shero--split:not(:has(.xh-shero-aside)) .xh-shero-inner{grid-template-columns:1fr;}
.xh-shero-main{min-width:0;}
.xh-shero--split .xh-shero-main{max-width:600px;}

/* Хлебные крошки внутри hero — сбрасываем «standalone» отступы (на портале
   .xh-breadcrumbs имеет свой padding для отдельных страниц). */
.xh-shero-inner .xh-breadcrumbs{margin:0 0 12px 30px;padding:0;font-size:14px;line-height:1.6;}

.xh-shero-eyebrow{display:inline-block;font-family:var(--xh-font-heading,'Rajdhani'),sans-serif;font-size:12px;
  font-weight:700;text-transform:uppercase;letter-spacing:2px;color:var(--xh-orange,#f59a3e);margin-bottom:10px;}
.xh-shero-title{font-family:var(--xh-font-display,'Rajdhani'),sans-serif;font-size:clamp(30px,4vw,46px);
  text-transform:uppercase;letter-spacing:1px;color:var(--xhh-title,#fff);line-height:1.1;margin:0 0 10px;}
.xh-shero-title em{font-style:normal;color:var(--xh-orange,#f59a3e);}
.xh-shero-subtitle{font-family:var(--xh-font-heading,'Rajdhani'),sans-serif;font-size:17px;font-weight:700;
  color:var(--xh-text,#e8ecf2);letter-spacing:.3px;margin:0 0 8px;}
.xh-shero-subtitle em{font-style:normal;color:var(--xh-orange,#f59a3e);}
.xh-shero-desc{font-size:15.5px;color:var(--xhh-desc,#a4b3c8);max-width:480px;margin:0;line-height:1.6;}
.xh-shero-desc--gap{margin-bottom:26px;}

@media (max-width:980px){
  .xh-shero--split .xh-shero-inner{grid-template-columns:1fr;gap:28px;}
  .xh-shero--split .xh-shero-main{max-width:100%;}
}
@media (max-width:768px){
  .xh-shero{min-height:auto;padding:32px 0 40px;}
  .xh-shero-title{font-size:clamp(26px,7vw,38px);}
  .xh-shero-inner{padding-left:16px;padding-right:16px;}
}