/* ===========================================================
   Surcouche relooking — siteinternet.nc
   Palette ANCRÉE LOGO : azur #1877E8 + navy #001030.
   1 SEULE animation = le marbré du HÉRO. Le reste = fond bleu CALME.
   Bordures de cartes en bleu moderne. Clair par défaut + interrupteur.
   100% CSS/JS, réversible. (Refonte propre — fin du patch-sur-patch.)
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500..800&display=swap');

/* ============ 1. TOKENS (couleurs du logo) ============ */
:root, html.light {
  color-scheme: light;
  --wp--preset--color--abyss:     #DCE7FC;
  --wp--preset--color--deep-navy: #C9DAF8;
  --wp--preset--color--midnight:  #FFFFFF;   /* cartes */
  --wp--preset--color--paper:     #04122E;   /* encre = navy logo */
  --wp--preset--color--pearl:     #11214A;
  --wp--preset--color--frost:     #51607E;   /* muted lisible */
  --wp--preset--color--azure:     #1877E8;   /* BLEU LOGO (primaire) */
  --wp--preset--color--beacon:    #2E8CFF;
  --wp--preset--color--spectra:   #1877E8;
  --wp--preset--color--embers:    #0E50BE;   /* bleu logo profond */
  --si-blue:      #1877E8;
  --si-blue-deep: #0E50BE;
  --si-navy:      #001030;
  --si-muted:     #51607E;
  --si-line:       rgba(28,42,80,.1);       /* bordure NEUTRE subtile (interne : chips, tabs, widgets) */
  --si-line-hover: rgba(255,122,26,.55);    /* hover orange discret */
  --si-bd:         rgba(255,122,26,.4);     /* bordure ORANGE — VRAIES cartes uniquement */
  --si-grad: linear-gradient(110deg, #1463DC 0%, #2E8CFF 54%, #FF9A3C 92%, #FF7A1A 100%);  /* signature AZUR→ORANGE (palette unifiée premium) */
  --si-cta:  linear-gradient(100deg, #00A6FF 0%, #2A52E0 100%);
  --si-orange:      #FF7A1A;                                            /* accent peps (mises en avant) */
  --si-orange-grad: linear-gradient(100deg, #FFA52E 0%, #FF6A00 100%);
  --si-orange-text: #C2410C;                                            /* orange brûlé : LISIBLE sur blanc (titres) */
}
html.dark {
  color-scheme: dark;
  --wp--preset--color--abyss:     #0A0F20;
  --wp--preset--color--deep-navy: #0E1430;
  --wp--preset--color--midnight:  #161D38;
  --wp--preset--color--paper:     #F4F6FC;
  --wp--preset--color--pearl:     #DDE3F0;
  --wp--preset--color--frost:     #98A2BE;
  --wp--preset--color--azure:     #4D94FF;
  --wp--preset--color--beacon:    #6AA6FF;
  --wp--preset--color--spectra:   #4D94FF;
  --wp--preset--color--embers:    #2E8CFF;
  --si-blue:      #4D94FF;
  --si-blue-deep: #6AA6FF;
  --si-navy:      #001030;
  --si-muted:     #98A2BE;
  --si-line:       rgba(170,190,235,.12);   /* bordure NEUTRE subtile (interne, sombre) */
  --si-line-hover: rgba(255,148,66,.6);
  --si-bd:         rgba(255,148,66,.48);    /* bordure ORANGE — VRAIES cartes (sombre) */
  --si-grad: linear-gradient(110deg, #5BA3FF 0%, #82BAFF 54%, #FFB061 92%, #FF9442 100%);  /* signature AZUR→ORANGE (sombre, + lumineux) */
  --si-cta:  linear-gradient(100deg, #2AB6FF 0%, #4D6BEE 100%);
  --si-orange:      #FF9442;
  --si-orange-grad: linear-gradient(100deg, #FFB155 0%, #FF7A2E 100%);
  --si-orange-text: #FF9442;                                            /* orange vif : lisible sur navy (titres) */
}

/* ============ 2. FOND : BLANC net (footer compris) + halo azur discret en haut ============ */
html.light body {
  background-color: #E7EAF1 !important;                                /* gris clair → cartes blanches ressortent */
  background-image: radial-gradient(125% 58% at 50% -12%, rgba(24,119,232,.08) 0%, rgba(24,119,232,.02) 42%, transparent 62%) !important;
  background-attachment: fixed !important;
}
html.dark body {
  background-color: #080C18 !important;
  background-image: radial-gradient(125% 58% at 50% -12%, rgba(24,119,232,.16) 0%, rgba(24,119,232,.04) 42%, transparent 62%) !important;
  background-attachment: fixed !important;
}
/* sections/bandes transparentes → laissent voir le fond bleu */
[class*="wafer-section"], .wafer-showcase, .wafer-hero, .wafer-section-alt, .wafer-band, .wafer-cta-band {
  background: transparent !important; background-color: transparent !important; border: none !important; box-shadow: none !important;
}
[class*="wafer-section"]::before, [class*="wafer-section"]::after,
.wafer-showcase::before, .wafer-showcase::after { border: none !important; background-image: none !important; }
/* Tue l'aurore violet+orange héritée du thème (body::before multi-radial) → fond PUR */
body::before, body::after { background: none !important; background-image: none !important; }
/* Supprime les glows azur hérités qui ternissaient le BLANC (footer surtout + section offre) */
/* Footer : fond DISTINCT pour le détacher de la page (clair = gris-bleu, sombre = navy distinct) */
html.light .wafer-footer-pro { background: linear-gradient(180deg, #EDF2FB 0%, #E2EAF6 100%) !important; background-image: linear-gradient(180deg, #EDF2FB 0%, #E2EAF6 100%) !important;
  border-top: 1px solid rgba(24,119,232,.22) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.7) !important; }
html.dark .wafer-footer-pro { background: linear-gradient(180deg, #0D1428 0%, #090E1F 100%) !important; background-image: linear-gradient(180deg, #0D1428 0%, #090E1F 100%) !important;
  border-top: 1px solid rgba(77,148,255,.2) !important; }
.wafer-footer-pro::before, .wafer-footer-pro::after { background-image: none !important; }
/* Blocs OPAQUES (plus d'animation visible à travers) */
html.light .wafer-feature-story { background: #FFFFFF !important; background-image: none !important; }
html.dark  .wafer-feature-story { background: #141A30 !important; background-image: none !important; }

/* ============ 3. FX : constellation (fond) + marbré « fumée » (hero) ============ */
.wafer-hero { position: relative !important; margin-top: -24px !important; }
.wafer-hero__canvas { display: none !important; }   /* canvas natif off */
/* constellation = couche fixe plein écran, DERRIÈRE le contenu (sur le blanc) */
.si-particles { position: fixed !important; inset: 0 !important; width: 100vw !important; height: 100vh !important; z-index: -1 !important; pointer-events: none !important; display: block !important; }
/* marbré = DANS le hero, au-dessus de la constellation (z=0), sous le contenu ; fondu bas → blanc */
.si-wave { display: block !important; pointer-events: none !important; }
.si-wave-hero { position: absolute !important; inset: 0 !important; width: 100% !important; height: 100% !important; z-index: 0 !important;
  -webkit-mask-image: linear-gradient(180deg, #000 0%, #000 82%, transparent 100%) !important;
          mask-image: linear-gradient(180deg, #000 0%, #000 82%, transparent 100%) !important; }
/* voile gauche : lisibilité du titre sur le marbré coloré (scrim) */
.wafer-hero-canvas-veil { display: block !important; }
html.light .wafer-hero-canvas-veil { background: linear-gradient(100deg, rgba(255,255,255,.52) 0%, rgba(255,255,255,.24) 44%, rgba(255,255,255,0) 72%) !important; }
html.dark  .wafer-hero-canvas-veil { background: linear-gradient(100deg, rgba(8,12,24,.52) 0%, rgba(8,12,24,.24) 46%, rgba(8,12,24,0) 72%) !important; }
html.light .wafer-hero__copy { text-shadow: 0 1px 16px rgba(255,255,255,.7); }

/* titre hero : ancrage plein + mot-clé en dégradé vif */
.wafer-hero__title, .wafer-hero__title *, .wafer-hero__line { text-shadow: none !important; -webkit-text-stroke: 0 !important; filter: none !important; }
.wafer-hero__line { font-family: 'Bricolage Grotesque', 'Inter', system-ui, sans-serif !important; font-style: normal !important; font-weight: 800 !important; letter-spacing: -0.03em !important; }
/* même police d'affichage sur les grands titres de section (style communication.nc) */
.wafer-block-h2, .wafer-feature-story__title, .wafer-offer__title { font-family: 'Bricolage Grotesque', 'Inter', system-ui, sans-serif !important; font-weight: 800 !important; letter-spacing: -0.025em !important; }
html.light .wafer-hero__line { color: #0B0E1C !important; -webkit-text-fill-color: #0B0E1C !important; background: none !important; }
html.dark  .wafer-hero__line { color: #F4F7FF !important; -webkit-text-fill-color: #F4F7FF !important; background: none !important; }
html.light .wafer-hero__line.wafer-hero__line--italic,
html.dark  .wafer-hero__line.wafer-hero__line--italic {
  background: var(--si-grad) !important; -webkit-background-clip: text !important; background-clip: text !important;
  color: transparent !important; -webkit-text-fill-color: transparent !important;
}
html.light .wafer-hero__line.wafer-hero__line--small { color: #33407A !important; -webkit-text-fill-color: #33407A !important; background: none !important; font-weight: 600 !important; letter-spacing: -0.01em !important; }
html.dark  .wafer-hero__line.wafer-hero__line--small { color: #9DB0FF !important; -webkit-text-fill-color: #9DB0FF !important; background: none !important; font-weight: 600 !important; letter-spacing: -0.01em !important; }
html.light .wafer-ph-meta-label { color: var(--si-blue) !important; }

/* ============ 4. CARTE Nouvelle-Calédonie (azur logo, plus de turquoise) ============ */
html.light .wafer-hero__nc-shape { stroke: #001030 !important; stroke-width: 2px !important; }   /* navy logo */
html.light .wafer-hero__nc-shape--fill { fill: rgba(0,16,48,.1) !important; }
html.dark  .wafer-hero__nc-shape { stroke: #4D94FF !important; stroke-width: 1.6px !important; } /* azur logo sur sombre */
html.dark  .wafer-hero__nc-shape--fill { fill: rgba(77,148,255,.12) !important; }
.wafer-hero__nc { opacity: 1 !important; }
html.light .wafer-hero__nc, html.light .wafer-hero__nc * { mix-blend-mode: normal !important; }
html.light .wafer-hero__nc { filter: drop-shadow(0 0 6px rgba(255,255,255,.75)) drop-shadow(0 2px 7px rgba(0,16,48,.3)) !important; }
html.dark  .wafer-hero__nc { filter: drop-shadow(0 0 12px rgba(77,148,255,.5)) !important; }

/* ============ 5. CARTES : verre blanc + BORDURE BLEU MODERNE ============ */
.wafer-card, .wafer-feature-card, .wafer-garantie, .wafer-pricing-card,
.wafer-post-card, .wafer-showcase__card, [class*="__card"] {
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s, border-color .4s;
}
html.light :is(.wafer-card, .wafer-garantie, .wafer-feature-card, .wafer-feature,
  .wafer-engagement-card, .wafer-tarif-card, .wafer-step-card, .wafer-offer__card,
  [class*="__card"]):not([class*="showcase"]):not([class*="mac-"]) {
  background: #FFFFFF !important;
  border: 1.5px solid var(--si-line) !important;
  box-shadow: 0 2px 6px rgba(20,33,80,.06), 0 10px 24px -14px rgba(255,122,26,.22), 0 28px 52px -30px rgba(20,33,80,.2) !important;
  border-radius: 16px !important;
}
html.light :is(.wafer-card, .wafer-feature-card, .wafer-garantie,
  [class*="__card"]):not([class*="showcase"]):not([class*="mac-"]):hover {
  border-color: var(--si-line-hover) !important;
  box-shadow: 0 2px 6px rgba(20,33,80,.06), 0 30px 56px -26px rgba(24,119,232,.5) !important; transform: translateY(-6px);
}
html.dark :is(.wafer-card, .wafer-garantie, .wafer-feature-card, .wafer-feature,
  .wafer-engagement-card, .wafer-tarif-card, .wafer-step-card, .wafer-offer__card,
  [class*="__card"]):not([class*="showcase"]):not([class*="mac-"]) {
  background: linear-gradient(158deg, rgba(44,56,92,.5), rgba(30,39,68,.35) 70%), #1A2139 !important;  /* + clair que le fond → ressort */
  border: 1.5px solid var(--si-line) !important;
  box-shadow: 0 22px 56px -30px rgba(0,0,0,.9), 0 0 42px -24px rgba(255,122,26,.42) !important;
  backdrop-filter: blur(12px); border-radius: 16px !important;
}
html.dark :is(.wafer-card, .wafer-feature-card, .wafer-garantie,
  [class*="__card"]):not([class*="showcase"]):not([class*="mac-"]):hover { border-color: var(--si-line-hover) !important; transform: translateY(-6px); }

/* accents (eyebrows, points) */
:is(html.light, html.dark) :is(.wafer-section-eyebrow, [class*="__eyebrow"], [class*="-eyebrow"]) { color: var(--si-blue) !important; }
.wafer-hero__eyebrow-dot, [class*="eyebrow-dot"] { background: var(--si-blue) !important; box-shadow: 0 0 10px rgba(24,119,232,.7) !important; }

/* ============ 6. CTA en dégradé (un seul thème, tous les boutons d'action) ============ */
.wafer-nav__cta, .wafer-hero__cta, .wafer-offer__cta-btn, .wafer-offer__cta,
.wafer-btn--primary, a.wafer-btn--primary, .wafer-contact__submit, .wafer-form-submit,
.wafer-footer-pro__cta, .cc-btn.cc-allow, .wp-block-button__link {
  background-image: var(--si-cta) !important; background-color: var(--si-blue) !important; color: #FFFFFF !important; border-color: transparent !important;
}
.wafer-nav__cta:hover, .wafer-hero__cta:hover, .wafer-contact__submit:hover,
.wafer-footer-pro__cta:hover, .cc-btn.cc-allow:hover { filter: brightness(1.07); }
/* « Découvrir » : vraie pilule (était plat) */
.wafer-offer__cta {
  display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 7px !important;
  padding: 12px 22px !important; border-radius: 999px !important; font-weight: 600 !important;
  width: auto !important; align-self: flex-start !important; white-space: nowrap !important;
}
.wafer-offer__cta svg { display: none !important; }

/* ============ 7. HEADER flottant arrondi ============ */
.wafer-header {
  position: fixed !important; top: 12px !important; left: 16px !important; right: 16px !important;
  margin: 0 auto !important; max-width: 1180px !important;
  border-radius: 16px !important; padding: 5px 18px !important;
  backdrop-filter: blur(14px) saturate(1.5) !important; -webkit-backdrop-filter: blur(14px) saturate(1.5) !important;
}
html.light .wafer-header {
  background: linear-gradient(180deg, rgba(255,255,255,.84), rgba(248,250,254,.68)) !important;
  border: 1px solid rgba(24,119,232,.12) !important;
  box-shadow: 0 12px 34px -20px rgba(20,33,80,.28), inset 0 1px 0 rgba(255,255,255,.7) !important;
}
html.dark .wafer-header {
  background: linear-gradient(180deg, rgba(22,29,56,.76), rgba(12,16,34,.6)) !important;
  border: 1px solid rgba(77,148,255,.2) !important;
  box-shadow: 0 16px 48px -18px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.06) !important;
}
@media (max-width: 700px) {
  .wafer-header { top: 8px !important; left: 8px !important; right: 8px !important; padding: 8px 14px !important; }
}

/* ============ 8. INTERRUPTEUR thème ============ */
.si-theme-toggle {
  display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; margin: 0 10px 0 6px; flex: 0 0 auto;
  border: 1px solid var(--si-line); border-radius: 50%; background: rgba(24,119,232,.08); color: var(--si-blue); cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: background .25s, border-color .25s, color .25s;
}
.si-theme-toggle:hover { background: rgba(24,119,232,.16); border-color: var(--si-line-hover); }
.si-theme-toggle svg { width: 19px; height: 19px; }
html.dark .si-theme-toggle { background: rgba(77,148,255,.12); }
html.dark  .si-icon-sun  { display: none; }
html.light .si-icon-moon { display: none; }

/* ============ 9. LISIBILITÉ (consolidé : formulaires · KPI · compare · mockup · footer) ============ */

/* — Formulaires : champs clairs — */
html.light :is(.wafer-input, .wafer-select, .wafer-textarea) {
  background: #FFFFFF !important; color: #0B0E1C !important; border: 1px solid rgba(11,14,28,.16) !important;
}
html.light :is(.wafer-input, .wafer-textarea)::placeholder { color: #8A93A8 !important; }
html.light :is(.wafer-input, .wafer-textarea, .wafer-select):focus { border-color: var(--si-blue) !important; outline-color: var(--si-blue) !important; }

/* — Cartes stat / KPI (toutes variantes regroupées en UNE règle) : verre blanc + chiffres vifs — */
html.light :is(
  .wafer-compare__after-kpi, .wafer-compare__before-kpi, [class*="wafer-compare__"][class*="kpi"],
  [class*="wafer-compare__"][class*="widget"], [class*="wafer-compare__"][class*="stat"],
  .wafer-ph-eyebrow, .wafer-ph-meta-item, [class*="ph-meta"][class*="item"], [class*="ph-stat"],
  .wafer-mini__kpi, [class*="kpi-mini"], .wafer-feature-story__kpi
) {
  background: #FFFFFF !important; background-image: none !important;
  border: 1px solid var(--si-line) !important; box-shadow: 0 10px 26px -16px rgba(24,119,232,.3) !important;
}
html.light :is(.wafer-compare__after-kpi, .wafer-compare__before-kpi, [class*="wafer-compare__"][class*="kpi"],
  .wafer-ph-eyebrow, .wafer-ph-meta-item, [class*="ph-meta"][class*="item"], .wafer-mini__kpi, .wafer-feature-story__kpi) :is(span, p, strong, div, dt, dd) { color: #2A3550 !important; }
html.light :is([class*="kpi-num"], [class*="kpi__num"], [class*="meta-value"], [class*="compare__"][class*="num"],
  [class*="kpi-mini__num"], .wafer-mini__kpi strong, .wafer-feature-story__kpi-num,
  [class*="ph-meta"][class*="value"], [class*="ph-stat"][class*="num"]) {
  color: var(--si-blue-deep) !important; -webkit-text-fill-color: var(--si-blue-deep) !important; font-weight: 800 !important; }
html.light .wafer-feature-story__kpi-lbl { color: var(--si-muted) !important; }

/* — Comparatif AVANT/APRÈS : panneaux clairs, zéro bronze — */
html.light :is(.wafer-compare__panel, .wafer-compare__panel--a, .wafer-compare__panel--b) {
  background-image: none !important; background: linear-gradient(160deg,#F4F7FC,#E8EFF9) !important;
}
html.light :is(.wafer-compare__label, .wafer-compare__label--a, .wafer-compare__label--b) {
  background: rgba(255,255,255,.82) !important; color: #1C2740 !important;
}
html.light .wafer-compare__panel--before [style*="FFB888"] { color: #6B7488 !important; -webkit-text-fill-color: #6B7488 !important; }
html.light .wafer-compare__panel--before :is(.wafer-showcase__card, [class*="card-body"], [class*="kpi"], [class*="__lead"], [class*="-stat"]) {
  background: #FFFFFF !important; background-image: none !important;
  border: 1px solid rgba(11,14,28,.1) !important; box-shadow: 0 10px 26px -16px rgba(20,33,80,.22) !important;
}
html.light .wafer-compare__panel--before :is([class*="lead"], [class*="kpi-num"], [class*="num"]) {
  color: #6B7488 !important; -webkit-text-fill-color: #6B7488 !important; font-size: 1.55rem !important; font-weight: 800 !important;
}
html.light .wafer-compare__panel--before :is([class*="lbl"], [class*="label"], [class*="eyebrow"]) { color: var(--si-muted) !important; }

/* — Cartes à style inline sombre/orange/pâle (sans classe) → clair + vif — */
html.light [style*="rgba(8,12,24"], html.light [style*="rgba(8, 12, 24"] {
  background: rgba(255,255,255,.94) !important; border-color: var(--si-line) !important;
  box-shadow: 0 8px 22px -15px rgba(24,119,232,.28) !important;
}
html.light [style*="rgba(255,106,0"], html.light [style*="rgba(255, 106, 0"] { border-color: var(--si-line) !important; }
html.light [style*="rgba(199,230,255"], html.light [style*="rgba(199, 230, 255"] { color: var(--si-muted) !important; }
html.light [style*="rgba(8,12,24"] :is(strong, b, [class*="num"]) { color: var(--si-blue-deep) !important; -webkit-text-fill-color: var(--si-blue-deep) !important; }

/* — Mockups (device clair) — */
html.light [class*="mac-"], html.light .wafer-hero__mockup, html.light .wafer-compare__after {
  --wp--preset--color--abyss: #F4F7FC; --wp--preset--color--deep-navy: #EAF0F8; --wp--preset--color--midnight: #FFFFFF;
  --wp--preset--color--paper: #0B0E1C; --wp--preset--color--pearl: #1C2740; --wp--preset--color--frost: var(--si-muted);
}
html.light .mac-mockup__screen { background: linear-gradient(180deg,#FFFFFF 0%,#EDF2FB 100%) !important; }
html.light .mac-mockup__frame { background: #E4EAF4 !important; background-image: none !important; }
html.light .mac-mockup__bar { background: #EDF1F9 !important; }
html.light :is(.mac-bars, .mac-bigchart, .mac-kpi, .mac-feed__row, .mac-perf, .mac-product,
  .mac-seo-row, .mac-shop-pill, .mac-shop-search, .mac-slide__top, .mac-tab, .mac-mockup__url, .mac-toast) {
  background: rgba(20,33,80,.055) !important; background-color: rgba(20,33,80,.055) !important; border-color: rgba(11,14,28,.08) !important;
}
html.light .mac-mockup, html.light .mac-mockup p,
html.light [class*="mac-"][class*="title"], html.light [class*="mac-"][class*="name"],
html.light [class*="mac-"][class*="text"], html.light .mac-cart__label, html.light .mac-seo-kw { color: #1C2740 !important; }
html.light :is([class*="mac-"][class*="label"], [class*="mac-"][class*="__lbl"], .mac-kpi__unit, .mac-kpi__label, .mac-perf__lbl,
  .mac-seo-vol, .mac-folio__cat, .mac-mockup__urltext, .mac-mockup__url, .mac-tab, .mac-feed__time, .mac-shop-pill) { color: var(--si-muted) !important; }
html.light :is(.mac-kpi__value, .mac-feed__amt, .mac-cart__total, .mac-product__price, .mac-perf__num, .mac-seo-rank) { color: var(--si-blue-deep) !important; }
html.light :is(.mac-cart__cta, .mac-bars__label) { color: var(--si-blue) !important; }
html.light :is(.mac-kpi__delta--down, [class*="trend--down"]) { color: #C2410C !important; }
/* tabs + vignettes portfolio */
html.light .mac-tab { background: rgba(24,119,232,.07) !important; color: var(--si-muted) !important; border: 1px solid var(--si-line) !important; }
html.light :is(.mac-tab.is-active, .mac-tab--active, .mac-tab[class*="active"], .mac-tab[aria-selected="true"]) { background: var(--si-blue) !important; color: #FFFFFF !important; border-color: transparent !important; }
html.light .mac-folio--c1 { background: linear-gradient(140deg, #1E86FF, #2360E8) !important; }
html.light .mac-folio--c2 { background: linear-gradient(140deg, #2E6CF0, #5A5BF0) !important; }
html.light .mac-folio--c3 { background: linear-gradient(140deg, #2E8CFF, #1654D6) !important; }
html.light .mac-folio--c4 { background: linear-gradient(140deg, #1A4FC8, #001030) !important; }
html.light .mac-folio--c5 { background: linear-gradient(140deg, #1E86FF, #0A3A9E) !important; }
html.light .mac-folio :is(.mac-folio__title, .mac-folio__cat) { color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; text-shadow: 0 1px 7px rgba(11,14,28,.3) !important; }
html.light .mac-folio .mac-folio__cat { color: rgba(255,255,255,.85) !important; -webkit-text-fill-color: rgba(255,255,255,.85) !important; }
/* barres mini-content (présence pro) */
html.light .mini-content__row { background: rgba(20,33,80,.05) !important; background-image: none !important; border: 1px solid rgba(11,14,28,.07) !important; }
html.light :is(.mini-content__row, .mini-content__row span, .mini-content__row p, .mini-content__txt, .mini-content__name) { color: #2A3550 !important; }
html.light :is(.mini-content__sub, .wafer-mini__url, .mini-content__url) { color: var(--si-muted) !important; }
/* cartes-photo showcase */
html.light .wafer-showcase__card, html.light .wafer-showcase__card-body {
  --wp--preset--color--paper: #FFFFFF; --wp--preset--color--pearl: #E8EEF6; --wp--preset--color--frost: #C7D6EC;
}
html.light :is(.wafer-blog-card__date, .wafer-carousel__role, .wafer-contact-map__label, .wafer-marquee__sub,
  .wafer-section--stats p, .wafer-tabs__btn) { color: #535A78 !important; }

/* — Carte contact/plan — */
html.light .wafer-contact-map { background-image: linear-gradient(rgba(244,247,252,.8), rgba(236,241,249,.88)) !important; }
html.light .wafer-contact-map :is(span, p, strong, li, div, dt, dd, time) { color: #2A3550 !important; }
html.light .wafer-contact-map a { color: var(--si-blue) !important; }

/* — Méthode (timeline) : ronds vifs + ligne derrière — */
html.light .wafer-timeline__num {
  background: #FFFFFF !important; background-image: none !important; border: 2px solid var(--si-blue-deep) !important;
  color: var(--si-blue-deep) !important; position: relative !important; z-index: 3 !important;
  box-shadow: 0 6px 18px -8px rgba(24,119,232,.45), 0 0 0 5px rgba(24,119,232,.06) !important;
}
html.light :is(.wafer-timeline__duration, [class*="timeline__duration"]) { color: var(--si-muted) !important; }

/* — Flèches carrousel — */
html.light :is(.wafer-showcase__nav-btn, [class*="__nav-btn"], [class*="carousel"][class*="btn"]) {
  background: #FFFFFF !important; background-image: none !important;
  border: 1.5px solid var(--si-line) !important; color: var(--si-blue) !important;
  box-shadow: 0 8px 22px -12px rgba(24,119,232,.4) !important;
}
html.light :is(.wafer-showcase__nav-btn, [class*="__nav-btn"]):hover { background-image: var(--si-cta) !important; color: #FFFFFF !important; border-color: transparent !important; }
html.light :is(.wafer-showcase__nav-btn, [class*="__nav-btn"]) :is(svg, path, line, polyline) { stroke: currentColor !important; }

/* — Icônes de cartes : dégradé saturé + glyphe blanc (punch, tue l'ambre) — */
html.light :is(.wafer-offer__icon, .wafer-garantie__icon, .wafer-feature-card__icon, .wafer-engagement-card__icon, .wafer-step-card__icon, .wafer-feature-story__icon) {
  background: var(--si-cta) !important; background-image: var(--si-cta) !important;
  color: #FFFFFF !important; border-color: transparent !important; --card-icon-color: #FFFFFF !important;
  box-shadow: 0 10px 22px -10px rgba(24,119,232,.55) !important;
}
html.light :is(.wafer-offer__icon, .wafer-garantie__icon, .wafer-feature-card__icon) :is(svg, path, use) { color: #FFFFFF !important; stroke: #FFFFFF !important; }
html.light .wafer-offer__chip { background: rgba(24,119,232,.08) !important; color: var(--si-blue) !important; border: 1px solid var(--si-line) !important; }

/* — Badges / cas similaires — */
html.light .wafer-tarif__badge { background: var(--si-blue) !important; color: #FFFFFF !important; }
html.light :is([class*="similar"], [class*="__cases"], [class*="offer__cas"]) { color: var(--si-muted) !important; }
html.light :is([class*="similar"] a, [class*="__cases"] a, [class*="offer__cas"] a) { color: var(--si-blue) !important; font-weight: 600 !important; }

/* — Cookies — */
html.light .cc-window.cc-banner { background: rgba(255,255,255,.97) !important; color: #1C2740 !important;
  border-top: 1px solid rgba(11,14,28,.08) !important; box-shadow: 0 -3px 22px rgba(20,33,80,.10) !important; }
html.light .cc-window .cc-message, html.light .cc-window .cc-link { color: var(--si-muted) !important; }
.cc-btn.cc-deny { color: #6A7593 !important; }

/* — Footer — */
html.light .wafer-footer-pro a, html.light .wafer-footer-pro__group-link, html.light .wafer-footer-pro__group-link * { color: #25324C !important; }
html.light .wafer-footer-pro a:hover { color: var(--si-blue) !important; }
html.light :is(.wafer-footer-pro li, .wafer-footer-pro p, .wafer-footer-pro__contact, .wafer-footer-pro__contact *,
  .wafer-footer-pro__tagline, .wafer-footer-pro__desc, .wafer-footer-pro__hours, .wafer-footer-pro__addr) { color: var(--si-muted) !important; }
html.light .wafer-footer-pro__group-label { color: var(--si-blue) !important; opacity: 1 !important; }
html.light :is(.wafer-footer-pro__bottom, .wafer-footer-pro__bottom *, .wafer-footer-pro__copy, .wafer-footer-pro__copy-sep, .wafer-footer-pro__legal) { color: #5C667E !important; }

/* ============ 10. ACCENTS ORANGE (peps sur les mises en avant — pas beaucoup) ============ */
/* Pastille eyebrow du hero → orange (petit pop chaud en haut) */
.wafer-hero__eyebrow-dot { background: var(--si-orange) !important; box-shadow: 0 0 10px rgba(255,122,26,.65) !important; }
/* Badge « le plus demandé » (tarifs) → dégradé orange */
html.light .wafer-tarif__badge, html.dark .wafer-tarif__badge { background: var(--si-orange-grad) !important; color: #FFFFFF !important; border-color: transparent !important; -webkit-text-fill-color: #FFFFFF !important; }
/* Badges de mise en avant (nouveau / express / populaire / featured / hot) → orange */
:is(html.light, html.dark) :is([class*="badge"][class*="new"], [class*="badge"][class*="express"],
  [class*="badge"][class*="popular"], [class*="badge"][class*="featured"], [class*="badge"][class*="hot"],
  [class*="pill--new"], .mac-product__badge) {
  background: var(--si-orange-grad) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important; border-color: transparent !important;
}
/* Liseré orange discret sur la carte tarif mise en avant */
html.light :is(.wafer-tarif-card.is-featured, .wafer-tarif-card--featured, [class*="tarif"][class*="featured"], [class*="pricing"][class*="popular"]) {
  border-color: rgba(255,122,26,.42) !important; box-shadow: 0 1px 3px rgba(20,33,80,.05), 0 16px 40px -22px rgba(255,122,26,.4) !important;
}
/* Titres des cartes (expertise + services = .wafer-offer__title) → ORANGE (théme-aware, lisible) */
.wafer-offer__title, .wafer-offer__title * { color: var(--si-orange-text) !important; -webkit-text-fill-color: var(--si-orange-text) !important; }
/* Graphs avant/après → ORANGE (sparkline, donut, barres) */
.wafer-compare__after-trendline path, .wafer-compare__after-trendline polyline, .wafer-compare__after-trendline line { stroke: var(--si-orange) !important; }
.wafer-compare linearGradient stop { stop-color: var(--si-orange) !important; }
.wafer-compare__after-donut circle:not([class*="bg"]):not([class*="track"]) { stroke: var(--si-orange) !important; }
.wafer-compare :is([class*="after"][class*="bar"]):not([class*="bars"]):not([class*="label"]):not([class*="lbl"]) {
  background-color: var(--si-orange) !important; background-image: linear-gradient(180deg, #FF9D2E, #FF6A00) !important;
}
.wafer-compare :is([class*="bars"], [class*="bar-chart"]) rect, .wafer-compare__after-donut path { fill: var(--si-orange) !important; }
/* Bordures ORANGE sur TOUS les blocs (général) — 2px sur les grands, 1.5px sur les petits */
:is(html.light, html.dark) :is(
  .wafer-card, .wafer-feature, .wafer-feature-card, .wafer-feature-story, .wafer-garantie,
  .wafer-offer__card, .wafer-engagement-card, .wafer-tarif-card, .wafer-step-card,
  .wafer-terrain-card, .wafer-callout, .wafer-post-card, .wafer-blog-card
):not([class*="showcase"]):not([class*="mac-"]) {
  border: 1.5px solid var(--si-bd) !important;   /* orange uniquement sur les VRAIES cartes */
}
/* (les KPI / widgets internes ne reçoivent PLUS de bordure orange — neutre subtil seulement) */
/* PADDING : respiration dans les blocs (certains à bordure étaient à 0px) */
:is(html.light, html.dark) :is(
  .wafer-feature, .wafer-card, .wafer-garantie, .wafer-engagement-card, .wafer-step-card,
  .wafer-offer__card, .wafer-post-card, .wafer-blog-card, .wafer-terrain-card
):not([class*="showcase"]):not([class*="mac-"]):not([class*="story"]) {
  padding: clamp(24px, 2.4vw, 34px) !important;
}
:is(html.light, html.dark) .wafer-callout { padding: clamp(26px, 2.6vw, 36px) !important; margin-block: 22px !important; }
:is(html.light, html.dark) :is(.wafer-kpi-mini, [class*="kpi-mini"], .wafer-feature-story__kpi, [class*="ph-meta-item"], [class*="ph-stat"]) { padding: 18px 20px !important; }

/* ============ 11. RÉALISATIONS (carrousel) — refonte UI/UX : clair, lisible, calme ============ */
/* Rail : défilement MANUEL scroll-snap (fini l'auto trop rapide). transform neutralisé → tue l'auto-play transform. */
.wafer-showcase__track {
  transform: none !important; width: 100% !important; max-width: 100% !important;
  display: flex !important; gap: 20px !important;
  overflow-x: auto !important; overflow-y: visible !important;
  scroll-snap-type: x mandatory !important; scroll-behavior: smooth !important; -webkit-overflow-scrolling: touch !important;
  padding: 8px 4px 18px !important; scrollbar-width: none !important;
}
.wafer-showcase__track::-webkit-scrollbar { height: 0 !important; display: none !important; }

/* Carte = screenshot NET (plus de voile sombre) + panneau verre clair lisible */
.wafer-showcase__card {
  scroll-snap-align: start !important;
  flex: 0 0 clamp(300px, 80vw, 430px) !important; width: clamp(300px, 80vw, 430px) !important; height: clamp(440px, 56vh, 500px) !important;
  position: relative !important; overflow: hidden !important; border-radius: 20px !important;
  background-size: cover !important; background-position: top center !important; background-repeat: no-repeat !important;
  border: 1.5px solid var(--si-bd) !important;   /* bordure ORANGE (allégée) */
  box-shadow: 0 2px 8px rgba(20,33,80,.08), 0 14px 30px -16px rgba(255,122,26,.3), 0 26px 56px -28px rgba(20,33,80,.4) !important;
  transition: transform .4s cubic-bezier(.22,1,.36,1), box-shadow .4s, border-color .4s !important;
}
.wafer-showcase__card:hover { transform: translateY(-6px) !important; border-color: rgba(255,122,26,.82) !important; box-shadow: 0 2px 8px rgba(20,33,80,.1), 0 18px 36px -16px rgba(255,122,26,.42), 0 40px 76px -30px rgba(20,33,80,.45) !important; }
/* on retire le voile sombre global du screenshot */
.wafer-showcase__card::before { background: none !important; background-image: none !important; }

/* Badges du haut → pastilles verre blanc lisibles sur le screenshot */
.wafer-showcase__card-meta { position: absolute !important; top: 14px !important; left: 14px !important; right: 14px !important; bottom: auto !important; z-index: 3 !important;
  display: flex !important; align-items: center !important; gap: 8px !important; }
.wafer-showcase__card-num, .wafer-showcase__card-chip {
  background: rgba(255,255,255,.92) !important; color: #0B0E1C !important; -webkit-text-fill-color: #0B0E1C !important;
  -webkit-backdrop-filter: blur(8px) !important; backdrop-filter: blur(8px) !important;
  border: 1px solid rgba(255,255,255,.7) !important; box-shadow: 0 6px 16px -8px rgba(20,33,80,.45) !important;
}

/* Panneau texte bas = verre clair + texte FONCÉ (contraste max, fini l'illisible) */
html.light .wafer-showcase__card-body, html.dark .wafer-showcase__card-body {
  --wp--preset--color--paper: #0B0E1C; --wp--preset--color--pearl: #1C2740; --wp--preset--color--frost: var(--si-muted);
  position: absolute !important; left: 14px !important; right: 14px !important; bottom: 14px !important; top: auto !important; z-index: 3 !important;  /* auto-ajusté au texte → AUCUNE troncature (carte à hauteur fixe = blocs même hauteur) */
  display: flex !important; flex-direction: column !important; gap: 5px !important;
  background: rgba(255,255,255,.96) !important; -webkit-backdrop-filter: blur(16px) saturate(1.4) !important; backdrop-filter: blur(16px) saturate(1.4) !important;
  border: 1px solid rgba(255,255,255,.7) !important; border-radius: 16px !important;
  padding: 13px 15px !important; box-shadow: 0 16px 44px -24px rgba(20,33,80,.5) !important;
}
.wafer-showcase__card-eyebrow { color: var(--si-blue) !important; -webkit-text-fill-color: var(--si-blue) !important; opacity: 1 !important; }
.wafer-showcase__card-title { color: #0B0E1C !important; -webkit-text-fill-color: #0B0E1C !important; }
.wafer-showcase__card-lead { color: var(--si-muted) !important; -webkit-text-fill-color: var(--si-muted) !important; font-size: 0.9em !important; line-height: 1.4 !important; }
.wafer-showcase__card-kpis { display: flex !important; gap: 14px !important; flex-wrap: wrap !important; }
.wafer-showcase__card-kpi-num { color: var(--si-blue-deep) !important; -webkit-text-fill-color: var(--si-blue-deep) !important; }
.wafer-showcase__card-kpi-lbl { color: var(--si-muted) !important; -webkit-text-fill-color: var(--si-muted) !important; }
.wafer-showcase__card-cta {
  background: var(--si-cta) !important; background-image: var(--si-cta) !important; color: #FFFFFF !important; -webkit-text-fill-color: #FFFFFF !important;
  border-color: transparent !important; border-radius: 999px !important;
  margin-top: auto !important; align-self: flex-start !important;   /* collé en bas du pavé (pavés égalisés → CTA alignés) */
}

/* ============ 12. AVANT / APRÈS — fonds DISTINCTS + textes lisibles ============ */
/* fond différent par côté : gris terne = AVANT, bleu frais = APRÈS (sens visuel + séparation nette) */
html.light .wafer-compare__panel--before { background: linear-gradient(155deg, #ECEEF3 0%, #DCE0E8 100%) !important; }
html.light .wafer-compare__panel--after  { background: linear-gradient(155deg, #E8F2FF 0%, #CFE3FF 100%) !important; }
html.dark  .wafer-compare__panel--before { background: linear-gradient(155deg, #14182A 0%, #0E1222 100%) !important; }
html.dark  .wafer-compare__panel--after  { background: linear-gradient(155deg, #0F1C3C 0%, #0A1430 100%) !important; }
/* poignée du slider : plus visible */
html.light .wafer-compare__handle { box-shadow: 0 0 0 3px rgba(255,255,255,.85), 0 8px 22px -8px rgba(20,33,80,.5) !important; }
/* textes pâles (labels, sous-titres, widgets) → lisibles partout */
html.light .wafer-compare :is([class*="widget-title"], [class*="kpi-sub"], [class*="-sub"], [class*="-lbl"], [class*="-label"], [class*="-unit"], [class*="-caption"], [class*="-note"]) {
  color: var(--si-muted) !important; -webkit-text-fill-color: var(--si-muted) !important; opacity: 1 !important;
}
/* valeurs chiffrées : APRÈS en bleu vif (succès), AVANT en gris terne (constat) */
html.light .wafer-compare__panel--after :is([class*="kpi-num"], [class*="-num"], [class*="-value"], [class*="-rank"]) {
  color: var(--si-blue-deep) !important; -webkit-text-fill-color: var(--si-blue-deep) !important;
}
html.light .wafer-compare__panel--before :is([class*="kpi"], [class*="-num"], [class*="-value"]) {
  color: #5A6478 !important; -webkit-text-fill-color: #5A6478 !important;
}
/* titres avant/après bien foncés (au cas où) */
html.light .wafer-compare :is([class*="__title"], [class*="-title"]):not([class*="widget"]) { color: #04122E !important; -webkit-text-fill-color: #04122E !important; }

/* ============ reduced-motion ============ */
@media (prefers-reduced-motion: reduce) { .si-particles, .si-wave { opacity: .85; } .wafer-showcase__track { scroll-behavior: auto !important; } }