/* =========================================================================
   Area Wellness Club — surcharges du thème Sixpack
   Palette (charte officielle) : gris anthracite #3B444B · jaune Area #FFD600 · blanc
   Polices : Montserrat (titres 800, accents italiques) · Cairo (arabe)
   ========================================================================= */
:root {
  --area-black: #3b444b;
  --area-ink: #343c42;
  --area-line: #4a545b;
  --area-gold: #ffd600;
  --area-gold-2: #e6c200;
  --area-white: #ffffff;
  --area-muted: #a3a3a3;
  --area-radius: 22px;
  --wdtPrimaryColor: #ffd600;
  --wdtPrimaryColorRgb: 255, 214, 0;
  --wdtSecondaryColor: #fff0a0;
  --wdtTertiaryColor: #343c42;
  --wdtFontTypo_Alt: Montserrat, sans-serif;
  --wdtFontTypo_Base: Montserrat, system-ui, sans-serif;
}
body.area-site { font-family: Montserrat, system-ui, sans-serif; }
body.rtl, body.area-lang-ar { font-family: Cairo, Montserrat, system-ui, sans-serif; }
body.area-lang-ar h1, body.area-lang-ar h2, body.area-lang-ar h3, body.area-lang-ar .area-hero-title { font-family: Cairo, sans-serif !important; font-weight: 800; letter-spacing: 0 !important; }

