/* ============================================
   MWASI STUDIO - CSS FINAL DEFINITIF
   ============================================ */

/* === VIDEO PORTFOLIO 9:16 === */
.elementor-element-f5a98cc .elementor-widget-container,
.elementor-element-b2aef1c .elementor-widget-container,
.elementor-element-ef5e699 .elementor-widget-container,
.elementor-element-1a52d8a .elementor-widget-container,
.elementor-element-2df7718 .elementor-widget-container {
  aspect-ratio: 9 / 16 !important;
  overflow: hidden !important;
  height: auto !important;
}
.elementor-element-f5a98cc .elementor-widget-container video,
.elementor-element-b2aef1c .elementor-widget-container video,
.elementor-element-ef5e699 .elementor-widget-container video,
.elementor-element-1a52d8a .elementor-widget-container video,
.elementor-element-2df7718 .elementor-widget-container video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
}

/* === STUDIO* : overflow visible partout === */
.elementor-element-f97ed0a,
.elementor-element-93910fb {
  overflow: visible !important;
  width: 100% !important;
}
.elementor-element-f97ed0a .elementor-heading-title,
.elementor-element-93910fb .elementor-heading-title {
  overflow: visible !important;
  white-space: nowrap !important;
  display: block !important;
}

/* === DESKTOP >= 1025px === */
@media (min-width: 1025px) {
  .elementor-element-f5a98cc,
  .elementor-element-b2aef1c,
  .elementor-element-ef5e699,
  .elementor-element-1a52d8a,
  .elementor-element-2df7718 {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 6px !important;
  }
}

/* === TABLETTE 768px - 1024px === */
@media (min-width: 768px) and (max-width: 1024px) {

  /* Videos 2 par 2 */
  .elementor-element-f5a98cc,
  .elementor-element-b2aef1c,
  .elementor-element-ef5e699,
  .elementor-element-1a52d8a,
  .elementor-element-2df7718 {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 6px !important;
  }

  /* Studio* tablette */
  .elementor-element-f97ed0a .elementor-heading-title,
  .elementor-element-93910fb .elementor-heading-title {
    font-size: clamp(4rem, 11vw, 9rem) !important;
    line-height: 1 !important;
  }

  /* Bouton Réserver tablette pleine largeur */
  .elementor-element-15d7b75 {
    width: 100% !important;
    max-width: 100% !important;
  }
  .elementor-element-15d7b75 .elementor-button-wrapper,
  .elementor-element-15d7b75 .elementor-button {
    width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }
  /* Bouton DISCUTONS tablette : taille auto */
  .elementor-element-737308f {
    width: auto !important;
  }
  .elementor-element-737308f .elementor-button {
    width: auto !important;
    display: inline-block !important;
    padding: 14px 30px !important;
    white-space: nowrap !important;
  }

  /* Textes tablette */
  .elementor-5550 .elementor-widget-text-editor p {
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    max-width: 100% !important;
  }

  /* Espaces titres/textes tablette */
  .elementor-element-99bc5e7, .elementor-element-36c4ded,
  .elementor-element-7e9dd48, .elementor-element-d92e956,
  .elementor-element-9c90985, .elementor-element-4cc7ad4,
  .elementor-element-71fdfd3, .elementor-element-2423a6a {
    margin-bottom: 8px !important;
  }
}

