/**
 * France Carte Grise — design system (premium institutional + conversion)
 * Prefixo .fcg- para coexistir com CSS legado / Bootstrap.
 */

@font-face {
  font-family: "Sora";
  src: url("../fonts/Sora-Regular.woff2") format("woff2"),
       url("../fonts/Sora-Regular.ttf") format("truetype");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "Sora";
  src: url("../fonts/Sora-SemiBold.woff2") format("woff2"),
       url("../fonts/Sora-SemiBold.ttf") format("truetype");
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "Sora";
  src: url("../fonts/Sora-Bold.woff2") format("woff2"),
       url("../fonts/Sora-Bold.ttf") format("truetype");
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "Sora";
  src: url("../fonts/Sora-ExtraBold.woff2") format("woff2"),
       url("../fonts/Sora-ExtraBold.ttf") format("truetype");
  font-weight: 800;
  font-display: swap;
}

[x-cloak] {
  display: none !important;
}

:root {
  --fcg-navy: #0a1e44;
  --fcg-navy-deep: #050f28;
  --fcg-blue: #1a6fd4;
  --fcg-blue-bright: #2b8fff;
  --fcg-teal: #12b58a;
  /* Extrémité foncée des dégradés, et couleur de texte/icône. #0a8f6c donnait
     4,07:1 sur blanc ; il faut aussi tenir sur les fonds gris clair (#f3f7fb),
     d'où cette valeur qui garde ≥ 4,5:1 dans les deux cas. */
  --fcg-teal-deep: #077a5c;
  --fcg-gold: #c9a227;
  --fcg-ink: #0f172a;
  /* Texte secondaire. #5b6b7f tenait sur blanc (5,45:1) mais tombait à 4,28:1
     sur les encadrés bleu pâle (#dce5f0) où figurent notamment les numéros
     d'étape — une information, pas une décoration. */
  --fcg-muted: #556475;
  --fcg-line: #dce5f0;
  --fcg-surface: #f3f7fb;
  --fcg-white: #ffffff;
  --fcg-danger: #dc2626;
  --fcg-radius: 16px;
  --fcg-radius-sm: 11px;
  --fcg-shadow: 0 22px 60px rgba(5, 15, 40, 0.16);
  --fcg-shadow-sm: 0 10px 28px rgba(5, 15, 40, 0.08);
  --fcg-font-display: "Sora", system-ui, sans-serif;
  /* Marianne n'a jamais été embarquée : la déclarer en tête faisait retomber
     tout le texte courant sur le repli suivant. La pile système donne un rendu
     moderne, homogène et sans téléchargement. */
  --fcg-font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  /* Échelle typographique unique — toute taille de texte doit se poser sur un
     de ces crans, pas entre deux. */
  --fcg-fs-xs: 0.75rem;     /* 12px — mentions légales, badges */
  --fcg-fs-sm: 0.8125rem;   /* 13px — métadonnées, notes */
  --fcg-fs-base: 0.875rem;  /* 14px — texte secondaire */
  --fcg-fs-md: 0.9375rem;   /* 15px — texte courant compact */
  --fcg-fs-body: 1rem;      /* 16px — texte courant */
  --fcg-fs-lg: 1.0625rem;   /* 17px — lead */
  --fcg-fs-xl: 1.125rem;    /* 18px — sous-titres */
  --fcg-fs-2xl: 1.25rem;    /* 20px — titres de carte */
  --fcg-fs-3xl: 1.5rem;     /* 24px — titres de bloc */
  --fcg-fs-h2: clamp(1.6rem, 1.2rem + 1.6vw, 2rem);   /* titres de section */
  --fcg-fs-h1: clamp(2rem, 1.4rem + 2.6vw, 3.15rem);  /* héros */
  /* 1140 px datait d'écrans plus étroits : sur un 1440 il restait 150 px de
     vide de chaque côté, et sur un 1600 plus de 220. Les colonnes de texte,
     elles, ne bougent pas — la lisibilité vient de la largeur du paragraphe,
     pas de celle de la page. Voir .fcg-ed-wide pour les blocs larges. */
  --fcg-max: 1240px;
  /* Offset des elements sticky : hauteur du header colle (~121 px) + un air.
     Tout sticky sous le header DOIT partir de cette valeur, pas de 0. */
  --fcg-sticky-top: 8.75rem;
  --fcg-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}

/* —— Utilities —— */
.fcg-container {
  width: min(100% - 2rem, var(--fcg-max));
  margin-inline: auto;
}
.fcg-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}
.fcg-kicker {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 0.65rem;
  font-family: var(--fcg-font-display);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--fcg-teal-deep);
}
.fcg-kicker--light {
  color: #7dffe0;
}

/* —— Buttons —— */
.fcg-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 3.15rem;
  padding: 0.75rem 1.45rem;
  border: none;
  border-radius: 999px;
  font-family: var(--fcg-font-display);
  font-weight: 700;
  font-size: 1rem;
  text-decoration: none;
  cursor: pointer;
  transition: transform 0.25s var(--fcg-ease), box-shadow 0.25s var(--fcg-ease), background 0.2s ease;
}
.fcg-btn:hover {
  transform: translateY(-2px);
}
.fcg-btn--primary {
  background: linear-gradient(135deg, var(--fcg-teal) 0%, var(--fcg-teal-deep) 100%);
  color: var(--fcg-white);
  box-shadow: 0 12px 32px rgba(18, 181, 138, 0.38);
}
.fcg-btn--primary:hover {
  color: var(--fcg-white);
  box-shadow: 0 16px 36px rgba(18, 181, 138, 0.48);
}
.fcg-btn--secondary {
  background: var(--fcg-white);
  color: var(--fcg-navy);
  border: 1.5px solid var(--fcg-line);
}
.fcg-btn--ghost {
  background: transparent;
  color: var(--fcg-white);
  border: 1.5px solid rgba(255, 255, 255, 0.45);
}
.fcg-btn--block {
  width: 100%;
}

/* —— Header shell —— */
body.fcg-ui .header_menu {
  position: sticky;
  top: 0;
  z-index: 1000;
  background: rgba(255, 255, 255, 0.94);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(220, 229, 240, 0.95);
  box-shadow: 0 1px 0 rgba(11, 31, 74, 0.04);
}
body.fcg-ui .header_notice {
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(90deg, var(--fcg-navy-deep), var(--fcg-navy));
  color: #dbe7ff;
  padding: 0.28rem 1rem;
}
body.fcg-ui .header_notice > * {
  flex: 0 1 auto;
}
body.fcg-ui .header_notice .notice_text {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  font-weight: 500;
  font-size: 0.75rem;
}
.header_actions {
  display: flex;
  align-items: center;
  gap: 0.85rem;
  flex-shrink: 0;
  margin-left: auto;
}
.header_actions__fc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.1rem;
}
/* Charte FranceConnect : le bouton officiel s'affiche à sa taille nominale
   (209 × 56), avec son survol. Le scale(0.78) le réduisait — une marque
   institutionnelle ne se redimensionne pas pour arranger la mise en page. */
.header_actions__fc .fcConnectDivNew {
  width: 209px;
  height: 56px;
}
/* Le lien « Qu'est-ce que FranceConnect ? » est un élément OBLIGATOIRE de la
   charte, affiché sous le bouton — il ne se masque pas. */
.header_actions__fc {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.header_actions__fc .fcg-header-fc-link {
  display: inline-block;
  margin-top: 0.2rem;
  font-size: 0.75rem;
}
/* Les deux blocs de droite — groupe FranceConnect et cartouche téléphone —
   font la même largeur et la même hauteur : la rangée se lit comme deux
   cartes jumelles. Le cartouche s'étire, la mention se centre dans l'espace
   restant sous la bande du numéro. */
.header_section_one_right.header_actions {
  align-items: stretch;
}
.header_actions .fcg-phone-cta {
  width: 209px;
  display: flex;
  flex-direction: column;
}
.header_actions .fcg-phone-cta__meta {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
}
body.fcg-ui .header_section_one {
  background: transparent;
  max-width: var(--fcg-max);
  margin: 0 auto;
  padding: 0.45rem 1rem;
  justify-content: space-between;
  align-items: center;
  min-height: 4.35rem;
  flex-wrap: nowrap;
  gap: 0.75rem;
}
body.fcg-ui .header_section_one_right {
  flex-direction: row;
  margin-left: 0;
}
body.fcg-ui .fcg-nav {
  flex: 1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.15rem 0.35rem;
  position: relative;
}
body.fcg-ui .fcg-nav .menuLinkHeader {
  font-size: 0.875rem;
  padding: 0.35rem 0.55rem !important;
  text-transform: none;
  border-radius: 8px;
  background: transparent;
}
body.fcg-ui .fcg-nav .menuLinkHeader i {
  font-size: 0.75rem;
  opacity: 0.7;
  margin-left: 0.15rem;
}
body.fcg-ui .menuLinkHeader span {
  width: auto;
}
#listeAideHeader {
  position: relative;
  display: inline-block;
}
#listeAideHeader > .sub_menu {
  left: 0;
  top: 100%;
  margin-top: -8px;
  padding-top: 8px;
  z-index: 1000;
}
#listeAideHeader > .sub_menu::before {
  content: '';
  position: absolute;
  left: -20px;
  right: -20px;
  top: -28px;
  height: 36px;
  pointer-events: auto;
}
#listeAideHeader:hover > .sub_menu,
#listeAideHeader > .sub_menu.sub_menu_open {
  display: flex;
}
body.fcg-ui .fcg-nav__panel {
  flex-direction: column;
  min-width: 240px;
  gap: 0.15rem;
  padding: 0.55rem;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 16px 40px rgba(10, 30, 68, 0.14);
  border: 1px solid var(--fcg-line);
}
body.fcg-ui .fcg-nav__panel a {
  display: block;
  padding: 0.55rem 0.75rem;
  border-radius: 8px;
  color: var(--fcg-navy) !important;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.875rem;
  white-space: nowrap;
}
body.fcg-ui .fcg-nav__panel a:hover {
  background: var(--fcg-surface);
  color: var(--fcg-blue) !important;
}
body.fcg-ui .fcg-nav__panel .header_sub_item {
  margin: 0;
}
body.fcg-ui .fcg-nav__all {
  margin-top: 0.25rem;
  border-top: 1px solid var(--fcg-line);
  padding-top: 0.7rem !important;
  color: var(--fcg-blue) !important;
}

/* —— Mega menu « Démarches » ——
   Deux colonnes : les fréquentes en cartes (intention + nom administratif),
   les autres en liste. Le panneau hérite du mécanisme hover de .sub_menu. */
body.fcg-ui .fcg-mega {
  flex-direction: row;
  align-items: stretch;
  gap: 1.1rem;
  width: min(680px, calc(100vw - 3rem));
  padding: 1.05rem;
  border-radius: 18px;
}
.fcg-mega__col {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
  min-width: 0;
}
.fcg-mega__col--cards {
  flex: 1.35;
}
.fcg-mega__col--liste {
  flex: 1;
  padding-left: 1.1rem;
  border-left: 1px solid var(--fcg-line);
}
.fcg-mega__titre {
  margin: 0 0 0.45rem;
  font-family: var(--fcg-font-display);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fcg-muted);
}
body.fcg-ui .fcg-mega .fcg-mega__card {
  display: flex;
  align-items: flex-start;
  gap: 0.7rem;
  padding: 0.55rem 0.6rem;
  border-radius: 12px;
  white-space: normal;
}
.fcg-mega__ico {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 9px;
  background: var(--fcg-surface);
  color: var(--fcg-blue);
  font-size: 1rem;
  transition: background 0.2s ease, color 0.2s ease;
}
body.fcg-ui .fcg-mega .fcg-mega__card:hover .fcg-mega__ico {
  background: var(--fcg-blue);
  color: #fff;
}
.fcg-mega__txt {
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  min-width: 0;
}
.fcg-mega__intent {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--fcg-navy);
  line-height: 1.3;
}
.fcg-mega__label {
  font-family: var(--fcg-font-body);
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--fcg-muted);
  line-height: 1.35;
}
body.fcg-ui .fcg-mega .fcg-mega__lien {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.5rem;
  font-size: 0.8125rem;
  white-space: normal;
  line-height: 1.3;
}
body.fcg-ui .fcg-mega .fcg-mega__lien i {
  flex: 0 0 auto;
  color: var(--fcg-muted);
  font-size: 0.875rem;
}
body.fcg-ui .fcg-mega .fcg-mega__lien:hover i {
  color: var(--fcg-blue);
}
body.fcg-ui .fcg-mega .fcg-mega__tout {
  margin-top: auto;
  display: flex;
  align-items: center;
  gap: 0.4rem;
}
/* Variante « Véhicules » : marques en grille de tuiles, logo + nom. */
body.fcg-ui .fcg-mega--veh {
  width: min(560px, calc(100vw - 3rem));
}
.fcg-mega__marques {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.25rem;
}
body.fcg-ui .fcg-mega .fcg-mega__marque {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.5rem 0.6rem;
  border-radius: 10px;
  white-space: normal;
}
.fcg-mega__marque img {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  object-fit: contain;
}
.header_mobile_fc {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: 0.35rem 0 0.75rem;
  background: transparent;
  border: 0;
}
.fcg-mobile-nav {
  padding: 0.75rem 1rem 1.1rem;
  display: grid;
  gap: 0.15rem;
}
.fcg-mobile-nav .menuLinkHeader {
  color: var(--fcg-navy) !important;
  font-weight: 700;
}
.fcg-mobile-nav .mobile_sub_menu {
  /* main.css cache .mobile_sub_menu par une règle de feuille de style, or
     x-show ne pilote que le style inline : l'accordéon ne s'ouvrait JAMAIS.
     Ici : visible par défaut, Alpine masque en inline, x-cloak couvre le
     premier rendu. Le fond bleu plein de main.css rendait le texte encre
     illisible — panneau clair, comme les panneaux du bureau. */
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
  margin: 0.3rem 0 0.6rem;
  padding: 0.5rem 0.6rem;
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  border-radius: 12px;
}
.fcg-mobile-nav .mobile_header_sub_item {
  display: block;
  padding: 0.45rem 0.5rem;
  color: var(--fcg-ink);
  text-decoration: none;
}
body.fcg-ui .logo_site {
  border-radius: 12px;
  box-shadow: var(--fcg-shadow-sm);
}
body.fcg-ui .menuLinkHeader {
  font-family: var(--fcg-font-display);
  font-weight: 600;
  color: var(--fcg-ink) !important;
  border-radius: 8px;
  padding: 0.4rem 0.7rem !important;
  transition: background 0.2s ease, color 0.2s ease;
}
body.fcg-ui .menuLinkHeader:hover {
  background: var(--fcg-surface);
  color: var(--fcg-blue) !important;
}
body.fcg-ui .header_section_one {
  align-items: center;
  min-height: 4.5rem;
}
body.fcg-ui .header_section_one_left {
  display: flex;
  align-items: center;
  gap: 0.35rem 0.15rem;
  flex-wrap: nowrap;
}
body.fcg-ui .header_logo_link {
  flex-shrink: 0;
  margin-right: 0.5rem;
}
body.fcg-ui .header_logo_link .logo_site {
  width: 52px;
  height: auto;
}
/* Signalétique tarifaire SVA : le violet N'EST PAS un choix de charte, c'est
   le code couleur réglementaire des numéros surtaxés — il ne doit pas être
   « modernisé » vers la palette du site. La ligne client, non surtaxée,
   prend la variante --client (vert, code des numéros non surtaxés). */
.fcg-phone-cta {
  display: block;
  width: 220px;
  text-align: center;
  text-decoration: none;
  border: 1px solid #a50f78;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
  box-shadow: none;
  transition: none;
}
.fcg-phone-cta:hover {
  transform: none;
  box-shadow: none;
  text-decoration: none;
}
.fcg-phone-cta__num {
  display: block;
  background: #a50f78;
  color: #fff;
  padding: 4px 6px;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  font-weight: 700;
  letter-spacing: 0;
  line-height: 1.3;
}
.fcg-phone-cta__num i {
  color: #fff;
  margin-right: 4px;
  font-size: 0.875rem;
}
.fcg-phone-cta__meta {
  display: block;
  padding: 4px 6px;
  font-size: 0.75rem;
  line-height: 1.35;
  color: #a50f78;
  background: #fff;
  font-weight: 600;
}
.fcg-phone-cta--client {
  border-color: #0c7a43;
}
.fcg-phone-cta--client .fcg-phone-cta__num {
  background: #0c7a43;
  color: #fff;
}
.fcg-phone-cta--client .fcg-phone-cta__meta {
  color: #0c7a43;
  background: #fff;
}
.fcg-header-fc-hint {
  font-size: 0.65rem;
  color: var(--fcg-muted);
  text-align: center;
  line-height: 1.3;
  margin-bottom: 0.2rem;
  max-width: 11rem;
}
.fcg-header-fc-link {
  margin-top: 0.35rem;
  color: var(--fcg-blue);
  font-size: 0.8125rem;
  font-weight: 600;
  text-decoration: underline;
}
.fcg-header-secure-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.55rem 0.9rem;
  border-radius: 999px;
  background: #ecfdf5;
  border: 1px solid #b7ebd9;
  color: var(--fcg-teal-deep);
  font-size: 0.8125rem;
  font-weight: 700;
  white-space: nowrap;
}
.fcg-header-secure-badge i { font-size: 1rem; }

/* Landing FC: header allégé (pas de 2e bouton FC) */
body.fcg-ui.fcg-fc-landing .header_section_one {
  min-height: 4.25rem;
}
body.fcg-ui.fcg-fc-landing .menuLinkHeader {
  font-size: 0.8125rem;
}

/* Hide legacy chrome that fights the new home */
body.fcg-ui.home .start_header_section,
body.fcg-ui.home .active-voiture,
body.fcg-ui.home .desactive-car {
  display: none !important;
}
body.fcg-ui.home main > .fixed_action_bar,
body.fcg-ui.home main > .mobile-fixed-group,
body.fcg-ui.home main > .mobile-fixed-element {
  display: none !important;
}

/* —— Trust bar —— */
.fcg-trust {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.65rem 1.25rem;
  font-family: var(--fcg-font-body);
  font-size: 0.875rem;
  color: var(--fcg-muted);
}
.fcg-trust span {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
}
.fcg-trust i,
.fcg-trust svg {
  color: var(--fcg-teal-deep);
}
.fcg-trust--on-dark {
  color: rgba(255, 255, 255, 0.82);
}
.fcg-trust--on-dark i {
  color: #7dffe0;
}

/* —— Premium home hero —— */
.fcg-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  min-height: min(92vh, 760px);
  display: flex;
  align-items: center;
  padding: 4rem 0 3.5rem;
  color: var(--fcg-white);
  background:
    linear-gradient(155deg, #040c22 0%, #0a2250 42%, #0c3d5c 78%, #0a4f5a 100%);
}
.fcg-hero__mesh {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.45;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.035) 1px, transparent 1px);
  background-size: 48px 48px;
  mask-image: radial-gradient(ellipse 70% 60% at 50% 40%, #000 20%, transparent 75%);
}
.fcg-hero__glow {
  position: absolute;
  border-radius: 50%;
  filter: blur(60px);
  pointer-events: none;
  z-index: 0;
}
.fcg-hero__glow--a {
  width: 42vw;
  height: 42vw;
  max-width: 520px;
  max-height: 520px;
  top: -12%;
  right: -5%;
  background: rgba(43, 143, 255, 0.45);
  animation: fcg-glow-drift 14s ease-in-out infinite;
}
.fcg-hero__glow--b {
  width: 36vw;
  height: 36vw;
  max-width: 420px;
  max-height: 420px;
  bottom: -18%;
  left: -8%;
  background: rgba(18, 181, 138, 0.32);
  animation: fcg-glow-drift 18s ease-in-out infinite reverse;
}
.fcg-hero__doc {
  position: absolute;
  right: -2%;
  bottom: -6%;
  width: min(46vw, 460px);
  height: min(46vw, 460px);
  background: url("../images/cerf-transformed.png") no-repeat center / contain;
  opacity: 0.14;
  pointer-events: none;
  z-index: 0;
  animation: fcg-float 14s ease-in-out infinite;
}
.fcg-hero__noise {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
@keyframes fcg-glow-drift {
  0%, 100% { transform: translate(0, 0) scale(1); }
  50% { transform: translate(-18px, 22px) scale(1.06); }
}
@keyframes fcg-float {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-14px); }
}
@keyframes fcg-rise {
  from { opacity: 0; transform: translateY(22px); }
  to { opacity: 1; transform: translateY(0); }
}
@keyframes fcg-pulse {
  0%, 100% { opacity: 1; box-shadow: 0 0 0 0 rgba(125, 255, 224, 0.55); }
  50% { opacity: 0.75; box-shadow: 0 0 0 8px rgba(125, 255, 224, 0); }
}

