.elementor-20 .elementor-element.elementor-element-743c9da{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-theme-builder-content-area{height:400px;}.elementor-location-header:before, .elementor-location-footer:before{content:"";display:table;clear:both;}/* Start custom CSS *//* =========================================================
   CRM – HEADER PREMIUM (CSS)
   ========================================================= */

:root{
  --crm-accent:#C86A1A;
  --crm-accent2:#FFB36B;
  --crm-bg:#0F1115;
  --crm-panel: rgba(15,17,21,.72);
  --crm-line: rgba(255,255,255,.10);
  --crm-text: rgba(245,247,251,.92);
  --crm-muted: rgba(245,247,251,.72);
  --crm-shadow: 0 22px 70px rgba(0,0,0,.45);
  --crm-radius: 18px;
}

/* Header wrapper */
.crm-header{
  position: sticky;
  top: 0;
  z-index: 999999;
  padding: 10px 0;
  background: linear-gradient(180deg, rgba(0,0,0,.25), rgba(0,0,0,0));
}

/* Barre */
.crm-header__bar{
  max-width: 1240px;
  margin: 0 auto;
  padding: 10px 16px;
  border-radius: var(--crm-radius);
  border: 1px solid var(--crm-line);
  background: var(--crm-panel);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: var(--crm-shadow);

  display:flex;
  align-items:center;
  justify-content:space-between;
  gap: 14px;
}

/* Brand */
.crm-brand{
  display:flex;
  align-items:center;
  gap: 12px;
  text-decoration:none;
  min-width: 220px;
}
.crm-brand__logo{
  height: 44px;
  width: auto;
  display:block;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.6));
}
.crm-brand__badge{
  width: 44px;
  height: 44px;
  border-radius: 14px;
  background: radial-gradient(circle at 30% 30%, var(--crm-accent2), var(--crm-accent));
  box-shadow: 0 14px 34px rgba(200,106,26,.35);
  flex: 0 0 auto;
}
.crm-brand__text{ line-height:1.05; }
.crm-brand__name{
  display:block;
  color: var(--crm-text);
  font-weight: 900;
  letter-spacing: .02em;
  font-size: 15px;
}
.crm-brand__tag{
  display:block;
  margin-top: 3px;
  color: rgba(245,247,251,.66);
  font-weight: 650;
  font-size: 12px;
  letter-spacing: .08em;
  text-transform: uppercase;
}

/* Nav desktop */
.crm-nav{
  display:flex;
  align-items:center;
  gap: 10px;
}
.crm-nav__list{
  display:flex;
  align-items:center;
  gap: 6px;
  list-style:none;
  padding:0;
  margin:0;
}
.crm-nav__link{
  display:inline-flex;
  align-items:center;
  height: 40px;
  padding: 0 12px;
  border-radius: 12px;
  text-decoration:none;

  color: var(--crm-text);
  opacity: .88;
  font-weight: 650;
  font-size: 13px;
  letter-spacing: .06em;
  text-transform: uppercase;

  transition: transform .16s ease, background .16s ease, opacity .16s ease;
}
.crm-nav__link:hover{
  opacity: 1;
  background: rgba(255,255,255,.06);
  transform: translateY(-1px);
}
.crm-nav__link.is-active{
  opacity: 1;
  background: rgba(255,179,107,.08);
  box-shadow: inset 0 -2px 0 rgba(255,179,107,.55);
}

/* CTA */
.crm-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height: 40px;
  padding: 0 16px;
  border-radius: 999px;
  text-decoration:none;

  color: #121316;
  font-weight: 900;
  letter-spacing: .02em;

  background: linear-gradient(135deg, var(--crm-accent2), var(--crm-accent));
  box-shadow: 0 14px 36px rgba(200,106,26,.30);
  transition: transform .16s ease, box-shadow .16s ease;
}
.crm-cta:hover{
  transform: translateY(-1px);
  box-shadow: 0 18px 46px rgba(200,106,26,.38);
}

/* Burger button */
.crm-burger{
  display:none;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  cursor:pointer;
  position: relative;
}
.crm-burger span{
  display:block;
  width: 18px;
  height: 2px;
  margin: 4px auto;
  background: rgba(245,247,251,.88);
  border-radius: 2px;
  transition: transform .16s ease, opacity .16s ease;
}

/* Overlay */
.crm-overlay{
  display:none;
}

