/* ===== Responsive The Hive (les styles inline sont écrasés via !important) ===== */

img, video { max-width: 100%; }

/* Grilles de contenu : repli en 1 colonne sur mobile */
@media (max-width: 820px) {
  [style*="grid-template-columns:repeat(3"],
  [style*="grid-template-columns: repeat(3"],
  [style*="grid-template-columns:repeat(4"],
  [style*="grid-template-columns: repeat(4"],
  [style*="grid-template-columns:1fr 1fr 1fr"],
  [style*="grid-template-columns:1.4fr 1fr 1fr"],
  [style*="grid-template-columns:1fr auto"],
  [style*="grid-template-columns:1fr 1fr"] {
    grid-template-columns: 1fr !important;
  }
  form [style*="grid-template-columns"] { grid-template-columns: 1fr !important; }
}

/* Paddings géants réduits sur mobile */
@media (max-width: 640px) {
  section[style*="padding:7rem 2rem"],
  section[style*="padding:8rem 2rem"],
  section[style*="padding:6rem 2rem"],
  section[style*="padding:7rem 2rem 5rem"],
  section[style*="padding:11rem 2rem"] {
    padding-left: 1.25rem !important;
    padding-right: 1.25rem !important;
    padding-top: 4rem !important;
    padding-bottom: 4rem !important;
  }
  section[style*="padding:11rem 2rem"] { padding-top: 8rem !important; }
}

/* ===== NAV mobile (hamburger) ===== */
.nav-burger { display: none; background: none; border: none; cursor: pointer; padding: 0.4rem; margin-left: auto; z-index: 60; }
.nav-burger span { display: block; width: 22px; height: 2px; background: #fff; margin: 4px 0; border-radius: 2px; transition: transform 0.3s ease, opacity 0.3s ease; }
nav.nav-open .nav-burger span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
nav.nav-open .nav-burger span:nth-child(2) { opacity: 0; }
nav.nav-open .nav-burger span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

@media (max-width: 780px) {
  nav .nav-burger { display: block; }
  nav > div {
    position: absolute; top: 100%; left: 0; right: 0;
    flex-direction: column !important; align-items: flex-start !important; gap: 0 !important;
    background: rgba(8, 9, 14, 0.98); backdrop-filter: blur(14px);
    padding: 0.5rem 1.5rem 1.5rem !important; border-bottom: 1px solid rgba(255, 255, 255, 0.08);
    transform: translateY(-135%); transition: transform 0.35s cubic-bezier(0.4, 0, 0.2, 1);
    max-height: calc(100vh - 60px); overflow: auto; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5);
  }
  nav.nav-open > div { transform: translateY(0); }

  /* Liens simples : une ligne, alignés à gauche */
  nav > div > a {
    display: block; width: 100%; margin: 0 !important;
    padding: 0.95rem 0 !important; border-bottom: 1px solid rgba(255, 255, 255, 0.06);
    font-family: 'Inter', sans-serif; font-size: 1rem !important; font-weight: 400 !important;
    letter-spacing: 0 !important; text-transform: none !important; text-align: left !important;
    color: rgba(255, 255, 255, 0.75) !important; background: none !important; border-radius: 0 !important;
  }

  /* Boutons / pills : compacts, vrai padding interne, non étirés */
  nav > div > a[class*="cta"],
  nav > div > a[style*="rgba(200,164,92"],
  nav > div > a[style*="background:#3d6bdb"],
  nav > div > a[style*="border:1px solid rgba(255,255,255,0.1)"] {
    display: inline-block; width: auto !important;
    margin: 1rem 0.6rem 0 0 !important; padding: 0.72rem 1.5rem !important;
    border-bottom: none !important; border-radius: 4px;
    font-family: 'Syne', sans-serif; font-size: 0.78rem !important; font-weight: 700 !important;
    letter-spacing: 0.06em !important; text-transform: uppercase !important; text-align: center !important;
  }
  /* Rendre au bouton Experience sa couleur or et au CTA sa couleur bleue */
  nav > div > a[style*="rgba(200,164,92"] { color: #c8a45c !important; background: rgba(200,164,92,0.12) !important; border: 1px solid rgba(200,164,92,0.35) !important; }
  nav > div > a.cta-btn { color: #fff !important; background: #3d6bdb !important; }
  nav > div > a.cta-gold { color: #07060a !important; background: #c8a45c !important; }
  nav > div > a[style*="border:1px solid rgba(255,255,255,0.1)"] { color: rgba(255,255,255,0.6) !important; border: 1px solid rgba(255,255,255,0.15) !important; }
}

/* ===== Accueil : panneaux split ===== */
@media (max-width: 760px) {
  .panel-title { white-space: normal !important; font-size: 1.85rem !important; line-height: 1.05 !important; }
  .panel-subtitle { font-size: 0.85rem !important; }
  .panel-content { padding: 1.75rem 1.5rem 2rem !important; }
  .split-wrap { height: auto !important; }
  .split-wrap .panel { min-height: 64vh; }
  /* La barre légale ne doit plus flotter par-dessus les panneaux */
  .home-legal { position: static !important; pointer-events: auto !important; padding: 1.25rem 1rem !important; background: #06080e; }
  .home-legal > div { background: none !important; backdrop-filter: none !important; flex-wrap: wrap; justify-content: center; }
  body { overflow: auto !important; height: auto !important; }
}

/* ===== Bandeau logos sponsors : wrap propre ===== */
@media (max-width: 640px) {
  .sponsor-logo img { max-width: 65%; height: auto !important; }
}

/* ===== Typographie mobile (réduire les tailles) ===== */
@media (max-width: 640px) {
  h1 { font-size: 1.95rem !important; line-height: 1.12 !important; letter-spacing: -0.01em !important; }
  h2 { font-size: 1.45rem !important; line-height: 1.2 !important; }
  h3 { font-size: 1.02rem !important; }
  /* Gros chiffres / accents (stats, "3-4x", numéros) */
  [style*="font-size:2.25rem"] { font-size: 1.6rem !important; }
  [style*="font-size:2rem"] { font-size: 1.5rem !important; }
  [style*="font-size:1.75rem"] { font-size: 1.35rem !important; }
  /* Paragraphe d'accroche du hero un peu plus compact */
  section > div > p, section > div > div > p { font-size: 0.9rem !important; line-height: 1.7 !important; }
  /* Titres de section : marges resserrées */
  h2 { margin-bottom: 1.25rem !important; }
}

/* ===== Nav : hauteur/logo compacts sur mobile ===== */
@media (max-width: 780px) {
  nav { padding: 0.85rem 1.25rem !important; }
  nav img { height: 24px !important; }
}

/* Évite tout débordement horizontal */
@media (max-width: 820px) {
  html, body { overflow-x: hidden !important; max-width: 100vw; }
}