.fcg-hero__grid {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(300px, 440px);
  gap: 2.75rem;
  align-items: center;
}
.fcg-hero__copy {
  animation: fcg-rise 0.75s var(--fcg-ease) both;
}
.fcg-hero__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-bottom: 1.15rem;
}
.fcg-hero__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  font-size: 0.8125rem;
  font-weight: 600;
  color: rgba(236, 244, 255, 0.95);
}
.fcg-hero__badge img {
  width: 22px;
  height: 22px;
  object-fit: contain;
}
.fcg-hero__badge i {
  color: #7dffe0;
}
.fcg-hero__brand-row {
  display: flex;
  align-items: center;
  gap: 1.1rem;
  margin-bottom: 0.85rem;
}
.fcg-hero__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0 0 1.1rem;
  padding: 0.4rem 0.85rem 0.4rem 0.55rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: rgba(232, 242, 255, 0.92);
}
.fcg-hero__pulse {
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: #7dffe0;
  animation: fcg-pulse 2.2s ease-out infinite;
}
.fcg-hero__brand {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.85rem, 4.2vw, 2.85rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.08;
  margin: 0;
  text-shadow: 0 12px 40px rgba(0, 0, 0, 0.25);
  flex: 0 1 auto;
  min-width: 0;
  white-space: nowrap;
}
.fcg-hero__brand span {
  color: #8fd0ff;
}
.fcg-hero__title {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.05rem, 1.85vw, 1.28rem);
  font-weight: 500;
  line-height: 1.45;
  max-width: 34rem;
  margin: 0 0 0.85rem;
  color: rgba(226, 236, 255, 0.92);
}
.fcg-hero__metrics {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.55rem;
  margin: 1.35rem 0 1.5rem;
  max-width: 34rem;
}
.fcg-hero__metric {
  padding: 0.7rem 0.55rem;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.12);
  text-align: center;
}
.fcg-hero__metric strong {
  display: block;
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: -0.02em;
}
.fcg-hero__metric span {
  display: block;
  margin-top: 0.15rem;
  font-size: 0.75rem;
  color: rgba(200, 220, 255, 0.75);
  line-height: 1.3;
}
@media (max-width: 560px) {
  .fcg-hero__metrics {
    grid-template-columns: 1fr 1fr;
  }
  .fcg-hero__brand-row {
    flex-wrap: wrap;
  }
}

/* Official seal */
.fcg-seal {
  position: relative;
  width: 108px;
  height: 108px;
  flex-shrink: 0;
  color: #d4af37;
  animation: fcg-rise 0.9s var(--fcg-ease) 0.12s both;
}
.fcg-seal--compact {
  width: 86px;
  height: 86px;
}
.fcg-seal__ring {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  border: 2.5px solid currentColor;
  opacity: 0.9;
  box-shadow: 0 0 0 4px rgba(7, 21, 54, 0.35), inset 0 0 0 1px rgba(212, 175, 55, 0.25);
}
.fcg-seal__ring--inner {
  inset: 8px;
  border-width: 1px;
  opacity: 0.55;
  border-style: dashed;
  box-shadow: none;
}
.fcg-seal__core {
  position: absolute;
  inset: 14%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: 50%;
  background:
    radial-gradient(circle at 35% 28%, #1e4a8c, #071536 72%);
  border: 1px solid rgba(212, 175, 55, 0.55);
  box-shadow: inset 0 0 18px rgba(0, 0, 0, 0.35);
  color: #fff;
  line-height: 1.15;
  padding: 0.35rem;
}
.fcg-seal__flag {
  width: 1.15rem;
  height: 0.72rem;
  margin-bottom: 0.2rem;
  background: linear-gradient(90deg, #002395 0 33%, #fff 33% 66%, #ed2939 66%);
  border-radius: 1px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
}
.fcg-seal__label {
  font-family: var(--fcg-font-display);
  font-size: 0.58rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.92);
}
.fcg-seal--compact .fcg-seal__label {
  font-size: 0.5rem;
}
.fcg-seal__core em {
  font-style: normal;
  font-family: var(--fcg-font-display);
  font-size: 0.75rem;
  font-weight: 800;
  color: #f0d78c;
  margin-top: 0.15rem;
}
.fcg-seal--compact .fcg-seal__core em {
  font-size: 0.62rem;
}

/* Certificat mock (product visual) */
.fcg-cert {
  position: relative;
  max-width: 320px;
  margin-top: 0.5rem;
  padding: 1rem 1.1rem 0.85rem;
  border-radius: 14px;
  background:
    linear-gradient(145deg, rgba(255, 255, 255, 0.97), rgba(236, 244, 255, 0.92));
  color: #0f172a;
  box-shadow:
    0 20px 50px rgba(0, 0, 0, 0.28),
    0 0 0 1px rgba(255, 255, 255, 0.35);
  transform: rotate(-2.5deg);
  animation: fcg-float 10s ease-in-out infinite;
  overflow: hidden;
}
.fcg-cert__sheen {
  position: absolute;
  inset: -40% auto -40% -30%;
  width: 45%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.55), transparent);
  transform: skewX(-18deg);
  animation: fcg-sheen 5.5s ease-in-out infinite;
}
@keyframes fcg-sheen {
  0%, 100% { transform: translateX(0) skewX(-18deg); opacity: 0; }
  30% { opacity: 0.7; }
  55% { transform: translateX(280%) skewX(-18deg); opacity: 0; }
}
.fcg-cert__header {
  position: relative;
  border-bottom: 1px solid #dbe4f0;
  padding-bottom: 0.55rem;
  margin-bottom: 0.65rem;
}
.fcg-cert__header span {
  display: block;
  font-size: 0.62rem;
  letter-spacing: 0.14em;
  color: #64748b;
  font-weight: 700;
}
.fcg-cert__header strong {
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  color: #0a1e44;
}
.fcg-cert__body {
  position: relative;
  display: grid;
  gap: 0.35rem;
}
.fcg-cert__row {
  display: flex;
  gap: 0.55rem;
  align-items: baseline;
  font-size: 0.8125rem;
}
.fcg-cert__row em {
  font-style: normal;
  font-weight: 800;
  color: #1a6fd4;
  min-width: 1.6rem;
}
.fcg-cert__row span {
  color: #334155;
  font-weight: 600;
  letter-spacing: 0.04em;
}
.fcg-cert__footer {
  position: relative;
  margin-top: 0.7rem;
  font-size: 0.65rem;
  color: #64748b;
  font-weight: 600;
}
@media (max-width: 900px) {
  .fcg-cert { display: none; }
}
.fcg-hero__lead {
  max-width: 34rem;
  margin: 0 0 1.15rem;
  font-size: 1.0625rem;
  line-height: 1.6;
  color: rgba(214, 228, 255, 0.88);
}
.fcg-hero__legal {
  max-width: 34rem;
  margin: 1rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: rgba(214, 228, 255, 0.62);
}
.fcg-hero__points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.1rem;
}
.fcg-hero__points li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(236, 244, 255, 0.92);
}
.fcg-hero__points i {
  color: #7dffe0;
  font-size: 1rem;
}

.fcg-hero__panel {
  background: rgba(255, 255, 255, 0.98);
  color: var(--fcg-ink);
  border-radius: calc(var(--fcg-radius) + 6px);
  padding: 1.35rem 1.35rem 1.3rem;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.35),
    var(--fcg-shadow);
  animation: fcg-rise 0.85s var(--fcg-ease) 0.08s both;
}
.fcg-hero__social {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: -0.15rem 0 0.95rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: linear-gradient(90deg, #f0fdf8, #f0f7ff);
  border: 1px solid #d8efe6;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #334155;
}
.fcg-stars {
  color: #eab308;
  letter-spacing: 0.05em;
  font-size: 0.875rem;
}
.fcg-hero__panel-head {
  margin-bottom: 1.05rem;
  padding-bottom: 0.9rem;
  border-bottom: 1px solid var(--fcg-line);
}
.fcg-hero__panel-head h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--fcg-navy);
  margin: 0 0 0.25rem;
}
.fcg-hero__panel-head p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fcg-muted);
}
.fcg-hero__sla {
  display: flex;
  align-items: flex-start;
  gap: 0.4rem;
  margin: 0.85rem 0 0.75rem;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--fcg-muted);
}
.fcg-hero__sla i {
  color: var(--fcg-teal-deep);
  margin-top: 0.1rem;
}
/* Tout le bas du panneau est centré : pastille d'avis, lien, garanties,
   habilitation — une seule colonne d'axe, comme le CTA au-dessus. */
.fcg-hero__panel-trust {
  list-style: none;
  margin: 0;
  padding: 0.75rem 0 0;
  border-top: 1px solid var(--fcg-line);
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem 0.85rem;
}
.fcg-hero__panel .fcg-hero__sla {
  justify-content: center;
}
.fcg-hero__panel .fcg-rw__fallback {
  justify-content: center;
}
.fcg-hero__panel-trust li {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--fcg-muted);
}
.fcg-hero__panel-trust i {
  color: var(--fcg-blue);
}
.fcg-hero__fields {
  display: grid;
  gap: 0.95rem;
}
.fcg-field {
  display: grid;
  gap: 0.4rem;
  margin: 0;
}
.fcg-field__label {
  font-family: var(--fcg-font-display);
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fcg-navy);
}
.fcg-field__hint,
.fcg-hero__panel .indication_plaque_format {
  font-size: 0.8125rem !important;
  color: var(--fcg-muted) !important;
  text-align: left !important;
}
.fcg-hero__panel .error_message {
  color: var(--fcg-danger);
  font-size: 0.8125rem;
}
.fcg-plate {
  display: flex !important;
  align-items: stretch;
  box-sizing: border-box;
  /* Même hauteur que les selects (min-height 3.15rem) : les trois champs du
     panneau se lisent comme une seule famille. */
  height: 3.15rem !important;
  min-height: 3.15rem !important;
  max-height: 3.15rem !important;
  border-radius: 6px !important;
  overflow: hidden;
  border: 1.5px solid #0a1e44;
  box-shadow: 0 8px 20px rgba(11, 31, 74, 0.1);
  background: #fff;
}
.fcg-plate:focus-within {
  border-color: #003399;
  box-shadow: 0 0 0 3px rgba(0, 51, 153, 0.22);
}
.fcg-plate__eu,
.fcg-plate .logoUnionEurope {
  display: block !important;
  position: relative !important;
  left: auto !important;
  top: auto !important;
  flex: 0 0 1.85rem;
  width: 1.85rem !important;
  min-width: 1.85rem;
  max-width: 1.85rem;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: #003399 !important;
  color: #ffcc00;
  overflow: hidden;
}
.fcg-plate__eu-svg {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100%;
}
.fcg-plate__stars,
.fcg-plate__f {
  display: none;
}
.fcg-plate .europeImg[hidden] {
  display: none !important;
}
.inputGroupDemarche.fcg-plate .inputPlaqueLogo,
.fcg-plate .inputPlaqueLogo {
  flex: 1 1 auto;
  /* min-width:0 — sans lui, la taille intrinsèque de l'input (size=20)
     empêche le flex de le comprimer : le cap bleu « F » sortait de l'écran
     sur mobile. */
  min-width: 0;
  width: auto !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: 100% !important;
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  background: #fff !important;
  font-family: "Arial Narrow", "Sora", Arial, sans-serif;
  font-weight: 700;
  font-size: 1.25rem !important;
  line-height: 2.25rem !important;
  letter-spacing: 0.12em;
  text-align: center;
  text-transform: uppercase;
  color: #111827;
  padding: 0 0.3rem !important;
  margin: 0 !important;
  appearance: none;
  -webkit-appearance: none;
}
.fcg-plate .inputPlaqueLogo::placeholder {
  color: #94a3b8;
  letter-spacing: 0.12em;
  font-weight: 700;
  text-transform: uppercase;
  opacity: 1;
}
.fcg-plate__end,
.fcg-plate .bluePlaque {
  position: relative !important;
  right: auto !important;
  top: auto !important;
  flex: 0 0 2.15rem;
  width: 2.15rem !important;
  min-width: 2.15rem;
  max-width: 2.15rem;
  height: 100% !important;
  min-height: 0 !important;
  background: #003399 !important;
  display: grid !important;
  grid-template-rows: 1.2fr 0.9fr;
  align-items: center;
  justify-items: center;
  gap: 0;
  padding: 0.06rem 0.04rem 0.04rem !important;
  color: #fff;
  overflow: hidden;
}
.fcg-plate__mark {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 100%;
  min-height: 0;
  line-height: 0;
}
.fcg-plate__mark:empty {
  visibility: hidden;
}
.fcg-plate__mark svg,
.fcg-plate__logo {
  width: 1.55rem;
  height: 0.82rem;
  max-height: 0.88rem;
  display: block;
  object-fit: contain;
  overflow: visible;
}
.fcg-plate .fcg-plate__dept,
.inputGroupDemarche .fcg-plate__dept {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 800;
  font-size: 0.75rem;
  letter-spacing: 0.02em;
  line-height: 1;
  color: #fff !important;
  min-height: 0;
  align-self: center;
  padding-top: 0;
}
.fcg-plate__dept.is-long {
  font-size: 0.75rem;
  letter-spacing: 0;
}
.fcg-select,
.fcg-hero__panel .fixed_select,
.fcg-hero__panel select {
  width: 100%;
  min-height: 3.15rem;
  border-radius: var(--fcg-radius-sm);
  border: 1.5px solid var(--fcg-line);
  padding: 0.55rem 2.4rem 0.55rem 0.95rem;
  font-size: 0.9375rem;
  font-family: var(--fcg-font-body);
  background-color: var(--fcg-white);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%230a1e44' d='M1.4.6 6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 12px 8px;
  color: var(--fcg-ink);
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.fcg-select:focus,
.fcg-hero__panel .fixed_select:focus,
.fcg-hero__panel select:focus {
  outline: none;
  border-color: var(--fcg-blue-bright);
  box-shadow: 0 0 0 3px rgba(43, 143, 255, 0.18);
}
body.fcg-ui .header_section_one_right > div > div:last-child > span {
  display: block;
}
body.fcg-ui .fcConnectDivNew {
  transform: none;
}
body.fcg-ui .header_actions__fc .fcConnectDivNew {
  transform: none;
}
.fcg-hero__cta {
  margin-top: 1.15rem;
}
.fcg-hero__panel .accueil_button_commande,
.fcg-hero__panel .homeCommencer {
  width: 100%;
  min-height: 3.35rem;
  border: none;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--fcg-teal), var(--fcg-teal-deep));
  color: #fff !important;
  font-family: var(--fcg-font-display);
  font-weight: 700;
  font-size: 1.0625rem;
  box-shadow: 0 14px 30px rgba(18, 181, 138, 0.38);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}
.fcg-hero__fine {
  margin: 0.85rem 0 0;
  text-align: center;
  font-size: 0.8125rem;
  color: var(--fcg-muted);
}

@media (max-width: 900px) {
  .fcg-hero {
    min-height: auto;
    padding: 2.25rem 0 2.5rem;
  }
  .fcg-hero__grid {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
  .fcg-hero__doc {
    opacity: 0.08;
    width: 260px;
    height: 260px;
  }
}

/* —— Trust ribbon —— */
.fcg-ribbon {
  position: relative;
  z-index: 2;
  margin-top: -1.25rem;
  padding-bottom: 0.5rem;
}
.fcg-ribbon__track {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.75rem;
  padding: 1rem;
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-ribbon__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.65rem;
  padding: 0.55rem 0.75rem;
  text-align: left;
  border-right: 1px solid var(--fcg-line);
}
.fcg-ribbon__item > i {
  font-size: 1.25rem;
  color: var(--fcg-teal-deep);
  flex-shrink: 0;
}
.fcg-ribbon__logo {
  flex-shrink: 0;
  display: block;
  width: 22px;
  height: auto;
}
.fcg-ribbon__item > div {
  display: grid;
  gap: 0.1rem;
}
.fcg-ribbon__item:last-child {
  border-right: none;
}
.fcg-ribbon__item strong {
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  color: var(--fcg-navy);
}
.fcg-ribbon__item span {
  font-size: 0.8125rem;
  color: var(--fcg-muted);
}
@media (max-width: 800px) {
  .fcg-ribbon__track {
    grid-template-columns: 1fr 1fr;
  }
  .fcg-ribbon__item:nth-child(2) {
    border-right: none;
  }
}

/* —— Sections —— */
.fcg-section {
  padding: 4rem 0;
}
.fcg-section--surface {
  background: var(--fcg-surface);
}
.fcg-section--ink {
  background:
    radial-gradient(ellipse 60% 50% at 90% 0%, rgba(43, 143, 255, 0.18), transparent 55%),
    linear-gradient(160deg, #071536 0%, #0b2a52 55%, #0a3d4a 100%);
  color: #fff;
}
.fcg-section__intro {
  text-align: center;
  margin-bottom: 2.25rem;
}
.fcg-section__intro--light .fcg-section__title {
  color: #fff;
}
.fcg-section__intro--light .fcg-section__sub {
  color: rgba(214, 228, 255, 0.85);
}
.fcg-section__title {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.5rem, 2.6vw, 2rem);
  font-weight: 700;
  color: var(--fcg-navy);
  text-align: center;
  margin: 0 0 0.55rem;
  letter-spacing: -0.025em;
}
.fcg-section__sub {
  text-align: center;
  color: var(--fcg-muted);
  max-width: 40rem;
  margin: 0 auto;
  line-height: 1.55;
}

/* Demarche grid */
.fcg-demarche-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem 1rem;
  width: 100%;
}
.fcg-demarche-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1000px) {
  .fcg-demarche-grid--4 {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 720px) {
  .fcg-demarche-grid {
    grid-template-columns: 1fr;
  }
}
@media (max-width: 560px) {
  .fcg-demarche-grid--4 {
    grid-template-columns: 1fr;
  }
}
.fcg-demarche-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0.9rem;
  padding: 1.05rem 1.15rem;
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  text-decoration: none;
  color: inherit;
  box-shadow: var(--fcg-shadow-sm);
  transition: transform 0.28s var(--fcg-ease), border-color 0.2s ease, box-shadow 0.28s ease;
  overflow: hidden;
  min-width: 0;
  width: auto;
  max-width: 100%;
  box-sizing: border-box;
}
body.fcg-ui .fcg-demarche-card.item-grid-demarche-carte-grise {
  width: auto !important;
  max-width: 100%;
  padding: 1.05rem 1.15rem;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  box-shadow: var(--fcg-shadow-sm);
  justify-content: flex-start;
}
.fcg-demarche-card::after {
  content: "";
  position: absolute;
  inset: auto 0 0 0;
  height: 3px;
  background: linear-gradient(90deg, var(--fcg-blue-bright), var(--fcg-teal));
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.35s var(--fcg-ease);
}
.fcg-demarche-card:hover {
  transform: translateY(-4px);
  border-color: rgba(43, 143, 255, 0.4);
  box-shadow: var(--fcg-shadow);
  color: inherit;
}
.fcg-demarche-card:hover::after {
  transform: scaleX(1);
}
.fcg-demarche-card__icon {
  width: 2.9rem;
  height: 2.9rem;
  border-radius: var(--fcg-radius-sm, 11px);
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #e8f3ff, #dff7f1);
  color: var(--fcg-blue);
  flex-shrink: 0;
  font-size: 1.125rem;
}
.fcg-demarche-card__body {
  flex: 1;
  min-width: 0;
}
.fcg-demarche-card h3 {
  font-family: var(--fcg-font-display);
  font-size: 1rem;
  margin: 0 0 0.2rem;
  color: var(--fcg-navy);
  line-height: 1.25;
  white-space: normal;
  overflow: visible;
  text-overflow: unset;
}
.fcg-demarche-card p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  line-height: 1.4;
  white-space: normal;
}
.fcg-demarche-card__go {
  position: absolute;
  right: 0.85rem;
  top: 50%;
  margin-top: -0.55rem;
  color: var(--fcg-blue-bright);
  opacity: 0;
  transform: translateX(-6px);
  transition: opacity 0.25s ease, transform 0.25s var(--fcg-ease);
  pointer-events: none;
}
.fcg-demarche-card:hover .fcg-demarche-card__go {
  opacity: 1;
  transform: translateX(0);
}

