.elementor-kit-9{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){--kit-widget-spacing:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* ================================================================
   CLINIQUE DIRECT — CSS Global Elementor
   Coller dans : Elementor > Paramètres du site > CSS Personnalisé
   OU dans : Apparence > Personnaliser > CSS Additionnel
   ================================================================ */

/* --- Google Fonts --- */
@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700;800&family=Inter:wght@300;400;500;600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200&display=swap');

/* --- Tokens de design --- */
:root {
  --cd-gold:           #b8972a;
  --cd-gold-light:     #d4b554;
  --cd-gold-fixed:     #f1e6bc;
  --cd-navy:           #021c39;
  --cd-navy-dark:      #1b314f;
  --cd-secondary:      #4a5f80;
  --cd-surface:        #f9f9ff;
  --cd-surface-low:    #f0f3ff;
  --cd-surface-ctn:    #e7eeff;
  --cd-gradient:       linear-gradient(135deg, #b8972a 0%, #d4b554 100%);
  --cd-radius-card:    24px;
  --cd-radius-btn:     12px;
  --cd-shadow-card:    0 20px 40px rgba(2, 28, 57, 0.08);
  --cd-shadow-hover:   0 30px 60px rgba(2, 28, 57, 0.12);
}

/* --- Base --- */
body {
  background-color: var(--cd-surface);
  color: var(--cd-navy);
}

/* ================================================================
   MATERIAL SYMBOLS (Google Fonts icon font)
   ================================================================ */
.mat-icon {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 24px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  direction: ltr;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}
.mat-icon.fill1 { font-variation-settings: 'FILL' 1, 'wght' 400, 'GRAD' 0, 'opsz' 24; }
.mat-icon.w300  { font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24; }

/* ================================================================
   HERO
   ================================================================ */
.cd-hero-section {
  position: relative;
}
.cd-hero-canvas-wrap {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  background: #ffcc33;
}
#cd-hero-canvas {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: block;
}
.cd-hero-overlay {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 20% 50%, rgba(0,0,0,.3) 0%, transparent 60%);
  z-index: 1;
  pointer-events: none;
}
.cd-hero-content {
  position: relative;
  z-index: 10;
}

/* Badge pill */
.cd-badge {
  display: inline-block;
  padding: 5px 14px;
  border-radius: 9999px;
  background: rgba(255, 255, 255, 0.2);
  color: #fff;
  font-family: Manrope, sans-serif;
  font-weight: 700;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.12em;
  border: 1px solid rgba(255, 255, 255, 0.3);
  backdrop-filter: blur(12px);
}

/* ================================================================
   BOUTONS
   ================================================================ */
.btn-cd-primary {
  background: var(--cd-gradient);
  color: #fff;
  border: none;
  padding: 16px 32px;
  border-radius: var(--cd-radius-btn);
  font-family: Manrope, sans-serif;
  font-weight: 700;
  font-size: 17px;
  cursor: pointer;
  box-shadow: 0 8px 20px rgba(0,0,0,.2);
  transition: box-shadow .3s, transform .2s;
  text-decoration: none;
  display: inline-block;
}
.btn-cd-primary:hover {
  box-shadow: 0 16px 35px rgba(0,0,0,.25);
  transform: translateY(-2px);
  color: #fff;
}

/* ================================================================
   SECTION 2 — CARTES SERVICES CHEVAUCHANTES
   ================================================================ */
.cd-service-card {
  background: #ffffff;
  border-radius: 8px;
  padding: 60px 40px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  transition: transform .3s ease, box-shadow .3s ease;
  box-shadow: 0 10px 30px rgba(0,0,0,.08);
  border: 1px solid rgba(0,0,0,.03);
  min-height: 480px;
}
.cd-service-card:hover {
  box-shadow: 0 20px 40px rgba(0,0,0,.12);
}

/* ================================================================
   SECTION 3 — BENTO CARDS
   ================================================================ */
.cd-bento-card {
  background: #ffffff;
  border-radius: var(--cd-radius-card);
  padding: 40px;
  transition: box-shadow .3s ease;
}
.cd-bento-card:hover {
  box-shadow: var(--cd-shadow-card);
}
.cd-bento-gold {
  background: var(--cd-gradient);
  color: #ffffff;
  border-radius: var(--cd-radius-card);
  padding: 40px;
}

/* ================================================================
   SECTION 4 — VALUE PROPS (Icon-box Elementor)
   ================================================================ */
.cd-icon-box-wrap .elementor-icon-box-icon {
  width: 56px !important;
  height: 56px !important;
  border-radius: 16px !important;
  background: rgba(184, 151, 42, 0.1) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex-shrink: 0;
}

/* ================================================================
   SECTION 5 — STATS
   ================================================================ */
.cd-stat-col {
  text-align: center;
}

/* ================================================================
   SECTION 6 — FORMULAIRE
   ================================================================ */
.cd-input {
  width: 100%;
  background: var(--cd-surface-low);
  border: none;
  border-radius: var(--cd-radius-btn);
  padding: 16px;
  font-family: Inter, sans-serif;
  font-size: 15px;
  color: var(--cd-navy);
  outline: none;
  transition: background .2s, box-shadow .2s;
  display: block;
  box-sizing: border-box;
}
.cd-input:focus {
  background: #ffffff;
  box-shadow: 0 0 0 2px rgba(184, 151, 42, .4);
}
.cd-input-label {
  font-size: 14px;
  font-weight: 700;
  color: var(--cd-secondary);
  font-family: Inter, sans-serif;
  display: block;
  margin-bottom: 8px;
}

/* ================================================================
   SECTION 7 — FOOTER
   ================================================================ */
.cd-footer-link,
.cd-footer-link:visited {
  color: #94a3b8;
  font-size: 14px;
  font-family: Inter, sans-serif;
  text-decoration: none;
  transition: color .2s;
}
.cd-footer-link:hover {
  color: var(--cd-gold);
  text-decoration: underline;
}

/* Footer nav-menu widget override */
#section-footer .elementor-nav-menu a {
  color: #94a3b8 !important;
  font-family: Inter, sans-serif !important;
  font-size: 14px !important;
  text-decoration: none !important;
  padding: 0 !important;
  transition: color .2s !important;
}
#section-footer .elementor-nav-menu a:hover {
  color: var(--cd-gold) !important;
}

/* ================================================================
   ELEMENTOR OVERRIDES
   ================================================================ */
.elementor-section.elementor-section-boxed > .elementor-container {
  max-width: 1280px;
}
.e-con-inner {
  max-width: 1280px;
}

/* Remove default Elementor column padding in stats row */
#section-stats .elementor-column > .elementor-widget-wrap {
  padding: 0;
}/* End custom CSS */