/* ===== Mobile ===== */
@media (max-width: 980px){
  .crm-header__bar{
    padding: 10px 12px;
  }

  .crm-burger{ display:block; }

  /* Nav devient panneau */
  .crm-nav{
    position: fixed;
    top: 14px;
    right: 14px;
    left: 14px;
    transform: translateY(-8px);
    opacity: 0;
    pointer-events: none;

    flex-direction: column;
    align-items: stretch;
    gap: 10px;

    padding: 12px;
    border-radius: 18px;
    border: 1px solid rgba(255,255,255,.12);
    background: rgba(10,12,16,.92);
    backdrop-filter: blur(14px);
    box-shadow: 0 24px 60px rgba(0,0,0,.60);

    transition: opacity .18s ease, transform .18s ease;
  }

  .crm-nav__list{
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }

  .crm-nav__link{
    height: 44px;
    padding: 0 12px;
    text-transform: none;
    letter-spacing: 0;
    font-size: 15px;
    border-radius: 14px;
    opacity: 1;
  }

  .crm-cta{
    width: 100%;
    height: 46px;
  }

  /* Overlay visible quand ouvert */
  .crm-overlay{
    display:block;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    opacity: 0;
    pointer-events: none;
    transition: opacity .18s ease;
  }

  /* Etat ouvert */
  .crm-header.is-open .crm-nav{
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
  }
  .crm-header.is-open .crm-overlay{
    opacity: 1;
    pointer-events: auto;
  }

  /* Burger -> X */
  .crm-header.is-open .crm-burger span:nth-child(1){
    transform: translateY(6px) rotate(45deg);
  }
  .crm-header.is-open .crm-burger span:nth-child(2){
    opacity: 0;
  }
  .crm-header.is-open .crm-burger span:nth-child(3){
    transform: translateY(-6px) rotate(-45deg);
  }
}

/* Accessibilité : focus visible */
.crm-nav__link:focus,
.crm-cta:focus,
.crm-burger:focus{
  outline: 2px solid rgba(255,179,107,.70);
  outline-offset: 2px;
}
/* =========================================================
   CRM – FIXES (fond blanc bords + hover bleu + uniformité)
   À coller APRÈS ton CSS header
   ========================================================= */

/* 1) Supprime tout “bleu lien” (hover/visited/focus) sur le header */
.crm-header a,
.crm-header a:visited{
  color: inherit !important;
  text-decoration: none !important;
}
.crm-header a:hover{
  color: inherit !important;
  text-decoration: none !important;
}
.crm-header a:focus{
  outline: none !important;
}
.crm-header a:focus-visible{
  outline: 2px solid rgba(255,179,107,.70) !important;
  outline-offset: 2px !important;
  border-radius: 12px;
}

/* 2) Fond uniforme sur toute la largeur (évite les bords blancs) */
html, body{
  background: #0F1115 !important;
}

/* si Elementor/Hello met un fond sur le wrapper */
#page, .site, .site-content, .elementor, .elementor-page{
  background: transparent !important;
}

/* 3) Empêche le “boxed” / padding du thème d’écraser le header */
.crm-header{
  width: 100% !important;
  background: #0F1115 !important; /* fond derrière la barre */
  padding: 10px 0 !important;
}

/* 4) La barre du header reste centrée mais sans “fuite” visuelle */
.crm-header__bar{
  background: rgba(15,17,21,.82) !important; /* un peu plus opaque = plus propre */
}

/* 5) Si ton thème ajoute un underline au hover */
.crm-nav__link{
  border-bottom: 0 !important;
  box-shadow: none;
}

/* 6) Force une couleur hover premium (orange) au lieu du bleu */
.crm-nav__link:hover{
  color: rgba(255,179,107,.95) !important;
}

/* 7) Empêche les styles Elementor global “link color” de gagner */
.crm-nav__link,
.crm-cta,
.crm-brand{
  -webkit-tap-highlight-color: transparent;
}
/* =========================================================
   CRM – FOND PREMIUM PLUS CLAIR (header + page)
   ========================================================= */

/* 1) Fond global (plus clair, plus élégant) */
html, body{
  background: #1E1B18 !important; /* anthracite, pas noir */
}

/* Supprime fonds blancs parasites */
#page, .site, .site-content, .elementor, .elementor-page{
  background: transparent !important;
}

/* =========================================================
   HEADER
   ========================================================= */

/* Zone header externe */
.crm-header{
  width: 100% !important;
  background: #1A1D22 !important;
  padding: 14px 0 !important;
}

/* Barre du menu (le “cartouche”) */
.crm-header__bar{
  background: linear-gradient(
    180deg,
    rgba(45,48,54,.92),
    rgba(38,41,47,.92)
  ) !important;

  border: 1px solid rgba(255,255,255,.10);
  box-shadow:
    0 18px 45px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.06);
}

/* =========================================================
   TEXTE MENU – PLUS LISIBLE
   ========================================================= */

.crm-nav__link{
  color: rgba(245,247,251,.88) !important;
}

.crm-nav__link:hover{
  color: #ffb36b !important;
}

/* Actif */
.crm-nav__link.is-active{
  color: #ffffff !important;
  background: rgba(255,179,107,.14);
}

/* =========================================================
   CTA
   ========================================================= */