/* Why */
.fcg-why-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.15rem;
}
@media (max-width: 900px) {
  .fcg-why-grid {
    grid-template-columns: 1fr;
  }
}
.fcg-section--ink .fcg-why-item {
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.14);
  color: #fff;
  backdrop-filter: blur(8px);
}
.fcg-section--ink .fcg-why-item h3 {
  color: #fff;
}
.fcg-section--ink .fcg-why-item p {
  color: rgba(214, 228, 255, 0.85);
}
.fcg-why-item {
  background: var(--fcg-white);
  border-radius: var(--fcg-radius);
  padding: 1.55rem 1.3rem;
  border: 1px solid var(--fcg-line);
  text-align: center;
  transition: transform 0.3s var(--fcg-ease);
}
.fcg-why-item:hover {
  transform: translateY(-5px);
}
.fcg-why-item img {
  width: 56px;
  height: 56px;
  margin-bottom: 0.85rem;
}
.fcg-why-item h3 {
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  color: var(--fcg-navy);
  margin: 0 0 0.5rem;
}
.fcg-why-item p {
  margin: 0;
  color: var(--fcg-muted);
  font-size: 0.9375rem;
  line-height: 1.55;
}

/* Timeline steps */
.fcg-timeline {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  counter-reset: none;
}
@media (max-width: 900px) {
  .fcg-timeline {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 560px) {
  .fcg-timeline {
    grid-template-columns: 1fr;
  }
}
.fcg-timeline__item {
  position: relative;
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  padding: 1.35rem 1.15rem 1.25rem;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-timeline__n {
  display: block;
  font-family: var(--fcg-font-display);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: var(--fcg-blue-bright);
  margin-bottom: 0.55rem;
}
.fcg-timeline__item h3 {
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  margin: 0 0 0.45rem;
  color: var(--fcg-navy);
}
.fcg-timeline__item p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  line-height: 1.5;
}
.fcg-timeline__item a {
  color: var(--fcg-blue);
  font-weight: 600;
}

/* Split pricing / docs */
.fcg-split {
  display: grid;
  grid-template-columns: 1.15fr 0.85fr;
  gap: 2rem;
  align-items: start;
}
@media (max-width: 800px) {
  .fcg-split {
    grid-template-columns: 1fr;
  }
}
.fcg-checklist {
  margin: 0 0 1.5rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
}
.fcg-checklist li {
  position: relative;
  padding-left: 1.6rem;
  color: var(--fcg-muted);
  line-height: 1.5;
}
.fcg-checklist li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0.35rem;
  width: 0.85rem;
  height: 0.85rem;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--fcg-teal), var(--fcg-blue-bright));
}
.fcg-split__panel {
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  padding: 1.4rem 1.25rem;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-split__panel h3 {
  font-family: var(--fcg-font-display);
  margin: 0 0 1rem;
  color: var(--fcg-navy);
  font-size: 1.125rem;
}
.fcg-doclist {
  list-style: none;
  margin: 0 0 1.15rem;
  padding: 0;
  display: grid;
  gap: 0.55rem;
}
.fcg-doclist li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 0.85rem;
  border-radius: var(--fcg-radius-sm);
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  font-size: 0.875rem;
}
.fcg-doclist a {
  color: var(--fcg-blue);
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

/* Blog cards */
.fcg-blog-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
@media (max-width: 1000px) {
  .fcg-blog-grid {
    grid-template-columns: 1fr 1fr;
  }
}
@media (max-width: 560px) {
  .fcg-blog-grid {
    grid-template-columns: 1fr;
  }
}
.fcg-blog-card {
  display: block;
  text-decoration: none;
  color: inherit;
  border-radius: var(--fcg-radius);
  overflow: hidden;
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  box-shadow: var(--fcg-shadow-sm);
  transition: transform 0.28s var(--fcg-ease), box-shadow 0.28s ease;
}
.fcg-blog-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--fcg-shadow);
  color: inherit;
}
.fcg-blog-card__media {
  aspect-ratio: 16 / 10;
  background-size: cover;
  background-position: center;
}
.fcg-blog-card h3 {
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  line-height: 1.4;
  margin: 0;
  padding: 1rem;
  color: var(--fcg-navy);
}

/* FAQ Alpine */
.fcg-faq {
  max-width: 720px;
  margin: 0 auto;
  display: grid;
  gap: 0.65rem;
}
.fcg-faq__item {
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius-sm);
  overflow: hidden;
}
.fcg-faq__q {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem;
  background: transparent;
  border: none;
  text-align: left;
  font-family: var(--fcg-font-display);
  font-weight: 600;
  font-size: 1rem;
  color: var(--fcg-navy);
  cursor: pointer;
}
.fcg-faq__q i {
  color: var(--fcg-blue);
  transition: transform 0.25s var(--fcg-ease);
}
.fcg-faq__item.is-open .fcg-faq__q i {
  transform: rotate(180deg);
}
.fcg-faq__a {
  padding: 0 1.1rem 1rem;
  color: var(--fcg-muted);
  font-size: 0.9375rem;
  line-height: 1.55;
}

/* Sticky CTA */
.fcg-sticky-cta {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 900;
  padding: 0.75rem 1rem calc(0.75rem + env(safe-area-inset-bottom));
  background: rgba(255, 255, 255, 0.96);
  backdrop-filter: blur(12px);
  border-top: 1px solid var(--fcg-line);
  box-shadow: 0 -8px 30px rgba(11, 31, 74, 0.1);
  transform: translateY(110%);
  transition: transform 0.35s var(--fcg-ease);
}
.fcg-sticky-cta.is-visible {
  transform: translateY(0);
}
.fcg-sticky-cta__inner {
  width: min(100%, 520px);
  margin: 0 auto;
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.fcg-sticky-cta__inner p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  flex: 1;
}
/* Sur les écrans étroits, le texte se serrait à un mot par ligne à côté du
   bouton : on ne garde que le bouton, pleine largeur. */
@media (max-width: 430px) {
  .fcg-sticky-cta__inner p { display: none; }
  .fcg-sticky-cta__inner .fcg-btn { width: 100%; }
}
html.fcg-has-sticky-cta {
  scroll-padding-bottom: 5.5rem;
}
html.fcg-has-sticky-cta body.fcg-ui {
  padding-bottom: 5.25rem;
}
/* FranceConnect landing: sticky masqué (parcours identité d’abord) */
body.fcg-fc-landing .fcg-sticky-cta {
  display: none !important;
}
@media (min-width: 900px) {
  .fcg-sticky-cta {
    display: none;
  }
  html.fcg-has-sticky-cta body.fcg-ui {
    padding-bottom: 0;
  }
}

/* Funnel progress */
.fcg-funnel-progress {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  max-width: 720px;
  margin: 0 auto 1.75rem;
}
.fcg-funnel-progress + .progessBarMain {
  display: none !important;
}
.fcg-funnel-progress__step {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  text-align: center;
  padding: 0.7rem 0.5rem;
  border-radius: 999px;
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  font-family: var(--fcg-font-display);
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--fcg-muted);
}
.fcg-funnel-progress__n {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.45rem;
  height: 1.45rem;
  border-radius: 999px;
  background: #e8eef6;
  color: var(--fcg-navy);
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}
.fcg-funnel-progress__step.is-done {
  background: #e8f8f3;
  border-color: #b7ebd9;
  color: var(--fcg-teal-deep);
}
.fcg-funnel-progress__step.is-done .fcg-funnel-progress__n {
  background: #b7ebd9;
  color: var(--fcg-teal-deep);
}
.fcg-funnel-progress__step.is-current {
  background: linear-gradient(135deg, var(--fcg-blue-bright), var(--fcg-blue));
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 20px rgba(43, 143, 255, 0.35);
}
.fcg-funnel-progress__step.is-current .fcg-funnel-progress__n {
  background: rgba(255,255,255,.22);
  color: #fff;
}
.fcg-funnel-progress__now {
  grid-column: 1 / -1;
  margin: 0.15rem 0 0;
  text-align: center;
  font-family: var(--fcg-font-body);
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--fcg-navy);
}
@media (max-width: 640px) {
  .fcg-funnel-progress__label { font-size: 0.75rem; }
  .fcg-funnel-progress__step { padding: 0.55rem 0.35rem; gap: 0.3rem; }
}
body.fcg-ui .progessBarMain {
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
}
body.fcg-ui .circle-progress-active {
  background: var(--fcg-blue-bright) !important;
  box-shadow: 0 0 0 4px rgba(43, 143, 255, 0.2);
}
body.fcg-ui .activestep {
  color: var(--fcg-navy) !important;
  font-weight: 700;
}
body.fcg-ui .demarche-form-section,
body.fcg-ui .page-informations-titulaire .blog-list-section,
body.fcg-ui .payment-page .blog-list-section {
  border-radius: var(--fcg-radius);
}
body.fcg-ui .btn-submit-v3,
body.fcg-ui .accueil_button_commande {
  border-radius: 999px;
}

/* Landing pages */
.fcg-lp {
  font-family: var(--fcg-font-body);
  color: var(--fcg-ink);
  background: var(--fcg-white);
}
.fcg-lp-hero {
  position: relative;
  overflow: hidden;
  isolation: isolate;
  padding: 4.25rem 0 3.75rem;
  color: #fff;
  background: linear-gradient(145deg, #040c22 0%, #0a2a58 50%, #0c5360 100%);
}
.fcg-lp-hero::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  background-image:
    linear-gradient(rgba(255, 255, 255, 0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255, 255, 255, 0.03) 1px, transparent 1px);
  background-size: 44px 44px;
  opacity: 0.55;
  pointer-events: none;
}
.fcg-lp-hero::after {
  content: "";
  position: absolute;
  width: 420px;
  height: 420px;
  right: -80px;
  top: -100px;
  border-radius: 50%;
  background: rgba(43, 143, 255, 0.35);
  filter: blur(70px);
  pointer-events: none;
  z-index: 0;
}
.fcg-lp-hero .fcg-container {
  position: relative;
  z-index: 1;
}
.fcg-lp-hero__inner {
  display: block;
}
.fcg-lp-hero--rich {
  padding: 4rem 0 3.75rem;
}
.fcg-lp-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(260px, 360px);
  gap: 2rem 2.5rem;
  align-items: center;
}
@media (max-width: 900px) {
  .fcg-lp-hero__grid {
    grid-template-columns: 1fr;
  }
}
.fcg-lp-hero__cta-card {
  background: rgba(255, 255, 255, 0.97);
  color: var(--fcg-ink);
  border-radius: calc(var(--fcg-radius) + 4px);
  padding: 1.4rem 1.3rem 1.35rem;
  box-shadow: var(--fcg-shadow);
}
.fcg-lp-hero__cta-kicker {
  margin: 0 0 0.35rem;
  font-family: var(--fcg-font-display);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--fcg-teal-deep);
}
.fcg-lp-hero__cta-card h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.25rem;
  margin: 0 0 0.4rem;
  color: var(--fcg-navy);
}
.fcg-lp-hero__cta-card > p {
  margin: 0 0 1.1rem !important;
  color: var(--fcg-muted) !important;
  font-size: 0.9375rem !important;
  max-width: none !important;
}
.fcg-lp-hero__cta-list {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0.85rem 0 0;
  border-top: 1px solid var(--fcg-line);
  display: grid;
  gap: 0.45rem;
}
.fcg-lp-hero__cta-list li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--fcg-muted);
}
.fcg-lp-hero__cta-list i {
  color: var(--fcg-blue);
}
.fcg-lp-hero__top {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 0.75rem;
}
.fcg-lp-hero__top .fcg-seal {
  color: #f0d78c;
}
.fcg-lp-hero__brand {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.15rem, 2vw, 1.35rem);
  font-weight: 700;
  letter-spacing: -0.02em;
  margin: 0;
  color: #8fd0ff;
}
.fcg-lp-hero__trust {
  margin-top: 1.35rem;
}
.fcg-lp-hero--slate {
  background: linear-gradient(135deg, #1e293b 0%, #334155 55%, #0f766e 100%);
}
.fcg-lp-hero--green {
  background: linear-gradient(135deg, #064e3b 0%, #0f766e 50%, #0b3a5c 100%);
}
.fcg-lp-hero h1 {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.85rem, 3.6vw, 2.65rem);
  font-weight: 700;
  letter-spacing: -0.035em;
  margin: 0 0 0.85rem;
  max-width: 18ch;
  line-height: 1.12;
}
.fcg-lp-hero p {
  max-width: 38rem;
  margin: 0 0 1.45rem;
  font-size: 1.0625rem;
  line-height: 1.55;
  color: rgba(236, 244, 255, 0.9);
}
.fcg-lp-layout {
  display: grid;
  grid-template-columns: 1fr 310px;
  gap: 2.25rem;
  width: min(100% - 2rem, var(--fcg-max));
  margin: 2.75rem auto 3.75rem;
}
@media (max-width: 900px) {
  .fcg-lp-layout {
    grid-template-columns: 1fr;
  }
}
.fcg-lp-main h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.375rem;
  color: var(--fcg-navy);
  margin: 2.15rem 0 0.85rem;
  letter-spacing: -0.02em;
}
.fcg-lp-main p,
.fcg-lp-main li {
  color: #334155;
  line-height: 1.7;
}
.fcg-lp-body {
  margin-top: 1rem;
}
.fcg-lp-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 0.6rem;
}
.fcg-lp-grid a {
  display: block;
  padding: 0.75rem 0.9rem;
  border-radius: var(--fcg-radius-sm);
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  text-decoration: none;
  color: var(--fcg-navy);
  font-weight: 600;
  font-size: 0.875rem;
  transition: border-color 0.2s, background 0.2s, transform 0.2s var(--fcg-ease);
}
.fcg-lp-grid a:hover {
  border-color: var(--fcg-blue-bright);
  background: #eef6ff;
  transform: translateY(-2px);
}
.fcg-lp-aside {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  align-self: start;
  position: sticky;
  top: var(--fcg-sticky-top, 8.75rem);
}
.fcg-lp-card {
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  padding: 1.25rem;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-page__main > .fcg-lp-card {
  margin-bottom: 1.25rem;
}
.fcg-lp-card--accent {
  background: linear-gradient(180deg, #f0f9ff, #fff);
  border-color: #cfe5ff;
}
.fcg-lp-card h3 {
  font-family: var(--fcg-font-display);
  margin: 0 0 0.55rem;
  font-size: 1.0625rem;
  color: var(--fcg-navy);
}
.fcg-lp-mini-link {
  display: block;
  padding: 0.5rem 0;
  color: var(--fcg-blue);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 600;
  border-bottom: 1px solid var(--fcg-line);
}
.fcg-lp-mini-link:last-child {
  border-bottom: none;
}
.fcg-lp-links-footer {
  margin-top: 2rem;
  font-size: 0.875rem;
  color: var(--fcg-muted);
}
.fcg-lp-links-footer a {
  color: var(--fcg-blue);
}
.fcg-lp-service-list {
  display: grid;
  gap: 0.65rem;
  margin: 1rem 0;
  padding: 0;
  list-style: none;
}
.fcg-lp-service-list a {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0.95rem 1.05rem;
  border-radius: var(--fcg-radius-sm);
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  text-decoration: none;
  color: var(--fcg-navy);
  font-weight: 600;
  transition: border-color 0.2s, transform 0.2s var(--fcg-ease);
}
.fcg-lp-service-list a:hover {
  border-color: var(--fcg-blue-bright);
  transform: translateX(3px);
}

/* Footer polish */
body.fcg-ui .site-footer-v3 {
  background: linear-gradient(180deg, var(--fcg-navy-deep), #030a1a);
}
body.fcg-ui .footer-logo {
  font-family: var(--fcg-font-display);
}
body.fcg-ui .btn-newsletter {
  background: var(--fcg-blue-bright) !important;
  border-radius: 8px;
}
body.fcg-ui .footer-payment-icons { display: flex; gap: 0.55rem; }
body.fcg-ui .footer-payment-icons img {
  background: #fff;
  border-radius: 7px;
  padding: 5px 8px;
  object-fit: contain;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.22);
}
body.fcg-ui .footer-pay-note {
  display: flex;
  align-items: flex-start;
  gap: 0.45rem;
  margin: 0.7rem 0 0;
  font-size: 0.78rem;
  line-height: 1.5;
  color: rgba(214, 228, 255, 0.75);
}
body.fcg-ui .footer-pay-note i { color: var(--fcg-teal, #12b58a); }
body.fcg-ui .footer-tel a {
  color: #fff;
  font-family: var(--fcg-font-display);
  font-weight: 700;
  font-size: 1.05rem;
  text-decoration: none;
}
body.fcg-ui .footer-tel a:hover { text-decoration: underline; }
body.fcg-ui .footer-tel-meta {
  margin: -0.2rem 0 0 1.7rem;
  font-size: 0.75rem;
  color: rgba(214, 228, 255, 0.65);
}
body.fcg-ui .footer-social {
  display: flex;
  gap: 0.6rem;
  margin-top: 1.1rem;
}
body.fcg-ui .footer-social a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.18);
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
  font-size: 1rem;
  transition: background 0.15s ease, border-color 0.15s ease, transform 0.15s ease;
}
body.fcg-ui .footer-social a:hover {
  background: rgba(18, 181, 138, 0.25);
  border-color: var(--fcg-teal, #12b58a);
  transform: translateY(-1px);
}

/* Service LPs */
.lp-duplicata,
.lp-changement-adresse {
  --ink: var(--fcg-ink);
  --navy: var(--fcg-navy);
  /* --blue n'est volontairement PAS redéfini ici.
     L'écraser avec --fcg-blue-bright (#2b8fff) ramenait les libellés de section,
     les puces d'étape et les icônes de FAQ à 2,9–3,2:1, sous le minimum AA.
     Les deux pages définissent déjà --blue: #1a5cff, qui tient 5,2:1 sur blanc
     et 4,7:1 sur le bleu pâle des encadrés. */
  --blue-2: #4f8dff;
  --blue-bg: #e8f3ff;
  --blue-mid: #b3ceff;
  --green: var(--fcg-teal);
  --green-bg: #ecfdf5;
  --surface: var(--fcg-surface);
  --border: var(--fcg-line);
  --muted: var(--fcg-muted);
  --white: var(--fcg-white);
}
.lp-duplicata .lp-ca-hero,
.lp-changement-adresse .lp-ca-hero {
  background:
    radial-gradient(ellipse 70% 55% at 90% 10%, rgba(43, 143, 255, 0.28), transparent 55%),
    linear-gradient(145deg, #040c22 0%, #0a2a58 50%, #0c5360 100%) !important;
}
.lp-duplicata .lp-ca-btn:not(.disabled),
.lp-changement-adresse .lp-ca-btn:not(.disabled),
.lp-duplicata .lp-ca-cta-primary,
.lp-changement-adresse .lp-ca-cta-primary {
  background: linear-gradient(135deg, var(--fcg-teal), var(--fcg-teal-deep)) !important;
  border-radius: 999px !important;
  box-shadow: 0 12px 28px rgba(18, 181, 138, 0.35) !important;
}
.lp-header-minimal {
  background: rgba(255, 255, 255, 0.96) !important;
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--fcg-line) !important;
  position: sticky;
  top: 0;
  z-index: 1000;
}
.lp-header-minimal .lp-header-logo span {
  font-family: var(--fcg-font-display);
  letter-spacing: -0.02em;
}

/* Mobile header Alpine */
body.fcg-ui .header_menu_mobile {
  background: rgba(255, 255, 255, 0.97);
  backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--fcg-line);
}
body.fcg-ui .header_mobile_open_menu_icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: var(--fcg-surface);
  cursor: pointer;
  border: 1px solid var(--fcg-line);
}
body.fcg-ui .header_menu_list {
  background: #fff !important;
}
body.fcg-ui .header_menu_list.fcg-mobile-nav-open {
  display: block !important;
  animation: fcg-rise 0.28s var(--fcg-ease) both;
}
body.fcg-ui .header_menu_list .menuLinkHeader {
  display: flex;
  align-items: center;
  padding: 0.85rem 0.35rem;
  border-bottom: 1px solid var(--fcg-line);
  font-family: var(--fcg-font-display);
  font-weight: 600;
  color: var(--fcg-navy) !important;
}

body.fcg-ui .temoignages-block {
  /* Même rythme vertical que les fcg-section (64 px). */
  padding: 4rem 0;
  background: var(--fcg-surface);
}
body.fcg-ui .temoignages-block .titleOne {
  font-family: var(--fcg-font-display);
  /* Meme corps que les autres titres de section — 30,4 px contre 32 partout
     ailleurs etait la derniere dissonance de la page. */
  font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2rem);
  color: var(--fcg-navy);
  letter-spacing: -0.02em;
}
/* Le style des cartes vit dans fcg-components.css (.fcg-temoin-card) : les
   !important d'ici ne servaient qu'à battre des styles inline, disparus. */
