/*
Theme Name:   Hello Elementor Child
Theme URI:    https://elementor.com/hello-theme/
Description:  A lightweight, plain-vanilla child theme for Hello Elementor
Author:       Elementor Team
Author URI:   https://elementor.com/
Template:     hello-elementor
Version:      1.0.0
Text Domain:  hello-elementor-child
License:      GNU General Public License v3 or later
License URI:  https://www.gnu.org/licenses/gpl-3.0.html
Tags:         flexible-header, accessibility-ready, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ==========================================================================
   Child Theme Custom Styles
   ========================================================================== */

/* Add your custom CSS below this line */
/** link menu**/
  :root{
    --teal:#4EC7D6;
    --teal-dark:#3FB6C5;
    --dark:#1E1E1E;
    --text:#2B2B2B;
    --row-bg:#F4F4F4;
    --gap:#FFFFFF;
    --radius:24px;
  }
.contact-link{
	display: none !important;
}
/** end **/

.rounded-title {
  border: 1px solid #ff6883;
  width: 271;
  angle: 0 deg;
  border-radius: 999px;
  border-width: 1px;
  padding-top: 7.5px;
  padding-right: 16px;
  padding-bottom: 7.64px;
  padding-left: 16px;
}
.block-form{
	box-shadow: 0px 20px 60px 0px #1F1B2E1F;
	position: sticky !important;
    top: 140px;
}
.block-sticky{
	position: sticky !important;
    top: 140px;
}
.form-contact .e-form__indicators{
     display: flex;
     gap: 16px;
     width: 100%;
     max-width: 100%;
}
.form-contact .e-form__indicators .e-form__indicators__indicator{
	flex: 1;
    background-color: #f4faff;
    border-radius: 12px;
    padding: 15px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    overflow: hidden;
    transition: all 0.3s ease;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.02);
	/*border-top: 3px solid #5BC2D714*/
	border: 2px solid #E5E7EB;
}
.form-contact .e-form__indicators .e-form__indicators__indicator__separator{
	display: none;
}
.form-contact .e-form__indicators .e-form__indicators__indicator.e-form__indicators__indicator--state-active{
	display: flex;
  	flex-direction: column;
  	align-items: center;
  	justify-content: center;
  
  /* Bordure en dégradé */
  border: 2px solid #5BC2D8;
  
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
}
.form-contact .e-form__indicators__indicator__label{
	font-family: Roboto;
	font-weight: 400;
	font-style: Regular;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: 0%;
	text-align: center;
	vertical-align: middle;
	color: #374151;
}
.form-contact .e-form__indicators__indicator__number{
	font-family: 'Libre Caslon Text', sans-serif;
	font-weight: 600;
	font-style: SemiBold;
	font-size: 24px;
	line-height: 79.2px;
	letter-spacing: -1px;
	vertical-align: middle;
	color: #A8AEB9;
	height: 24px;
}
.form-contact .e-form__indicators__indicator--state-active .e-form__indicators__indicator__number{
	color: #5BC2D8;
}
.flex-item-one {
	flex: 1;
}

/** personnaliser le style de theme **/
table tbody>tr:nth-child(odd)>td, table tbody>tr:nth-child(odd)>th{
	background-color: transparent !important;
}
table td, table th{
	border: none !important;
	font-family: "Inter" sans-serif;
	font-weight: 400;
	font-style: Regular;
	font-size: 14.5px;
	leading-trim: NONE;
	line-height: 22.48px;
	letter-spacing: 0%;
	vertical-align: middle;
	color: #1F1B2E;
}
/** end **/

/** block ref **/
.block-ref {
	flex-wrap: wrap;
	align-items: stretch;
}
.block-ref > * {
	flex: 0 0 calc(225px - 10px) !important;
}
/** end block ref **/

/** block card numétoté **/
.block-cart-numerote{
	flex-wrap: wrap;
	align-items: stretch;
	gap: 30px;
}
.block-cart-numerote > * {
	flex: 0 0 calc(33.33% - 20px) ; 
}
.card-numerote{
	height: 100%;
}
.card-numerote .elementor-icon{
    position: absolute;
    top: -20px;
}
/** fin **/

