/* FIX: применяем фон к .header (шапке)
   Изображение: pictures/hero-fpv.png (PNG, рядом с index.html)
   Рекомендации: ширина 2400-3000px, оптимизированный (<=400 KB).
   Тёмная тема NERV: оранжевый оттенок поверх фона.
   NERV-полоса внизу шапки УДАЛЕНА по запросу.
*/

/* Шапка растягивается на ВСЮ ширину окна (full-bleed),
   вырываясь за пределы контейнера .page-shell (max-width: 1240px). */
.header {
  /* убираем заливку, чтобы фон был виден */
  background-color: transparent !important;
  background-image: url("pictures/hero-fpv.png") !important;
  background-size: cover !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  color: var(--text) !important; /* текст поверх фона */

  /* ===== РАСТЯГИВАНИЕ НА ВСЮ ШИРИНУ ===== */
  width: 100vw !important;
  margin-left: calc(50% - 50vw) !important;  /* прижимаем левый край к экрану */
  margin-right: calc(50% - 50vw) !important; /* прижимаем правый край к экрану */
  margin-top: 0 !important;                  /* убираем отступ сверху — впритык к верху окна */
  border-radius: 0 !important;               /* убираем скругление — картинка касается краёв */
  border: 0 !important;                      /* убираем рамку по краям экрана */
  box-shadow: none !important;               /* убираем тень от карточки */
}

/* Защита от горизонтального скролла,
   т.к. 100vw чуть шире видимой области (учитывает полосу прокрутки) */
body {
  overflow-x: hidden !important;
}

/* Затемняющая накладка, чтобы текст читался — тёмная с оранжевым NERV-оттенком.
   Ослаблена (0.55 → 0.35), чтобы текст был светлее на тёмном фоне. */
.header::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.35), rgba(20, 12, 0, 0.55));
  pointer-events: none;
}

/* Позиционирование: .header должен быть position: relative для псевдоэлементов */
.header { position: relative; z-index: 0; }
.header > * { position: relative; z-index: 1; }

/* ===== ЯРКО-ОРАНЖЕВЫЙ ТЕКСТ В ШАПКЕ ===== */

/* Логотип FPVhub: сочный оранжевый вместо тусклого градиента */
.header .brand-logo-text {
  background: none !important;
  -webkit-text-fill-color: #FFB300 !important;
  color: #FFB300 !important;
  font-weight: 900 !important;
  text-shadow:
    0 0 10px rgba(255, 140, 0, 0.9),
    0 0 24px rgba(255, 120, 0, 0.5),
    0 1px 3px rgba(0, 0, 0, 0.9) !important;
}

/* Ссылки и меню в шапке — тоже оранжевые и читаемые */
.header nav a,
.header .nav a,
.header .menu a,
.header a {
  color: #FFB300 !important;
  text-shadow:
    0 0 6px rgba(255, 140, 0, 0.7),
    0 1px 2px rgba(0, 0, 0, 0.9) !important;
}

/* На мобайле уменьшаем padding, центрируем текст */
@media (max-width: 860px) {
  .header { background-position: center top !important; padding: 18px !important; }
}