/* ==========================================================================
   1) CONTENEUR PRINCIPAL : avec coins arrondis et overflow caché
   ========================================================================== */
.mse-video-slider-wrapper {
  position: relative;
  width: 100%;
  /* Hauteur de votre slider (ajustez selon vos besoins) */
  height: 80vh;
  max-height: 100%; /* optionnel */
  overflow: hidden;  /* pour que la vidéo et la bande du bas soient rognées aux coins */
  border-radius: 16px; /* coins arrondis du slider */
  display: flex;
  align-items: center;
  justify-content: flex-start; /* on aligne le contenu à gauche */
  background-color: #000;       /* utile en cas de latence vidéo */
}

/* ========================================================================
   2) VIDÉO EN FOND et OVERLAY
   ======================================================================== */
.mse-video-background {
  position: absolute;
  top: 50%;
  left: 50%;
  width: auto;
  height: 100%;
  min-width: 100%;
  min-height: 100%;
  transform: translate(-50%, -50%);
  object-fit: cover;
  z-index: 1;
}

.mse-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* Légèrement plus sombre pour faire ressortir le texte blanc */
  background: rgba(0, 0, 0, 0.35);
  z-index: 2;
}

/* ==========================================================================
   3) CONTENU PRINCIPAL (TEXTE + BOUTONS), aligné à gauche
   ========================================================================== */
.mse-content-container {
  position: relative !important;
  z-index: 4 !important;          
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  align-items: flex-start !important; /* on colle le texte/boutons à gauche */
  padding: 0 40px !important;        /* espace gauche/droite du contenu */
  width: 100% !important;
  max-width: 600px !important;       /* largeur max pour le bloc texte/boutons */
  color: #FFFFFF !important;
}

/* TITRE */
.mse-main-title {
  margin: 0 !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 3rem !important;        /* Ajustez si besoin */
  font-weight: 600 !important;
  line-height: 1.1 !important;
  color: #FFFFFF !important;         /* Blanc sur overlay */
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4) !important;
}

/* SOUS-TITRE */
.mse-subtitle {
  margin: 0.5rem 0 2rem 0 !important;
  font-family: 'Open Sans', sans-serif !important;
  font-size: 1.1rem !important;
  font-weight: 400 !important;
  color: #FFFFFF !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4) !important;
}

/* BOUTONS : groupe horizontal, aligné à gauche */
.mse-button-group {
  display: flex !important;
  gap: 1rem !important;
  flex-wrap: wrap !important;
}

/* STYLE GÉNÉRAL DES BOUTONS */
.mse-btn {
  display: inline-block !important;
  padding: 0.8rem 1.8rem !important;
  font-family: 'Poppins', sans-serif !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  text-decoration: none !important;
  border-radius: 6px !important;
  transition: background-color 0.25s ease, transform 0.2s ease !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
  z-index: 5 !important;
}

/* Empêche le soulignement éventuel au hover ajouté par le thème */
.mse-btn:hover {
  text-decoration: none !important;
}

/* BOUTON PRIMAIRE (orange) */
.mse-btn-primary,
.mse-btn-primary:link,
.mse-btn-primary:visited {
  background-color: #FFB300;
  color: #FFFFFF;
  border: none;
  text-decoration: none !important;
}

.mse-btn-primary:hover {
  background-color: #e6a000 !important;
  color: #fff;
  transform: translateY(-2px) !important;
  text-decoration: none !important;
}

/* BOUTON SECONDAIRE (blanc) */
.mse-btn-secondary,
.mse-btn-secondary:link,
.mse-btn-secondary:visited {
  background-color: #FFFFFF;
  color: #1A2A44;    /* Bleu foncé pour le texte */
  border: 1px solid #DDDDDD;
  text-decoration: none !important;
}

.mse-btn-secondary:hover {
  background-color: #f2f2f2 !important;
  color: #000;
  transform: translateY(-2px) !important;
  text-decoration: none !important;
}

@media (max-width: 1024px) {
  .mse-main-title {
    font-size: 2.5rem !important;
  }
  .mse-subtitle {
    font-size: 1rem !important;
  }
  .mse-content-container {
    padding: 0 30px !important;
    max-width: 500px !important;
  }
  
}

/* Mobile / Écran petit */
@media (max-width: 768px) {
  .mse-main-title {
    font-size: 2rem !important;
  }
  .mse-subtitle {
    font-size: 0.95rem !important;
    margin-bottom: 1.2rem !important;
  }
  .mse-button-group {
    gap: 0.5rem !important;
  }
  .mse-btn {
    padding: 0.7rem 1.4rem !important;
    font-size: 0.9rem !important;
  }
  .mse-content-container {
    padding: 0 20px !important;
    max-width: 100% !important;
  }
  
}