/** style table **/
  .comparison{
    width:100%;
    background:#F3F3F3;
    border-radius:16px;
    box-shadow:0 6px 24px rgba(0,0,0,.08);
    
  }

  table{
    width:100%;
  }

  /* ---------- En-tête ---------- */
	.comparison thead{
		margin:14px;
		background: #5AC8D8;
	}
  thead th{
    color:#fff;
    font-size:.85rem;
    font-weight:600;
    padding:22px 12px;
    text-align:center;
    vertical-align:middle;
  }
  thead th:first-child{
    border-top-left-radius:var(--radius);
    border-bottom-left-radius:var(--radius);
  }
  thead th:last-child{
    border-top-right-radius:var(--radius);
    border-bottom-right-radius:var(--radius);
  }

  /* ---------- Corps ---------- */
  tbody td, tbody th{
    background:var(--row-bg);
    padding:20px 14px;
    font-size:.8rem;
    font-weight:400;
    vertical-align:middle;
  }
  tbody th{
    text-align:left;
    font-weight:500;
    color:var(--dark);
    width:34%;
  }
  tbody td{
    text-align:center;
    width:22%;
    color:var(--text);
  }

  /* ---------- Icônes ---------- */
  .icon{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:24px;
    height:24px;
    border-radius:50%;
    vertical-align:middle;
  }
  .icon svg{width:12px;height:12px;}
  .yes{background: #5AC8D8;}
  .no{background:var(--dark);}
  .yes svg{stroke:#fff;}
  .no svg{stroke:#fff;}

  .visually-hidden{
    position:absolute;
    width:1px;height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }

/** animation btn whatsap ***/
/* Effet de survol sur le bouton lui-même */
.whatsapp-btn .elementor-button:hover {
  transform: scale(1.08);
}

/* Base commune pour les ondes */
.whatsapp-btn .elementor-button::before,
.whatsapp-btn .elementor-button::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  background-color: #61CE70; /* La couleur de vos ondes */
  border-radius: 50%;
  transform: translate(-50%, -50%);
  z-index: -1; /* Placé derrière l'icône */
  opacity: 0;
  pointer-events: none; /* Évite de bloquer les clics */
}

/* Animation de la première onde */
.whatsapp-btn .elementor-button::before {
  animation: pulse-wave 2.4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
}

/* Animation de la deuxième onde (décalée dans le temps pour fluidifier) */
.whatsapp-btn::after {
  animation: pulse-wave 2.4s cubic-bezier(0.215, 0.61, 0.355, 1) infinite;
  animation-delay: 1.2s; /* Démarre pile à la moitié du cycle de la première */
}

/* Définition de l'animation */
@keyframes pulse-wave {
  0% {
    transform: translate(-50%, -50%) scale(1);
    opacity: 0.8;
  }
  100% {
    transform: translate(-50%, -50%) scale(2.2); /* S'élargit jusqu'à 2.2 fois sa taille */
    opacity: 0; /* Devient invisible à la fin */
  }
}
/** end btn whatsap**/

  /* ================= RESPONSIVE ================= */

  /* Tablette : réduction des espacements */
  @media (max-width:640px){
    thead th{font-size:.75rem;padding:16px 8px;}
    tbody td, tbody th{font-size:.72rem;padding:14px 8px;}
  }

  /* Mobile : le tableau devient des cartes empilées */
  @media (max-width:480px){
    .comparison{padding:10px;}
    table, thead, tbody, tr, th, td{display:block;width:100%;}
    thead{position:absolute;left:-9999px;top:-9999px;} /* on masque l'en-tête, les labels sont injectés via data-col */

    tbody tr{
      background:var(--row-bg);
      border-radius:14px;
      margin-bottom:12px;
      overflow:hidden;
      padding:6px 0;
    }
    tbody th{
      width:100%;
      background:var(--teal);
      color:#fff;
      font-size:.82rem;
      font-weight:600;
      text-align:center;
      border-radius:14px 14px 0 0;
      padding:14px 12px;
      margin:-6px 0 0 0;
    }
    tbody td{
      width:100%;
      background:transparent;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:12px;
      text-align:right;
      padding:12px 16px;
      border-bottom:1px solid #e6e6e6;
    }
    tbody td:last-child{border-bottom:none;}
    tbody td::before{
      content:attr(data-col);
      font-weight:500;
      color:var(--dark);
      text-align:left;
      flex-shrink:0;
    }
	table tbody>tr:nth-child(odd)>th{
      background-color: #B85BBD !important;
	}
  }
/** fin style table**/
.shadow-left-right {
  /* Crée un masque linéaire : transparent aux extrémités (0% et 100%) et opaque au milieu */
  mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, transparent 0%, black 10%, black 90%, transparent 100%);
}

  /* ── Mobile: stack as cards ── */
  @media (max-width: 599px) {
    .comparatif-wrapper { box-shadow: none; border-radius: 0; }

    .comparatif-table,
    .comparatif-table thead,
    .comparatif-table tbody,
    .comparatif-table th,
    .comparatif-table td,
    .comparatif-table tr { display: block; width: 100%; min-width: unset; }

    .comparatif-table thead { display: none; }

    .comparatif-table tbody tr {
      background: white;
      border-radius: 10px;
      box-shadow: 0 2px 10px rgba(0,0,0,0.07);
      margin-bottom: 16px;
      border: none;
      overflow: hidden;
    }

    .comparatif-table tbody tr:nth-child(even) td,
    .comparatif-table tbody tr:nth-child(odd)  td { background: white; }

    .comparatif-table td {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 12px 16px;
      border-bottom: 1px solid #f0f0f0;
      text-align: right;
    }

    .comparatif-table td:last-child { border-bottom: none; }

    /* Label injected via data-label */
    .comparatif-table td::before {
      content: attr(data-label);
      font-weight: 600;
      font-size: 12px;
      color: #888;
      text-transform: uppercase;
      letter-spacing: 0.04em;
      text-align: left;
      flex: 0 0 90px;
      margin-right: 12px;
    }

    /* Critère row — full-width header style */
    .comparatif-table td.col-critere {
      background: #f7f7f7 !important;
      font-weight: 600;
      font-size: 13px;
      color: #1a1a1a;
      justify-content: flex-start;
      text-align: left;
    }
    .comparatif-table td.col-critere::before { display: none; }

    /* MonarkIT row highlight */
    .comparatif-table td.col-monark {
      background: #f0fbfd !important;
      text-align: right;
    }
    .comparatif-table td.col-other {
      text-align: right;
    }
  }
/** fin **/

.block-offer-one{
    background: linear-gradient(134.34deg, #1F1B2E 0%, #3A2F5A 60%, #6E58F3 100%);
  }
.yellow-tag{
	background-color: #FFC85724;
	border-radius: 999px;
	color: #FFC857;
	font-family: Inter;
	font-weight: 800;
	font-style: Extra Bold;
	font-size: 11.5px;
	leading-trim: NONE;
	line-height: 17.83px;
	letter-spacing: 0.46px;
	vertical-align: middle;
	padding: 5px 10px;
	width: fit-content;
	margin-top: 6px;
}

.counter-block .elementor-counter{
	gap: 15px;
	text-align: center;
}
/** media query **/
@media(max-width: 767px){
	.form-contact .e-form__indicators__indicator__number{
		width: 20px;
		height:20px;
	}
}
@media(max-width: 600px){
	.block-cart-numerote > * {
		flex: 0 0 calc(100% - 20px) ; 
	}
	.form-contact .e-form__indicators .e-form__indicators__indicator{
		border: 1px solid #E5E7EB;
	}
	.form-contact .e-form__indicators__indicator__number{
		font-size: 18px;
		line-height: 25px;
		width: 18px;
		height:18px;
	}
	.block-sticky{
		position: relative !important;
		top: 0px !important;
	}
	.counter-block{
		text-align: center;
	}
}
@media(max-width: 1024px){
	.contact-btn{
		display: none !important;
	}
	.contact-link{
		display: block !important;
	}
}

@media (min-width: 2400px) {
	#monarkit-sticky-header{
		left: 50% !important;
    	transform: translateX(-50%);
    	width: 100% !important;
		max-width: 1240px;
	}
}
/** end media query **/

/** globale style*/
.flex-center h2, .flex-center h1{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 8px;
}
.m-auto{
	margin: 0 auto;
}
.break-line {
	display: block !important;
	flex: 1 !important;
  	width: 100% !important;
  	height: auto !important;
  	white-space: normal !important;
  	overflow: visible !important;
  	padding: 0 !important;
}
.gradienhero-pinkcolor{
	background: linear-gradient(
    90deg, 
    #FE3559 0%, 
    #D55CC7 33%, 
    #FF5238 66%, 
    #FE3559 100%
  	);
  	font-style: italic;
  	-webkit-background-clip: text;
  	background-clip: text;
  	-webkit-text-fill-color: transparent;
}
.btn-gradien-bg{
	background: linear-gradient(135deg, #0773DB 0%, #D55CC7 36%, #FE3559 68%, #FF5238 100%);
}
.gradien-pinkyellow{
	font-style: italic;
  	background: linear-gradient(90deg, #D55CC7 10%, #FFAE00 25%, #FF5238 50%, #FE3559 68%, #D55CC7 100%);
  	-webkit-background-clip: text;
  	background-clip: text;
  	-webkit-text-fill-color: transparent;
}
/* Base pour les mots en dégradé italique */
.gradient-red,
.gradient-blue {
	font-size: 64px;
  	font-style: italic;
  	-webkit-background-clip: text;
  	background-clip: text;
  	-webkit-text-fill-color: transparent;
}
/* Dégradé Rose / Rouge */
.gradient-red {
  	background-image: linear-gradient(90deg, #D55CC7 0%, #FE3559 50%, #FF5238 100%);
}

/* Dégradé Bleu / Violet */
.gradient-blue {
  	background-image: linear-gradient(90deg, #0773DB 0%, #6155D1 60%, #D55CC7 100%);
}
.gradien-yellowpink{
	background: linear-gradient(90deg, #F19E1B 0%, #FE3559 50%, #D55CC7 100%);
  	-webkit-background-clip: text;
  	background-clip: text;
  	-webkit-text-fill-color: transparent;
}
/** end g style **/