/* ===========================
   RESPONSIVE / MOBILE-ONLY
   =========================== */

/* --- крупные планшеты --- */
@media (max-width: 1200px){
  .nav-container{ padding: 1.5rem 2rem; }
  .section{ padding: 80px 0; }
  .hero-title{ font-size: 3rem; }
  .hero-subtitle{ font-size: 1.15rem; }
  .goals-content-wrapper{ gap: 60px; max-width: 1100px; }
}

/* --- ноуты / горизонтальные планшеты --- */
@media (max-width: 992px){
  .logo{ min-width: 0; }
  .logo h1{ font-size: 1.05rem; }

  /* герой */
  .hero{ min-height: 100svh; height: 100svh; }
  .hero-title{ font-size: 2.2rem; margin-bottom: .75rem; }
  .hero-subtitle{ font-size: 1rem; }
  .scroll-indicator{ height: 32px; }

  /* фон героя спокойнее */
  .pipe-line{ opacity: .55; }
  .energy-particle{ transform: scale(.85); filter: blur(.7px); }
}

/* --- планшеты, портрет + Мобильное меню --- */
@media (max-width: 768px){
  /* базовая защита от горизонтального скролла */
  html, body{
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }
  .section,
  .hero,
  #goals,
  .goals-block,
  #mission,
  #about,
  #knowledge,
  #contacts{
    overflow: hidden;
  }
  .container{ padding: 0 16px; }

  /* Шапка */
  .nav-container{ padding: 1rem 16px; position: relative; }
  .logo h1{ font-size:.98rem; letter-spacing:.2px; }
  .header.scrolled .nav-container{ padding:1rem 16px; }
  .header.scrolled .logo h1{ font-size:.98rem; }

  /* === ГАМБУРГЕР (фикс: виден, ровные три полосы, не зависит от числа span) === */
  .hamburger{
    display:flex;              /* <-- включаем, иначе скрыт базой */
    position:relative;
    z-index:1201;              /* над оверлеем меню (1200) */
    width:34px;
    height:22px;
    cursor:pointer;
    align-items:center;
    justify-content:center;
  }

  /* если в HTML несколько span — показываем только первый как «среднюю» полосу */
  .hamburger span{ display:none; }
  .hamburger span:first-child{
    display:block;
    position:absolute;
    left:0; top:50%;
    width:100%; height:2.5px;
    background:#fff; border-radius:999px;
    transform:translateY(-50%);
    transition:transform .25s ease, opacity .2s ease;
    margin:0 !important;
    box-shadow:none;
  }

  /* Верх/низ — псевдоэлементы, поэтому всегда будет три линии */
  .hamburger::before,
  .hamburger::after{
    content:"";
    position:absolute; left:0;
    width:100%; height:2.5px;
    background:#fff; border-radius:999px;
    transition:transform .25s ease, opacity .2s ease;
  }
  .hamburger::before{ top:0; }
  .hamburger::after { bottom:0; }

  /* Состояние "крестик" */
  .hamburger.active span:first-child{
    opacity:0; transform:translateY(-50%) scaleX(.6);
  }
  .hamburger.active::before{
    top:50%; transform:translateY(-50%) rotate(45deg);
  }
  .hamburger.active::after{
    bottom:auto; top:50%; transform:translateY(-50%) rotate(-45deg);
  }

  /* === ОВЕРЛЕЙ-МЕНЮ без «мига» (жёсткий сброс десктопных стилей) === */
  .nav-menu{
    all: unset;                 /* чистим наследие десктопа */
    position: fixed;
    inset: 0;

    display: none;              /* до активации вообще не рендерим */
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2rem;

    background:
      linear-gradient(
        185deg,
        rgba(5, 8, 6, 0.96)   0%,
        rgba(8, 12, 10, 0.95) 18%,
        rgba(12, 20, 14, 0.93) 40%,
        rgba(18, 30, 20, 0.90) 65%,
        rgba(28, 48, 34, 0.86) 100%
      );
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 1200;

    opacity: 0;
    transform: scale(.98);
    transition: opacity .25s ease, transform .25s ease;
  }
  .nav-menu.active,
  .nav.nav-open .nav-menu,
  .header.nav-open .nav-menu{
    display: flex;     /* теперь реально рисуем */
    opacity: 1;
    transform: scale(1);
  }

  /* пункты меню + стейджинг появления */
  .nav-menu li{ list-style:none; width:100%; text-align:center; }
  .nav-link{
    display:inline-block; padding: 14px 0;
    font-size: 1.3rem; font-weight: 800;
    color:#fff; text-transform:uppercase; letter-spacing:.11em;
    text-shadow: 0 2px 10px rgba(0,0,0,.55);
    opacity:0; transform: translateY(18px);
    transition: opacity .4s ease, transform .4s ease, color .2s ease;
  }
  .nav-menu.active .nav-link{ opacity:1; transform: translateY(0); }
  .nav-menu.active li:nth-child(1) .nav-link{ transition-delay:.08s; }
  .nav-menu.active li:nth-child(2) .nav-link{ transition-delay:.16s; }
  .nav-menu.active li:nth-child(3) .nav-link{ transition-delay:.24s; }
  .nav-menu.active li:nth-child(4) .nav-link{ transition-delay:.32s; }
  .nav-link:hover{ color:#e8ffb0; transform: translateY(-2px); }

  /* при открытом меню — блокируем скролл, шапку не блюрим */
  body.nav-open{ overflow:hidden; }
  body.nav-open .header{ background: transparent !important; backdrop-filter: none !important; }

  /* герой */
  .hero{ min-height: 100svh; height: 100svh; }
  .pipe-line{ opacity: .55; }
  .energy-particle{ transform: scale(.85); filter: blur(.7px); }

  /* О НАС — сетка в 1 колонку, центр, без подрезания */
  .about-content-wrapper{
    display:grid; grid-template-columns:1fr; gap:1rem;
    overflow: visible !important;
    justify-items: center; align-items: center;
  }
  /* критично: снять правый паддинг у текста */
  .about-section .text-content p,
  .about-content-wrapper .text-content p,
  .text-content p{ font-size:1.05rem; line-height:1.65; padding-right:0 !important; }
  #about .text-content p strong{ font-weight:700; }

  /* reset позиционирования инженера + центрирование */
  .engineer-image-wrapper{
    position:relative !important; right:auto !important; bottom:auto !important;
    width:100% !important; max-width:340px !important; height:auto !important;
    margin:0 auto !important; display:flex !important; justify-content:center !important;
    justify-self:center !important;
  }
  .engineer-image{
    position:static !important; width:100% !important;
    display:flex !important; justify-content:center !important; align-items:flex-end !important;
    transform:none !important; margin:0 auto !important; text-align:center !important;
  }
  .engineer-image img{
    position:static !important; display:block !important; margin:0 auto !important;
    transform:none !important; object-fit:contain !important; object-position:center bottom !important;
    width:80% !important; max-width:260px !important; height:auto !important; padding:0 !important;
  }
  .about-text-block{ order:2; padding-right:0; }

  /* МИССИЯ — по одной карточке */
  .mission-grid{ grid-template-columns:1fr; gap:1.25rem; }
  .mission-item{ padding:1.5rem; }
  .mission-icon{ width:110px; height:110px; }
  /* Убираем декоративные линии всех заголовков */
  .section-title::before,
  .section-title::after,
  /* Убираем декоративные линии заголовка миссии на мобильных */
  .mission-block h3::before,
  .mission-block h3::after{ display:none; }

  /* Реестр: компактный заголовок */
  .file-download h3{ font-size: 1.35rem; }

  /* ЦЕЛИ — башня между колонками в одну линию */
  .goals-block{ padding:64px 16px; }
  .goals-content-wrapper{
    flex-wrap: wrap; gap:24px; max-width:680px; padding:0; justify-content:center;
  }
  .goals-left{ order:1; }
  .cooling-tower-container{ order:2; flex:1 1 100%; text-align:center; }
  .goals-right{ order:3; }
  .goals-column{ flex:1 1 100%; max-width:100%; gap:20px; transform:none; }
  .goal-item{ font-size:16px; }
  .cooling-tower{ width:min(360px, 90%); }
  .cooling-tower-container::before{ display:none; }
  .goals-word{ font-size:40px; top:50%; transform:translate(-50%,-55%); }
  /* Убираем декоративный текст в мобильной версии */
  .goals-word,
  .goals-word-back,
  .goals-word-front{ display:none; }

  /* Участники/Документы/Знания */
  .members-grid--heroheads{ grid-template-columns: 1fr !important; gap: 1rem; }
  .member-hero{ height: 150px; }
  .member-card .services{ padding: 1rem 1rem 1.2rem; }

  .docs-showcase{ gap: 1rem; }
  .doc-showcase-card{ max-width: 240px; overflow:hidden; }

  /* База знаний: карточка в столбик, кнопки ниже текста */
  .kcard{ padding: 1rem; }
  .kitem{ display:grid; grid-template-columns:1fr; gap:.75rem; }
  .kitem__main{ min-width:0; }
  .kitem__actions{ display:flex; flex-wrap:wrap; gap:.5rem; justify-content:flex-start; }

    /* Контакты */
  #contacts{ padding: 120px 12px 120px; min-height: 560px; background-position: center center; background-size: cover; }
  .contacts-overlay{ width: min(820px, 100%); }
  .contacts-panel{
    grid-template-rows:auto auto;
    padding:24px 18px 28px;
    border-radius:16px;
    gap:20px;
  }
  .form-row{ grid-template-columns:1fr; }
  .form-submit{ width:100%; justify-self: stretch; text-align:center; }
}

