/* === Fix mobile hero rentability.fr — vidéo plein hero derrière le texte === */
@media (max-width: 767px) {
  /* Section : stacking context + overflow */
  section.relative.min-h-screen {
    isolation: isolate;
    overflow: hidden;
  }

  /* Wrapper vidéo : couvre TOUTE la section, derrière */
  section.relative.min-h-screen > div.absolute.inset-0.z-0 {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 0 !important;
    pointer-events: none !important;
    overflow: hidden;
  }

  /* Vidéo : remplit son wrapper, cover */
  section.relative.min-h-screen > div.absolute.inset-0.z-0 > video {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    min-width: 100% !important;
    min-height: 100% !important;
    transform: none !important;
    object-fit: cover !important;
    object-position: center !important;
    z-index: 0 !important;
    pointer-events: none !important;
  }

  /* Overlay assombrissant pour lisibilité du texte */
  section.relative.min-h-screen > div.absolute.inset-0.z-0::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8,12,20,0.35) 0%, rgba(8,12,20,0.55) 50%, rgba(8,12,20,0.85) 100%);
    z-index: 1;
    pointer-events: none;
  }

  /* Contenu : au-dessus de tout */
  section.relative.min-h-screen > div.relative.z-\[2\] {
    z-index: 10 !important;
    position: relative !important;
  }
}