body.fcg-ui .temoignage-card {
  transition: transform 0.25s var(--fcg-ease);
}
body.fcg-ui .temoignage-card:hover {
  transform: translateY(-3px);
}

/* —— Premium home hero v2 (market-informed composition) —— */
.fcg-hero--v2 {
  min-height: min(90vh, 780px);
  padding: 3.75rem 0 4.5rem;
}
.fcg-hero__atmosphere {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  overflow: hidden;
}
.fcg-hero__docplane {
  position: absolute;
  right: -4%;
  bottom: -10%;
  width: min(52vw, 540px);
  height: min(52vw, 540px);
  background: url("../images/cerf-transformed.png") no-repeat center / contain;
  opacity: 0.11;
  filter: saturate(0.85);
  animation: fcg-float 16s ease-in-out infinite;
}
.fcg-hero--v2 .fcg-hero__grid {
  grid-template-columns: minmax(0, 1.05fr) minmax(320px, 460px);
  gap: 2.5rem 3rem;
  align-items: center;
}
.fcg-hero__stage {
  position: relative;
  z-index: 1;
}
.fcg-cert--stage {
  position: absolute;
  right: -8%;
  top: -12%;
  width: min(100%, 280px);
  margin: 0;
  z-index: 0;
  opacity: 0.92;
  transform: rotate(6deg) scale(0.92);
  pointer-events: none;
  animation: fcg-float 11s ease-in-out infinite;
}
.fcg-hero--v2 .fcg-hero__panel {
  position: relative;
  z-index: 1;
}
.fcg-hero__points {
  list-style: none;
  margin: 1.35rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.55rem 1.15rem;
}
.fcg-hero__points li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(236, 244, 255, 0.92);
}
.fcg-hero__points i {
  color: #7dffe0;
}
.fcg-hero--v2 .fcg-hero__brand {
  font-size: clamp(1.9rem, 4.4vw, 2.95rem);
}
.fcg-hero--v2 .fcg-hero__title {
  font-size: clamp(1.15rem, 2vw, 1.4rem);
  font-weight: 600;
  color: rgba(255, 255, 255, 0.96);
  margin: 0 0 0.75rem;
}
.fcg-timeline--3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}
@media (max-width: 900px) {
  .fcg-timeline--3 {
    grid-template-columns: 1fr;
  }
}
.fcg-journey-cta {
  margin: 1.5rem 0 0;
  text-align: center;
}
.fcg-section--tight {
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
}
.fcg-demarche-hub__form {
  max-width: 520px;
  margin: 0 auto;
}
.fcg-demarche-hub__fc {
  margin: 1.5rem 0 0;
  text-align: center;
}
.fcg-demarche-hub__fc a {
  font-weight: 650;
  color: var(--fcg-blue-bright, #0e7490);
}
.fcg-journey-bare {
  margin: 1.25rem 0 1.75rem;
}
.fcg-journey-bare h2 {
  margin: 0 0 0.35rem;
}
.fcg-journey-bare > p {
  margin: 0 0 1rem;
  color: var(--fcg-muted, #5b6b7c);
}
@media (min-width: 901px) {
  .fcg-timeline--line::before {
    content: "";
    position: absolute;
    /* Centre des pastilles : 0.5rem de padding + la moitié de 3.5rem. */
    top: 2.25rem;
    left: 12%;
    right: 12%;
    height: 2px;
    background: repeating-linear-gradient(90deg,
      rgba(18, 181, 138, 0.55) 0 10px, transparent 10px 18px);
    z-index: 0;
  }
  .fcg-timeline--line .fcg-timeline__item {
    z-index: 1;
  }
}
@media (max-width: 900px) {
  .fcg-hero--v2 {
    min-height: auto;
    padding: 2.25rem 0 3rem;
  }
  .fcg-hero--v2 .fcg-hero__grid {
    grid-template-columns: 1fr;
    gap: 1.75rem;
  }
  .fcg-cert--stage {
    display: none;
  }
}

/* Header densification (home) */
body.fcg-ui .header_menu {
  box-shadow: 0 1px 0 rgba(11, 31, 74, 0.05);
}

/* —— Landing FranceConnect-first —— */
.fcg-fc-lp__hero {
  position: relative;
  overflow: hidden;
  padding: 3.25rem 0 2.5rem;
  color: #fff;
  background: linear-gradient(145deg, #040c22 0%, #0a2a58 48%, #0c5360 100%);
}
.fcg-fc-lp__glow {
  position: absolute;
  width: 420px;
  height: 420px;
  right: -80px;
  top: -120px;
  border-radius: 50%;
  background: rgba(43, 143, 255, 0.35);
  filter: blur(70px);
  pointer-events: none;
}
.fcg-fc-lp__brand {
  position: relative;
  font-family: var(--fcg-font-display);
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0 0 0.75rem;
  letter-spacing: -0.02em;
}
.fcg-fc-lp__brand span { color: #8fd0ff; }
.fcg-fc-lp__hero h1 {
  position: relative;
  font-family: var(--fcg-font-display);
  font-size: clamp(1.7rem, 3.2vw, 2.4rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  margin: 0 0 0.65rem;
  max-width: 18ch;
  line-height: 1.15;
}
.fcg-fc-lp__lead {
  position: relative;
  max-width: 38rem;
  margin: 0 0 1.5rem;
  color: rgba(226, 236, 255, 0.9);
  line-height: 1.55;
}
.fcg-fc-steps {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.55rem;
  max-width: 640px;
}
.fcg-fc-steps__item {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.7rem 0.85rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.14);
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(226, 236, 255, 0.75);
}
.fcg-fc-steps__n {
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background: rgba(255, 255, 255, 0.12);
  font-size: 0.8125rem;
  flex-shrink: 0;
}
.fcg-fc-steps__item.is-current {
  background: rgba(18, 181, 138, 0.2);
  border-color: rgba(125, 255, 224, 0.45);
  color: #fff;
}
.fcg-fc-steps__item.is-current .fcg-fc-steps__n,
.fcg-fc-steps__item.is-done .fcg-fc-steps__n {
  background: var(--fcg-teal);
  color: #fff;
}
.fcg-fc-steps__item.is-done {
  color: #b7ebd9;
}
.fcg-fc-lp__body {
  padding-top: 2.25rem;
}
.fcg-fc-lp__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(240px, 320px);
  gap: 1.5rem 2rem;
  align-items: start;
}
.fcg-fc-lp__layout.is-full {
  grid-template-columns: 1fr;
  max-width: 980px;
  margin-inline: auto;
}
@media (max-width: 900px) {
  .fcg-fc-lp__layout { grid-template-columns: 1fr; }
  .fcg-fc-steps { grid-template-columns: 1fr; }
}
.fcg-fc-lp__card {
  background: var(--fcg-white);
  border: 1px solid var(--fcg-line);
  border-radius: calc(var(--fcg-radius) + 4px);
  padding: 1.5rem 1.4rem 1.45rem;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-fc-lp__card--state {
  padding: 0;
  overflow: hidden;
  border-color: #c5d4e8;
  box-shadow: var(--fcg-shadow);
}
.fcg-fc-panel h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.375rem;
  color: var(--fcg-navy);
  margin: 0 0 0.55rem;
}
.fcg-fc-panel__sub {
  margin: 0 0 1.25rem;
  color: var(--fcg-muted);
  line-height: 1.55;
}
.fcg-fc-panel__fc {
  display: grid;
  justify-items: center;
  gap: 0.65rem;
  margin: 1.25rem 0 1rem;
}
.fcg-fc-panel__what {
  color: var(--fcg-blue);
  font-size: 0.875rem;
  font-weight: 600;
}
.fcg-fc-panel__alt {
  margin-top: 1.5rem;
  padding-top: 1.15rem;
  border-top: 1px solid var(--fcg-line);
  display: grid;
  gap: 0.45rem;
  justify-items: start;
}
.fcg-fc-panel__alt span {
  font-size: 0.8125rem;
  color: var(--fcg-muted);
}
.fcg-fc-panel__err {
  margin: 0.75rem 0;
  color: var(--fcg-danger);
  font-size: 0.875rem;
  font-weight: 600;
}
.fcg-fc-panel__busy {
  margin: 0.5rem 0 0;
  color: var(--fcg-muted);
  font-size: 0.875rem;
}
.fcg-fc-panel__ok {
  display: flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0 0 0.85rem;
  padding: 0.65rem 0.8rem;
  border-radius: 10px;
  background: #ecfdf5;
  border: 1px solid #b7ebd9;
  color: var(--fcg-teal-deep);
  font-size: 0.875rem;
}
.fcg-fc-panel__ok i { font-size: 1.125rem; }
.fcg-fc-fields {
  display: grid;
  gap: 0.95rem;
  margin-bottom: 1.15rem;
}
.fcg-fc-preview {
  margin-top: 1rem;
  padding: 0.95rem 1rem;
  border-radius: var(--fcg-radius-sm);
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
}
.fcg-fc-preview h3 {
  margin: 0 0 0.35rem;
  font-family: var(--fcg-font-display);
  font-size: 1rem;
  color: var(--fcg-navy);
}
.fcg-fc-preview__devis { margin: 0.35rem 0 0; color: var(--fcg-teal-deep); }
.fcg-fc-panel__back { margin-top: 1rem; }
.fcg-link-btn {
  background: none;
  border: none;
  color: var(--fcg-blue);
  font-weight: 600;
  cursor: pointer;
  padding: 0;
}
.fcg-fc-panel--center { text-align: center; padding: 1.5rem 0.5rem; }
.fcg-fc-spinner {
  width: 2.5rem;
  height: 2.5rem;
  margin: 0 auto 1rem;
  border-radius: 50%;
  border: 3px solid var(--fcg-line);
  border-top-color: var(--fcg-teal);
  animation: fcg-spin 0.8s linear infinite;
}
@keyframes fcg-spin {
  to { transform: rotate(360deg); }
}
.fcg-fc-aside-list {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.65rem;
}
.fcg-fc-aside-list li {
  font-size: 0.875rem;
  color: var(--fcg-muted);
  line-height: 1.45;
}
.fcg-fc-aside-list strong {
  color: var(--fcg-navy);
}
.fcg-fc-lp .fcConnectDivNew {
  min-height: 56px;
  min-width: 220px;
  cursor: pointer;
}

/* —— Étape 1 : CTA FranceConnect agressif —— */
.fcg-fc-panel--push h2 {
  font-size: clamp(1.35rem, 2.4vw, 1.7rem);
  line-height: 1.25;
  margin-bottom: 0.65rem;
}
.fcg-fc-panel__compulsory {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 0.85rem;
  padding: 0.4rem 0.75rem;
  border-radius: 999px;
  background: #fff7ed;
  border: 1px solid #fdba74;
  color: #c2410c;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.01em;
}
.fcg-fc-panel__compulsory i { font-size: 0.9375rem; }
.fcg-fc-push-benefits {
  margin: 0 0 1.35rem;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 0.55rem;
}
.fcg-fc-push-benefits li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--fcg-navy);
  line-height: 1.4;
}
.fcg-fc-push-benefits i {
  color: var(--fcg-teal);
  font-size: 1.125rem;
  margin-top: 0.1rem;
  flex-shrink: 0;
}
.fcg-fc-push-benefits--inline {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.5rem 0.75rem;
  margin-bottom: 1.15rem;
}
.fcg-fc-push-benefits--inline li {
  font-size: 0.875rem;
  align-items: center;
}
@media (max-width: 700px) {
  .fcg-fc-push-benefits--inline { grid-template-columns: 1fr; }
}
.fcg-fc-push {
  position: relative;
  display: grid;
  justify-items: center;
  gap: 0.55rem;
  margin: 0.25rem 0 0.5rem;
  padding: 1.5rem 1.15rem 1.25rem;
  border-radius: calc(var(--fcg-radius) + 6px);
  background: linear-gradient(180deg, #eef6ff 0%, #f8fbff 55%, #fff 100%);
  border: 2px solid var(--fcg-blue, #1a6fd4);
  box-shadow: 0 0 0 4px rgba(32, 146, 253, 0.12), 0 14px 36px rgba(15, 45, 95, 0.12);
  overflow: hidden;
  text-align: center;
}
.fcg-fc-push__glow {
  position: absolute;
  inset: -40% -20% auto;
  height: 70%;
  background: radial-gradient(ellipse at center, rgba(32, 146, 253, 0.28), transparent 65%);
  pointer-events: none;
  animation: fcg-fc-pulse 2.4s ease-in-out infinite;
}
@keyframes fcg-fc-pulse {
  0%, 100% { opacity: 0.55; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.06); }
}
.fcg-fc-push__label {
  position: relative;
  margin: 0;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--fcg-navy);
}
.fcg-fc-push__btn {
  position: relative;
  transform: scale(1.18);
  transform-origin: center;
  margin: 0.55rem 0 0.35rem;
  filter: drop-shadow(0 8px 18px rgba(15, 70, 160, 0.35));
  transition: transform 0.2s var(--fcg-ease), filter 0.2s ease;
}
.fcg-fc-push__btn:hover,
.fcg-fc-push__btn:focus-visible {
  transform: scale(1.24);
  filter: drop-shadow(0 10px 22px rgba(15, 70, 160, 0.45));
  outline: none;
}
.fcg-fc-push__hint {
  position: relative;
  margin: 0.15rem 0 0.25rem;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--fcg-teal-deep);
  letter-spacing: 0.01em;
}
.fcg-fc-panel--push .fcg-fc-panel__what,
.fcg-fc-panel--state .fcg-fc-panel__what {
  position: relative;
  font-size: 0.875rem;
}
.fcg-fc-panel__manual {
  margin: 1.35rem 0 0;
  padding-top: 1.1rem;
  border-top: 1px dashed var(--fcg-line);
  text-align: center;
  font-size: 0.9375rem;
  color: var(--fcg-muted);
  line-height: 1.5;
}
.fcg-fc-panel__manual .fcg-link-btn {
  display: inline;
  margin-left: 0.2rem;
  font-size: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.fcg-fc-panel__manual .fcg-link-btn:hover {
  color: var(--fcg-navy);
}
@media (max-width: 600px) {
  .fcg-fc-push__btn { transform: scale(1.08); }
  .fcg-fc-push__btn:hover,
  .fcg-fc-push__btn:focus-visible { transform: scale(1.12); }
}

/* —— Bloc style État (plein) —— */
.fcg-fc-rf {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  height: 6px;
}
.fcg-fc-rf__b { background: #002395; }
.fcg-fc-rf__w { background: #fff; }
.fcg-fc-rf__r { background: #ed2939; }
.fcg-fc-state {
  display: grid;
  grid-template-columns: minmax(200px, 280px) minmax(0, 1fr);
  gap: 0;
  min-height: 420px;
}
.fcg-fc-state__visual {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1.5rem;
  padding: 2rem 1.25rem;
  background:
    linear-gradient(165deg, #071833 0%, #0c3a72 55%, #0a5a6e 100%);
  color: #fff;
  position: relative;
  overflow: hidden;
}
.fcg-fc-state__visual::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 30% 20%, rgba(255,255,255,0.12), transparent 45%),
    repeating-linear-gradient(
      -18deg,
      transparent,
      transparent 14px,
      rgba(255,255,255,0.03) 14px,
      rgba(255,255,255,0.03) 15px
    );
  pointer-events: none;
}
.fcg-fc-state__pictos {
  position: relative;
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
  width: 100%;
  max-width: 12rem;
}
.fcg-fc-state__pictos li {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  padding: 0.55rem 0.7rem;
  border-radius: 10px;
  background: rgba(255,255,255,0.1);
  border: 1px solid rgba(255,255,255,0.18);
  font-size: 0.875rem;
  font-weight: 700;
}
.fcg-fc-state__pictos i {
  font-size: 1.0625rem;
  color: #9ad4ff;
}
.fcg-fc-state__main {
  padding: 1.75rem 1.6rem 1.5rem;
  background:
    linear-gradient(180deg, #f5f8fc 0%, #fff 28%);
}
.fcg-fc-state__kicker {
  display: inline-block;
  margin: 0 0 0.65rem;
  padding: 0.28rem 0.65rem;
  border-radius: 4px;
  background: #002395;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
.fcg-fc-panel--state h2 {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.45rem, 2.6vw, 1.9rem);
  color: var(--fcg-navy);
  margin: 0 0 0.55rem;
  line-height: 1.2;
  max-width: 18ch;
}
.fcg-fc-panel--state .fcg-fc-panel__sub {
  max-width: 36rem;
}
.fcg-fc-push--state {
  background: linear-gradient(180deg, #e8f1ff 0%, #fff 70%);
  border-color: #002395;
  box-shadow: 0 0 0 4px rgba(0, 35, 149, 0.1), 0 16px 40px rgba(7, 24, 51, 0.14);
}
.fcg-fc-panel--state .fcg-fc-panel__manual {
  margin-top: 1.15rem;
  border-top-color: #d5deea;
}
@media (max-width: 800px) {
  .fcg-fc-state {
    grid-template-columns: 1fr;
    min-height: 0;
  }
  .fcg-fc-state__visual {
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem 1.5rem;
    padding: 1.35rem 1rem;
  }
  .fcg-fc-state__pictos {
    grid-template-columns: repeat(3, auto);
    max-width: none;
    width: auto;
  }
  .fcg-fc-state__pictos li {
    flex-direction: column;
    text-align: center;
    padding: 0.45rem 0.55rem;
    font-size: 0.75rem;
    gap: 0.25rem;
  }
  .fcg-fc-state__main { padding: 1.35rem 1.15rem 1.25rem; }
  .fcg-fc-panel--state h2 { max-width: none; }
}

/* —— Risques (sous le bloc FC) —— */
.fcg-fc-risks {
  /* La section parente apporte deja 64px de padding : la marge haute de
     2.25rem creusait un trou de ~176px avant le bloc. */
  margin: 0.5rem 0 0.5rem;
  padding: 1.75rem 1.5rem 1.6rem;
  border-radius: calc(var(--fcg-radius) + 4px);
  background: #fff;
  border: 1px solid var(--fcg-line);
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-fc-risks__head {
  max-width: 40rem;
  margin-bottom: 1.35rem;
}
.fcg-fc-risks__kicker {
  margin: 0 0 0.4rem;
  color: #b45309;
  font-size: 0.75rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.fcg-fc-risks__head h2 {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.25rem, 2.2vw, 1.55rem);
  color: var(--fcg-navy);
  margin: 0 0 0.5rem;
  line-height: 1.25;
}
.fcg-fc-risks__head p {
  margin: 0;
  color: var(--fcg-muted);
  line-height: 1.55;
  font-size: 0.9375rem;
}
.fcg-fc-risks__grid {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
}
.fcg-fc-risk {
  padding: 1.05rem 0.95rem 1rem;
  border-radius: var(--fcg-radius-sm);
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  border: 1px solid #e2e8f0;
}
.fcg-fc-risk__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  margin-bottom: 0.65rem;
  border-radius: 10px;
  background: #fff1f2;
  color: #be123c;
  font-size: 1.125rem;
}
.fcg-fc-risk h3 {
  margin: 0 0 0.4rem;
  font-family: var(--fcg-font-display);
  font-size: 1rem;
  color: var(--fcg-navy);
}
.fcg-fc-risk p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  line-height: 1.5;
}
.fcg-fc-risks__cta {
  margin: 1.25rem 0 0;
  padding-top: 1rem;
  border-top: 1px solid var(--fcg-line);
  text-align: center;
  font-size: 0.9375rem;
  color: var(--fcg-muted);
}
.fcg-fc-risks__cta .fcg-link-btn {
  margin-left: 0.35rem;
  text-decoration: underline;
}
@media (max-width: 960px) {
  .fcg-fc-risks__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .fcg-fc-risks { padding: 1.35rem 1rem 1.2rem; }
  .fcg-fc-risks__grid { grid-template-columns: 1fr; }
}

/* —— Brand / header wordmark —— */
.fcg-brand {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  color: var(--fcg-navy);
}
.fcg-brand__name {
  font-family: var(--fcg-font-display);
  font-weight: 800;
  font-size: 1rem;
  letter-spacing: -0.03em;
  line-height: 1.15;
  color: var(--fcg-navy);
}
.fcg-brand__name span { color: var(--fcg-blue); }
body.fcg-ui .header_notice {
  font-size: 0.75rem;
  letter-spacing: 0.01em;
}
body.fcg-ui .header_notice .notice_text {
  font-weight: 500;
}
body.fcg-ui .header_logo_link .logo_site {
  width: 48px;
  height: 48px;
}

/* —— Start form —— */
.fcg-start {
  display: grid;
  gap: 0.85rem;
}
.fcg-hero__alt,
.fcg-lp-hero__alt {
  margin: 0.85rem 0 0;
  text-align: center;
  font-size: 0.875rem;
}
.fcg-hero__alt a,
.fcg-lp-hero__alt a {
  color: var(--fcg-blue);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

/* —— Landing flow chips —— */
.fcg-lp-flow {
  list-style: none;
  margin: 1rem 0 1.15rem;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}
.fcg-lp-flow li {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.35rem 0.7rem;
  border-radius: 999px;
  background: rgba(255,255,255,0.12);
  border: 1px solid rgba(255,255,255,0.2);
  font-size: 0.8125rem;
  font-weight: 600;
  color: #e8f1ff;
}
.fcg-lp-flow span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background: var(--fcg-teal);
  color: #fff;
  font-size: 0.75rem;
}
.fcg-lp-hero__cta-card .fcg-field__label { color: var(--fcg-navy); }
.fcg-lp-hero__cta-card .fcg-field__hint { color: var(--fcg-muted); }
.fcg-lp-aside__label {
  margin: 1rem 0 .35rem;
  font-size: .75rem;
  font-weight: 700;
  color: var(--fcg-muted);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.fcg-lp-how { padding-top: 2.25rem; padding-bottom: 0.5rem; }

/* —— Home FranceConnect band —— */
.fcg-fc-home {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(220px, 0.8fr);
  gap: 1.5rem 2rem;
  align-items: center;
}
.fcg-fc-home__points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.65rem;
}
.fcg-fc-home__points li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 600;
  color: var(--fcg-navy);
}
.fcg-fc-home__points i { color: var(--fcg-teal); font-size: 1.125rem; }
@media (max-width: 800px) {
  .fcg-fc-home { grid-template-columns: 1fr; }
}

/* —— Content pages —— */
.fcg-page__hero {
  padding: 2.4rem 0 1.75rem;
  background: linear-gradient(145deg, #040c22 0%, #0a2a58 55%, #0c5360 100%);
  color: #fff;
}
.fcg-page__hero h1 {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.55rem, 3vw, 2.15rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  margin: 0 0 0.5rem;
  max-width: 22ch;
}
.fcg-page__hero p {
  margin: 0;
  max-width: 38rem;
  color: rgba(226, 236, 255, 0.9);
  line-height: 1.55;
}
.fcg-page__hero .fcg-kicker { color: #7dffe0; }
.fcg-page__hero .fcg-kicker a { color: inherit; }
.fcg-page__layout {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(240px, 300px);
  gap: 1.75rem 2rem;
  padding: 2rem 0 3rem;
  align-items: start;
}
@media (max-width: 900px) {
  /* `1fr` seul vaut `minmax(auto, 1fr)` : la colonne ne descend jamais sous la
     largeur mini de son contenu. Le tableau des pièces, large par nature,
     poussait donc la colonne a 538 px dans un écran de 375 — toute la page
     partait en défilement horizontal, alors que le tableau savait déjà
     défiler tout seul. `minmax(0, …)` autorise la colonne a rétrécir. */
  .fcg-page__layout { grid-template-columns: minmax(0, 1fr); }
}
/* Même raison, pour l'élément lui-même : un enfant large ne doit pas dicter
   la largeur de la colonne. */
.fcg-page__main { min-width: 0; }
.fcg-page__h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.25rem;
  color: var(--fcg-navy);
  margin: 1.75rem 0 0.85rem;
}
.fcg-page__aside .fcg-lp-card p {
  margin: 0 0 0.85rem;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  line-height: 1.5;
}
.fcg-doclist--page { margin: 0; }
.fcg-blog-list { display: grid; gap: 1.15rem; }
/* —— Index du blog : une à la une + grille magazine —— */
.fcg-blogx-une {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  gap: 0;
  margin: 0 0 1.75rem;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--fcg-shadow-sm);
  transition: transform 0.25s var(--fcg-ease), box-shadow 0.25s var(--fcg-ease);
}
.fcg-blogx-une:hover {
  transform: translateY(-3px);
  box-shadow: var(--fcg-shadow);
}
.fcg-blogx-une__media {
  position: relative;
  display: block;
  min-height: 260px;
  background-size: cover;
  background-position: center;
}
.fcg-blogx-badge {
  position: absolute;
  top: 0.9rem;
  left: 0.9rem;
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--fcg-teal) 0%, var(--fcg-teal-deep) 100%);
  color: #fff;
  font-family: var(--fcg-font-display);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
}
.fcg-blogx-une__body {
  padding: 1.75rem 1.9rem;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.65rem;
}
.fcg-blogx-une__body h2 {
  margin: 0;
  font-family: var(--fcg-font-display);
  font-size: 1.5rem;
  line-height: 1.3;
  letter-spacing: -0.015em;
}
.fcg-blogx-une__body h2 a {
  color: var(--fcg-navy);
  text-decoration: none;
}
.fcg-blogx-une__body h2 a:hover {
  color: var(--fcg-blue);
}
.fcg-blogx-une__excerpt {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--fcg-muted);
}
.fcg-blogx-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0;
  font-size: 0.8125rem;
  color: var(--fcg-muted);
}
.fcg-blogx-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.22rem 0.65rem;
  border-radius: 999px;
  background: var(--fcg-surface);
  border: 1px solid var(--fcg-line);
  color: var(--fcg-navy);
  font-weight: 600;
  font-size: 0.75rem;
}
.fcg-blogx-chip i {
  color: var(--fcg-teal-deep);
}
.fcg-blogx-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
}
.fcg-blogx-card {
  display: flex;
  flex-direction: column;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--fcg-shadow-sm);
  transition: transform 0.25s var(--fcg-ease), box-shadow 0.25s var(--fcg-ease);
}
.fcg-blogx-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--fcg-shadow);
}
.fcg-blogx-card__media {
  display: block;
  aspect-ratio: 16 / 9;
  background-size: cover;
  background-position: center;
}
.fcg-blogx-card__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
  padding: 1.1rem 1.2rem 1.2rem;
  flex: 1;
}
.fcg-blogx-card__body h2 {
  margin: 0;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  line-height: 1.35;
}
.fcg-blogx-card__body h2 a {
  color: var(--fcg-navy);
  text-decoration: none;
}
.fcg-blogx-card__body h2 a:hover {
  color: var(--fcg-blue);
}
.fcg-blogx-card__excerpt {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--fcg-muted);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fcg-blogx-card__go {
  margin-top: auto;
  padding-top: 0.35rem;
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: var(--fcg-blue);
  font-weight: 700;
  font-size: 0.875rem;
}
@media (max-width: 860px) {
  .fcg-blogx-une {
    grid-template-columns: 1fr;
  }
  .fcg-blogx-une__media {
    min-height: 190px;
  }
  .fcg-blogx-une__body {
    padding: 1.25rem 1.2rem 1.35rem;
  }
  .fcg-blogx-grid {
    grid-template-columns: 1fr;
  }
}