/* --- крупные телефоны --- */
@media (max-width: 600px){
  .section{ padding: 64px 0; }
  .section-title{ font-size: 1.9rem; }

  .nav-container{ padding: 0.85rem 14px; }
  .logo h1{ font-size: .9rem; }

  .hero-title{ font-size: 1.9rem; }
  .hero-subtitle{ font-size: .98rem; max-width: 520px; margin: 0 auto; }
  .hero-content{ padding-inline: 12px; }

  .mission-item{ padding: 1.25rem; }
  .mission-icon{ width: 96px; height: 96px; }
  .mission-content h4{ font-size: 1.2rem; }

  /* Реестр: ещё компактнее заголовок */
  .file-download h3{ font-size: 1.25rem; }

  .goals-block{ padding: 56px 12px; }
  .goal-item{ font-size: 15px; }

  .members-grid{ gap: 1rem; }
  .member-card{ padding: 1.2rem; }
  .member-hero{ height: 160px; }
  .member-card .services ul{ gap: .5rem; font-size: .97rem; }

  .docs-showcase{ grid-template-columns: 1fr; justify-items: center; }
  .doc-showcase-card{ width: min(100%, 320px); }

  #contacts{ padding: 96px 10px 110px; }
  .contacts-overlay{ padding: 0 6px; }
}

/* --- маленькие телефоны --- */
@media (max-width: 480px){
  html, body{ font-size: 15px; }

  .nav-menu{ padding: 100px 16px; gap: 1.5rem; }
  .nav-link{ font-size: 1.15rem; letter-spacing: .08em; }

  .hero-title{ font-size: 1.7rem; }
  .hero-subtitle{ font-size: .95rem; }

  .mission-block h3{ font-size: 2rem; }
  .mission-grid{ gap: 1rem; }

  .cooling-tower{ width: min(300px, 85%); }
  .goals-word{ font-size: 34px; }

  .member-card{ padding: 1rem; }
  .member-card .services ul{ padding-left: 18px; }

  .kcard{ padding: .85rem; }
  .kitem{ gap: .6rem; }
  .kitem__actions{ gap: .4rem; }

  .contacts-panel{ padding: 20px 14px 24px; }
  .form-group label{ font-size: .95rem; }
  .form-submit{ font-size: 1rem; padding: .9rem 1.1rem; }
}