/* =========================================
   HOME — GEMINI LAYER (SAFE)
   Подключать последним на index.html
   ========================================= */

/* 1) HERO — светлый, премиальный, аккуратный */
.hero-premium{
    background: #ffffff !important;
    overflow: hidden;
  }
  
  .hero-premium .hero-grid{
    padding: 64px 0 !important;
    gap: 40px !important;
  }
  
  .hero-premium .hero-content h1{
    letter-spacing: 0.01em;
    line-height: 0.95;
  }
  
  .hero-premium .hero-subtitle{
    font-family: 'Instrument Sans', sans-serif;
    font-weight: 500;
    letter-spacing: 0.01em;
  }
  
  /* Фоновая “монограмма” ETL — очень тонко (как у Gemini, но без плакатности) */
  .hero-premium::before{
    content: "ЕТЛ";
    position: absolute;
    right: 1%;
    top: 50%;
    transform: translateY(-50%);
    font-family: "Bowler", Impact, sans-serif;
    font-size: min(38vw, 520px);
    line-height: 0.8;
    color: rgba(15,18,22,0.04);
    pointer-events: none;
    z-index: 0;
  }
  
  /* Важное: контейнер/грузовик не должен “жить своей жизнью” */
  .hero-visual{
    position: relative;
    min-height: 420px;
  }
  
  /* Твой CSS ставит .hero-truck absolute и огромным — тут делаем управляемо */
  .hero-visual .hero-truck{
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
  
    width: min(680px, 100%);
    max-width: 100%;
    height: auto;
  
    display: block;
    margin-left: auto;
    filter: drop-shadow(0 22px 55px rgba(0,0,0,.14));
    opacity: 0.98;
  }
  
  /* Кнопка — чуть “дороже” (не трогая твою систему классов) */
  .hero-premium .p-btn-primary{
    padding: 14px 22px;
    border-radius: 10px;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    box-shadow: 0 12px 28px rgba(229,38,41,.22);
  }
  .hero-premium .p-btn-primary:hover{
    transform: translateY(-1px);
    box-shadow: 0 18px 44px rgba(229,38,41,.28);
  }
  
  /* 2) STATS — всегда видимы + премиальный вид */
  /* ===== STATS LIGHT VERSION ===== */

/* 3) Мобилка */
  @media (max-width: 980px){
    .hero-premium .hero-grid{
      grid-template-columns: 1fr !important;
      padding: 42px 0 !important;
    }
    .hero-visual{
      min-height: 280px;
      margin-top: 10px;
    }
    .hero-visual .hero-truck{
      width: min(560px, 92%);
      margin: 0 auto;
    }
  
    }
  /* ===== FIX ACTIVE NAV ITEM ON LIGHT HEADER ===== */

.navbar{
    background: #ffffff !important;
    border-bottom: 1px solid rgba(15,18,22,.06);
  }
  
  .nav-link{
    color: #0f1216 !important;
    opacity: 0.65;
  }
  
  .nav-link:hover{
    opacity: 1;
  }
  
  .nav-link.active,
  .nav-link[aria-current="page"]{
    color: var(--etl-red) !important;
    opacity: 1;
  }
  
  .nav-link.active::after,
  .nav-link[aria-current="page"]::after{
    background: var(--etl-red);
  }
  /* FIX: при наведении не делаем текст белым */
.navbar .nav-link:hover{
    color: var(--etl-red) !important;
  }
  /* ===== OPERATIVE TERMINAL CARDS — UNIFIED HOVER ===== */

.oper-terminal .card,
.oper-terminal .terminal-card,
.oper-terminal .bento-card {
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
  border: 1px solid rgba(15,18,22,.06);
  border-radius: 16px;
  background: #ffffff;
}

.oper-terminal .card:hover,
.oper-terminal .terminal-card:hover,
.oper-terminal .bento-card:hover {
  transform: translateY(-6px);
  box-shadow: 0 25px 60px rgba(15,18,22,.12);
  border-color: rgba(229,38,41,.35);
}