.fcg-blog-row {
  display: grid;
  grid-template-columns: 140px minmax(0, 1fr);
  gap: 1rem 1.15rem;
  padding: 1rem;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  background: #fff;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-blog-row__media {
  display: block;
  min-height: 96px;
  border-radius: 10px;
  background: #dbe7f5 center/cover no-repeat;
}
.fcg-blog-row h2 {
  margin: 0 0 0.35rem;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
}
.fcg-blog-row h2 a { color: var(--fcg-navy); text-decoration: none; }
.fcg-blog-row h2 a:hover { color: var(--fcg-blue); }
.fcg-blog-row p { margin: 0 0 0.55rem; color: var(--fcg-muted); font-size: 0.9375rem; line-height: 1.5; }
.fcg-blog-row__date {
  margin: 0 0 0.25rem;
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--fcg-muted);
  letter-spacing: 0.04em;
  text-transform: uppercase;
}
@media (max-width: 640px) {
  .fcg-blog-row { grid-template-columns: 1fr; }
  .fcg-blog-row__media { min-height: 140px; }
}
.fcg-prose .content-blog {
  font-size: 1rem;
  line-height: 1.7;
  color: var(--fcg-ink);
}
.fcg-prose .content-blog h2,
.fcg-prose .content-blog h3 {
  font-family: var(--fcg-font-display);
  color: var(--fcg-navy);
  margin: 1.5rem 0 0.6rem;
}

/* —— Centre d'aide —— */
.fcg-aide-search {
  position: relative;
  max-width: 28rem;
  margin-top: 1.15rem;
}
.fcg-aide-search input {
  width: 100%;
  min-height: 3rem;
  padding: 0.7rem 2.6rem 0.7rem 1rem;
  border: 0;
  border-radius: 999px;
  font-size: 1rem;
}
.fcg-aide-search i {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  color: var(--fcg-blue);
}
.fcg-aide-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.85rem;
  margin: 1.75rem 0 1.25rem;
}
.fcg-aide-card {
  display: grid;
  gap: 0.55rem;
  justify-items: start;
  text-align: left;
  padding: 1.1rem 1rem;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  background: #fff;
  box-shadow: var(--fcg-shadow-sm);
  cursor: pointer;
  font: inherit;
  color: inherit;
}
.fcg-aide-card:hover {
  border-color: var(--fcg-blue);
  transform: translateY(-2px);
}
.fcg-aide-card.is-active {
  border-color: var(--fcg-teal-deep);
  box-shadow: 0 0 0 2px rgba(13, 148, 136, 0.28);
}
.fcg-aide-steps {
  margin: 0 0 1rem;
  padding-left: 1.2rem;
}
.fcg-aide-steps li {
  margin: 0 0 0.45rem;
}
.fcg-aide-card i { font-size: 1.5rem; color: var(--fcg-teal); }
.fcg-aide-card h2 {
  margin: 0;
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  color: var(--fcg-navy);
}
.fcg-aide-q { margin-bottom: 1.5rem; }
.fcg-contact-form {
  margin-top: 1.5rem;
  padding: 1.25rem;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  background: #fff;
}
@media (max-width: 900px) {
  .fcg-aide-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .fcg-aide-grid { grid-template-columns: 1fr; }
}

