/* overrides.css
   CSS perso chargé après mbr-additional.css
   Objectif: petites corrections sans tout casser

   Conseils:
   - Incrémente ?v=1 -> ?v=2 dans le <link> quand je modifies ce fichier (cache mobile)
   - Garder les règles ultra ciblées (par id de section) pour survivre aux réexports Mobirise
*/

/* -------------------------------------------------------------------------- */
/* Tests (à activer ponctuellement, puis re-commenter)                         */
/* -------------------------------------------------------------------------- */
/* #social02-31 { outline: 4px solid red !important; } */
/* #footer3-3w  { outline: 4px solid lime !important; } */

/* -------------------------------------------------------------------------- */
/* HERO mobile : cadrage + lisibilité (Mobirise parallax jarallax)            */
/* -------------------------------------------------------------------------- */
#header1-1j,
#header1-1j .jarallax-img {
  background-position: right center;
  background-size: cover;
  background-repeat: no-repeat;
}

/* Contenu au-dessus du parallax */
#header1-1j { position: relative; }
#header1-1j .container { position: relative; z-index: 1; }

@media (max-width: 991.98px) {
  #header1-1j {
    min-height: 100vh;
    padding-top: 6.5rem;   /* évite la navbar fixe */
    padding-bottom: 4.5rem;
  }

  /* Overlay mobile: plus sombre à gauche, transparent à droite */
  #header1-1j::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(90deg,
      rgba(0,0,0,.72) 0%,
      rgba(0,0,0,.50) 45%,
      rgba(0,0,0,.18) 70%,
      rgba(0,0,0,0) 100%);
    z-index: 0;
  }

  /* Cadrage mobile (visage plus à droite dans le cadre) */
  #header1-1j,
  #header1-1j .jarallax-img {
    background-position: 92% 35%;
  }

  /* Limiter la largeur du texte pour ne pas recouvrir le visage */
  #header1-1j .mbr-section-title,
  #header1-1j .mbr-section-subtitle,
  #header1-1j .mbr-text {
    max-width: 70vw;
  }

  /* Typo responsive */
  #header1-1j .display-1 { font-size: clamp(2.2rem, 9vw, 4rem); line-height: 1.02; }
  #header1-1j .display-2 { font-size: clamp(1.8rem, 7vw, 3rem); line-height: 1.05; }
}

@media (max-width: 575.98px) {
  #header1-1j,
  #header1-1j .jarallax-img {
    background-position: 95% 25%;
  }

  #header1-1j .mbr-section-title,
  #header1-1j .mbr-section-subtitle,
  #header1-1j .mbr-text {
    max-width: 66vw;
  }
}

/* -------------------------------------------------------------------------- */
/* Réduire l’espace avant "Ma conférence signature" (header09-5f)            */
/* -------------------------------------------------------------------------- */
/* Mobirise met souvent le padding sur des wrappers internes, pas sur la section */

#header09-5f .container-fluid,
#header09-5f .content-wrap {
  padding-top: 0 !important;
}

@media (max-width: 575.98px) {
  #header09-5f {
    padding-top: 1rem !important;
  }
}

/* -------------------------------------------------------------------------- */
/* Réduire l'espace entre les textes relatifs aux réseaux sociaux            */
/* -------------------------------------------------------------------------- */
/*
  Le vrai coupable était le line-height imposé par le thème via .display-4.
  On corrige uniquement ça, de façon robuste (id variable après réexport).
*/

section.social02 .card-box .display-4,
section[id^="social02-"] .card-box .display-4 {
  line-height: 1 !important;
}