/* === MOBILE <= 767px === */
@media (max-width: 767px) {

  /* Studio* mobile : 13vw pour tenir sur une ligne */
  .elementor-element-f97ed0a .elementor-heading-title,
  .elementor-element-93910fb .elementor-heading-title {
    font-size: 13vw !important;
    letter-spacing: -1px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    text-align: center !important;
    display: block !important;
    width: 100% !important;
  }

  /* Videos mobile 1 colonne */
  .elementor-element-f5a98cc,
  .elementor-element-b2aef1c,
  .elementor-element-ef5e699,
  .elementor-element-1a52d8a,
  .elementor-element-2df7718 {
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
  }

  /* Bouton mobile pleine largeur */
  .elementor-element-15d7b75,
  .elementor-element-737308f {
    width: 100% !important;
    max-width: 100% !important;
  }
  .elementor-element-15d7b75 .elementor-button-wrapper,
  .elementor-element-737308f .elementor-button-wrapper,
  .elementor-element-15d7b75 .elementor-button,
  .elementor-element-737308f .elementor-button {
    width: 100% !important;
    max-width: 100% !important;
    display: block !important;
    box-sizing: border-box !important;
    text-align: center !important;
    padding: 14px 20px !important;
  }

  /* Textes mobile */
  .elementor-5550 .elementor-widget-text-editor,
  .elementor-5550 .elementor-widget-heading {
    max-width: 100% !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
    box-sizing: border-box !important;
  }

  /* Espaces titres/textes mobile */
  .elementor-element-99bc5e7, .elementor-element-36c4ded,
  .elementor-element-a254543, .elementor-element-6ac4e31,
  .elementor-element-4355a3d, .elementor-element-f1f283e,
  .elementor-element-7e9dd48, .elementor-element-d92e956,
  .elementor-element-9c90985, .elementor-element-4cc7ad4,
  .elementor-element-71fdfd3, .elementor-element-2423a6a {
    margin-bottom: 8px !important;
  }
}

/* --- Stats grille 2x2 sur mobile --- */
@media (max-width: 767px) {
  .elementor-element-78cce9f {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 20px !important;
    flex-direction: unset !important;
  }
  .elementor-element-dcacb31 {
    width: 100% !important;
  }
}

/* --- Espace entre bouton DISCUTONS et MES SERVICES --- */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-element-737308f {
    margin-bottom: 40px !important;
  }
}

/* --- Espace bouton DISCUTONS -> MES SERVICES --- */
@media (min-width: 768px) and (max-width: 1024px) {
  .elementor-element-a2a7eb2 {
    margin-bottom: 48px !important;
    padding-bottom: 48px !important;
  }
  .elementor-element-de09063 {
    margin-bottom: 48px !important;
  }
  .elementor-element-28e81b3 {
    margin-top: 48px !important;
    padding-top: 48px !important;
  }
  .elementor-element-a2fcce9 {
    margin-top: 48px !important;
  }
}

/* --- HEADER CUSTOM LOGO --- */
.hfe-header {
  position: fixed !important;
  top: 0 !important;
  left: 0 !important;
  width: 100% !important;
  z-index: 9999 !important;
  background: transparent !important;
  padding: 20px 40px !important;
  box-sizing: border-box !important;
}
.hfe-header img {
  height: 38px !important;
  width: auto !important;
}
/* Eviter que le header cache le contenu */
.hfe-canvas--has-header .elementor-section-wrap,
.elementor-canvas .hfe-header + * {
  padding-top: 80px !important;
}


  .elementor-form .elementor-field-label,
  .elementor-form label {
    display: block !important;
    width: 100% !important;
    margin-bottom: 6px !important;
  }
  .elementor-form .elementor-field,
  .elementor-form input,
  .elementor-form textarea,
  .elementor-form select {
    width: 100% !important;
    box-sizing: border-box !important;
    display: block !important;
  }
  .elementor-form .elementor-field-group {
    margin-bottom: 16px !important;
    flex-wrap: wrap !important;
  }
  /* Checkbox alignée correctement */
  .elementor-field-type-checkbox .elementor-field-label {
    display: inline !important;
    width: auto !important;
  }
}


  .elementor-element-96cd215 .e-form__field,
  .elementor-element-96cd215 .e-form-input,
  .elementor-element-96cd215 .e-form-textarea,
  .elementor-element-96cd215 .e-form-label,
  .elementor-element-96cd215 .e-form-submit-button,
  .elementor-element-96cd215 > * {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Chaque champ prend toute la largeur */
  .elementor-element-a8949d0,
  .elementor-element-8c3195f,
  .elementor-element-9175d55,
  .elementor-element-de4844a,
  .elementor-element-805cce5 {
    width: 100% !important;
    max-width: 100% !important;
  }
  .elementor-element-a8949d0 input,
  .elementor-element-8c3195f input,
  .elementor-element-9175d55 input,
  .elementor-element-de4844a textarea {
    width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Submit pleine largeur */
  .elementor-element-805cce5 button,
  .elementor-element-805cce5 .elementor-button {
    width: 100% !important;
    display: block !important;
  }
}