/* —— Footer alignment with design system —— */
body.fcg-ui .site-footer-v3 {
  background: linear-gradient(180deg, var(--fcg-navy-deep), var(--fcg-navy));
}
body.fcg-ui .footer-logo span { color: #8fd0ff; }
body.fcg-ui .footer-heading::after { background: var(--fcg-teal); }
body.fcg-ui .btn-newsletter {
  /* --fcg-teal donnait 2,62:1 avec le libellé blanc « OK » : sous le minimum AA.
     La variante foncée conserve la teinte et passe le seuil. */
  background: var(--fcg-teal-deep) !important;
}

/* —— Funnel chrome —— */
.fcg-funnel-progress {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.45rem;
  max-width: 720px;
  margin: 0.85rem auto 1.25rem;
  padding: 0 1rem;
}
.fcg-funnel-progress__step {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  text-align: center;
  padding: 0.55rem 0.45rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 700;
  background: #eef3f9;
  color: var(--fcg-muted);
}
.fcg-funnel-progress__n {
  display: inline-flex;
  width: 1.35rem;
  height: 1.35rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #d9e6f3;
  color: var(--fcg-navy);
  font-size: 0.75rem;
}
.fcg-funnel-progress__step.is-current {
  background: var(--fcg-navy);
  color: #fff;
}
.fcg-funnel-progress__step.is-current .fcg-funnel-progress__n {
  background: rgba(255,255,255,.2);
  color: #fff;
}
.fcg-funnel-progress__step.is-done {
  background: #dcfce7;
  color: var(--fcg-teal-deep);
}
.fcg-funnel-progress__step.is-done .fcg-funnel-progress__n {
  background: #bbf7d0;
  color: var(--fcg-teal-deep);
}

/* —— Quality pass v3 —— */
.header_menu_list .fcg-phone-cta {
  margin: 0.9rem auto 0.2rem;
}
.fcg-hero__h1 {
  font-family: var(--fcg-font-display);
  font-size: clamp(2.05rem, 4.6vw, 3.35rem);
  font-weight: 800;
  letter-spacing: -0.045em;
  line-height: 1.08;
  margin: 0 0 1rem;
  max-width: 16ch;
  color: #fff;
  text-shadow: 0 16px 40px rgba(0, 0, 0, 0.28);
}
.fcg-hero--v2 {
  min-height: min(86vh, 720px);
  padding: 3.25rem 0 5.25rem;
}
.fcg-hero--v2 .fcg-hero__grid {
  grid-template-columns: minmax(0, 1.08fr) minmax(340px, 420px);
  align-items: center;
}
/* Cette règle vit APRÈS le point de coupure mobile du fichier : sans ce
   rappel, elle gagnait par ordre et imposait deux colonnes sur téléphone —
   la colonne texte (le H1 du site !) tombait à 0 px et le panneau partait
   hors écran. */
@media (max-width: 900px) {
  .fcg-hero--v2 .fcg-hero__grid {
    grid-template-columns: 1fr;
  }
}
.fcg-hero--v2 .fcg-hero__panel {
  padding: 1.5rem 1.45rem 1.35rem;
  border-radius: 22px;
  box-shadow:
    0 0 0 1px rgba(255,255,255,0.4),
    0 28px 70px rgba(2, 10, 30, 0.38);
}
.fcg-hero__panel-head p {
  margin: 0.25rem 0 0;
  color: var(--fcg-muted);
  font-size: 0.875rem;
}
.fcg-ribbon {
  margin-top: -2.25rem;
  position: relative;
  z-index: 2;
}
.fcg-ribbon__track {
  background: #fff;
  border-radius: 18px;
  box-shadow: 0 18px 50px rgba(5, 15, 40, 0.12);
  border: 1px solid rgba(220, 229, 240, 0.9);
  padding: 0.35rem 0.5rem;
}
.fcg-timeline__n {
  display: inline-grid;
  place-items: center;
  width: 2.35rem;
  height: 2.35rem;
  margin-bottom: 0.75rem;
  border-radius: 50%;
  background: linear-gradient(145deg, #e8f3ff, #dff7f1);
  color: var(--fcg-navy);
  font-size: 0.8125rem;
  letter-spacing: 0;
}
/* Pas de nombre de colonnes ici : la frise existe en 3 ET en 4 etapes.
   Le compte vient de la base (.fcg-timeline, 4) ou de .fcg-timeline--3. */
.fcg-timeline--line {
  position: relative;
  gap: 2rem;
  max-width: 1080px;
  margin-inline: auto;
}
@media (max-width: 900px) {
  .fcg-timeline--line {
    gap: 1.5rem;
  }
}
.fcg-timeline--line .fcg-timeline__item {
  background: transparent;
  border: 0;
  box-shadow: none;
  text-align: center;
  padding: 0.5rem 0.75rem 0;
}
.fcg-timeline--line .fcg-timeline__item h3,
.fcg-timeline--line .fcg-timeline__item p {
  text-align: center;
}
/* Badge d'étape : une pastille généreuse avec l'icône du geste, le numéro en
   médaillon teal par-dessus. La ligne de continuité passe derrière les
   pastilles — le regard suit 01 → 02 → 03 sans effort. */
.fcg-timeline--line .fcg-timeline__badge {
  position: relative;
  display: inline-grid;
  place-items: center;
  width: 3.5rem;
  height: 3.5rem;
  margin-bottom: 0.9rem;
  border-radius: 50%;
  background: linear-gradient(145deg, #e8f3ff, #dff7f1);
  border: 3px solid #fff;
  box-shadow: 0 6px 18px rgba(5, 15, 40, 0.12);
  color: var(--fcg-navy);
  font-size: 1.35rem;
}
.fcg-timeline--line .fcg-timeline__badge .fcg-timeline__n {
  position: absolute;
  top: -0.35rem;
  right: -0.55rem;
  display: inline-grid;
  place-items: center;
  width: 1.5rem;
  height: 1.5rem;
  margin: 0;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--fcg-teal) 0%, var(--fcg-teal-deep) 100%);
  border: 2px solid #fff;
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0;
}
.fcg-fc-band .fcg-fc-home__points li {
  color: #fff;
  background: rgba(255,255,255,0.08);
  border: 1px solid rgba(255,255,255,0.16);
  border-radius: 12px;
  padding: 0.7rem 0.85rem;
}
.fcg-fc-band .fcg-fc-home__points i { color: #7dffe0; }
.fcg-section--surface .fcg-fc-risks {
  box-shadow: none;
  border: 0;
  background: transparent;
  padding: 0;
}
body.fcg-ui.home .header_notice { font-size: 0.75rem; }
body.fcg-ui.home .header_section_one {
  min-height: 4rem;
  padding: 0.45rem 1rem;
}
@media (max-width: 1180px) {
  body.fcg-ui .fcg-nav .menuLinkHeader {
    padding: 0.35rem 0.5rem !important;
    font-size: 0.875rem;
  }
  body.fcg-ui .header_actions {
    gap: 0.55rem;
  }
  body.fcg-ui .header_actions__fc .fcConnectDivNew {
    transform: none;
    margin: 0;
  }
}
/* Petit écran : mêmes cotes et même seuil que la production (< 960 px,
   136 × 37, image entière redimensionnée) — jamais de transform qui
   écrase la marque FranceConnect. */
@media (max-width: 960px) {
  body.fcg-ui .header_actions__fc .fcConnectDivNew {
    width: 136px;
    height: 37px;
    background-size: cover;
  }
}
.fcg-lp-hero h1 {
  font-size: clamp(2rem, 3.6vw, 2.85rem);
  max-width: 16ch;
}
.fcg-lp-hero__cta-card {
  padding: 1.45rem 1.35rem 1.3rem;
  border-radius: 22px;
}
@media (max-width: 900px) {
  .fcg-hero__h1 { max-width: none; }
  .fcg-timeline--line .fcg-timeline__item,
  .fcg-timeline--line .fcg-timeline__item h3,
  .fcg-timeline--line .fcg-timeline__item p { text-align: left; }
}

/* —— Authority band (pills + brand + seal) —— */
.fcg-authority__slogan {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.2rem, 2.4vw, 1.65rem);
  font-weight: 700;
  letter-spacing: -0.03em;
  line-height: 1.25;
  color: #fff;
  margin: 0 0 0.85rem;
}
.fcg-authority--compact {
  margin-bottom: 0.85rem;
}
.fcg-authority--compact .fcg-hero__badges {
  margin-bottom: 0.65rem;
}
.fcg-authority--compact .fcg-hero__brand {
  font-size: clamp(1.2rem, 2.1vw, 1.5rem);
  text-shadow: none;
}
.fcg-authority--compact .fcg-hero__brand-row {
  margin-bottom: 0.15rem;
  gap: 0.75rem;
}
.fcg-authority--offer .fcg-hero__brand {
  font-size: clamp(1.15rem, 2.1vw, 1.45rem);
  text-shadow: none;
}
.fcg-authority--offer .fcg-hero__brand-row {
  margin-bottom: 0.35rem;
  gap: 0.7rem;
}
.fcg-authority--offer .fcg-hero__h1 {
  max-width: 14ch;
  margin: 0 0 0.85rem;
}
.lp-ca-hero-text .fcg-authority .fcg-hero__brand,
.fcg-lp-hero__copy .fcg-authority .fcg-hero__brand,
.fcg-fc-lp__hero .fcg-authority .fcg-hero__brand {
  color: #fff;
}
.lp-ca-hero-text .fcg-hero__brand span,
.fcg-lp-hero__copy .fcg-hero__brand span,
.fcg-fc-lp__hero .fcg-hero__brand span {
  color: #8fd0ff;
}
.lp-ca-hero-text h1 span {
  background: none !important;
  -webkit-text-fill-color: #8fd0ff !important;
  color: #8fd0ff !important;
  animation: none !important;
}
.lp-ca-fc-alt {
  margin: 0.75rem 0 0;
  text-align: center;
  font-size: 0.875rem;
}
.lp-ca-fc-alt a {
  color: var(--fcg-blue);
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.lp-ca-urgency-wrap {
  background: #fffbeb;
  border-top: 1px solid #fde68a;
  border-bottom: 1px solid #fde68a;
  padding: 0 20px;
}
.lp-ca-urgency-wrap .lp-ca-urgency-icon { display: none; }
.lp-duplicata .fcg-ribbon,
.lp-changement-adresse .fcg-ribbon {
  margin-top: -1.75rem;
  padding: 0 20px 0.5rem;
}
.lp-duplicata .fcg-ribbon .fcg-container,
.lp-changement-adresse .fcg-ribbon .fcg-container {
  max-width: 1120px;
}
.fcg-pref .fcg-ribbon { margin-top: -1.75rem; }
.fcg-pref .dep-breadcrumb { margin: 0 0 1.25rem; }
.fcg-fc-lp__hero .fcg-authority { position: relative; z-index: 1; }
.fcg-fc-lp__hero .fcg-authority + h1 { margin-top: 0.35rem; }

/* Funnel: keep the modern pills, hide the old bar */
body.fcg-ui .fcg-funnel-progress + .progessBarMain {
  display: none !important;
}
body.fcg-ui .titleOne {
  font-family: var(--fcg-font-display);
  letter-spacing: -0.03em;
  color: var(--fcg-navy);
}
body.fcg-ui .breadcrumbs {
  max-width: var(--fcg-max, 1120px);
  margin: 1rem auto 0;
  padding: 0 1rem;
  font-size: 0.875rem;
  color: var(--fcg-muted);
  /* Un fil d'Ariane long ne se coupe pas hors écran : il passe à la ligne. */
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.15rem 0.4rem;
}

/* —— City / préfecture landing (mairie-style) —— */
.fcg-city-hero {
  background: #eef5fb;
  color: var(--fcg-navy);
  padding: 2.2rem 0 2rem;
}
.fcg-city-hero__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.02fr) minmax(300px, 0.98fr);
  gap: 1.6rem 2.25rem;
  align-items: stretch;
}
.fcg-city-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0 0 0.85rem;
  padding: 0.28rem 0.8rem;
  border-radius: 999px;
  background: #fff;
  border: 1px solid #d5e4f2;
  color: var(--fcg-blue);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.fcg-city-badge i { font-size: 0.9375rem; }
.fcg-city-hero h1 {
  font-family: var(--fcg-font-display);
  font-size: clamp(1.9rem, 3.5vw, 2.65rem);
  font-weight: 800;
  letter-spacing: -0.04em;
  line-height: 1.1;
  max-width: 16ch;
  margin: 0 0 0.65rem;
  color: var(--fcg-navy);
}
.fcg-city-hero__lead {
  margin: 0 0 1.1rem !important;
  max-width: 44ch;
  font-size: 1rem !important;
  line-height: 1.5;
  color: #4b6078 !important;
}
.fcg-city-panel {
  background: #0b1f4a;
  border-radius: 18px;
  padding: 1.15rem 1.1rem 1.2rem;
  box-shadow: 0 18px 40px rgba(11, 31, 74, 0.28);
}
.fcg-start--city {
  gap: 0.7rem;
}
.fcg-start--city .fcg-plate {
  border-radius: 8px;
  overflow: hidden;
}
.fcg-city-select {
  position: relative;
  display: block;
}
.fcg-city-select > i {
  position: absolute;
  left: 0.85rem;
  top: 50%;
  transform: translateY(-50%);
  color: #64748b;
  pointer-events: none;
  z-index: 1;
}
.fcg-start--city .fcg-select,
.fcg-city-panel .fcg-select {
  background-color: #fff !important;
  color: var(--fcg-navy) !important;
  border-color: transparent !important;
  min-height: 3rem;
  padding: 0.55rem 2.4rem 0.55rem 2.35rem;
  border-radius: 10px;
}
.fcg-start--city .error_message {
  color: #fecaca;
}
.fcg-city-panel .fcg-btn--primary {
  border-radius: 12px;
  min-height: 3.05rem;
  font-size: 1rem;
}
.fcg-city-panel .fcg-hero__cta {
  margin-top: 0.15rem;
}
/* Le panneau de saisie des pages département/ville est sur fond bleu nuit.
   Les textes d'aide héritaient de --fcg-muted (gris foncé) : 2,65:1 sur ce fond,
   soit une indication de format quasi illisible, sur ~140 pages d'atterrissage.
   Le !important est nécessaire : la règle de base en pose un elle aussi. */
.fcg-city-panel .fcg-field__hint,
.fcg-city-panel .indication_plaque_format {
  color: #a8b6c8 !important;
}
.fcg-city-panel .fcg-field__label:not(.fcg-sr-only) {
  color: #d8e1ec;
}
.fcg-city-trust {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem 1.2rem;
  margin: 1rem 0 0;
  padding: 0;
}
.fcg-city-trust li {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #3d5470;
}
.fcg-city-trust i { color: var(--fcg-blue); font-size: 1.0625rem; }
.fcg-city-photo {
  position: relative;
  min-height: 29rem;
  height: 100%;
  border-radius: 22px;
  overflow: hidden;
  background:
    linear-gradient(180deg, #9eb9d4 0%, #c5b89a 100%);
  box-shadow: 0 16px 40px rgba(11, 31, 74, 0.16);
}
.fcg-city-photo__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  display: block;
}
.fcg-city-photo::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(11, 31, 74, 0.04) 28%, rgba(11, 31, 74, 0.38) 100%);
  pointer-events: none;
}
/* Bulles compactes en bas a droite de la photo : des vignettes discretes,
   pas deux panneaux qui recouvrent la moitie de l'image. */
.fcg-city-photo__cards {
  position: absolute;
  left: auto;
  right: 0.75rem;
  bottom: 0.75rem;
  z-index: 1;
  display: grid;
  gap: 0.5rem;
  width: min(240px, 60%);
}
.fcg-city-place {
  background: rgba(255, 255, 255, 0.96);
  border-radius: var(--fcg-radius-sm, 11px);
  padding: 0.55rem 0.7rem 0.6rem;
  box-shadow: 0 8px 20px rgba(11, 31, 74, 0.16);
}
.fcg-city-place h2 {
  font-family: var(--fcg-font-display);
  font-size: 0.8125rem;
  margin: 0 0 0.2rem;
  color: var(--fcg-navy);
}
.fcg-city-place p {
  margin: 0;
  font-size: 0.6875rem;
  line-height: 1.35;
  color: #5b6b80;
}
.fcg-city-place__warn {
  margin-top: 0.35rem !important;
  padding: 0.3rem 0.45rem;
  border-radius: 7px;
  background: #fff8e1;
  border: 1px solid #fde68a;
  color: #7a5b00 !important;
  font-weight: 600;
}
.fcg-city-place__meta {
  margin-top: 0.18rem !important;
}
.fcg-city-place__meta i { margin-right: 0.25rem; color: var(--fcg-blue); }
.fcg-city-place__more {
  display: inline-block;
  margin-top: 0.25rem;
  font-size: 0.6875rem;
  font-weight: 700;
  color: #12557f;
  text-decoration: none;
}
.fcg-city-place__more:hover { text-decoration: underline; }
.fcg-city-place__note {
  margin-top: 0.3rem !important;
  padding: 0.28rem 0.45rem;
  border-radius: 7px;
  background: #eaf3fb;
  color: #1a4f7a !important;
  font-weight: 600;
}
@media (max-width: 768px) {
  /* Sous le hero empile, la photo est etroite : les bulles reprennent la
     largeur et des corps lisibles au doigt. */
  .fcg-city-photo__cards {
    left: 0.75rem;
    width: auto;
  }
  .fcg-city-place h2 { font-size: 0.9375rem; }
  .fcg-city-place p { font-size: 0.8125rem; }
  .fcg-city-place__more { font-size: 0.8125rem; }
}
.fcg-city-infos {
  background: #fff;
  padding: 1.7rem 0 0.5rem;
}
.fcg-city-infos__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.fcg-city-info {
  border: 1px solid #e8eef5;
  border-radius: 16px;
  padding: 1.2rem 1.2rem 1.25rem;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 40, 80, 0.06);
}
.fcg-city-info__icon {
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  display: grid;
  place-items: center;
  background: #eaf3fb;
  color: var(--fcg-blue);
  font-size: 1.125rem;
  margin-bottom: 0.7rem;
}
.fcg-city-info h2 {
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  margin: 0 0 0.4rem;
  color: var(--fcg-navy);
}
.fcg-city-info p {
  margin: 0 0 0.75rem;
  font-size: 0.875rem;
  line-height: 1.45;
  color: #5b6b80;
}
.fcg-city-info a {
  font-weight: 700;
  font-size: 0.875rem;
  color: var(--fcg-blue);
  text-decoration: none;
}
.fcg-city-info a:hover { text-decoration: underline; }
.fcg-pref--city .fcg-risks { margin-top: 1.5rem; }
#fcg-city-start, #fcg-city-paths, #fcg-city-cases { scroll-margin-top: 6.5rem; }
.fcg-city-bar {
  background: #f4f7fb;
  border-top: 1px solid #e4edf5;
  border-bottom: 1px solid #e4edf5;
  padding: 1.15rem 0;
}
.fcg-city-bar__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1rem;
}
.fcg-city-bar__grid > div {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: auto auto;
  column-gap: 0.65rem;
  align-items: start;
}
.fcg-city-bar__grid i {
  grid-row: 1 / span 2;
  color: var(--fcg-blue);
  font-size: 1.25rem;
  margin-top: 0.15rem;
}
.fcg-city-bar__grid strong {
  font-size: 0.875rem;
  color: var(--fcg-navy);
}
.fcg-city-bar__grid span {
  font-size: 0.8125rem;
  color: #5b6b80;
  line-height: 1.35;
}
.fcg-city-paths {
  /* 2.4rem/1.2rem cassait le rythme entre le ruban et la premiere section. */
  padding: 2.5rem 0;
  background: #fff;
}
.fcg-city-ways {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
  margin-bottom: 2rem;
}
.fcg-city-way {
  display: block;
  padding: 1.15rem 1.2rem 1.2rem;
  border: 1px solid #e4edf5;
  border-radius: 16px;
  text-decoration: none;
  color: inherit;
  background: #f8fbfe;
  transition: border-color .15s, box-shadow .15s;
}
.fcg-city-way:hover {
  border-color: #b9d4ee;
  box-shadow: 0 10px 24px rgba(11, 31, 74, 0.08);
}
.fcg-city-way__n {
  display: inline-grid;
  place-items: center;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 999px;
  background: #0b1f4a;
  color: #fff;
  font-size: 0.8125rem;
  font-weight: 700;
  margin-bottom: 0.55rem;
}
.fcg-city-way h3 {
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  margin: 0 0 0.35rem;
  color: var(--fcg-navy);
}
.fcg-city-way p {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.45;
  color: #5b6b80;
}
.fcg-city-cases-title {
  font-family: var(--fcg-font-display);
  font-size: 1.125rem;
  margin: 0 0 0.9rem;
  color: var(--fcg-navy);
}
.fcg-city-cases {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.fcg-city-case {
  border: 1px solid #e4edf5;
  border-radius: 18px;
  padding: 1.25rem 1.2rem 1.15rem;
  background: #fff;
  box-shadow: 0 8px 24px rgba(15, 40, 80, 0.05);
}
.fcg-city-case.is-active {
  border-color: var(--fcg-teal);
  box-shadow: 0 10px 28px rgba(18, 181, 138, 0.16);
}
.fcg-city-case__icon {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  display: grid;
  place-items: center;
  background: #eaf3fb;
  color: var(--fcg-blue);
  font-size: 1.25rem;
  margin-bottom: 0.75rem;
}
.fcg-city-case h3 {
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  margin: 0 0 0.4rem;
  color: var(--fcg-navy);
}
.fcg-city-case p {
  margin: 0 0 1rem;
  font-size: 0.875rem;
  line-height: 1.45;
  color: #5b6b80;
  min-height: 3.2em;
}
.fcg-city-case__alt {
  display: block;
  margin-top: 0.55rem;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--fcg-blue);
  text-decoration: none;
}
.fcg-city-case__alt:hover { text-decoration: underline; }
.fcg-city-more {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 1rem;
}
.fcg-city-more__item {
  display: flex;
  gap: 0.7rem;
  align-items: flex-start;
  padding: 0.85rem 0.95rem;
  border: 1px solid #e8eef5;
  border-radius: 14px;
  text-decoration: none;
  color: inherit;
  background: #fff;
}
.fcg-city-more__item:hover { border-color: #b9d4ee; }
.fcg-city-more__item.is-active { border-color: var(--fcg-teal); }
.fcg-city-more__item i { color: var(--fcg-blue); font-size: 1.125rem; margin-top: 0.15rem; }
.fcg-city-more__item strong {
  display: block;
  font-size: 0.875rem;
  color: var(--fcg-navy);
  margin-bottom: 0.15rem;
}
.fcg-city-more__item span { font-size: 0.8125rem; color: #5b6b80; line-height: 1.35; }
.fcg-city-crumbs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.35rem;
  font-size: 0.875rem;
  color: #64748b;
  margin-bottom: 0.4rem;
}
.fcg-city-crumbs a { color: var(--fcg-blue); text-decoration: none; font-weight: 600; }
.fcg-city-crumbs a:hover { text-decoration: underline; }
.fcg-city-local { background: #f7fafc; }
.fcg-city-local__grid {
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) minmax(240px, 0.75fr);
  gap: 1.5rem;
  align-items: start;
}
.fcg-city-local__copy p { color: #3d5470; font-size: 1rem; line-height: 1.6; }
.fcg-city-local__law {
  padding: 0.85rem 1rem;
  background: #fff8e1;
  border: 1px solid #fde68a;
  border-radius: 12px;
  color: #7a5b00 !important;
}
.fcg-city-fact {
  background: #fff;
  border: 1px solid #e4edf5;
  border-radius: 16px;
  padding: 1rem 1.1rem;
  margin-bottom: 0.75rem;
}
.fcg-city-fact__k { margin: 0; font-size: 0.75rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--fcg-blue); }
.fcg-city-fact__v { margin: 0.2rem 0 0.35rem; font-family: var(--fcg-font-display); font-size: 1.5rem; color: var(--fcg-navy); }
.fcg-city-fact p { margin: 0; font-size: 0.875rem; color: #5b6b80; line-height: 1.4; }
.fcg-city-fact a { display: inline-block; margin-top: 0.45rem; font-weight: 700; font-size: 0.875rem; color: var(--fcg-blue); text-decoration: none; }

#simulateur,
#fcg-city-start,
#fcg-home-cases,
#fcg-lp-services {
  scroll-margin-top: 6rem;
}

.fcg-start__steps {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.35rem;
  list-style: none;
  margin: 0 0 0.85rem;
  padding: 0;
}
.fcg-start__steps li {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0.35rem 0.25rem;
  border-radius: 999px;
  background: #f3f7fb;
  color: #68788c;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: .02em;
  text-transform: uppercase;
}
.fcg-start__steps li span {
  display: inline-flex;
  width: 1.15rem;
  height: 1.15rem;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #d9e6f3;
  color: var(--fcg-navy);
  font-size: 0.75rem;
}
.fcg-start__steps li.is-on {
  background: #e8f1ff;
  color: var(--fcg-blue);
}
.fcg-start__steps li.is-on span {
  background: var(--fcg-blue);
  color: #fff;
}
.fcg-start__reassure {
  margin: 0.55rem 0 0;
  text-align: center;
  font-size: 0.8125rem;
  color: #68788c;
  line-height: 1.35;
}
.fcg-start__reassure--soft {
  margin-top: 0.2rem;
  font-weight: 500;
  color: #5a6f86;
}
.fcg-start--city .fcg-start__reassure {
  color: rgba(226, 236, 255, .78);
}
.fcg-start--city .fcg-start__reassure--soft {
  color: rgba(226, 236, 255, .62);
}

.fcg-glossaire {
  margin: 0;
  padding: 0;
}
.fcg-glossaire__item {
  padding: 1rem 0;
  border-bottom: 1px solid #e8eef5;
}
.fcg-glossaire__item:first-child { padding-top: 0; }
.fcg-glossaire dt {
  margin: 0 0 0.35rem;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--fcg-navy);
}
.fcg-glossaire dd {
  margin: 0;
  color: #3d5470;
  line-height: 1.55;
  font-size: 1rem;
}
.fcg-faq-answer {
  font-size: 1rem;
  line-height: 1.65;
  color: #2c3e50;
}

