/* ==========================================================
   ELEMENTOR FRAMEWORK CSS — media2001 v2
   ========================================================== */

/* ----------------------------------------------------------
   FIX GLOBAL overflow — évite la bande noire
   ---------------------------------------------------------- */

html, body { overflow-x: hidden; }
html { background-color: var(--zone-1, #ffffff); }

/* ==========================================================
   VARIABLES FRAMEWORK
   ========================================================== */

:root {
  --section-xxl-padding-min: 9.375rem; --section-xxl-padding-max: 10rem;
  --section-xl-padding-min:  6.875rem; --section-xl-padding-max:  7.5rem;
  --section-l-padding-min:   5.625rem; --section-l-padding-max:   6.25rem;
  --section-m-padding-min:   5rem;     --section-m-padding-max:   5rem;
  --section-s-padding-min:   3.75rem;  --section-s-padding-max:   3.75rem;
  --section-xs-padding-min:  2.5rem;   --section-xs-padding-max:  2.5rem;
  --section-xxs-padding-min: 1.5rem;   --section-xxs-padding-max: 1.5rem;
  --section-header-padding-min: 1.25rem; --section-header-padding-max: 1.25rem;
  --fluid-side-padding-min: 1.25rem;
  --fluid-side-padding-max: 5rem;
  --gap-none: 0px; --gap-xxs: 0.5rem; --gap-xs: 0.75rem; --gap-sm: 1rem;
  --gap-md: 1.5rem; --gap-lg: 2rem; --gap-xl: 3rem; --gap-2xl: 4rem;
  --section-hero-height: 100vh;
  --section-offset-header: 80px;
  --section-narrow: 62.5rem;
  --section-narrow-xs: 45rem;
  --rail-gap: 1.25rem;
  --rail-peek: 2rem;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.12);
  --transition-normal: 0.3s ease-out;
  --zone-1: #ffffff; --zone-1-text: #333333;
  --zone-2: #f5f5f5; --zone-2-text: #333333;
  --zone-3: #1a1a2e; --zone-3-text: #f0f0f0;
}

/* ==========================================================
   SECTION PADDING
   ========================================================== */

.section-xxl { padding-top: clamp(var(--section-xxl-padding-min),1.087vw + 9.13rem,var(--section-xxl-padding-max)); padding-bottom: clamp(var(--section-xxl-padding-min),1.087vw + 9.13rem,var(--section-xxl-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-xl  { padding-top: clamp(var(--section-xl-padding-min),1.087vw + 6.63rem,var(--section-xl-padding-max)); padding-bottom: clamp(var(--section-xl-padding-min),1.087vw + 6.63rem,var(--section-xl-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-l   { padding-top: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-bottom: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-m   { padding-top: clamp(var(--section-m-padding-min),0vw + 5rem,var(--section-m-padding-max)); padding-bottom: clamp(var(--section-m-padding-min),0vw + 5rem,var(--section-m-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-s   { padding-top: clamp(var(--section-s-padding-min),0vw + 3.75rem,var(--section-s-padding-max)); padding-bottom: clamp(var(--section-s-padding-min),0vw + 3.75rem,var(--section-s-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-xs  { padding-top: clamp(var(--section-xs-padding-min),0vw + 2.5rem,var(--section-xs-padding-max)); padding-bottom: clamp(var(--section-xs-padding-min),0vw + 2.5rem,var(--section-xs-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-xxs { padding-top: clamp(var(--section-xxs-padding-min),0vw + 1.5rem,var(--section-xxs-padding-max)); padding-bottom: clamp(var(--section-xxs-padding-min),0vw + 1.5rem,var(--section-xxs-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-header { padding-top: clamp(var(--section-header-padding-min),0vw + 1.25rem,var(--section-header-padding-max)); padding-bottom: clamp(var(--section-header-padding-min),0vw + 1.25rem,var(--section-header-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }

.section-hero { min-height: var(--section-hero-height) !important; }
.section-hero .e-con-inner { justify-content: center !important; }
.section-full div { max-width: 100% !important; }
.section-narrow .e-con-inner { max-width: var(--section-narrow) !important; }
.section-narrow-xs .e-con-inner { max-width: var(--section-narrow-xs) !important; }
.section-offset { padding-top: calc(var(--section-offset-header) + var(--section-xxl-padding-min)); }

/* ==========================================================
   BACKGROUNDS
   ========================================================== */

.bg-light     { background-color: var(--color-light)     !important; }
.bg-light-alt { background-color: var(--color-light-alt) !important; }
.bg-dark      { background-color: var(--color-dark)      !important; color: var(--color-text-on-dark) !important; }
.bg-dark-alt  { background-color: var(--color-dark-alt)  !important; color: var(--color-text-on-dark) !important; }
.bg-primary   { background-color: var(--color-primary)   !important; color: var(--color-white)        !important; }
.bg-white     { background-color: var(--color-white)     !important; }

/* ==========================================================
   SECTION ZONES
   ========================================================== */

.section-zone-1 { background-color: var(--zone-1) !important; color: var(--zone-1-text) !important; padding-top: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-bottom: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-zone-2 { background-color: var(--zone-2) !important; color: var(--zone-2-text) !important; padding-top: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-bottom: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }
.section-zone-3 { background-color: var(--zone-3) !important; color: var(--zone-3-text) !important; padding-top: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-bottom: clamp(var(--section-l-padding-min),1.087vw + 5.38rem,var(--section-l-padding-max)); padding-left: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; padding-right: clamp(var(--fluid-side-padding-min),6.522vw + -0.217rem,var(--fluid-side-padding-max)) !important; }

.section-zone-1.section-xxl,.section-zone-2.section-xxl,.section-zone-3.section-xxl { padding-top: clamp(var(--section-xxl-padding-min),1.087vw + 9.13rem,var(--section-xxl-padding-max)); padding-bottom: clamp(var(--section-xxl-padding-min),1.087vw + 9.13rem,var(--section-xxl-padding-max)); }
.section-zone-1.section-xl,.section-zone-2.section-xl,.section-zone-3.section-xl   { padding-top: clamp(var(--section-xl-padding-min),1.087vw + 6.63rem,var(--section-xl-padding-max)); padding-bottom: clamp(var(--section-xl-padding-min),1.087vw + 6.63rem,var(--section-xl-padding-max)); }
.section-zone-1.section-m,.section-zone-2.section-m,.section-zone-3.section-m     { padding-top: clamp(var(--section-m-padding-min),0vw + 5rem,var(--section-m-padding-max)); padding-bottom: clamp(var(--section-m-padding-min),0vw + 5rem,var(--section-m-padding-max)); }
.section-zone-1.section-s,.section-zone-2.section-s,.section-zone-3.section-s     { padding-top: clamp(var(--section-s-padding-min),0vw + 3.75rem,var(--section-s-padding-max)); padding-bottom: clamp(var(--section-s-padding-min),0vw + 3.75rem,var(--section-s-padding-max)); }
.section-zone-1.section-xs,.section-zone-2.section-xs,.section-zone-3.section-xs  { padding-top: clamp(var(--section-xs-padding-min),0vw + 2.5rem,var(--section-xs-padding-max)); padding-bottom: clamp(var(--section-xs-padding-min),0vw + 2.5rem,var(--section-xs-padding-max)); }
.section-zone-1.section-xxs,.section-zone-2.section-xxs,.section-zone-3.section-xxs { padding-top: clamp(var(--section-xxs-padding-min),0vw + 1.5rem,var(--section-xxs-padding-max)); padding-bottom: clamp(var(--section-xxs-padding-min),0vw + 1.5rem,var(--section-xxs-padding-max)); }

/* ==========================================================
   GAPS
   ========================================================== */

.gap-none .e-con-inner { gap: var(--gap-none) !important; }
.gap-xxs  .e-con-inner { gap: var(--gap-xxs)  !important; }
.gap-xs   .e-con-inner { gap: var(--gap-xs)   !important; }
.gap-sm   .e-con-inner { gap: var(--gap-sm)   !important; }
.gap-md   .e-con-inner { gap: var(--gap-md)   !important; }
.gap-lg   .e-con-inner { gap: var(--gap-lg)   !important; }
.gap-xl   .e-con-inner { gap: var(--gap-xl)   !important; }
.gap-2xl  .e-con-inner { gap: var(--gap-2xl)  !important; }

/* ==========================================================
   TEXT UTILS
   ========================================================== */

.text-muted   { color: var(--color-text-muted)   !important; }
.text-light   { color: var(--color-text-light)   !important; }
.text-on-dark { color: var(--color-text-on-dark) !important; }
.text-primary { color: var(--color-primary)      !important; }
.text-accent  { color: var(--color-accent)       !important; }

/* ==========================================================
   RAIL — scroll horizontal CSS pur, zéro JS
   ========================================================== */

@media (max-width: 1024px) {
  .rail {
    overflow-x: auto;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    scroll-snap-type: x mandatory;
    scroll-padding-left: var(--rail-gap);
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: var(--rail-gap);
    padding-left: var(--rail-gap);
    padding-right: 0;
    background: transparent !important;
  }
  .rail::-webkit-scrollbar { display: none; }
  .rail::after {
    content: '';
    display: block;
    min-width: var(--rail-gap);
    height: 1px;
    flex-shrink: 0;
  }
  .rail > *, .rail > * > * {
    flex: 0 0 calc(100vw - var(--rail-gap) * 2 - var(--rail-peek)) !important;
    max-width: calc(100vw - var(--rail-gap) * 2 - var(--rail-peek)) !important;
    scroll-snap-align: start;
    width: auto !important;
  }
}