.crm-cta{
  background: linear-gradient(135deg,#ffb36b,#c86a1a) !important;
  color: #151515 !important;
}

/* =========================================================
   ACCESSIBILITÉ
   ========================================================= */

.crm-header a:focus-visible{
  outline: 2px solid rgba(255,179,107,.7);
  outline-offset: 3px;
  border-radius: 14px;
}
/* =========================================================
   CRM – FIX MENU INVISIBLE (forçage couleur liens)
   Colle ce bloc TOUT EN BAS de ton CSS
   ========================================================= */

/* Force la couleur des liens du menu dans la barre */
.crm-header__bar .crm-nav a,
.crm-header__bar .crm-nav__link,
.crm-header__bar nav a{
  color: rgba(255,255,255,.92) !important;
  opacity: 1 !important;
  text-decoration: none !important;
}

/* Hover */
.crm-header__bar .crm-nav a:hover,
.crm-header__bar .crm-nav__link:hover,
.crm-header__bar nav a:hover{
  color: #ffb36b !important;
}

/* Actif (plusieurs cas possibles selon ton HTML/WordPress) */
.crm-header__bar .crm-nav a[aria-current="page"],
.crm-header__bar .crm-nav .current-menu-item > a,
.crm-header__bar .crm-nav .current_page_item > a,
.crm-header__bar .crm-nav__link.is-active{
  color: #ffffff !important;
  background: rgba(255,179,107,.14) !important;
  border: 1px solid rgba(255,179,107,.22) !important;
  border-radius: 999px;
  padding: 10px 14px;
}

/* Si un style "visited" assombrit */
.crm-header__bar .crm-nav a:visited{
  color: rgba(255,255,255,.92) !important;
}

/* Si un filtre/opacité est appliqué par Elementor/thème */
.crm-header__bar *{
  filter: none !important;
}
/* =========================================================
   CRM – FIX MENU MOBILE NON CLIQUABLE
   Cause : .crm-overlay passe au-dessus du panneau .crm-nav
   ========================================================= */

@media (max-width: 980px){

  /* 1) Overlay : en dessous du menu, + moins sombre */
  .crm-overlay{
    position: fixed !important;
    inset: 0 !important;

    /* moins sombre */
    background: rgba(0,0,0,.22) !important;

    /* IMPORTANT : pas de blur ici, sinon effet “sombre/flou” */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    z-index: 1000000 !important;
  }

  /* 2) Panneau nav : au-dessus de l’overlay */
  .crm-nav{
    position: fixed !important;
    z-index: 1000002 !important;
    pointer-events: none; /* fermé = pas cliquable */
  }

  /* Ouvert = cliquable */
  .crm-header.is-open .crm-nav{
    pointer-events: auto !important;
  }

  /* 3) Liens : toujours au-dessus (sécurité) */
  .crm-nav a,
  .crm-nav__link{
    position: relative !important;
    z-index: 1000003 !important;
  }

  /* 4) Burger au-dessus de tout */
  .crm-burger{
    position: relative !important;
    z-index: 1000004 !important;
  }
}
/* =========================================================
   CRM – FIX MENU MOBILE (non cliquable + trop transparent)
   => overlay visuel seulement + nav 100% au-dessus + opaque
   ========================================================= */

@media (max-width: 980px){

  /* 0) Stabilise les couches */
  .crm-header{
    isolation: isolate !important; /* évite les conflits de stacking */
  }

  /* 1) OVERLAY : visuel seulement (ne bloque plus aucun clic) */
  .crm-overlay{
    position: fixed !important;
    inset: 0 !important;
    background: rgba(0,0,0,.18) !important;  /* léger, pas “noir d’un coup” */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    opacity: 0 !important;
    pointer-events: none !important;         /* ✅ clé : ne bloque rien */
    z-index: 999998 !important;
  }
  .crm-header.is-open .crm-overlay{
    opacity: 1 !important;
  }

  /* 2) NAV : au-dessus de tout + cliquable */
  .crm-nav{
    position: fixed !important;
    top: 14px !important;
    left: 14px !important;
    right: 14px !important;

    z-index: 999999 !important;              /* ✅ au-dessus overlay */
    pointer-events: none !important;         /* fermé = non cliquable */
    
    /* ✅ plus “au travers” */
    background: rgba(10,12,16,.98) !important; /* presque opaque */
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    opacity: 0 !important;
    transform: translateY(-8px) !important;
  }
  .crm-header.is-open .crm-nav{
    opacity: 1 !important;
    transform: translateY(0) !important;
    pointer-events: auto !important;         /* ✅ ouvert = cliquable */
  }

  /* 3) Liens/bouton : force le clic (au cas où) */
  .crm-nav a,
  .crm-nav__link,
  .crm-cta{
    pointer-events: auto !important;
    position: relative !important;
    z-index: 1000000 !important;
  }

  /* 4) Burger/X toujours au-dessus */
  .crm-burger{
    position: relative !important;
    z-index: 1000001 !important;
  }
}/* End custom CSS */