.fcg-home-ways {
  padding-top: 2.5rem;
}

.fcg-docmatrix-wrap { margin-bottom: 2rem; }
.fcg-docmatrix-lead { color: #5b6b80; font-size: 0.9375rem; margin: 0 0 1rem; }
.fcg-docmatrix { overflow-x: auto; border: 1px solid #e4edf5; border-radius: 14px; background: #fff; -webkit-overflow-scrolling: touch; }
.fcg-docmatrix table { width: 100%; border-collapse: collapse; font-size: 0.875rem; }
.fcg-docmatrix th, .fcg-docmatrix td { padding: 0.7rem 0.85rem; text-align: left; border-bottom: 1px solid #eef3f8; }
.fcg-docmatrix thead th { background: #f6f9fc; color: var(--fcg-navy); font-size: 0.8125rem; letter-spacing: .04em; text-transform: uppercase; }
.fcg-docmatrix tbody th { color: var(--fcg-navy); font-weight: 650; white-space: nowrap; }
/* Mobile : la table glisse — la premiere colonne (le nom de la piece) reste
   fixe, et un indice dit qu'il y a plus de colonnes a droite. */
@media (max-width: 700px) {
  .fcg-docmatrix thead th:first-child,
  .fcg-docmatrix tbody th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    background: #fff;
    box-shadow: 6px 0 8px -6px rgba(11, 31, 74, 0.18);
  }
  .fcg-docmatrix thead th:first-child { background: #f6f9fc; }
  .fcg-docmatrix-hint {
    display: flex !important;
  }
}
.fcg-docmatrix-hint {
  display: none;
  align-items: center;
  gap: 0.4rem;
  margin: 0.5rem 0 0;
  font-size: 0.75rem;
  color: var(--fcg-muted, #556475);
}
.fcg-docmatrix-hint i { color: var(--fcg-blue, #1a6fd4); }
.fcg-docmatrix td { color: #3d5470; }
.fcg-page__hero-cta { margin-top: 1rem; }

.fcg-prix-table-wrap { overflow-x: auto; border: 1px solid #e4edf5; border-radius: 14px; background: #fff; }
.fcg-prix-table { width: 100%; border-collapse: collapse; font-size: 0.9375rem; }
.fcg-prix-table th, .fcg-prix-table td { padding: 0.8rem 1rem; text-align: left; border-bottom: 1px solid #eef3f8; }
.fcg-prix-table thead th { background: #f6f9fc; color: var(--fcg-navy); font-size: 0.8125rem; letter-spacing: .04em; text-transform: uppercase; }
.fcg-prix-table tbody th { font-weight: 650; color: var(--fcg-navy); }
.fcg-prix-table td { color: #3d5470; }
.fcg-prix-table a { color: var(--fcg-blue); font-weight: 650; text-decoration: none; }
.fcg-prix-table a:hover { text-decoration: underline; }
.fcg-prix-note { margin-top: 0.85rem; color: #5b6b80; font-size: 0.875rem; }

@media (max-width: 980px) {
  .fcg-city-hero__grid,
  .fcg-city-infos__grid,
  .fcg-city-bar__grid,
  .fcg-city-ways,
  .fcg-city-cases,
  .fcg-city-more,
  .fcg-city-local__grid {
    grid-template-columns: 1fr;
  }
  .fcg-city-photo { min-height: 26rem; }
  .fcg-city-hero h1 { max-width: none; }
  .fcg-city-case p { min-height: 0; }
}

/* ── Largeur de lecture ───────────────────────────────────────────────────
   Élargir le cadre du site ne doit pas élargir le texte courant : un
   paragraphe de 1200 px fait plus de deux cents caractères par ligne, et l'œil
   ne retrouve pas le début de la ligne suivante. Le cadre porte la mise en
   page ; ces règles portent la mesure.

   Ciblées, jamais globales : un `p` dans une carte ou une cellule de tableau
   doit suivre son conteneur, pas une mesure typographique. */
.contenu-reglement p,
.contenu-reglement li { max-width: 78ch; }

.fcg-prix-note,
.fcg-bs__legal,
.fcg-docmatrix-lead { max-width: 90ch; }

/* Les pages de règlements citent des URL entières comme texte de lien. Sans
   coupure, une adresse de cinquante caractères ne rentre pas dans un écran de
   375 px et emporte toute la page en défilement horizontal. */
.contenu-reglement a { overflow-wrap: anywhere; }

/* ── Menu mobile : icônes et liens « tout voir » ─────────────────────────── */
.fcg-mobile-nav .menuLinkHeader > i:first-child {
  display: inline-block;
  width: 1.35em;
  color: var(--fcg-blue);
  text-align: center;
}
.fcg-mobile-nav .mobile_header_sub_item > i:first-child {
  display: inline-block;
  width: 1.35em;
  color: var(--fcg-muted);
  text-align: center;
}
.fcg-mobile-nav .fcg-mobile-all {
  color: var(--fcg-blue) !important;
  font-weight: 700;
}
.fcg-mobile-nav .fcg-mobile-all i {
  color: var(--fcg-blue);
}

/* ── Étape paiement : colonne resserrée et centrée ────────────────────────
   .blog-main s'étirait à 1660 px : la carte de paiement (~440 px) restait
   collée à gauche et le récapitulatif partait à l'extrême droite, avec un
   vide de plusieurs centaines de pixels entre les deux. */
body.fcg-ui .payment-page .blog-main {
  max-width: var(--fcg-max, 1240px);
  justify-content: center;
}
/* La zone de paiement occupe TOUTE sa colonne ; le formulaire Stripe garde
   une mesure confortable, centré dans la zone. */
body.fcg-ui .payment-page .demarche-input-side-full {
  width: 100%;
}
body.fcg-ui .payment-page .payment-form,
body.fcg-ui .payment-page .payment-form-card {
  width: 100%;
}
body.fcg-ui .payment-page .payment-section-inner,
body.fcg-ui .payment-page .payment-form-content {
  width: min(560px, 100%);
  margin-inline: auto;
}
body.fcg-ui .payment-page .payment-submit-sec {
  width: min(560px, 100%);
  margin-inline: auto;
}

/* ── Mobile : FranceConnect dans la barre, simulateur en premier ─────────── */
.fcg-fc-bar {
  width: 136px;
  height: 37px;
  background-size: cover;
  cursor: pointer;
}
@media (min-width: 901px) {
  .fcg-fc-bar { display: none; }
}
/* Le panneau simulateur AVANT le texte du héros : c'est lui qui convertit —
   sur téléphone il partait sous deux écrans de titre et de badges. */
@media (max-width: 900px) {
  .fcg-hero--v2 .fcg-hero__stage {
    order: -1;
  }
}

.fcg-fc-bar-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
}
@media (min-width: 901px) {
  .fcg-fc-bar-wrap { display: none; }
}
.fcg-fc-bar-link {
  margin-top: 0;
  font-size: 0.625rem;
}

/* ── Récapitulatif de commande : même langue que le reste du site ─────────
   Titres bleu-lien, filets noirs #525252 et total vert « caisse » dataient
   d'une autre charte. Navy + Sora pour les titres, filets doux, total teal —
   sans toucher au markup partagé par les deux étapes et les deux formats. */
body.fcg-ui .commande-info-part .title_info_demarche,
body.fcg-ui .commande-info-part-mobile .title_info_demarche {
  font-family: var(--fcg-font-display);
  color: var(--fcg-navy);
  letter-spacing: -0.01em;
}
body.fcg-ui .commande-info-part .info-demarche-modal h3,
body.fcg-ui .commande-info-part-mobile .info-demarche-modal h3 {
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--fcg-navy);
}
body.fcg-ui .commande-info-part .info-demarche-modal h3 i,
body.fcg-ui .commande-info-part-mobile .info-demarche-modal h3 i {
  color: var(--fcg-teal-deep) !important;
}
body.fcg-ui .commande-info-part .row-info-demarche-modal,
body.fcg-ui .commande-info-part-mobile .row-info-demarche-modal {
  border-color: var(--fcg-line) !important;
}
body.fcg-ui .commande-info-part .tarification-total-visible,
body.fcg-ui .commande-info-part-mobile .tarification-total-visible {
  border-top: 2px solid var(--fcg-navy) !important;
}
body.fcg-ui .commande-info-part .price_demarche,
body.fcg-ui .commande-info-part-mobile .price_demarche {
  font-family: var(--fcg-font-display);
  color: var(--fcg-teal-deep);
}

/* Ruban de garanties : cinq items sur mobile — deux colonnes serrées,
   textes sur plusieurs lignes plutôt que coupés. */
@media (max-width: 600px) {
  .fcg-ribbon__item strong { font-size: 0.8125rem; }
  .fcg-ribbon__item span { font-size: 0.75rem; }
  .fcg-ribbon__item { min-width: 0; }
  .fcg-ribbon__item div { min-width: 0; overflow-wrap: break-word; }
}

/* ── Optimisation mobile des parcours ────────────────────────────────────── */
@media (max-width: 900px) {
  /* iOS zoome toute la page quand un champ focalisé fait moins de 16 px.
     Dans un tunnel de paiement, ce zoom est un tueur de conversion. */
  input:not([type="checkbox"]):not([type="radio"]),
  select,
  textarea {
    font-size: 16px !important;
  }
  /* En-tête du tunnel : chaque pixel au-dessus du formulaire se paie.
     La ligne méta est secondaire — le récap mobile redit l'essentiel. */
  .fcg-funnel-page .fcg-dhead {
    margin-bottom: 0.6rem;
  }
  .fcg-funnel-page .fcg-dhead__meta {
    display: none;
  }
  .fcg-funnel-page .fcg-rw {
    margin-bottom: 0;
  }
  .fcg-funnel-page .fcg-rw__resume {
    padding: 0.35rem 0.7rem;
  }
  .fcg-funnel-page .fcg-funnel-progress {
    margin-top: 0.5rem;
  }
  .fcg-funnel-page .demarche-form-section {
    margin-top: 18px;
    padding: 18px 14px;
  }
  /* Cibles tactiles des liens secondaires du parcours. */
  .fcg-rw__fallback a,
  .fcg-header-fc-link {
    display: inline-block;
    padding: 0.5rem 0.25rem;
  }
  /* Liens du pied de page : 27 px de haut, sous le minimum tactile. */
  .site-footer-v3 li a {
    display: inline-block;
    padding-block: 0.4rem;
  }
}

/* Total compact en tête de formulaire — mobile uniquement : sur bureau le
   récapitulatif est déjà sous les yeux dans la colonne de droite. */
.fcg-total-mobile {
  display: none;
}
@media (max-width: 991px) {
  .fcg-total-mobile {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin: 0.75rem 0 0;
    padding: 0.55rem 0.8rem;
    border: 1px solid var(--fcg-line, #dce5f0);
    border-radius: 10px;
    background: var(--fcg-surface, #f3f7fb);
    font-size: 0.875rem;
    color: var(--fcg-muted, #556475);
  }
  .fcg-total-mobile strong {
    font-family: var(--fcg-font-display, "Sora", sans-serif);
    font-size: 1.125rem;
    color: var(--fcg-teal-deep, #077a5c);
  }
  .fcg-total-mobile a {
    margin-left: auto;
    color: var(--fcg-blue, #1a6fd4);
    text-decoration: underline;
    padding: 0.25rem;
  }
  #recap-mobile-ancre {
    scroll-margin-top: 5rem;
  }
}

/* ── Focus clavier visible, partout ───────────────────────────────────────
   Un reset historique tuait l'outline : au clavier, impossible de savoir où
   l'on est — y compris dans le tunnel de paiement. :where() garde la
   spécificité à zéro : les focus dessinés sur mesure (selects, options de
   paiement) continuent de gagner. :focus-visible ne cible que le clavier —
   rien ne change au clic ou au toucher. */
:where(a, button, input, select, textarea, summary, [role="button"], [tabindex]):focus-visible {
  outline: 3px solid var(--fcg-blue-bright, #2b8fff);
  outline-offset: 2px;
}

/* ── Hero home : les deux chiffres qui portent l'offre ─────────────────────
   Prix d'appel et delai en cartes verre sur le bleu nuit — la colonne de
   gauche portait du texte, jamais l'argument. */
.fcg-hero__highlights {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.9rem;
  margin: 1.4rem 0 0;
  max-width: 560px;
}
.fcg-hero__hl {
  display: flex;
  align-items: flex-start;
  gap: 0.8rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: var(--fcg-radius-sm, 11px);
  background: rgba(255, 255, 255, 0.06);
}
.fcg-hero__hl > i {
  flex: 0 0 auto;
  margin-top: 0.2rem;
  font-size: 1.25rem;
  color: var(--fcg-teal, #12b58a);
}
.fcg-hero__hl-val {
  display: block;
  font-family: var(--fcg-font-display);
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.15;
  letter-spacing: -0.02em;
  color: #fff;
}
.fcg-hero__hl-lab {
  display: block;
  margin-top: 0.25rem;
  font-size: 0.8125rem;
  line-height: 1.45;
  color: rgba(255, 255, 255, 0.78);
}
@media (max-width: 560px) {
  .fcg-hero__highlights { grid-template-columns: 1fr; gap: 0.7rem; }
  .fcg-hero__hl { padding: 0.85rem 1rem; }
}

/* —— Blog : mosaique de tete, couvertures dessinees, revelation —— */
.fcg-blogx-top {
  display: grid;
  grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr);
  gap: 1.25rem;
  margin: 0 0 1.75rem;
}
.fcg-blogx-top .fcg-blogx-une {
  margin: 0;
  grid-template-columns: 1fr;      /* la une devient verticale dans la mosaique */
  align-self: stretch;
}
.fcg-blogx-top .fcg-blogx-une__media { min-height: 230px; }
.fcg-blogx-side {
  display: grid;
  grid-template-rows: 1fr 1fr;
  gap: 1.25rem;
  min-width: 0;
}
.fcg-blogx-mini {
  display: grid;
  grid-template-columns: 132px minmax(0, 1fr);
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  overflow: hidden;
  background: #fff;
  box-shadow: var(--fcg-shadow-sm);
  transition: transform 0.25s var(--fcg-ease), box-shadow 0.25s var(--fcg-ease);
}
.fcg-blogx-mini:hover {
  transform: translateY(-3px);
  box-shadow: var(--fcg-shadow);
}
.fcg-blogx-mini__media {
  display: block;
  min-height: 100%;
  background-size: cover;
  background-position: center;
}
.fcg-blogx-mini__body {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  padding: 0.9rem 1rem;
  min-width: 0;
}
.fcg-blogx-mini__body h2 {
  margin: 0;
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  line-height: 1.35;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.fcg-blogx-mini__body h2 a { color: var(--fcg-navy); text-decoration: none; }
.fcg-blogx-mini__body h2 a:hover { color: var(--fcg-blue); }

/* Couverture dessinee : remplace le logo etire quand l'article n'a pas de
   visuel propre — degrade maison + icone de rubrique. */
.fcg-blogx-cover {
  display: flex !important;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--fcg-navy) 0%, #123a6d 62%, var(--fcg-teal-deep) 140%);
}
.fcg-blogx-cover > i {
  font-size: 2.4rem;
  color: rgba(255, 255, 255, 0.85);
}
.fcg-blogx-mini .fcg-blogx-cover > i { font-size: 1.7rem; }

.fcg-blogx-more-wrap { margin: 1.5rem 0 0; text-align: center; }
.fcg-blogx-more {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-height: 48px;
  padding: 0.65rem 1.6rem;
  border: 1px solid var(--fcg-line);
  border-radius: 999px;
  background: #fff;
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--fcg-navy);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease;
}
.fcg-blogx-more:hover { border-color: #9fbdd8; background: var(--fcg-surface); }
.fcg-blogx-more__n { color: var(--fcg-muted); font-weight: 600; }

@media (max-width: 860px) {
  .fcg-blogx-top { grid-template-columns: 1fr; }
  .fcg-blogx-side { grid-template-rows: none; }
  .fcg-blogx-mini { grid-template-columns: 108px minmax(0, 1fr); }
}
@media (prefers-reduced-motion: reduce) {
  .fcg-blogx-mini { transition: none; }
  .fcg-blogx-mini:hover { transform: none; }
}

/* —— Sidebar des pages contenu : collante sous le header ——
   Meme traitement que les autres colonnes du site (.fcg-ea, .fcg-legal__nav) :
   sticky simple sous le header, pas de defilement interne — une barre de
   defilement dans une colonne de 300 px jure avec tout le reste. Les cartes
   s'espacent d'un gap explicite, comme la colonne editoriale. */
.fcg-page__aside {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
@media (min-width: 901px) {
  .fcg-page__aside {
    position: sticky;
    top: var(--fcg-sticky-top, 8.75rem);
  }
}

/* Espacement de la sidebar contenu : le widget d'avis apportait sa propre
   marge par-dessus le gap de la colonne (30 px la ou tout est a 16). */
.fcg-page__aside .fcg-rw { margin: 0; }

/* —— Bande de proximite des landings locales —— */
.fcg-city-proxi {
  padding: 1.1rem 0;
  background: #fff;
  border-bottom: 1px solid var(--fcg-line);
}
.fcg-city-proxi__in {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.fcg-city-proxi__preuve {
  margin: 0;
  font-size: 0.9375rem;
  color: var(--fcg-navy);
}
.fcg-city-proxi__preuve i { color: var(--fcg-teal-deep); margin-right: 0.3rem; }
.fcg-city-proxi__communes {
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.4rem;
  font-size: 0.8125rem;
  color: var(--fcg-muted);
}
.fcg-city-proxi__communes > i { color: var(--fcg-blue); }
.fcg-city-proxi__chip {
  padding: 3px 10px;
  border: 1px solid var(--fcg-line);
  border-radius: 999px;
  background: var(--fcg-surface, #f6f9fd);
  font-weight: 600;
  color: #33445c;
  white-space: nowrap;
}
.fcg-city-proxi__reste { font-style: italic; }

/* —— Hero local : bleu nuit fondu dans la photo ——
   Le bandeau clair posait un panneau navy sur fond pale ; ici tout le hero
   est nuit, la photo file jusqu'au bord droit de l'ecran et se fond dans le
   bleu par un degrade — la structure des heros de l'accueil. */
.fcg-city-hero {
  background: linear-gradient(118deg, #0a1e44 0%, #0e2c5e 55%, #123a6d 100%);
  color: #fff;
  overflow: clip;
  padding: 2.4rem 0 2.2rem;
}
.fcg-city-hero .fcg-city-badge {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.22);
  color: #9fd8ff;
}
.fcg-city-hero h1 { color: #fff; }
.fcg-city-hero__lead { color: rgba(222, 233, 250, 0.92) !important; }
.fcg-city-hero .fcg-city-panel {
  background: rgba(7, 20, 46, 0.55);
  border: 1px solid rgba(255, 255, 255, 0.14);
}
.fcg-city-hero .fcg-city-trust li { color: rgba(255, 255, 255, 0.85); }
.fcg-city-hero .fcg-city-trust i { color: var(--fcg-teal); }
.fcg-city-hero .fcg-city-photo {
  border-radius: 20px;
  /* Deborde du conteneur vers la droite, mais PLAFONNE : sur un ecran large,
     suivre le bord de l'ecran faisait grossir la photo avec le viewport
     pendant que la colonne de texte restait dans les 1240 px — un hero
     disproportionne, bulles collees au bord. 4 rem d'echappee suffisent a
     donner l'effet sans desequilibrer. */
  margin-right: calc(-1 * min(4rem, max(1rem, (100vw - var(--fcg-max, 1240px)) / 2)));
  box-shadow: 0 18px 44px rgba(4, 12, 30, 0.35);
}
/* Fondu navy -> photo sur le bord gauche ; l'assombrissement du bas (::after)
   reste tel quel. */
.fcg-city-hero .fcg-city-photo::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, #0a1e44 0%, rgba(10, 30, 68, 0.4) 24%, rgba(10, 30, 68, 0) 55%);
  pointer-events: none;
}
.fcg-city-hero .fcg-city-photo__cards { z-index: 2; }
@media (max-width: 980px) {
  /* Empile : la photo prend toute la largeur, bords francs. */
  .fcg-city-hero .fcg-city-photo {
    border-radius: 0;
    margin-left: -1rem;
    margin-right: -1rem;
  }
}

/* —— Dobra « livraison à domicile » ——
   Fidele a la reference : UNE carte blanche ; photo pleine hauteur a gauche ;
   panneau bleu pale a droite (maquette SMS + titre + texte) ; rangee de
   garanties a filets dans la meme carte. */
.fcg-livr-sec { background: var(--fcg-surface, #f6f9fd); }
.fcg-livr {
  background: #fff;
  border: 1px solid var(--fcg-line);
  border-radius: var(--fcg-radius);
  box-shadow: var(--fcg-shadow-sm);
  overflow: hidden;
}
.fcg-livr__haut {
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
}
.fcg-livr__media {
  position: relative;
  min-height: 23rem;
}
.fcg-livr__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fcg-livr__droite {
  position: relative;
  padding: 2.5rem 2.75rem 2.25rem 2.5rem;
  background:
    radial-gradient(38rem 22rem at 100% 0%, #dcecfa 0%, rgba(220, 236, 250, 0) 60%),
    linear-gradient(180deg, #f2f8fd 0%, #ffffff 85%);
}
.fcg-livr__sms {
  width: min(380px, 100%);
  margin: 0 0 1.5rem;
  padding: 0.85rem 1.05rem 0.95rem;
  background: #fff;
  border: 1px solid #e4eaf3;
  border-radius: 14px;
  box-shadow: 0 14px 34px rgba(11, 31, 74, 0.12);
}
.fcg-livr__sms-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin: 0 0 0.4rem;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #7a8aa0;
}
.fcg-livr__sms-app i {
  color: #22c55e;
  margin-right: 0.25rem;
  font-size: 0.875rem;
}
.fcg-livr__sms-now {
  font-weight: 500;
  letter-spacing: 0;
  text-transform: none;
}
.fcg-livr__sms-txt {
  margin: 0;
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--fcg-navy);
}
.fcg-livr__sms-txt i { color: #eab308; }
.fcg-livr__titre {
  margin: 0 0 0.8rem;
  font-family: var(--fcg-font-display);
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 1.9rem);
  line-height: 1.2;
  letter-spacing: -0.02em;
  color: var(--fcg-navy);
}
.fcg-livr__lead {
  margin: 0 0 0.75rem;
  font-size: 1rem;
  line-height: 1.65;
  color: #33445c;
  max-width: 46ch;
}
.fcg-livr__note {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: var(--fcg-muted);
  max-width: 46ch;
}
/* Rangee de garanties dans la carte, filet haut + filets entre colonnes */
.fcg-livr__feats {
  list-style: none;
  margin: 0;
  padding: 0.35rem 0;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  border-top: 1px solid var(--fcg-line);
}
.fcg-livr__feats li {
  padding: 1.35rem 1.1rem;
  text-align: center;
}
.fcg-livr__feats li + li {
  border-left: 1px solid var(--fcg-line);
}
.fcg-livr__ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  margin-bottom: 0.7rem;
  border-radius: 50%;
  background: #eaf3fb;
  color: var(--fcg-blue);
  font-size: 1.35rem;
}
.fcg-livr__feats h3 {
  margin: 0 0 0.3rem;
  font-family: var(--fcg-font-display);
  font-size: 0.9375rem;
  color: var(--fcg-navy);
}
.fcg-livr__feats p {
  margin: 0;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--fcg-muted);
}
/* Picto « envoi » a cheval sur la couture photo / panneau */
.fcg-livr__pin {
  position: absolute;
  left: -28px;
  top: 2.3rem;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  box-shadow: 0 0 0 5px #fff, 0 10px 24px rgba(11, 31, 74, 0.18);
  background: #fff;
}
@media (max-width: 900px) {
  .fcg-livr__haut { grid-template-columns: 1fr; }
  .fcg-livr__media { min-height: 14rem; }
  /* Empile : le picto chevauche le bas de la photo. */
  .fcg-livr__pin { left: 1.25rem; top: -28px; }
  .fcg-livr__droite { padding: 1.5rem 1.25rem 1.6rem; }
  .fcg-livr__feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .fcg-livr__feats li + li { border-left: 0; }
  .fcg-livr__feats li:nth-child(even) { border-left: 1px solid var(--fcg-line); }
  .fcg-livr__feats li:nth-child(n+3) { border-top: 1px solid var(--fcg-line); }
}

/* —— Dobra « toutes les villes » —— */
.fcg-vfr__vlien {
  color: var(--fcg-blue);
  font-weight: 700;
  text-decoration: none;
}
.fcg-vfr__vlien:hover { text-decoration: underline; }
/* Marquee continu : deux lots identiques dans la piste, l'animation glisse
   d'exactement un lot. Survol = pause ; mouvement reduit = defilement manuel. */
.fcg-vfr__marquee {
  /* Cadre du site, pas la pleine largeur de l'ecran : le fondu des deux cotes
     fait « fenetre » sur le defile au lieu de le couper au bord. */
  max-width: var(--fcg-max, 1240px);
  margin-inline: auto;
  overflow: hidden;
  padding: 0.35rem 0 0.6rem;
  -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 clamp(3rem, 8%, 7rem), #000 calc(100% - clamp(3rem, 8%, 7rem)), transparent 100%);
  mask-image: linear-gradient(90deg, transparent 0, #000 clamp(3rem, 8%, 7rem), #000 calc(100% - clamp(3rem, 8%, 7rem)), transparent 100%);
}
.fcg-vfr__track {
  display: flex;
  width: max-content;
  /* ~35 px/s : une derive, pas un carrousel — la piste fait ~9 000 px le lot. */
  animation: fcgVfrDefile 260s linear infinite;
  will-change: transform;
}
.fcg-vfr__marquee:hover .fcg-vfr__track,
.fcg-vfr__marquee:focus-within .fcg-vfr__track {
  animation-play-state: paused;
}
.fcg-vfr__lot {
  display: flex;
  gap: 0.9rem;
  padding-right: 0.9rem;
}
@keyframes fcgVfrDefile {
  to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
  .fcg-vfr__track { animation: none; }
  .fcg-vfr__marquee {
    overflow-x: auto;
    -webkit-mask-image: none;
    mask-image: none;
  }
}
.fcg-vfr__card {
  position: relative;
  display: flex;
  align-items: flex-end;
  flex: 0 0 auto;
  width: 220px;
  min-height: 10rem;
  border-radius: var(--fcg-radius);
  overflow: hidden;
  background: linear-gradient(180deg, #9eb9d4, #55677a);
  text-decoration: none;
  transition: transform 0.25s var(--fcg-ease), box-shadow 0.25s var(--fcg-ease);
}
.fcg-vfr__img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.fcg-vfr__card::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(10, 30, 68, 0) 40%, rgba(10, 30, 68, 0.72) 100%);
}
.fcg-vfr__card:hover,
.fcg-vfr__card:focus-visible {
  transform: translateY(-4px);
  box-shadow: var(--fcg-shadow);
}
.fcg-vfr__badge {
  position: absolute;
  top: 0.6rem;
  left: 0.6rem;
  z-index: 1;
  padding: 0.22rem 0.6rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--fcg-navy);
  font-size: 0.625rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  text-transform: uppercase;
}
.fcg-vfr__name {
  position: relative;
  z-index: 1;
  padding: 0.8rem 0.85rem;
  font-family: var(--fcg-font-display);
  font-size: 1.0625rem;
  font-weight: 700;
  color: #fff;
}
.fcg-vfr__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.9rem 1.5rem;
  margin-top: 1.1rem;
  padding: 0.9rem 1.25rem;
  background: #fff;
  border: 1px solid var(--fcg-line);
  border-radius: 999px;
  box-shadow: var(--fcg-shadow-sm);
}
.fcg-vfr__bar-txt {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--fcg-navy);
}
.fcg-vfr__bar-txt i { color: var(--fcg-teal-deep); margin-right: 0.35rem; }
.fcg-vfr__bar-cta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
}
@media (max-width: 640px) {
  .fcg-vfr__card { width: 180px; min-height: 8.5rem; }
  .fcg-vfr__bar { border-radius: var(--fcg-radius); justify-content: center; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  .fcg-vfr__card { transition: none; }
  .fcg-vfr__card:hover { transform: none; }
}

/* Credit de licence sur la photo livraison (CC BY-SA : obligatoire) */
.fcg-livr__credit {
  position: absolute;
  top: 0.55rem;
  right: 0.65rem;
  z-index: 1;
  padding: 0.14rem 0.5rem;
  border-radius: 999px;
  background: rgba(10, 30, 68, 0.55);
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.625rem;
  font-weight: 600;
  text-decoration: none;
}
.fcg-livr__credit:hover { background: rgba(10, 30, 68, 0.75); color: #fff; }
.fcg-livr__suivi {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-top: 0.9rem;
  min-height: 44px;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #12557f;
  text-decoration: none;
}
.fcg-livr__suivi:hover { text-decoration: underline; }

/* Etat « rempli » : le champ valide passe au vert (pendant du is-invalid). */
.fcg-select.is-rempli,
.fcg-dpk__btn.is-rempli,
.fcg-ss__input.is-rempli {
  border-color: var(--fcg-teal-deep, #077a5c) !important;
  box-shadow: 0 0 0 3px rgba(18, 181, 138, 0.18);
}
/* La plaque porte deja un anneau blanc+marine en couches : a l'etat valide
   c'est l'anneau qui passe au vert — meme dessin, couleur d'etat.
   !important : la regle de base de l'anneau gagne sinon la cascade. */
.fcg-plate.is-rempli {
  box-shadow: 0 0 0 3px #fff, 0 0 0 6px var(--fcg-teal-deep, #077a5c), 0 12px 28px rgba(7, 122, 92, 0.28) !important;
}

/* Retour d'etape dans le tunnel */
.fcg-funnel-retour {
  margin: -0.25rem 0 1rem;
  text-align: center;
  font-size: 0.875rem;
}
.fcg-funnel-retour a {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  min-height: 44px;
  padding: 0.35rem 0.9rem;
  color: #12557f;
  font-weight: 600;
  text-decoration: none;
  border-radius: 999px;
}
.fcg-funnel-retour a:hover { text-decoration: underline; }

/* ── Bande de confiance du footer ────────────────────────────────────────── */
.footer-confiance {
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
  padding: 1.5rem 0;
}
.footer-confiance__grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1.25rem;
}
.footer-confiance__item { display: flex; align-items: flex-start; gap: 0.8rem; }
.footer-confiance__item > i {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 12px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(255, 255, 255, 0.06);
  color: #4ade80;
  font-size: 1.2rem;
}
.footer-confiance__item strong { display: block; color: #fff; font-size: 0.9375rem; line-height: 1.3; }
.footer-confiance__item span { font-size: 0.78rem; color: rgba(255, 255, 255, 0.6); line-height: 1.45; }
@media (max-width: 900px) { .footer-confiance__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .footer-confiance__grid { grid-template-columns: 1fr; } }

/* ── Hero v2 : gabarit du plan (ligne degradee, avis a gauche, FC en panneau) ── */
/* Le H1 en deux lignes exactes : la largeur limitee a 16ch cassait la ligne
   degradee en deux — on l'elargit et on retient legerement le corps. */
.fcg-hero--v2 .fcg-hero__h1 {
  max-width: none;
  font-size: clamp(1.95rem, 3.9vw, 2.95rem);
  margin-bottom: 0.85rem;
}
.fcg-hero__h1-grad {
  display: block;
  background: linear-gradient(92deg, #6cb8ff 0%, #8f9bff 55%, #b48cf2 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
/* Avis sur fond sombre : pas de pastille blanche — la note, les etoiles et le
   lien posés directement sur le hero, comme sur le gabarit. */
.fcg-hero__avisrow { margin: 1.1rem 0 0; }
.fcg-hero__avisrow .fcg-rw { margin: 0; text-align: left; }
.fcg-hero__avisrow .fcg-rw__resume {
  background: transparent;
  border: 0;
  padding: 0;
  margin: 0;
  gap: 0.15rem 0.55rem;
}
.fcg-hero__avisrow .fcg-rw__note { color: #fff; font-size: 1.25rem; }
.fcg-hero__avisrow .fcg-rw__sur { color: rgba(255, 255, 255, 0.65); }
.fcg-hero__avisrow .fcg-rw__nb { color: rgba(255, 255, 255, 0.85); }
.fcg-hero__avisrow .fcg-rw__e { color: rgba(255, 255, 255, 0.28); }
.fcg-hero__avisrow .fcg-rw__e.is-on { color: #f5b83d; }
.fcg-hero__avisrow .fcg-rw__e.is-half {
  background: linear-gradient(90deg, #f5b83d 50%, rgba(255, 255, 255, 0.28) 50%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.fcg-hero__avisrow .fcg-rw__fallback {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin: 0.15rem 0 0;
}
.fcg-hero__avisrow .fcg-rw__fallback i { color: #35d0a0; }
.fcg-hero__avisrow .fcg-rw__fallback a {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #cfe4ff;
  text-decoration: underline;
  text-underline-offset: 3px;
}
.fcg-hero__avisrow .fcg-rw__fallback a:hover { color: #fff; }
.fcg-hero__panel-head--ok {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.8rem;
}
.fcg-hero__panel-head--ok h2 { font-size: 1.125rem; }
.fcg-hero__panel-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background: var(--fcg-teal, #12b58a);
  color: #fff;
  font-size: 1rem;
  box-shadow: 0 4px 12px rgba(18, 181, 138, 0.35);
}
.fcg-hero__ou {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0.85rem 0 0.7rem;
  color: var(--fcg-muted, #5e718d);
  font-size: 0.78rem;
  font-weight: 600;
}
.fcg-hero__ou::before,
.fcg-hero__ou::after {
  content: "";
  flex: 1;
  height: 1px;
  background: var(--fcg-line, #dce5f0);
}
/* Bouton FranceConnect du panneau : carte blanche + petite Marianne + texte,
   comme sur le gabarit — le bouton officiel bleu vit sur /parcours-rapide. */
.fcg-hero__fc2 {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: 100%;
  min-height: 52px;
  margin: 0 0 0.4rem;
  padding: 0.6rem 1rem;
  border: 1.5px solid var(--fcg-line, #dce5f0);
  border-radius: var(--fcg-radius-sm, 11px);
  background: #fff;
  color: var(--fcg-navy, #0a1e44);
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}
.fcg-hero__fc2:hover,
.fcg-hero__fc2:focus-visible {
  border-color: #9fbdd8;
  background: #f6faff;
  box-shadow: 0 4px 14px rgba(10, 30, 68, 0.08);
}
.fcg-hero__fc2 img { flex: 0 0 auto; display: block; }
.fcg-hero__fc2 span { flex: 1; text-align: left; }
.fcg-hero__fc2 strong { font-weight: 800; }
.fcg-hero__fc2 > i { color: var(--fcg-muted, #5e718d); font-size: 0.8125rem; }

/* Petits pictos bleus dans les champs du simulateur (gabarit du plan).
   Le departement recoit un second background (picto + chevron existant) ;
   la demarche passe par ::before sur le bouton du picker. */
.fcg-hero--v2 .fcg-hero__panel select#departementID {
  padding-left: 2.55rem;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%230a1e44' d='M1.4.6 6 5.2 10.6.6 12 2 6 8 0 2z'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%231a6fd4' d='M8 0a5.53 5.53 0 0 0-5.5 5.55c0 4.16 5.5 10.45 5.5 10.45s5.5-6.29 5.5-10.45A5.53 5.53 0 0 0 8 0zm0 7.9a2.35 2.35 0 1 1 0-4.7 2.35 2.35 0 0 1 0 4.7z'/%3E%3C/svg%3E");
  background-repeat: no-repeat, no-repeat;
  background-position: right 1rem center, left 0.95rem center;
  background-size: 12px 8px, 15px 15px;
}
.fcg-hero--v2 .fcg-hero__panel .fcg-dpk__btn { justify-content: flex-start; }
.fcg-hero--v2 .fcg-hero__panel .fcg-dpk__btn .fcg-dpk__chev { margin-left: auto; }
.fcg-hero--v2 .fcg-hero__panel .fcg-dpk__btn::before {
  content: "";
  flex: 0 0 auto;
  width: 15px;
  height: 15px;
  margin-right: -0.15rem;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%231a6fd4' d='M4 0a2 2 0 0 0-2 2v12a2 2 0 0 0 2 2h8a2 2 0 0 0 2-2V4.7a2 2 0 0 0-.6-1.4L10.7.6A2 2 0 0 0 9.3 0H4zm1 7.5h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1 0-1zm0 3h6a.5.5 0 0 1 0 1H5a.5.5 0 0 1 0-1zm0-6h3a.5.5 0 0 1 0 1H5a.5.5 0 0 1 0-1z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* Le departement est remplace au chargement par le composant de recherche
   (.fcg-ss__input, background bloque en !important) : le picto vit donc sur
   le conteneur, et le texte s'aligne a gauche comme sur le gabarit. */
.fcg-hero--v2 .fcg-hero__panel .fcg-ss { position: relative; }
.fcg-hero--v2 .fcg-hero__panel .fcg-ss::before {
  content: "";
  position: absolute;
  left: 0.95rem;
  top: 50%;
  transform: translateY(-50%);
  width: 15px;
  height: 15px;
  pointer-events: none;
  z-index: 1;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath fill='%231a6fd4' d='M8 0a5.53 5.53 0 0 0-5.5 5.55c0 4.16 5.5 10.45 5.5 10.45s5.5-6.29 5.5-10.45A5.53 5.53 0 0 0 8 0zm0 7.9a2.35 2.35 0 1 1 0-4.7 2.35 2.35 0 0 1 0 4.7z'/%3E%3C/svg%3E") center / contain no-repeat;
}
.fcg-hero--v2 .fcg-hero__panel .fcg-ss__input {
  padding-left: 2.55rem;
  text-align: left;
}

/* ── Message d'erreur en flux (mobile — remplace le tooltip flottant) ──────
   Même pastille que le style inline d'etape-two/demarche-option, pour que le
   fallback soit identique sur les pages qui n'embarquent pas ce style. */
.invalid-feedback-custom {
  display: inline-block;
  position: relative;
  margin-top: 8px;
  padding: 6px 12px;
  border-radius: 6px;
  background-color: #dc3545;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  line-height: 1.45;
  box-shadow: 0 2px 8px rgba(220, 53, 69, 0.2);
  z-index: 10;
}
.invalid-feedback-custom::before {
  content: "";
  position: absolute;
  top: -6px;
  left: 15px;
  border-left: 6px solid transparent;
  border-right: 6px solid transparent;
  border-bottom: 6px solid #dc3545;
}
