/* ============================================================
   RANTSA — Surcouche de thème sombre
   Charte : 80% noir/blanc/charcoal · 15% gris froid · 5% violet
   Se charge APRÈS pitoon.css + pitoon-responsive.css
   ============================================================ */

:root {
  /* Accent violet officiel RANTSA */
  --pitoon-base: #7C3AED;          /* RANTSA Violet — CTA, logo, repères */
  --pitoon-base-rgb: 124, 58, 237;

  /* Fonds : la couleur "primary" (ancien crème) devient surface sombre */
  --pitoon-primary: #141414;       /* Dark Surface — cards & panels */
  --pitoon-primary-rgb: 20, 20, 20;

  /* Fonds noirs : near-black de la charte */
  --pitoon-black: #0A0A0A;         /* Near Black — fond principal */
  --pitoon-black-rgb: 10, 10, 10;

  /* Texte secondaire : gris froid */
  --pitoon-gray: #B7BCC6;          /* Cool Gray */
  --pitoon-gray-rgb: 183, 188, 198;

  /* Bordures & lignes : charcoal */
  --pitoon-bdr-color: #1E1E1E;
  --pitoon-bdr-color-rgb: 30, 30, 30;
}

/* ---- Fond global near-black ---- */
html, body {
  background-color: #0A0A0A;
}
body {
  color: var(--pitoon-gray);
}