/* ---------- En-tête ---------- */
#header-wrapper .wdt-logo-container img, .area-logo img, #header-wrapper .wdt-logo img {
  /* logo-area-blanc.png : texte blanc et vague #FFD600 sur fond transparent (charte) */
  max-height: 56px; width: auto;
}
#header-wrapper .wdt-button, #header-wrapper a.wdt-button { background: var(--area-gold) !important; color: var(--area-black) !important; }
#header-wrapper .wdt-primary-nav > li > a { text-transform: uppercase; letter-spacing: .06em; font-weight: 600; }
#header-wrapper .wdt-primary-nav > li.current-menu-item > a, #header-wrapper .wdt-primary-nav > li > a:hover { color: var(--area-gold) !important; }
.area-tools { display: flex; align-items: center; gap: 14px; color: #fff; }
.area-langs { display: flex; border: 1px solid #56616a; border-radius: 999px; overflow: hidden; }
.area-langs a { padding: 5px 10px; font-size: 12px; font-weight: 700; color: #ddd !important; text-decoration: none; line-height: 1; }
.area-langs a.is-current { background: var(--area-gold); color: var(--area-black) !important; }
.area-tools .gcb-cart-badge, .area-account { color: #fff !important; display: inline-flex; }
.area-tools .gcb-cart-badge { font-size: 18px; }

/* ---------- Boutons génériques ---------- */
.area-btn {
  display: inline-flex; align-items: center; gap: 10px; padding: 15px 30px; border-radius: 999px;
  background: var(--area-gold); color: var(--area-black) !important; font-weight: 800; text-transform: uppercase;
  letter-spacing: .05em; text-decoration: none !important; font-size: 14px; transition: transform .2s, background .2s; border: 0;
}
.area-btn:hover { background: var(--area-gold-2); transform: translateY(-2px); }
.area-btn-ghost { background: transparent; color: #fff !important; border: 1.5px solid rgba(255,255,255,.7); }
.area-btn-ghost:hover { background: #fff; color: var(--area-black) !important; }
.area-btn-dark { background: var(--area-black); color: var(--area-gold) !important; }
.area-btn-dark:hover { background: #4a545b; }
.area-btn-sm { padding: 10px 18px; font-size: 12px; }

/* ---------- Accueil : pleine largeur ---------- */
body.area-home #main > .container { max-width: none; width: 100%; padding: 0; margin: 0; }
body.area-home #main { padding: 0 !important; }
body.area-home .main-title-section-wrapper { display: none; }
.area-page { overflow: hidden; }
.area-wrap { width: min(1240px, 92vw); margin-inline: auto; }
.area-section { padding: clamp(64px, 9vw, 120px) 0; background: #fff; }
.area-dark { background: var(--area-black); color: #e9e9e9; }
.area-dark h2, .area-dark h3 { color: #fff; }
.area-kicker { display: inline-block; color: var(--area-black); background: var(--area-gold); font-weight: 800; font-size: 12px; text-transform: uppercase; letter-spacing: .14em; padding: 6px 14px; border-radius: 999px; margin-bottom: 18px; }
.area-page h2 { font-family: Montserrat, sans-serif; font-weight: 800; font-size: clamp(1.8rem, 3.8vw, 3rem); line-height: 1.05; letter-spacing: 0; margin: 0 0 20px; text-transform: uppercase; }
.area-head { text-align: center; max-width: 760px; margin: 0 auto 48px; }
.area-head p { color: #666; }
.area-lead { font-size: 1.1rem; line-height: 1.7; color: #bdbdbd; }
.area-center { text-align: center; margin-top: 36px; }

/* Héros */
.area-hero { position: relative; min-height: min(92vh, 900px); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; background: var(--area-black); }
.area-hero-video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.area-hero-shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(59,68,75,.96) 4%, rgba(59,68,75,.35) 55%, rgba(59,68,75,.55) 100%); }
[dir="rtl"] .area-hero-shade, .rtl .area-hero-shade { background: linear-gradient(0deg, rgba(59,68,75,.96) 4%, rgba(59,68,75,.35) 55%, rgba(59,68,75,.55) 100%); }
.area-hero-inner { position: relative; padding: 140px 0 60px; }
.area-hero-title { font-family: Montserrat, sans-serif; font-weight: 800; font-size: clamp(2.3rem, 6.4vw, 5rem); line-height: 1; margin: 0 0 22px; max-width: 16ch; color: #fff; text-transform: uppercase; }
.area-hero-title::after { content: ""; display: block; width: 120px; height: 8px; background: var(--area-gold); margin-top: 22px; border-radius: 8px; }
.area-hero-text { font-size: clamp(1rem, 1.6vw, 1.25rem); max-width: 620px; color: #d6d6d6; line-height: 1.7; margin-bottom: 34px; }
.area-actions { display: flex; gap: 14px; flex-wrap: wrap; }
.area-stats { position: relative; border-top: 1px solid rgba(255,255,255,.12); background: rgba(59,68,75,.7); backdrop-filter: blur(6px); }
.area-stats .area-wrap { display: grid; grid-template-columns: repeat(4, 1fr); }
.area-stats .area-wrap > div { padding: 26px 10px; border-inline-end: 1px solid rgba(255,255,255,.1); }
.area-stats .area-wrap > div:last-child { border: 0; }
.area-stats strong { display: block; font-family: Montserrat, sans-serif; font-weight: 800; font-size: 1.8rem; color: var(--area-gold); line-height: 1; }
.area-stats span { color: #bbb; font-size: .85rem; text-transform: uppercase; letter-spacing: .08em; }
@media (max-width: 760px) { .area-stats .area-wrap { grid-template-columns: repeat(2, 1fr); } .area-stats .area-wrap > div:nth-child(2) { border: 0; } }

/* Disciplines */
.area-disciplines { display: grid; grid-template-columns: repeat(3, 1fr); grid-auto-rows: 360px; gap: 18px; }
.area-disc { position: relative; border-radius: var(--area-radius); overflow: hidden; display: block; color: #fff !important; text-decoration: none !important; background: #2f363c; }
.area-disc.is-wide { grid-column: span 2; grid-row: span 2; }
.area-disc img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center top; transition: transform .6s ease; }
.area-disc::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.88) 0%, rgba(0,0,0,.05) 60%); }
.area-disc:hover img { transform: scale(1.07); }
.area-disc-body { position: absolute; z-index: 1; inset-inline: 22px; bottom: 20px; }
.area-disc h3 { font-family: Montserrat, sans-serif; font-weight: 800; font-size: 1.3rem; line-height: 1.1; margin: 0 0 6px; color: #fff; text-transform: uppercase; }
.area-disc.is-wide h3 { font-size: 2rem; }
.area-disc p { margin: 0; color: #d0d0d0; font-size: .92rem; }
.area-disc-body::before { content: ""; display: block; width: 36px; height: 4px; border-radius: 4px; background: var(--area-gold); margin-bottom: 12px; }
@media (max-width: 1000px) { .area-disciplines { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 240px; } }
@media (max-width: 560px) { .area-disciplines { grid-template-columns: 1fr; } .area-disc.is-wide { grid-column: auto; grid-row: span 1; } }

/* Split */
.area-split { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(32px, 6vw, 90px); align-items: center; }
@media (max-width: 900px) { .area-split { grid-template-columns: 1fr; } }
.area-mosaic { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.area-mosaic img { width: 100%; aspect-ratio: 4/5; object-fit: cover; border-radius: var(--area-radius); }
.area-mosaic img:nth-child(2), .area-mosaic img:nth-child(4) { transform: translateY(36px); }
.area-checks { list-style: none; padding: 0; margin: 24px 0 34px; }
.area-checks li { position: relative; padding: 10px 0; padding-inline-start: 38px; border-bottom: 1px solid rgba(127,127,127,.2); font-weight: 600; }
.area-checks li::before { content: "✓"; position: absolute; inset-inline-start: 0; top: 9px; width: 24px; height: 24px; border-radius: 50%; background: var(--area-gold); color: var(--area-black); display: grid; place-items: center; font-size: 13px; font-weight: 900; }

/* Formules */
.area-plans-section { background: #f4f4f1; }
.area-plans-dark .area-head p { color: #a3a3a3; }

/* ---------- Concept « réseau de clubs » ---------- */
.area-tools .area-account { align-items: center; gap: 6px; font-weight: 700; font-size: 13px; text-decoration: none; }
@media (max-width: 1200px) { .area-tools .area-account span { display: none; } }
.area-promo { display: inline-block; background: rgba(255, 214, 0,.14); border: 1px solid var(--area-gold); color: var(--area-gold); font-weight: 800; font-size: clamp(.8rem, 1.4vw, 1rem); padding: 8px 16px; border-radius: 999px; margin-bottom: 22px; }
.area-finder { margin-top: 34px; max-width: 640px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); backdrop-filter: blur(8px); border-radius: 20px; padding: 16px 18px; }
.area-finder label { display: block; color: var(--area-gold); font-weight: 800; text-transform: uppercase; letter-spacing: .12em; font-size: 12px; margin-bottom: 10px; }
.area-finder > div { display: flex; gap: 10px; }
.area-finder select { flex: 1; min-width: 0; height: 52px; border-radius: 999px; border: 0; padding: 0 20px; font: inherit; font-weight: 600; background: #fff; color: #3b444b; }
.area-finder .area-btn { padding-block: 0; height: 52px; white-space: nowrap; }
@media (max-width: 560px) { .area-finder > div { flex-direction: column; } }
.area-clubs-section { background: #f4f4f1; }
.area-clubs-section .gcb { max-width: none; }
.area-lead-dark { font-size: 1.1rem; line-height: 1.7; color: #4a545b; margin-bottom: 30px; }
.area-band .area-actions { margin-top: 6px; }

/* Champions */
.area-champions { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 1fr); gap: 18px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 12px; scrollbar-color: var(--area-gold) #4a545b; }
.area-champion { margin: 0; scroll-snap-align: start; position: relative; border-radius: var(--area-radius); overflow: hidden; aspect-ratio: 4/5; }
.area-champion img { width: 100%; height: 100%; object-fit: cover; }
.area-champion figcaption { position: absolute; inset-inline: 0; bottom: 0; padding: 60px 20px 20px; background: linear-gradient(0deg, rgba(0,0,0,.92), transparent); color: #fff; font-weight: 700; font-size: 1.05rem; }

/* Vidéo */
.area-video-frame { border-radius: var(--area-radius); overflow: hidden; border: 1px solid var(--area-line); background: #3b444b; max-width: 420px; justify-self: center; box-shadow: 0 30px 80px rgba(255, 214, 0,.12); }
.area-video-frame video { width: 100%; display: block; aspect-ratio: 9/16; object-fit: cover; }
.area-split-video { grid-template-columns: 1.3fr 1fr; }

/* Application */
.area-app { background: var(--area-gold); color: var(--area-black); }
.area-app .area-kicker { background: var(--area-black); color: var(--area-gold); }
.area-app h2 { color: var(--area-black); }
.area-app .area-checks li::before { background: var(--area-black); color: var(--area-gold); }
.area-phone { width: 290px; height: 590px; border-radius: 46px; background: var(--area-black); padding: 14px; margin-inline: auto; box-shadow: 0 40px 80px rgba(0,0,0,.35); transform: rotate(-4deg); }
.area-phone-screen { height: 100%; border-radius: 34px; background: #2f363c; padding: 26px 18px; display: flex; flex-direction: column; gap: 14px; color: #fff; }
.area-phone-top { display: flex; justify-content: space-between; align-items: center; font-family: Montserrat, sans-serif; font-weight: 800; font-size: 1.2rem; }
.area-phone-top b { font-family: Montserrat, sans-serif; font-size: .7rem; background: var(--area-gold); color: #3b444b; padding: 4px 8px; border-radius: 999px; }
.area-phone-card { background: linear-gradient(140deg, #3b444b, #343c42); border: 1px solid var(--area-gold); border-radius: 20px; padding: 18px; }
.area-phone-card small { color: var(--area-gold); text-transform: uppercase; font-size: .65rem; font-weight: 800; letter-spacing: .1em; }
.area-phone-card strong { display: block; font-family: Montserrat, sans-serif; font-weight: 800; font-size: 1.5rem; margin: 6px 0 12px; }
.area-phone-card i { display: block; height: 6px; border-radius: 6px; background: linear-gradient(90deg, var(--area-gold) var(--p), #333 var(--p)); }
.area-phone-row { display: flex; gap: 12px; align-items: center; background: #363e44; border-radius: 14px; padding: 14px; font-size: .85rem; }
.area-phone-row span { color: var(--area-gold); font-weight: 800; }
.area-phone-tabs { margin-top: auto; display: flex; justify-content: space-around; color: #555; }
.area-phone-tabs .on { color: var(--area-gold); }

/* Bandeau */
.area-band { padding: clamp(70px, 10vw, 130px) 0; background-size: cover; background-position: center; color: #fff; }
.area-band h2 { color: #fff; max-width: 14ch; }
.area-band p { color: #ccc; max-width: 560px; font-size: 1.1rem; margin-bottom: 30px; }


/* Apparition au défilement */
[data-reveal] { opacity: 0; transform: translateY(28px); transition: opacity .8s ease, transform .8s ease; }
[data-reveal].is-in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity: 1; transform: none; transition: none; } .area-hero-video { display: none; } }

/* ---------- Pied de page ---------- */
#footer, .wdt-footer, footer .elementor-section, footer .e-con { --wdtPrimaryColor: #ffd600; }
.area-footer-app { opacity: .85; }

/* ---------- Pages du portail dans le thème ---------- */
body.area-site .main-title-section-wrapper { background-color: var(--area-black); }
body.area-site .main-title-section-wrapper .main-title-section h1 { color: #fff; font-family: Montserrat, sans-serif; font-weight: 800; letter-spacing: .02em; }
body.area-site .gcb { margin-block: 20px; }
body.area-site .gcb-alert, body.area-site .gcb-card { box-shadow: 0 10px 30px rgba(0,0,0,.08); }

/* ---------- RTL ---------- */
.rtl .area-hero-title, .rtl .area-page h2 { font-size: clamp(2.2rem, 7vw, 5.6rem); line-height: 1.15; }
.rtl .area-mosaic img:nth-child(2), .rtl .area-mosaic img:nth-child(4) { transform: translateY(36px); }
.rtl .area-phone { transform: rotate(4deg); }

/* ---------- En-tête blanc (charte Area : logo anthracite, menu anthracite, accents jaunes) ---------- */
#header-wrapper .wdt-header-tpl, #header-wrapper .wdt-header-tpl .elementor-section, #header-wrapper .wdt-header-tpl .e-con { background-color: #fff !important; }
#header-wrapper .wdt-header-tpl, #header-wrapper .wdt-header-tpl a, #header-wrapper .wdt-header-tpl .wdt-animation-item,
#header-wrapper .wdt-header-tpl .wdt-primary-nav > li > a { color: var(--area-black); }
#header-wrapper .wdt-header-tpl .wdt-primary-nav > li > a { font-size: 13px; padding-inline: 12px; white-space: nowrap; }
#header-wrapper .wdt-header-tpl .wdt-primary-nav > li.current-menu-item > a, #header-wrapper .wdt-header-tpl .wdt-primary-nav > li > a:hover { color: var(--area-black) !important; box-shadow: inset 0 -3px 0 var(--area-gold); }
#header-wrapper .wdt-header-tpl .wdt-button, #header-wrapper .wdt-header-tpl .wdt-button * { white-space: nowrap; text-transform: none; color: var(--area-black) !important; }
#header-wrapper .wdt-header-tpl .area-langs { border-color: #d6dadd; }
#header-wrapper .wdt-header-tpl .area-langs a:not(.is-current) { color: var(--area-black) !important; }
#header-wrapper .wdt-header-tpl .area-tools, #header-wrapper .wdt-header-tpl .area-tools .gcb-cart-badge, #header-wrapper .wdt-header-tpl .area-account { color: var(--area-black) !important; }
#header-wrapper .wdt-header-tpl .slide-underline { background: var(--area-gold) !important; }
/* Bandeau défilant : reste anthracite, texte blanc */
#header-wrapper .wdt-header-tpl .elementor-element-b8ed432, #header-wrapper .wdt-header-tpl .elementor-element-6a11a01,
#header-wrapper .wdt-header-tpl .elementor-element-9664ee4, #header-wrapper .wdt-header-tpl .elementor-element-9664ee4 .e-con { background-color: var(--area-black) !important; }
#header-wrapper .wdt-header-tpl .elementor-element-9664ee4, #header-wrapper .wdt-header-tpl .elementor-element-9664ee4 * { color: #fff; }
#header-wrapper { background-color: #fff; box-shadow: 0 1px 0 #e6e8ea; }
body.area-home #header-wrapper { margin-bottom: 0; }
#header-wrapper .wdt-logo-container img { mix-blend-mode: normal; max-height: 52px; }

/* Logo Area : fichiers déjà aux couleurs de la charte (anthracite en en-tête, blanc en pied de page), sans filtre */
.wdt-logo-container img { height: 52px !important; max-height: none !important; width: auto !important; max-width: none !important; object-fit: contain; }
.wdt-logo-container a { display: inline-block; line-height: 0; }

/* ---------- Pied de page sombre (remplace le fond pastel de la démo) ---------- */
#footer .wdt-footer-tpl .e-con, #footer .wdt-footer-tpl .elementor-section { background: #3b444b !important; background-image: none !important; border-color: #4a545b !important; }
#footer .wdt-footer-tpl .e-con::before, #footer .wdt-footer-tpl .e-con::after { display: none !important; }
#footer .wdt-footer-tpl, #footer .wdt-footer-tpl p, #footer .wdt-footer-tpl span, #footer .wdt-footer-tpl a, #footer .wdt-footer-tpl li,
#footer .wdt-footer-tpl .elementor-icon-list-text, #footer .wdt-footer-tpl .wdt-image-box-title, #footer .wdt-footer-tpl h5, #footer .wdt-footer-tpl .wdt-heading-title { color: #e9e9e9 !important; }
#footer .wdt-footer-tpl a:hover, #footer .wdt-footer-tpl h5, #footer .wdt-footer-tpl .wdt-heading-title { color: var(--area-gold) !important; }
#footer .wdt-footer-tpl .elementor-icon-list-icon svg, #footer .wdt-footer-tpl .wdt-image-box-image img[src$=".svg"] { filter: invert(1); }
.area-tools .area-account span { white-space: nowrap; }
.area-finder select { width: auto !important; flex: 1 1 260px !important; max-width: none !important; height: 52px !important; line-height: 52px !important; padding: 0 20px !important; margin: 0 !important; border-radius: 999px !important; background-color: #fff !important; color: #3b444b !important; font-size: 15px !important; }
.area-finder > div { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; }
.area-finder select { width: 100% !important; }
@media (max-width: 560px) { .area-finder > div { grid-template-columns: 1fr; } }
.area-tools, .area-langs { flex-shrink: 0; }
.area-langs a { white-space: nowrap; }

/* ---------- Recherche de club : liste « select2 » du thème (champ blanc arrondi, options lisibles) ---------- */
.area-finder > div { align-items: center; }
.area-finder > div > .area-btn { margin: 0 !important; }
.area-finder .select2-container { width: 100% !important; min-width: 0; height: 52px; margin: 0 !important; }
.area-finder .select2-container .select2-selection--single { height: 52px !important; border: 0 !important; border-radius: 999px !important; background: #fff !important; display: flex; align-items: center; }
.area-finder .select2-container .select2-selection--single .select2-selection__rendered { color: #3b444b; font-weight: 600; font-size: 15px; line-height: 52px; padding: 0 44px 0 20px; }
.area-finder .select2-container .select2-selection--single .select2-selection__arrow { height: 52px; right: 14px; }
.rtl .area-finder .select2-container .select2-selection--single .select2-selection__rendered { padding: 0 20px 0 44px; }
.rtl .area-finder .select2-container .select2-selection--single .select2-selection__arrow { right: auto; left: 14px; }
.area-site .select2-dropdown { border: 0; border-radius: 16px; overflow: hidden; box-shadow: 0 18px 40px rgba(0,0,0,.35); }
.area-site .select2-results__option { color: #3b444b; background: #fff; }
.area-site .select2-results__option[aria-selected="true"], .area-site .select2-results__option--selected { background: #f4f4f4; color: #3b444b; font-weight: 700; }
.area-site .select2-results__option--highlighted, .area-site .select2-results__option--highlighted[aria-selected] { background: var(--area-gold) !important; color: #3b444b !important; }
.area-site .select2-search--dropdown .select2-search__field { border: 1px solid #d9d9d9; border-radius: 10px; color: #3b444b; }