/* ---- Preloader : logo jaune/noir du template → logo Rantsa sur fond noir ---- */
.preloader { background-color: #0A0A0A; }
.preloader__image {
  background-image: url(../images/resources/logo-1.png);
  background-size: 140px auto;
  animation-name: none;
  opacity: .9;
}

/* ---- Contact page : liens tel/email de la colonne gauche (near-black sur fond noir) ---- */
.contact-page__points li .content h4 a { color: #FFFFFF !important; }
.contact-page__points li .content h4 a:hover { color: var(--pitoon-base) !important; }

/* ---- Titres lisibles sur fond sombre (blanc) ---- */
h1, h2, h3, h4, h5, h6,
h1 a, h2 a, h3 a, h4 a, h5 a, h6 a,
.section-title__title,
.section-title__title a,
.blog-one__title a,
.services-one__title a,
.feature-one__title a,
.project-one__title a,
.team-one__name a {
  color: #FFFFFF;
}

/* ---- Violet réservé aux repères / taglines ---- */
.section-title__tagline {
  color: var(--pitoon-base);
}

/* ---- Navigation principale : liens clairs ---- */
.main-menu__list > li > a,
.main-menu-two__list > li > a {
  color: #FFFFFF;
}

/* Sous-menus déroulants : fond sombre, texte clair */
.main-menu__list li ul {
  background-color: #141414;
  border-color: #1E1E1E;
}
.main-menu__list li ul li > a {
  color: var(--pitoon-gray);
  background-color: transparent;
}
/* Override haute-spécificité : fond au repos des items (était blanc) → charcoal */
.main-menu .main-menu__list>li>ul>li>a,
.main-menu .main-menu__list>li>ul>li>ul>li>a,
.stricky-header .main-menu__list>li>ul>li>a,
.stricky-header .main-menu__list>li>ul>li>ul>li>a {
  background-color: #141414 !important;
  color: var(--pitoon-gray) !important;
  text-shadow: none !important;
}
.main-menu__list li ul li:hover > a {
  color: #FFFFFF;
  background-color: #1E1E1E;
  text-shadow: none;
}
/* Override haute-spécificité : le hover d'origine mettait le texte en near-black
   sur la surface sombre (invisible) → texte blanc, fond charcoal */
.main-menu .main-menu__list>li>ul>li:hover>a,
.main-menu .main-menu__list>li>ul>li>ul>li:hover>a,
.stricky-header .main-menu__list>li>ul>li:hover>a,
.stricky-header .main-menu__list>li>ul>li>ul>li:hover>a {
  background-color: #1E1E1E !important;
  color: #FFFFFF !important;
  text-shadow: none !important;
}

/* ---- Cards / surfaces qui étaient blanches → surface sombre ---- */
.services-one__single,
.blog-one__single,
.blog-one__content,
.team-one__single,
.team-one__content,
.pricing-one__single,
.faq-one-single,
.about-one__certified,
.project-one__title-box,
.testimonial-one__single,
.contact,
.contact__form-box {
  background-color: #141414;
}

/* ---- Champs de formulaire sur fond sombre ---- */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
textarea,
select,
.contact input,
.contact textarea,
.contact__form-box input,
.contact__form-box textarea,
.contact__form-input-box input[type="text"],
.contact__form-input-box input[type="email"],
.contact__form-input-box textarea,
.comment-form__input-box input[type="text"],
.comment-form__input-box input[type="email"],
.comment-form__input-box textarea,
.contact-page__form-box input,
.contact-page__form-box textarea {
  background-color: #141414;
  border-color: #1E1E1E;
  color: #FFFFFF;
}
::placeholder { color: var(--pitoon-gray); }

/* ---- Hover / micro-accent violet clair ---- */
a:hover { color: var(--pitoon-base); }

/* ---- Gris codés en dur (#627174 / #757a7b) → gris froid lisible ---- */
.main-header__contact-list li .text p,
.main-header__contact-list li .text p a,
.main-header__toll-free p,
.main-header__social-title,
.footer-widget__about-text,
.footer-widget__link-list li a,
.footer-widget__Contact-text,
.site-footer__bottom-text,
.site-footer__bottom-text a,
.testimonial-two__client-name span,
.services-three__text,
.blog-one__meta li,
.blog-one__meta li a {
  color: var(--pitoon-gray);
}

/* Séparateurs verticaux du header → charcoal */
.main-header__toll-free::before,
.main-header__contact-list li + li::before {
  background-color: #1E1E1E;
}

/* ============================================================
   COUCHE "WOW" — profondeur, halos violets, micro-interactions
   Le violet reste rare mais frappe fort (glows & dégradés)
   ============================================================ */

/* ---- Logo RANTSA bien dimensionné ---- */
.main-menu__logo img,
.main-menu-two__logo img,
.main-menu-three__logo img { max-height: 46px; width: auto; }
.footer-widget__logo img { max-height: 42px; width: auto; }

/* ---- Sélection & scrollbar violets ---- */
::selection { background: rgba(124,58,237,0.9); color:#fff; }
::-webkit-scrollbar { width: 11px; }
::-webkit-scrollbar-track { background:#0A0A0A; }
::-webkit-scrollbar-thumb {
  background: linear-gradient(#7C3AED,#4C1D95);
  border-radius: 10px; border:2px solid #0A0A0A;
}

/* ---- Boutons : dégradé violet + halo lumineux ---- */
/* ---- Bouton scroll-to-top : violet plein (pas d'inversion verte) ---- */
.scroll-to-top {
  mix-blend-mode: normal !important;
  background: linear-gradient(135deg,#7C3AED 0%,#A855F7 100%) !important;
  box-shadow: 0 10px 30px -8px rgba(124,58,237,0.65) !important;
}
.scroll-to-top i { color:#fff !important; }

.thm-btn {
  background: linear-gradient(105deg,#7C3AED 0%,#A855F7 100%) !important;
  color:#fff !important;
  border: none;
  box-shadow: 0 10px 30px -8px rgba(124,58,237,0.65);
  transition: transform .35s ease, box-shadow .35s ease, filter .35s ease;
}
.thm-btn::before { background: #A855F7 !important; }
.thm-btn:hover {
  color:#fff !important;
  transform: translateY(-3px);
  filter: brightness(1.08);
  box-shadow: 0 18px 44px -8px rgba(168,85,247,0.75);
}

/* ---- Halos violets ambiants derrière le hero ---- */
.main-slider { overflow: hidden; }
.main-slider::before,
.main-slider::after {
  content:""; position:absolute; z-index:0; pointer-events:none;
  width: 780px; height: 780px; border-radius:50%;
  filter: blur(40px); opacity:.55;
}
.main-slider::before {
  top:-260px; right:-180px;
  background: radial-gradient(circle, rgba(124,58,237,0.55) 0%, rgba(124,58,237,0) 68%);
}
.main-slider::after {
  bottom:-320px; left:-220px;
  background: radial-gradient(circle, rgba(168,85,247,0.5) 0%, rgba(168,85,247,0) 70%);
}
.main-slider .container { position:relative; z-index:2; }

/* subtil grain/vignette de profondeur sur les grandes sections sombres */
.trust-one, .feature-one, .why-choose-one, .cta-one {
  position: relative;
}

/* ---- Titres : accent gradient sur le tagline + trait violet ---- */
.section-title__tagline {
  position: relative;
  color: var(--pitoon-base);
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* ---- Icônes de service : violet + halo au survol ---- */
.services-one__icon span,
.feature-one__icon span,
.about-one__certified-icon span,
.about-one__icon span {
  color: var(--pitoon-base);
  transition: color .35s ease, text-shadow .35s ease, transform .35s ease;
}
.services-one__single:hover .services-one__icon span {
  color:#fff;
  text-shadow: 0 0 26px rgba(168,85,247,0.95);
  transform: translateY(-4px);
}

/* ---- Cartes : bordure charcoal, survol = lift + halo violet ---- */
.services-one__single,
.blog-one__single,
.team-one__single,
.feature-one__single,
.pricing-one__single {
  border: 1px solid #1E1E1E;
  border-radius: 14px;
  transition: transform .4s cubic-bezier(.2,.7,.2,1), box-shadow .4s ease, border-color .4s ease;
}
.services-one__single:hover,
.blog-one__single:hover,
.team-one__single:hover,
.feature-one__single:hover,
.pricing-one__single:hover {
  transform: translateY(-8px);
  border-color: rgba(124,58,237,0.6);
  box-shadow: 0 26px 60px -20px rgba(124,58,237,0.6),
              0 0 0 1px rgba(124,58,237,0.28) inset;
}

/* Le remplissage noir animé des cartes de service → surface sombre */
.services-one__single::before { background-color:#0A0A0A !important; }

/* ---- Footer : liseré violet en haut ---- */
.site-footer { position: relative; }
.site-footer::before {
  content:""; position:absolute; top:0; left:0; right:0; height:2px;
  background: linear-gradient(90deg, transparent, #7C3AED 30%, #A855F7 50%, #7C3AED 70%, transparent);
  opacity:.8; z-index:3;
}

/* ---- CTA final : halo violet enveloppant ---- */
.cta-one__inner {
  position: relative;
  box-shadow: 0 30px 90px -30px rgba(124,58,237,0.5);
}

/* ---- Compteurs / chiffres clés en dégradé violet ---- */
.counter-one__count,
.funfact-one__count,
.about-one__experience-count {
  background: linear-gradient(120deg,#A855F7,#7C3AED);
  -webkit-background-clip: text; background-clip: text;
  -webkit-text-fill-color: transparent; color: transparent;
}

/* ---- Compteur sur fond violet : texte + icônes en blanc ---- */
.counter-two__icon i,
.counter-two__content h3,
.counter-two__text {
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
}
.counter-two__single::before {
  background-color: rgba(255,255,255,.25) !important;
}

/* ---- Liens de menu : soulignement violet animé ---- */
.main-menu__list > li > a { position: relative; }
.main-menu__list > li > a::after {
  content:""; position:absolute; left:0; bottom:-6px; height:2px; width:0;
  background: linear-gradient(90deg,#7C3AED,#A855F7);
  transition: width .3s ease;
}
.main-menu__list > li:hover > a::after,
.main-menu__list > li.current > a::after { width:100%; }

/* ============================================================
   HERO — retour aux chevrons flottants animés d'origine, en NOIR & BLANC
   (le "R" RANTSA est masqué)
   ============================================================ */

/* On restaure les chevrons flottants animés, forcés en noir & blanc */
.main-slider__shape-1 img,
.main-slider__shape-2 img,
.main-slider__shape-3 img {
  filter: grayscale(1) brightness(1.05) contrast(1.05) !important;
}

/* Le "R" RANTSA est masqué : les chevrons animés reprennent leur rôle */
.main-slider__brand-r { display: none !important; }

/* ============================================================
   CORRECTIFS COULEUR — vestiges de la palette claire d'origine
   (couleurs uniquement ; aucune structure/élément modifié)
   ============================================================ */

/* 1. Titre de barre de progression : near-black → blanc (était invisible) */
.about-one__progress-title { color: #FFFFFF; }

/* 2. Lien inline "Let’s Get Started" : near-black sur fond sombre → accent violet */
.services-one__satisfied-text a { color: var(--pitoon-base); }
.services-one__satisfied-text a:hover { color: #A855F7; }

/* 3. Puces du carrousel FAQ : crème #f6f3ef / bordure noire → blanc translucide */
.faq-one__carousel.owl-carousel .owl-dots .owl-dot {
  background-color: rgba(255, 255, 255, 0.28);
}
.faq-one__carousel.owl-carousel .owl-dot.active {
  background-color: transparent;
  border-color: #FFFFFF;
}

/* 4. Réseaux sociaux des cartes équipe : icônes near-black sur surface sombre → gris froid */
.team-one__social a,
.team-one__social a i { color: var(--pitoon-gray); }
.team-one__social a:hover,
.team-one__social a:hover i { color: var(--pitoon-base); }

/* 5. Icônes near-black posées sur le violet (contraste trop faible) → blanc */
.video-one__video-icon .fa-play,
.feature-one__hover-icon span,
.why-choose-one__experience-icon span { color: #FFFFFF; }

/* 6. Bandeau BLANC derrière les cartes de services (pseudo-élément oublié)
      rgb(255,255,255) qui s'étend sur 10000px → fond transparent (les cartes
      #141414 ressortent sur le near-black #0A0A0A). */
.services-one__inner::before {
  background-color: transparent !important;
  box-shadow: none !important;
}

/* 7. Section FAQ : textes near-black restés invisibles sur fond sombre */
/*    Paragraphes de la liste de points → gris froid */
.faq-one__points li .text p { color: var(--pitoon-gray); }
/*    Titres des questions de l'accordéon → blanc, actif = violet */
.faq-one__faq-box .faq-one-accrodion .accrodion-title h4 { color: #FFFFFF; }
.faq-one__faq-box .faq-one-accrodion .accrodion.active .accrodion-title h4 { color: var(--pitoon-base); }
/*    Corps de réponse de l'accordéon → gris froid */
.faq-one__faq-box .faq-one-accrodion .accrodion-content p { color: var(--pitoon-gray); }

/* ============================================================
   CORRECTIFS COULEUR — vestiges TEAL (#061f23 / #04171a) & JAUNE (#f9be17)
   du template d'origine, codés en dur (hors variables) → charte violette
   ============================================================ */

/* 8. Newsletter (footer) : champ bleu-vert #061f23 → surface charcoal */
.footer-widget__newsletter-form-input-box input[type="email"] {
  background-color: #141414;
  color: var(--pitoon-gray);
  border: 1px solid #1E1E1E;
}
.footer-widget__newsletter-form-input-box input[type="email"]::placeholder {
  color: #6B7280;
}

/* 9. Icônes de points "Why Choose" : pastille bleu-vert #061f23 → chip violet */
.why-choose-one__points li .icon span {
  background-color: rgba(124, 58, 237, 0.14);
}

/* 10. Barre de progression : dégradé teal→JAUNE → dégradé violet */
.about-one__progress .bar-inner {
  background-image: linear-gradient(90deg, #7C3AED 0%, #A855F7 100%) !important;
}

/* 11. Carrousel projets */
/*     a) survol : voile dégradé JAUNE → voile dégradé violet */
.project-one__img-box::before {
  background-image: linear-gradient(90deg, rgba(124, 58, 237, 0.85) 0%, rgba(124, 58, 237, 0) 100%) !important;
}
/*     b) barre blanche parasite en bas de l'image au survol → supprimée */
.project-one__img-box::after {
  background-color: transparent !important;
}

/* 12. Onglets "Why Choose" : texte toujours blanc (le 3e chevron est violet,
       le 2e était bleu-vert). Chevron 2 → charcoal neutre, chevron 3 → violet. */
.why-choose-one__main-tab-box .tab-buttons .tab-btn span,
.why-choose-one__main-tab-box .tab-buttons .tab-btn:nth-child(2) span,
.why-choose-one__main-tab-box .tab-buttons .tab-btn:nth-child(3) span {
  color: #FFFFFF;
}
.why-choose-one__main-tab-box .tab-buttons .tab-btn:nth-child(2) span:before {
  background-color: #1E1E1E !important;
}
.why-choose-one__main-tab-box .tab-buttons .tab-btn:nth-child(3) span:before {
  background-color: var(--pitoon-base) !important;
}

/* 13. Survol cartes équipe : voile bleu-vert #04171a → voile violet profond */
.team-one__hover-content {
  background-color: rgba(76, 29, 149, 0.92) !important;
}

/* 14. Cartes "Feature" : bordures charcoal jugées trop dures → surface pleine
       douce + halo violet discret au survol (aucune bordure). */
.feature-one__single {
  border: none !important;
  background-color: #141414;
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
}
/* La bordure noire réelle est sur le contenu interne → supprimée aussi. */
.feature-one__content {
  border: none !important;
}
.feature-one__single:hover {
  background-color: #171522;
  box-shadow: 0 18px 44px -14px rgba(124, 58, 237, 0.45);
}

/* 15. Fond décoratif vidéo (image teal) → teinté vers le violet de la charte */
.video-one__bg-2 {
  filter: hue-rotate(96deg) saturate(1.15) brightness(0.95);
}

/* 16. Blocs projet : l'étiquette de catégorie (fond violet) avait un texte
       near-black illisible → blanc. */
.project-one__tag p { color: #FFFFFF; }

/* 17. Slider de plage sous le carrousel projets : ligne teal + barre teal→jaune
       → charte violette (couleurs uniquement). */
.thm-owl__carousel--range__input .irs--flat .irs-line {
  background-color: #1E1E1E !important;
}
.thm-owl__carousel--range__input .irs--flat .irs-bar {
  background-image: linear-gradient(90deg, #7C3AED 0%, #A855F7 100%) !important;
}
.thm-owl__carousel--range__input .irs--flat .irs-handle > i:nth-child(2) {
  background-color: var(--pitoon-base) !important;
}
/* Un re-render pouvait empiler un widget .irs orphelin → n'afficher que le dernier */
.thm-owl__carousel--range__input > span.irs:not(:last-of-type) {
  display: none !important;
}

/* 18. Formulaire de contact : bordure basse sur les champs (demande),
       accent violet au focus. */
.contact__form-input-box input[type="text"],
.contact__form-input-box input[type="email"],
.contact__form-input-box textarea {
  border-bottom: 1px solid #2A2A2A;
}
.contact__form-input-box input[type="text"]:focus,
.contact__form-input-box input[type="email"]:focus,
.contact__form-input-box textarea:focus {
  border-bottom-color: var(--pitoon-base);
}

/* 19. Bloc "Follow on:" (header) : fond bleu-vert #031316 et pointe teal
       #04171a → surface charcoal discrète (le violet plein était trop lourd). */
.main-header__social-box {
  background-color: #1A1A1A !important;
}
.main-header__social-box::before {
  border-left-color: #1A1A1A !important;
}

/* ============================================================
   22. Menu top (About / Help / Contact) : liens gris #627174 → blanc,
   survol violet (couleurs uniquement). */
.main-header__top-menu li a {
  color: #FFFFFF !important;
}
.main-header__top-menu li a:hover {
  color: var(--pitoon-base) !important;
}

/* 23. Image "Why Choose" (onglets) : en noir & blanc comme le hero.
   Le mode luminosity récupérait la teinte du fond → normal + grayscale. */
.why-choose-one__experience-img img {
  filter: grayscale(1) contrast(1.05);
  mix-blend-mode: normal !important;
}

/* 24. FAQ — bloc compteurs : le ::before était un pavé BLANC (#fff) hérité du
   template clair, criard sur fond sombre → surface charcoal discrète. */
.faq-one__counter-single::before {
  background-color: #1A1A1A !important;
}

/* 25. Carrousel projets — le voile violet au survol doit être VERTICAL
   (bas → haut) et non horizontal. */
.project-one__img-box::before {
  background-image: linear-gradient(to top, rgba(124, 58, 237, 0.85) 0%, rgba(124, 58, 237, 0) 100%) !important;
}

/* ============================================================
   21. CARTES SERVICES — rendu premium (couleurs uniquement)
   ============================================================ */
/* Surface : léger dégradé chaud-sombre + hairline violet discret + relief haut */
.services-one__single {
  background-image: linear-gradient(158deg, #18151F 0%, #121016 62%, #0F0D12 100%) !important;
  border: 1px solid rgba(124, 58, 237, 0.14) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.04) inset,
    0 10px 30px -18px rgba(0, 0, 0, 0.8);
  transition: box-shadow .45s ease, border-color .45s ease, transform .45s ease;
}
/* Survol : voile violet dégradé (au lieu du near-black plat) */
.services-one__content:before {
  background-color: transparent !important;
  background-image: linear-gradient(158deg, #2A1857 0%, #1A1030 70%, #120B22 100%) !important;
}
/* Harmonise les coins : le contenu interne et son overlay suivent le radius de
   la carte (avant, contenu carré dans carte arrondie = coins incohérents). */
.services-one__content,
.services-one__content:before {
  border-radius: 13px !important;
}
/* Survol : bordure + halo violet, léger soulèvement */
.services-one__single:hover {
  border-color: rgba(124, 58, 237, 0.55) !important;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.05) inset,
    0 22px 50px -18px rgba(124, 58, 237, 0.5);
  transform: translateY(-4px);
}
/* Icône : halo violet pour la faire vibrer */
.services-one__icon span {
  filter: drop-shadow(0 6px 18px rgba(124, 58, 237, 0.45));
}
.services-one__single:hover .services-one__icon span {
  color: #A855F7 !important;
}
/* Pastille "+" : contour violet discret au repos, plein violet au survol (déjà géré) */
.services-one__plus a {
  background-color: rgba(124, 58, 237, 0.12) !important;
  color: #C4B5FD !important;
  transition: all .4s ease;
}
.services-one__single:hover .services-one__plus a {
  color: #FFFFFF !important;
}

/* ============================================================
   RÈGLE GÉNÉRALE — palette stricte violet / noir / blanc
   Toutes les images du site passent en noir & blanc (grayscale), de sorte
   que la seule couleur de la charte reste le violet.
   ============================================================ */
img {
  filter: grayscale(1) contrast(1.03);
}
/* Fonds photographiques posés en background-image (vidéo, CTA, about…) */
.video-one__bg,
.video-one__bg-2,
.cta-one__bg,
.about-one__img,
.testimonial-one__bg,
.page-header__bg {
  filter: grayscale(1);
}

/* ============================================================
   PAGES INTERNES — panneaux blancs résiduels du template clair
   passés en surface sombre pour la cohérence sur tout le site.
   ============================================================ */
/* En-tête collant + variantes de menu blanches → near-black */
.stricky-header,
.stricky-header.main-menu-three,
.main-menu-three__wrapper-inner {
  background-color: #0A0A0A !important;
}
/* Panneaux / cartes de contenu blancs → surface charcoal */
.search-popup__content form,
.project-two__title,
.faq-two__left,
.testimonial-three__client-img-box,
.pricing-page__single-inner,
.product__all-single-inner,
.product__all-img,
.product-description {
  background-color: #141414 !important;
}
/* Étiquette (badge) blanche → chip violet discret */
.why-choose-two__sub-title {
  background-color: rgba(124, 58, 237, 0.14) !important;
  color: #FFFFFF !important;
}
/* Fonds de page entiers blancs → transparents (le near-black du body ressort) */
.cart-page,
.boxed-wrapper .page-wrapper {
  background-color: transparent !important;
}

/* Champs de saisie — override large et prioritaire : des règles internes plus
   spécifiques laissaient des champs blancs sur login / checkout / boutique /
   recherche. On force toutes les entrées texte en surface sombre. */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="number"],
input[type="search"],
input[type="url"],
textarea,
select {
  background-color: #141414 !important;
  border-color: #1E1E1E !important;
  color: #FFFFFF !important;
}

/* Panneau de formulaire de connexion (blanc confirmé) → surface sombre */
.login-page__form {
  background-color: #141414 !important;
}

/* ============================================================
   CORRECTIF DÉFINITIF — texte "near-black" du template sur fond sombre
   ============================================================ */
/* Sidebar "Services" (répétée sur toutes les pages service) : les liens au
   repos étaient en var(--pitoon-black) sur surface #141414 → invisibles. */
.services-details__services li a {
  color: var(--pitoon-gray) !important;
}
.services-details__services li:hover a,
.services-details__services li.active a {
  color: #FFFFFF !important;
}

/* ============================================================
   EXCEPTIONS À LA MISE EN N&B — le logo et l'icône d'appel restent EN COULEUR
   ============================================================ */
.main-menu__logo img,
.main-menu-two__logo img,
.main-menu-three__logo img,
.footer-widget__logo img,
.main-menu__call-icon img {
  filter: none !important;
}

/* ============================================================
   BARRE DE MENU — fond flou (frosted) couvrant TOUTE la section
   (uniquement le flou, sans teinte de couleur ajoutée)
   ============================================================ */
/* n. FAQ — icône loupe du champ de recherche (haut de page) near-black → blanche */
.faq-search-box__form-input button[type="submit"] { color: #FFFFFF !important; }

.main-menu__wrapper-inner {
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}

/* ============================================================
   26. CORRECTIFS CONTRASTE — pages internes (retours Fandresena)
   Règle : blanc sur violet · sombre/violet sur fond clair · jamais teal
   ============================================================ */

/* a. Mobile-applications — liste "Benefits" : texte near-black → blanc */
.services-details__benefit-points li .text p { color: #FFFFFF !important; }

/* b. Sidebar Services — flèche du lien au repos (near-black invisible) → blanche */
.services-details__services li a:before { border-left-color: #FFFFFF !important; }

/* c. Services (services-four) — pastille "+" bleu-vert #061f23 → chip violet */
.services-three__plus {
  background-color: rgba(124, 58, 237, 0.16) !important;
  color: #FFFFFF !important;
}
.services-three__plus:hover {
  background-color: var(--pitoon-base) !important;
  color: #FFFFFF !important;
}
/* Textes des points (near-teal #627174) → gris froid lisible */
.services-three__points li .text p { color: var(--pitoon-gray) !important; }

/* d. Page 404 — icône loupe du champ de recherche near-black → blanche */
.error-page__form button[type="submit"] { color: #FFFFFF !important; }

/* e. FAQ — pastille d'icône bleu-vert rgb(4,23,26) → chip violet */
.faq-page__icon { background-color: rgba(124, 58, 237, 0.16) !important; }

/* f. FAQ — accordéon : titres near-black → blanc, actif violet, icône +/- lisible */
.faq-page__faq-box .faq-one-accrodion .accrodion-title h4 { color: #FFFFFF !important; }
.faq-page__faq-box .faq-one-accrodion .accrodion.active .accrodion-title h4 { color: var(--pitoon-base) !important; }
.faq-page__faq-box .faq-one-accrodion .accrodion.active .accrodion-title h4::before { color: #FFFFFF !important; }

/* g. FAQ — carte contact VIOLETTE (single, pas single-2) : tout le texte en blanc */
.faq-page__contact-single:not(.faq-page__contact-single-2) .faq-page__contact-title,
.faq-page__contact-single:not(.faq-page__contact-single-2) .faq-page__contact-box .content p,
.faq-page__contact-single:not(.faq-page__contact-single-2) .faq-page__contact-box .content h3,
.faq-page__contact-single:not(.faq-page__contact-single-2) .faq-page__contact-box .content h3 a {
  color: #FFFFFF !important;
}

/* h. Pricing — cartes claires sur fond sombre : textes sombres, tout aligné à gauche */
.pricing-page__single,
.pricing-page__single .pricing-page__single-inner {
  background-color: #FFFFFF !important;
}
.pricing-page__single .pricing-page__price,
.pricing-page__single .pricing-page__title {
  color: #0A0A0A !important;
}
.pricing-page__single .pricing-page__price-sub-title,
.pricing-page__single .pricing-page__service-list li .text p {
  color: #333333 !important;
}
.pricing-page__single .pricing-page__content p { color: #333333; }
/* Cartes à hauteur égale, espacement des puces */
.pricing-page__single { height: 100%; }
.pricing-page__service-list li + li { margin-top: 12px !important; }
/* Bullets alignés à gauche, pastille calée sur la 1re ligne du texte */
.pricing-page__service-list li {
  justify-content: flex-start !important;
  align-items: flex-start !important;
  text-align: left !important;
}
.pricing-page__service-list li .icon {
  flex: 0 0 13px;
  margin-top: 7px;
}
.pricing-page__service-list li .text {
  flex: 1;
  min-width: 0;
}
.pricing-page__single .pricing-page__content { text-align: left; }
.pricing-page__single .pricing-page__title { text-align: left; }
/* Survol icône : jaune #f9be17 résiduel → violet */
.pricing-page__single:hover .pricing-page__icon { background-color: rgba(124, 58, 237, 0.14) !important; }
.pricing-page__single:hover .pricing-page__icon span { color: var(--pitoon-base) !important; }

/* i. Gallery — icône "+" au survol → blanche */
.gallery-page__icon a,
.gallery-page__icon a:hover { color: #FFFFFF !important; }

/* j. Team-details — barres de progression : dégradé teal→jaune → violet */
.team-details__progress .bar-inner {
  background-image: linear-gradient(90deg, #7C3AED 0%, #A855F7 100%) !important;
}
/* Réseaux sociaux (fond noir) : icône near-black → blanche (survol déjà géré) */
.team-details__social a { color: #FFFFFF !important; }

/* k. About — "Why Choose Three" : icône violette peu lisible → blanche */
.why-choose-three__icon span { color: #FFFFFF !important; }

/* l. About-four — flèche sur pastille violette → blanche, texte des points → blanc */
.about-four__points li .icon span { color: #FFFFFF !important; }
.about-four__points li .text p { color: #FFFFFF !important; }

/* m. About — logos partenaires (brand-one) forcés en blanc monochrome */
.brand-one__img img {
  filter: brightness(0) invert(1) !important;
  opacity: .7;
  transition: opacity .3s ease;
}
.brand-one__single:hover .brand-one__img img { opacity: 1; }

/* i. Home services : 6 cartes par rangée */
@media (min-width: 1200px) {
  .services-one__list li {
    -ms-flex: 0 0 16.6667%;
    flex: 0 0 16.6667%;
    max-width: 16.6667%;
  }
  .services-one__content { padding: 32px 24px 50px; }
  .services-one__title { font-size: 19px; }
}


/* ---- Mobile pass (≤ 767px) ---- */
@media (max-width: 767px) {
  html, body { overflow-x: hidden; }
  /* grilles 2-3 colonnes inline → 1 colonne */
  [style*="grid-template-columns: 1fr 1fr"],
  [style*="grid-template-columns: 1fr 1.1fr"],
  [style*="grid-template-columns: 1.1fr .9fr"],
  [style*="grid-template-columns: 1fr auto 1fr"] { grid-template-columns: 1fr !important; gap: 24px !important; }
  [style*="grid-template-columns: 110px 1fr"] { grid-template-columns: 1fr !important; gap: 4px !important; }
  [style*="minmax(280px, 1fr)"], [style*="minmax(240px, 1fr)"], [style*="minmax(230px, 1fr)"] { grid-template-columns: 1fr !important; }
  /* cartes flex à min-width fixe */
  [style*="min-width: 300px"], [style*="min-width: 260px"], [style*="min-width: 240px"] { min-width: 0 !important; flex-basis: 100% !important; max-width: 100% !important; }
  /* gros paddings de panneaux */
  [style*="padding: 54px 48px"], [style*="padding: 52px 44px"], [style*="padding: 48px 44px"], [style*="padding: 44px 40px"], [style*="padding: 38px 34px"] { padding: 30px 20px !important; }
  /* flèches entre cartes avant/après : pivotent vers le bas */
  .sv-arrow, .flow-arrow { transform: rotate(90deg); align-self: center !important; }
  /* passerelle : colonnes pleine largeur, "or" centré */
  .split-col { width: 100% !important; }
  .split-or { width: 100%; text-align: center; }
  /* titres très grands */
  h1[style*="clamp("], h2[style*="clamp("] { word-break: normal; overflow-wrap: anywhere; }
  /* boutons : cible tactile */
  .thm-btn { min-height: 48px; }
}

/* ---- Footer Rantsa ---- */
.rf a { transition: color .2s ease, border-color .2s ease, background .2s ease; }
.rf ul a:hover, .rf p a:hover { color: #FFFFFF !important; }
.rf .rf-soc:hover { background: #7C3AED; border-color: #7C3AED !important; color: #FFFFFF !important; }
.rf .rf-soc[aria-label="WhatsApp"]:hover, .rf .rf-wa:hover { background: #25D366; border-color: #25D366 !important; color: #FFFFFF !important; }
.rf .rf-wa:hover i { color: #FFFFFF !important; }
@media (max-width: 991px) { .rf .rf-grid { grid-template-columns: 1fr 1fr !important; } }
@media (max-width: 575px) { .rf .rf-grid { grid-template-columns: 1fr !important; gap: 32px !important; } }

.rh-card { transition: transform .3s ease, border-color .3s ease, box-shadow .3s ease; }
.rh-card:hover { transform: translateY(-6px); border-color: #A855F7 !important; box-shadow: 0 18px 46px rgba(124,58,237,.22); }

/* ---- Livre feuilleté agence ---- */
#agency-book { display: grid; }
#agency-book .ab-page { position: relative; grid-area: 1 / 1; padding: 64px 60px 110px; opacity: 0; transform: translateX(46px); transition: opacity .55s ease, transform .55s cubic-bezier(.16,1,.3,1); pointer-events: none; display: flex; flex-direction: column; justify-content: center; }
#agency-book .ab-page.active { opacity: 1; transform: translateX(0); pointer-events: auto; }
#agency-book .ab-page.leaving { opacity: 0; transform: translateX(-46px); }
#agency-book .ab-btn { width: 46px; height: 46px; border-radius: 50%; border: 1px solid rgba(124,58,237,.5); background: transparent; color: #FFFFFF; font-size: 16px; cursor: pointer; transition: all .25s ease; display: inline-flex; align-items: center; justify-content: center; }
#agency-book .ab-btn:hover { background: #7C3AED; border-color: #7C3AED; }
#agency-book .ab-dot { cursor: pointer; font-size: 13px; font-weight: 700; color: #6A6A72; padding: 6px 4px; background: none; border: none; letter-spacing: .08em; transition: color .25s ease; }
#agency-book .ab-dot.active { color: #A855F7; }
#agency-book .ab-progress { position: absolute; top: 0; left: 0; height: 2px; background: #7C3AED; width: 0; z-index: 2; }
#agency-book .ab-progress.run { animation: abProg 7s linear forwards; }
@keyframes abProg { from { width: 0 } to { width: 100% } }
@media (max-width: 700px) { #agency-book .ab-page { padding: 44px 28px 110px; } #agency-book .ab-nav { left: 28px !important; right: 28px !important; } }

/* ---- Type scale harmonisation (aligné sur le template : Syne 600 titres, Manrope 15px texte) ---- */
h1[style], h2[style], h3[style], h4[style], h5[style] { font-family: var(--pitoon-font-two) !important; font-weight: 600 !important; letter-spacing: 0 !important; }
p[style*="font-family: Syne"] { font-family: var(--pitoon-font-two) !important; }
h4[style*="font-size: 17px"], h4[style*="font-size: 18px"], h4[style*="font-size: 19px"], h4[style*="font-size: 20px"], h3[style*="font-size: 22px"], h3[style*="font-size: 24px"] { font-size: 22px !important; line-height: 1.35 !important; }
.cat-card h4[style] { font-size: 19px !important; }
p[style*="font-size: 14.5px"], p[style*="font-size: 15.5px"], div[style*="font-size: 14.5px"], li[style*="font-size: 14.5px"] { font-size: 15px !important; }
p[style*="font-size: 17px"], p[style*="font-size: 18px"]:not([style*="font-weight"]) { font-size: 16px !important; }
body, p, li, a, button, input, textarea, select { font-family: var(--pitoon-font); }

/* ---- Mobile : listes longues en carrousel, une carte à la fois ---- */
.m-swipe-hint { display: none; }
@media (max-width: 767px) {
  .m-swipe { display: flex !important; flex-wrap: nowrap !important; grid-template-columns: none !important; gap: 14px !important; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: none; margin-left: -15px; margin-right: -15px; padding: 18px 15px 6px !important; }
  .m-swipe::-webkit-scrollbar { display: none; }
  .m-swipe > * { flex: 0 0 84% !important; max-width: 84% !important; min-width: 0 !important; scroll-snap-align: center; }
  .m-swipe > .cat-hidden { display: none !important; }
  .m-swipe-hint { display: block; margin: 10px 0 0; text-align: center; font-size: 13px; font-weight: 700; letter-spacing: .06em; color: #A855F7; }
}

/* ---- Heros : fond sombre violet / noir nuancé, partout ---- */
.main-slider, .page-header { background-color: #0A0A0A !important; }
.main-slider__bg, .main-slider__bg-two, .page-header__bg, .page-header__bg-two {
  background-image:
    radial-gradient(circle at 82% 12%, rgba(124,58,237,.30), transparent 42%),
    radial-gradient(circle at 8% 92%, rgba(168,85,247,.18), transparent 40%),
    linear-gradient(160deg, #120A1F 0%, #0A0A0A 55%, #0D0716 100%) !important;
  background-color: #0A0A0A !important;
}
.main-slider__bg::before, .main-slider__bg::after, .main-slider__bg-two::before, .main-slider__bg-two::after,
.page-header__bg::before, .page-header__bg::after, .page-header__bg-two::before, .page-header__bg-two::after { display: none !important; }
.main-slider__bg-two-outer, .page-header__bg-two-outer { opacity: .55; }
.main-slider__title, .page-header__inner h2, .page-header__inner h1 { color: #FFFFFF !important; text-shadow: 0 2px 24px rgba(0,0,0,.45); }
.main-slider__sub-title, .thm-breadcrumb li, .thm-breadcrumb li a { color: #E6E1F0 !important; }

/* ---- Audit ergonomie ---- */
h1.main-slider__title { margin: 0; }
.page-header__inner h1 { font-size: 60px; line-height: 1.1; font-weight: 700; margin: 0; }
@media (max-width: 767px) { .page-header__inner h1 { font-size: 38px; } }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid #A855F7 !important; outline-offset: 3px; }
html { scroll-behavior: smooth; }
[id] { scroll-margin-top: 100px; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; } }
@media (max-width: 767px) { input, select, textarea { font-size: 16px !important; } }