/* ==========================================================================
   VITRINE — feuille commune des pages publiques (refonte visuelle, 10/2026)
   Jetons de couleur, rythme des sections, boutons, maquettes d'interface
   (données fictives), apparition au défilement. Chaque page n'ajoute que ses
   mises en page propres.
   ========================================================================== */

:root{
  /* ---- COULEURS : seule source de vérité. Aucune valeur en dur ailleurs. ---- */
  /* Marine : logo, titres, texte fort, boutons sombres — jamais en grande surface */
  --c-marine:#0e295c;
  --c-marine-survol:#1a3a7a;
  /* Bleu de surface : grandes zones colorées (haut de page, bandeau, appel final, pied) */
  --c-surface:#0a1f47;         /* variante A retenue le 23/10 (B et C : static/maquettes/test-hero.html) */
  --c-surface-2:#0e295c;       /* fin du dégradé */
  --c-sur-surface:#ffffff;     /* texte principal sur surface */
  --c-sur-surface-2:#dbe4f7;   /* texte courant sur surface */
  --c-sur-surface-3:#b9c7e8;   /* notes, sources sur surface */
  --c-trame:#ffffff;           /* traits de la trame de plan sur surface */
  /* Orange du logo */
  --c-orange:#e1622b;          /* filets, pictogrammes, grands titres sur fond clair */
  --c-orange-btn:var(--c-orange); /* un seul orange sur tout le site : celui du logo (comme le site en ligne) */
  --c-orange-btn-survol:#c9541f; /* survol, déjà utilisé sur le site en ligne */
  --c-orange-clair:#f4a07a;    /* tous les textes orange sur fond sombre (décision validée) */
  --c-orange-pale:#fdeee7;
  --c-logo-gris:#c8c4be;       /* arc gris du logo */
  /* Fonds clairs */
  --c-fond:#ffffff;
  --c-fond-clair:#f3f6fc;      /* blanc teinté de bleu */
  --c-fond-clair-2:#e6ecf8;
  --c-bord:#dde4f2;
  /* Texte sur fond clair (tous AA sur --c-fond et --c-fond-clair) */
  --c-texte:#1f2937;
  --c-texte-2:#4b5563;
  --c-texte-3:#5b6472;
  /* Familles de profils */
  --c-profil-moa:var(--c-marine);
  --c-profil-moe:var(--c-orange-btn);
  --c-profil-ent:#3a5a44;
  /* Statut « Autorisé » / vérifié */
  --c-statut:#1f7a4d;
  --c-statut-pale:#e3f3ea;
  /* Ombres : marine transparent */
  --c-ombre:color-mix(in srgb,var(--c-marine) 9%,transparent);
  --c-ombre-forte:color-mix(in srgb,var(--c-marine) 22%,transparent);

  /* Dégradé des grandes surfaces */
  --v-degrade-surface:linear-gradient(160deg,var(--c-surface) 0%,var(--c-surface-2) 100%);

  --v-rayon:12px;
  --v-ombre:0 1px 2px var(--c-ombre),0 8px 24px var(--c-ombre);
  --v-ombre-haute:0 2px 4px var(--c-ombre),0 24px 56px var(--c-ombre-forte);
  --v-anim:200ms cubic-bezier(.2,.7,.3,1);
  --v-largeur:1180px; --v-nav-h:76px;
  --v-courbe:clamp(28px,5vw,80px); /* hauteur de la courbe sous le haut de page */
  --v-panneau-marge:32px; --v-panneau-rayon:40px; --v-panneau-espace:24px; /* panneaux sombres arrondis */
  --v-gouttiere:48px;
  --v-section:64px;
}

.vitrine *,.vitrine *::before,.vitrine *::after{box-sizing:border-box}
.vitrine{font-family:'Outfit',sans-serif;color:var(--c-texte);background:var(--c-fond);
  font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;margin:0}
:where(.vitrine) :where(h1,h2,h3,p){margin:0}
:where(.vitrine) :where(a){color:inherit}

/* ---------- Conteneurs et sections ---------- */
.v-wrap{max-width:var(--v-largeur);margin:0 auto;padding:0 var(--v-gouttiere)}
.v-sec{padding:var(--v-section) 0;position:relative}
.v-sec--blanc{background:var(--c-fond)}
.v-sec--gris{background:var(--c-fond-clair)}
.v-sec--marine{background:var(--v-degrade-surface);color:var(--c-sur-surface-2)}
.v-sec--serre{padding:var(--v-section) 0}

/* Étiquette, titres, chapô */
.v-tag{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;
  letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:18px}
.v-tag::before{content:'';width:22px;height:2px;background:currentColor;border-radius:2px}
.v-sec--marine .v-tag{color:var(--c-orange-clair)}
.v-h2{font-size:clamp(28px,3.4vw,42px);font-weight:600;line-height:1.15;letter-spacing:-.02em;
  color:var(--c-marine);text-wrap:balance}
.v-sec--marine .v-h2{color:var(--c-fond)}
.v-chapo{font-size:18px;color:var(--c-texte-2);line-height:1.7;max-width:60ch;margin-top:18px}
.v-sec--marine .v-chapo{color:var(--c-sur-surface-2)}
.v-entete{margin-bottom:56px}
.v-entete--ligne{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;flex-wrap:wrap}

/* ---------- Boutons : 3 types, une seule définition chacun. Aucune flèche. ----------
   Primaire   .v-btn.v-btn--primaire   : orange plein, texte blanc
   Secondaire .v-btn.v-btn--secondaire : contour 1,5 px, se remplit au survol
                                         (marine sur fond clair, blanc dans un contexte .v-sombre)
   Tertiaire  .v-lien                  : texte seul, soulignement fin dessiné de gauche à droite au survol
   Primaire et secondaire ont la même hauteur et le même arrondi que les cartes. */
.v-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-family:inherit;
  font-size:16px;font-weight:600;line-height:1.2;min-height:52px;padding:0 26px;border-radius:var(--v-rayon);
  border:1.5px solid transparent;cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background-color var(--v-anim),color var(--v-anim),border-color var(--v-anim),box-shadow var(--v-anim),transform var(--v-anim)}
.v-btn--primaire{background:var(--c-orange-btn);color:var(--c-fond);
  box-shadow:0 6px 18px color-mix(in srgb,var(--c-orange-btn) 30%,transparent)}
.v-btn--primaire:hover{background:var(--c-orange-btn-survol);transform:translateY(-1px);
  box-shadow:0 10px 24px color-mix(in srgb,var(--c-orange-btn) 36%,transparent)}
.v-btn--secondaire{background:transparent;color:var(--c-marine);border-color:var(--c-marine)}
.v-btn--secondaire:hover{background:var(--c-marine);color:var(--c-fond)}
.v-sombre .v-btn--secondaire{color:var(--c-sur-surface);border-color:var(--c-sur-surface)}
.v-sombre .v-btn--secondaire:hover{background:var(--c-sur-surface);color:var(--c-marine)}

.v-lien{display:inline;font-weight:600;font-size:16px;text-decoration:none;color:var(--c-orange-btn);padding-bottom:3px;
  background:linear-gradient(currentColor,currentColor) left bottom / 0 1.5px no-repeat;transition:background-size 260ms cubic-bezier(.2,.7,.3,1)}
.v-lien:hover,.v-carte-lien:hover .v-lien{background-size:100% 1.5px}
.v-sombre .v-lien{color:var(--c-sur-surface)}
.v-btn:focus-visible,.v-lien:focus-visible,.v-carte-lien:focus-visible{outline:3px solid var(--c-orange-clair);outline-offset:3px}

/* ---------- Trame de plan (SVG en fond) ---------- */
.v-trame{position:absolute;inset:0;pointer-events:none;overflow:hidden;color:var(--c-trame)}
.v-trame--fonce{color:var(--c-marine)}
.v-trame svg{position:absolute;inset:0;width:100%;height:100%}

/* ---------- Cartes ---------- */
.v-carte{background:var(--c-fond);border-radius:var(--v-rayon);box-shadow:var(--v-ombre);
  border:1px solid transparent;transition:transform var(--v-anim),box-shadow var(--v-anim),border-color var(--v-anim)}
.v-carte-lien{display:flex;flex-direction:column;text-decoration:none;color:inherit}
.v-carte-lien:hover,.v-carte--survol:hover{transform:translateY(-3px);border-color:var(--c-orange);
  box-shadow:0 2px 4px var(--c-ombre),0 16px 36px var(--c-ombre-forte)}

/* Pictogramme dans une pastille */
.v-picto{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:none;
  background:var(--c-fond-clair-2);color:var(--c-marine)}
.v-picto svg{width:24px;height:24px}
.v-picto--orange{background:var(--c-orange-pale);color:var(--c-orange-btn)}
.v-picto--vert{background:var(--c-statut-pale);color:var(--c-statut)}

/* Badge « Recommandé » */
.v-badge-reco{display:inline-flex;align-items:center;gap:6px;background:var(--c-orange-btn);color:var(--c-fond);
  font-size:13px;font-weight:600;padding:5px 11px 5px 9px;border-radius:999px;width:fit-content}
.v-badge-reco svg{width:14px;height:14px}

/* ==========================================================================
   MAQUETTES D'INTERFACE (données fictives, aria-hidden côté page)
   ========================================================================== */
.mq{font-family:'Outfit',sans-serif;font-size:13px;line-height:1.4;color:var(--c-texte);text-align:left;
  background:var(--c-fond);border-radius:14px;box-shadow:var(--v-ombre-haute);overflow:hidden;user-select:none}
.mq-barre{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--c-bord);background:var(--c-fond)}
.mq-barre-titre{font-weight:600;color:var(--c-marine);font-size:13.5px;display:flex;align-items:center;gap:8px}
.mq-barre-titre svg{width:16px;height:16px;color:var(--c-orange)}
.mq-barre-fin{margin-left:auto;display:flex;align-items:center;gap:8px;color:var(--c-texte-3)}
.mq-barre-fin svg{width:16px;height:16px}
.mq-pastille-notif{position:relative}
.mq-pastille-notif::after{content:'';position:absolute;top:-1px;right:-1px;width:7px;height:7px;border-radius:50%;background:var(--c-orange);box-shadow:0 0 0 2px var(--c-fond)}
.mq-corps{padding:14px 16px 16px;background:var(--c-fond-clair)}
.mq-filtres{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:12px}
.mq-filtre{display:inline-flex;align-items:center;gap:5px;background:var(--c-fond);border:1px solid var(--c-bord);border-radius:999px;
  padding:4px 10px;font-size:11.5px;font-weight:500;color:var(--c-texte-2)}
.mq-filtre--actif{background:var(--c-marine);border-color:var(--c-marine);color:var(--c-fond)}
.mq-filtre svg{width:11px;height:11px}
.mq-compte{font-size:11.5px;color:var(--c-texte-3);margin-bottom:8px}
.mq-compte b{color:var(--c-marine);font-weight:600}

.mq-permis{background:var(--c-fond);border:1px solid var(--c-bord);border-radius:10px;padding:12px 14px;display:grid;gap:8px}
.mq-permis + .mq-permis{margin-top:8px}
.mq-permis-haut{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.mq-type{font-size:10.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-3)}
.mq-statut{display:inline-flex;align-items:center;gap:5px;margin-left:auto;background:var(--c-statut-pale);color:var(--c-statut);
  font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px}
.mq-statut::before{content:'';width:6px;height:6px;border-radius:50%;background:currentColor}
.mq-adresse{font-size:14px;font-weight:600;color:var(--c-marine);display:flex;align-items:center;gap:6px}
.mq-adresse svg{width:14px;height:14px;color:var(--c-orange);flex:none}
.mq-donnees{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
.mq-donnee{background:var(--c-fond-clair);border-radius:7px;padding:6px 8px}
.mq-donnee span{display:block;font-size:10px;color:var(--c-texte-3);text-transform:uppercase;letter-spacing:.05em}
.mq-donnee b{display:block;font-size:13px;font-weight:600;color:var(--c-marine);margin-top:1px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mq-moa{display:flex;align-items:center;gap:6px;font-size:11.5px;color:var(--c-texte-2);padding-top:8px;border-top:1px dashed var(--c-bord)}
.mq-moa svg{width:12px;height:12px;color:var(--c-orange)}
.mq-moa b{font-weight:600;color:var(--c-marine)}
.mq-permis--compact .mq-donnees{grid-template-columns:repeat(2,minmax(0,1fr))}

/* Alerte flottante */
.mq-alerte{display:flex;align-items:flex-start;gap:10px;background:var(--c-fond);border-radius:12px;padding:12px 14px;
  box-shadow:var(--v-ombre-haute);font-size:12.5px;line-height:1.35;max-width:260px}
.mq-alerte-picto{width:30px;height:30px;border-radius:8px;background:var(--c-orange-pale);color:var(--c-orange-btn);display:flex;align-items:center;justify-content:center;flex:none}
.mq-alerte-picto svg{width:16px;height:16px}
.mq-alerte b{display:block;color:var(--c-marine);font-weight:600;font-size:13px}
.mq-alerte span{color:var(--c-texte-2)}

/* Recommandation vérifiée */
.mq-reco{padding:16px;display:grid;gap:10px}
.mq-reco-haut{display:flex;align-items:center;gap:10px}
.mq-av{width:36px;height:36px;border-radius:10px;background:var(--c-marine);color:var(--c-fond);font-weight:600;font-size:13px;display:flex;align-items:center;justify-content:center;flex:none}
.mq-av--orange{background:var(--c-orange-btn)}
.mq-av--vert{background:var(--c-profil-ent)}
.mq-nom{font-weight:600;color:var(--c-marine);font-size:13.5px}
.mq-sous{font-size:11.5px;color:var(--c-texte-3)}
.mq-verifie{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:600;color:var(--c-statut);background:var(--c-statut-pale);padding:3px 8px;border-radius:999px;width:fit-content}
.mq-verifie svg{width:12px;height:12px}
.mq-citation{font-size:12.5px;color:var(--c-texte-2);line-height:1.5;border-left:2px solid var(--c-orange);padding-left:10px}
.mq-ligne{height:8px;border-radius:4px;background:var(--c-fond-clair-2)}

/* Annonce / appel à candidatures */
.mq-annonce{padding:16px;display:grid;gap:10px}
.mq-etiq{display:inline-block;width:fit-content;background:var(--c-orange-pale);color:var(--c-orange-btn);font-size:11px;font-weight:600;padding:3px 9px;border-radius:6px}
.mq-annonce-titre{font-weight:600;font-size:14px;color:var(--c-marine);line-height:1.3}
.mq-meta{display:flex;gap:12px;flex-wrap:wrap;font-size:11.5px;color:var(--c-texte-3)}
.mq-meta span{display:inline-flex;align-items:center;gap:4px}
.mq-meta svg{width:12px;height:12px}
.mq-annonce-pied{display:flex;align-items:center;justify-content:space-between;padding-top:10px;border-top:1px solid var(--c-bord)}
.mq-mini-btn{background:var(--c-marine);color:var(--c-fond);font-size:11.5px;font-weight:600;padding:6px 12px;border-radius:7px}
.mq-candidats{display:flex;align-items:center}
.mq-candidats i{width:22px;height:22px;border-radius:50%;border:2px solid var(--c-fond);margin-left:-6px;background:var(--c-fond-clair-2)}
.mq-candidats i:first-child{margin-left:0;background:var(--c-fond-clair-2)}
.mq-candidats i:nth-child(2){background:var(--c-orange-pale)}

/* Mention « données fictives » */
.mq-legende{font-size:12px;color:var(--c-texte-3);margin-top:14px;text-align:center}
.v-sec--marine .mq-legende,.v-hero .mq-legende{color:var(--c-sur-surface-3)}

/* ==========================================================================
   APPARITION AU DÉFILEMENT — masqué seulement si le JS est là et que
   l'utilisateur n'a pas demandé à réduire les animations.
   ========================================================================== */
.v-js-rv .rv{opacity:0;transform:translateY(18px);transition:opacity 500ms ease,transform 500ms cubic-bezier(.2,.7,.3,1)}
.v-js-rv .rv.rv-vu{opacity:1;transform:none}
.v-js-rv .rv-d1{transition-delay:80ms}
.v-js-rv .rv-d2{transition-delay:160ms}
.v-js-rv .rv-d3{transition-delay:240ms}
@media (prefers-reduced-motion:reduce){
  .vitrine *{transition:none !important;animation:none !important;scroll-behavior:auto !important}
  .vitrine *::before,.vitrine *::after{animation:none !important}
  html{scroll-behavior:auto !important}
}

.v-sr{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

@media (max-width:900px){
  :root{--v-section:56px;--v-gouttiere:24px;--v-panneau-marge:24px;--v-panneau-rayon:32px}
  .v-entete{margin-bottom:40px}
}
@media (max-width:480px){
  :root{--v-section:48px;--v-gouttiere:16px;--v-panneau-marge:12px;--v-panneau-rayon:22px;--v-panneau-espace:8px}
  .vitrine{font-size:16px}
  .v-chapo{font-size:17px}
  .v-btn{width:100%}
}
/* Mobile : 16px minimum sur les champs — sinon iOS Safari zoome au focus. */
@media (max-width:768px){.vitrine input,.vitrine textarea,.vitrine select{font-size:16px !important}}

/* ---- Réseau de profils (hero de l'accueil) ---- */
.mq-reseau{position:relative;width:100%;max-width:440px;height:340px;margin-left:auto}
.mq-reseau-liens{position:absolute;inset:0;width:100%;height:100%}
.mq-reseau-liens :is(path,circle,ellipse){stroke:var(--c-sur-surface);stroke-opacity:.6;stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke}
.mq-reseau-liens .mq-reseau-fin{stroke-opacity:.28;stroke-dasharray:3 5}
.mq-noeud{position:absolute;width:210px;display:flex;align-items:center;gap:10px;background:var(--c-fond);
  border-radius:var(--v-rayon);padding:12px 14px;box-shadow:var(--v-ombre-haute)}
.mq-noeud-ico{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--c-fond);background:var(--c)}
.mq-noeud-ico svg{width:20px;height:20px}
.mq-noeud-txt{display:flex;flex-direction:column;gap:2px;min-width:0}
.mq-noeud-txt b{font-size:15.5px;font-weight:600;color:var(--c-marine);line-height:1.25}
.mq-noeud-txt span{font-size:12px;color:var(--c-texte-3)}
.mq-noeud.moa{--c:var(--c-profil-moa)}.mq-noeud.moe{--c:var(--c-profil-moe)}.mq-noeud.ent{--c:var(--c-profil-ent)}
.mq-reseau-badge{position:absolute;left:150px;top:182px;z-index:2;display:inline-flex;align-items:center;gap:5px;white-space:nowrap;
  font-size:12px;font-weight:600;color:var(--c-statut);background:var(--c-statut-pale);padding:4px 10px;border-radius:999px;box-shadow:var(--v-ombre)}
.mq-reseau-badge svg{width:13px;height:13px}
@media (max-width:480px){
  .mq-reseau{margin:0 auto}
  .mq-reseau-badge{left:auto;right:8px}
}

/* ==========================================================================
   MENU DES PAGES PUBLIQUES (.vn)
   État --hero : transparent sur le haut de page sombre (logo et liens clairs).
   État --plein : blanc légèrement transparent, flou et ombre légère (au défilement
   ou d'emblée sur les pages sans haut de page sombre).
   ========================================================================== */
.vn{position:fixed;top:0;left:0;right:0;z-index:200;height:var(--v-nav-h);color:var(--c-sur-surface);
  transition:background-color var(--v-anim),box-shadow var(--v-anim),color var(--v-anim)}
.vn--plein{color:var(--c-marine);background:color-mix(in srgb,var(--c-fond) 88%,transparent);
  -webkit-backdrop-filter:saturate(1.4) blur(14px);backdrop-filter:saturate(1.4) blur(14px);
  box-shadow:0 1px 0 var(--c-bord),0 6px 20px var(--c-ombre)}
body.vitrine:not(.vitrine--hero){padding-top:var(--v-nav-h)}
.vn-barre{height:100%;max-width:var(--v-largeur);margin:0 auto;padding:0 var(--v-gouttiere);display:flex;align-items:center;gap:24px}

.vn-logo{display:flex;align-items:center;gap:14px;text-decoration:none;color:inherit;flex:none}
.vn-logo svg{width:64px;height:64px;color:var(--c-sur-surface)}  /* tailles reprises de l'ancien menu */
.vn--plein .vn-logo svg{color:var(--c-marine)}
.vn-logo-gris{stroke:var(--c-sur-surface-3)}
.vn--plein .vn-logo-gris{stroke:var(--c-logo-gris)}
.vn-marque{font-size:30px;font-weight:800;letter-spacing:2px;line-height:1;color:var(--c-sur-surface)}
.vn--plein .vn-marque{color:var(--c-marine)}
.vn-amo{color:var(--c-orange)}

.vn-nav{margin:0 auto}
.vn-liste{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.vn-groupe{position:relative}
.vn-lien{position:relative;display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:15.5px;font-weight:500;
  color:inherit;background:none;border:0;cursor:pointer;text-decoration:none;padding:10px 12px;border-radius:8px;white-space:nowrap}
.vn-chevron{width:16px;height:16px;transition:transform var(--v-anim)}
.vn-lien[aria-expanded="true"] .vn-chevron{transform:rotate(180deg)}
/* Soulignement : trait orange fin pour la page active, esquissé au survol */
.vn-lien::after{content:'';position:absolute;left:12px;right:12px;bottom:4px;height:2px;border-radius:2px;
  background:var(--c-orange);transform:scaleX(0);transform-origin:left;transition:transform var(--v-anim)}
.vn-lien:hover::after{transform:scaleX(1);opacity:.5}
.vn-lien.vn-actif::after{transform:scaleX(1);opacity:1}
.vn-lien:focus{outline:none}
.vn-lien:focus-visible,.vn-item:focus-visible,.vn-logo:focus-visible,.vn-burger:focus-visible,.vn-t-lien:focus-visible{outline:3px solid var(--c-orange-clair);outline-offset:2px}
.vn--plein .vn-lien:focus-visible,.vn-panneau .vn-item:focus-visible,.vn--plein .vn-logo:focus-visible{outline-color:var(--c-orange-btn)}

/* Panneaux déroulants */
.vn-panneau{position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%,6px);min-width:300px;padding:10px;
  background:var(--c-fond);border-radius:14px;box-shadow:0 18px 48px var(--c-ombre-forte),0 0 0 1px var(--c-bord);
  display:grid;gap:2px;opacity:0;visibility:hidden;transition:opacity var(--v-anim),transform var(--v-anim),visibility 0s linear 200ms}
.vn-panneau::before{content:'';position:absolute;left:0;right:0;top:-12px;height:12px}
.vn-panneau--large{grid-template-columns:repeat(2,minmax(0,1fr));min-width:560px;gap:6px}
.vn-groupe.vn-ouvert .vn-panneau{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
@media (hover:hover) and (min-width:1200px){
  .vn-groupe:hover:not(.vn-ferme) .vn-panneau{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s}
  /* La flèche suit le panneau, qu'il soit ouvert au survol ou au clic */
  .vn-groupe:hover:not(.vn-ferme) .vn-chevron{transform:rotate(180deg)}
}
.vn-item{display:flex;align-items:center;gap:14px;padding:10px;border-radius:10px;text-decoration:none;
  color:var(--c-marine);font-size:15.5px;font-weight:600;line-height:1.3;transition:background-color var(--v-anim)}
.vn-item:hover{background:var(--c-fond-clair)}
.vn-item[aria-current="page"]{background:var(--c-fond-clair);box-shadow:inset 3px 0 0 var(--c-orange)}
.vn-ico{flex:none;width:36px;height:36px;border-radius:10px;display:grid;place-items:center;color:var(--c-fond);background:var(--c)}
.vn-ico svg{width:20px;height:20px}
.vn-item--profil.moa{--c:var(--c-profil-moa)}.vn-item--profil.moe{--c:var(--c-profil-moe)}.vn-item--profil.ent{--c:var(--c-profil-ent)}

/* Mini-vignettes de maquette */
.vn-vig{flex:none;position:relative;width:76px;height:54px;border-radius:8px;background:var(--c-fond-clair);
  box-shadow:inset 0 0 0 1px var(--c-bord);overflow:hidden}
.vn-vig i,.vn-vig b,.vn-vig em,.vn-vig s,.vn-vig u{position:absolute;display:block}
.vn-vig--annuaire i{left:8px;top:9px;width:14px;height:14px;border-radius:50%;background:var(--c-marine)}
.vn-vig--annuaire i.r2{top:31px;background:var(--c-orange)}
.vn-vig--annuaire b{left:27px;top:10px;width:38px;height:5px;border-radius:3px;background:var(--c-marine);opacity:.7}
.vn-vig--annuaire b.c{top:18px;width:26px;opacity:.25}
.vn-vig--annuaire b.b2{top:32px}
.vn-vig--annuaire b.c2{top:40px}
.vn-vig--annonces em{left:8px;top:8px;width:26px;height:9px;border-radius:5px;background:var(--c-orange-pale);box-shadow:inset 0 0 0 1px var(--c-orange)}
.vn-vig--annonces b{left:8px;top:23px;width:56px;height:6px;border-radius:3px;background:var(--c-marine);opacity:.75}
.vn-vig--annonces b.c{top:33px;width:44px;height:4px;opacity:.25}
.vn-vig--annonces b.d{top:41px;width:32px}
.vn-vig--radar s{left:50%;top:50%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:1.5px solid var(--c-marine);opacity:.35}
.vn-vig--radar s.s2{width:20px;height:20px;margin:-10px 0 0 -10px}
.vn-vig--radar u{left:44px;top:15px;width:7px;height:7px;border-radius:50%;background:var(--c-orange)}
.vn-vig--radar u.u2{left:27px;top:31px;background:var(--c-marine)}
.vn-vig--radar u.u3{left:49px;top:35px;background:var(--c-statut)}
.vn-vig--etapes{display:flex;align-items:center;justify-content:center;gap:6px}
.vn-vig--etapes em{position:static;width:18px;height:18px;border-radius:50%;background:var(--c-fond);box-shadow:inset 0 0 0 1.5px var(--c-marine);
  font-style:normal;font-size:10px;font-weight:700;color:var(--c-marine);display:grid;place-items:center}
.vn-vig--etapes em:last-child{background:var(--c-orange-btn);box-shadow:none;color:var(--c-fond)}

/* Partie droite */
.vn-droite{display:flex;align-items:center;gap:8px;flex:none}
.vn-discret{opacity:.85}
.vn-discret:hover{opacity:1}
.vn-inscription{min-height:44px;padding:0 20px;font-size:15px}
.vn-av{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-size:11px;font-weight:600;
  background:var(--c-orange-btn);color:var(--c-fond)}

/* Tiroir mobile */
.vn-burger{display:none;margin-left:auto;width:44px;height:44px;border:0;border-radius:10px;background:none;color:inherit;cursor:pointer;place-items:center}
.vn-burger svg{width:24px;height:24px}
.vn-tiroir{position:fixed;inset:var(--v-nav-h) 0 0 0;z-index:199;background:var(--c-fond);color:var(--c-marine);display:flex;flex-direction:column}
.vn-tiroir[hidden]{display:none}
.vn-tiroir-corps{flex:1;overflow-y:auto;padding:12px var(--v-gouttiere) 24px}
.vn-tiroir-titre{font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-texte-3);margin:20px 0 4px}
.vn-t-lien{display:block;padding:13px 0;font-size:18px;font-weight:500;color:var(--c-marine);text-decoration:none;border-bottom:1px solid var(--c-bord)}
.vn-t-lien[aria-current="page"]{color:var(--c-orange-btn);font-weight:600}
.vn-tiroir-pied{flex:none;display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px var(--v-gouttiere) calc(14px + env(safe-area-inset-bottom));
  background:var(--c-fond);box-shadow:0 -1px 0 var(--c-bord),0 -8px 24px var(--c-ombre)}
.vn-tiroir-pied .v-btn{width:100%}
html.vn-bloque,html.vn-bloque body{overflow:hidden}
.vn.vn-tiroir-ouvert{color:var(--c-marine);background:var(--c-fond);box-shadow:0 1px 0 var(--c-bord);-webkit-backdrop-filter:none;backdrop-filter:none}
/* ↑ sans flou : un backdrop-filter fait du menu le cadre des éléments en position fixe, et le tiroir
   (position:fixed, sous le menu) se réduisait à la hauteur du menu une fois la page défilée. */
.vn.vn-tiroir-ouvert .vn-logo svg,.vn.vn-tiroir-ouvert .vn-marque{color:var(--c-marine)}
.vn.vn-tiroir-ouvert .vn-logo-gris{stroke:var(--c-logo-gris)}

/* Sous 1200 px, logo + 5 entrées + boutons ne tiennent plus sur une ligne : tiroir */
@media (max-width:1199px){
  .vn-nav,.vn-droite{display:none}
  .vn-burger{display:grid}
}
@media (max-width:900px){
  .vn-marque{font-size:22px}
}
@media (max-width:480px){
  .vn-barre{padding:0 12px 0 16px}
}
@media (max-width:380px){
  .vn-logo{gap:8px}
  .vn-logo svg{width:44px;height:44px}
  .vn-marque{font-size:17px;letter-spacing:1px}
  .vn-tiroir-corps,.vn-tiroir-pied{padding-left:16px;padding-right:16px}
}

/* ==========================================================================
   PANNEAUX SOMBRES : pas de coupe entre sections. Le bandeau sombre central et
   l'appel final + pied de page sont de grands panneaux marine posés sur le fond
   clair, avec une marge latérale et des coins arrondis. La trame reste dedans.
   ========================================================================== */
.v-panneau{margin:var(--v-panneau-espace) var(--v-panneau-marge) var(--v-section);border-radius:var(--v-panneau-rayon);overflow:hidden;
  padding-top:calc(var(--v-section) + 24px);padding-bottom:calc(var(--v-section) + 24px)}

/* ==========================================================================
   PIED DE PAGE fusionné avec l'appel final (.vp)
   ========================================================================== */
.vp{position:relative;overflow:hidden;background:var(--v-degrade-surface);color:var(--c-sur-surface-2);
  margin:var(--v-panneau-espace) var(--v-panneau-marge) 0;padding-top:calc(var(--v-section) + 24px);
  border-radius:var(--v-panneau-rayon) var(--v-panneau-rayon) 0 0}
.vp > .v-wrap{position:relative}
/* Pied sans appel final (fiches annuaire / annonces, contact) : pas de grand vide ni de trait en tête */
.vp:not(:has(.vp-appel)){padding-top:24px}
.vp:not(:has(.vp-appel)) .vp-corps::before{display:none}
.vp .v-trame{opacity:.6}
.vp-appel{text-align:center;padding-bottom:64px}
.vp-appel .v-tag{color:var(--c-orange-clair)}
.vp-appel .v-h2{color:var(--c-sur-surface);max-width:22ch;margin:0 auto}
.vp-appel .v-chapo{color:var(--c-sur-surface-2);margin:20px auto 0;max-width:62ch}
.vp-actions{display:flex;justify-content:center;align-items:center;gap:16px;flex-wrap:wrap;margin-top:36px}
.vp-note{font-size:15px;color:var(--c-sur-surface-3);margin-top:24px}
.vp-corps{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:48px;
  padding-top:48px;padding-bottom:48px}
.vp-marque p{font-size:16px;line-height:1.65;color:var(--c-sur-surface-2);margin-top:18px;max-width:34ch}
.vp-logo{color:var(--c-sur-surface)}
.vp-logo svg{width:36px;height:36px}
.vp-logo .vn-marque{font-size:20px;color:var(--c-sur-surface)}
.vp-col{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.vp-titre{font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-orange-clair);margin-bottom:6px}
.vp-col a,.vp-legal a{color:var(--c-sur-surface-2);text-decoration:none;padding-bottom:3px;
  background:linear-gradient(currentColor,currentColor) left bottom / 0 1.5px no-repeat;background-origin:content-box;background-clip:content-box;
  transition:color var(--v-anim),background-size 260ms cubic-bezier(.2,.7,.3,1)}
.vp-col a{font-size:16px;line-height:1.4}
.vp-col a:hover,.vp-legal a:hover{color:var(--c-orange-clair);background-size:100% 1.5px}
.vp-legal{display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;padding-top:22px;padding-bottom:28px;font-size:13.5px;
  color:var(--c-sur-surface-3)}
/* Filets alignés sur le contenu (hors gouttières) */
.vp-corps::before,.vp-legal::before{content:'';position:absolute;top:0;left:var(--v-gouttiere);right:var(--v-gouttiere);height:1px;
  background:color-mix(in srgb,var(--c-sur-surface) 14%,transparent)}
.vp-legal a{color:var(--c-sur-surface-3)}
.vp a:focus-visible{outline:3px solid var(--c-orange-clair);outline-offset:3px;border-radius:2px}
@media (max-width:900px){
  .vp-corps{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}
  /* Écrans tactiles : zone de clic d'au moins 44 px */
  .vp-col{gap:0}
  /* 44 px de zone de clic par marges intérieures : le soulignement reste collé au texte */
  .vp-col a,.vp-legal a{display:inline-block;padding:11px 0}
  .vp-col a.vp-linkedin{display:inline-flex}
  .vp-legal{gap:0 18px}
  .vp-marque{grid-column:1 / -1}
}
@media (max-width:560px){
  .vp-corps{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 16px}
  .vp-actions .v-btn{width:100%}
  .vp-appel{padding-bottom:40px}
  .vp-corps{padding-top:32px}
}
@media (max-width:480px){
  .vp-corps{grid-template-columns:minmax(0,1fr)}
}

/* Carte 03 : appel à candidatures confidentiel */
.mq-conf-lignes{display:grid;padding:6px 16px 10px}
.mq-conf-ligne{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;font-size:13px;border-bottom:1px solid var(--c-bord)}
.mq-conf-ligne:last-child{border-bottom:0}
.mq-conf-ligne span{color:var(--c-texte-3)}
.mq-conf-ligne b{color:var(--c-marine);font-weight:600;text-align:right}
.mq-conf-gratuit{color:var(--c-statut) !important;background:var(--c-statut-pale);padding:2px 10px;border-radius:999px}

/* Apparition immédiate du visuel du haut de page (moins de 600 ms, sans attendre le défilement) */
@keyframes v-entree{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.v-entree{animation:v-entree 480ms cubic-bezier(.2,.7,.3,1) 60ms both}
@media (prefers-reduced-motion:reduce){.v-entree{animation:none}}
@media (max-width:400px){
  .mq-donnee{padding:6px 6px}
  .mq-donnee b{font-size:12px}
}
/* Panneaux sur mobile : 24 px de marge intérieure */
@media (max-width:480px){
  .v-panneau > .v-wrap,.vp > .v-wrap{padding-left:20px;padding-right:20px}
}

/* =====================================================================
   HAUT DE PAGE MARINE + BANDE QUI CHEVAUCHE (accueil et pages intérieures)
   ===================================================================== */
/* HERO — occupe le premier écran : contenu centré, bande des bénéfices ancrée en bas.
   Le fond remplit toute la fenêtre ; le contenu est plafonné à 900 px de haut sur grand écran
   pour ne pas s'étirer, ce qui garantit que la section suivante reste sous la ligne de flottaison. */
.v-hero{position:relative;overflow:hidden;color:var(--c-fond);background:var(--v-degrade-surface);
  min-height:100svh;display:flex;flex-direction:column}
.v-hero-int{position:relative;flex:1 1 auto;display:flex;flex-direction:column;width:100%;padding:var(--v-nav-h) 0 36px}
.v-hero .v-plan{position:absolute;left:-140px;bottom:-150px;width:520px;opacity:.6}
/* Le contenu se centre dans l'espace restant ; ses marges sont plafonnées pour ne pas s'étirer sur grand écran */
.v-hero-grille{position:relative;flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);
  gap:56px;align-items:center;padding-top:clamp(24px,4svh,56px);padding-bottom:clamp(24px,4svh,48px);max-height:760px;margin:auto;width:100%}
.v-hero .v-tag{color:var(--c-orange-clair)}
.v-hero h1{font-size:clamp(34px,3.9vw,58px);font-weight:500;line-height:1.1;letter-spacing:normal;color:var(--c-fond);text-wrap:balance}
.v-hero h1 em{font-style:normal;color:var(--c-orange-clair)}
.v-hero-sous{font-size:clamp(17px,1.35vw,19px);line-height:1.6;color:var(--c-sur-surface-2);margin-top:20px;max-width:58ch}
.v-hero-actions{display:flex;align-items:center;gap:28px;flex-wrap:wrap;margin-top:32px}
.v-hero-visuel{position:relative;width:100%;max-width:440px;margin-left:auto}
/* COULEUR DE PROFIL — pages profil (28/10) : libellé du hero en couleur claire, filet de 3 px en haut de la bande des bénéfices
   (filet dans la même couleur claire que le libellé, lisible sur le fond marine). Classe v-profil--moa|moe|entreprise sur la section .v-hero. */
.v-profil--moa{--tag-profil:rgb(110 168 255);--filet-profil:var(--tag-profil)}
.v-profil--moe{--tag-profil:#f4a07a;--filet-profil:var(--tag-profil)}
.v-profil--entreprise{--tag-profil:#6fcf97;--filet-profil:var(--tag-profil)}
:is(.v-profil--moa,.v-profil--moe,.v-profil--entreprise) .v-hero-int .v-tag{color:var(--tag-profil)}
:is(.v-profil--moa,.v-profil--moe,.v-profil--entreprise) .v-benef-grille{border-top:3px solid var(--filet-profil)}

/* BANDE DES 3 BÉNÉFICES — en bas du hero, entièrement visible au premier écran */
.v-benef{position:relative;z-index:2;flex:none;width:100%}
/* Transition avec la suite : le fond marine s'arrête à mi-hauteur de la bande, le reste est sur le fond de la section suivante */
.v-hero + .v-sec{padding-top:56px}
/* Limite marine / clair : courbe douce partant haut à gauche et finissant bas à droite (sous le milieu de la bande).
   Masque = la courbe sur --v-courbe de haut, puis un aplat jusqu'en bas. */
.v-benef::before{content:'';position:absolute;z-index:-1;top:calc(50% - var(--v-courbe));bottom:-36px;left:calc(50% - 50vw);width:100vw;background:var(--c-fond);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0C38 30 68 82 100 100V100H0Z'/%3E%3C/svg%3E") top / 100% var(--v-courbe) no-repeat,linear-gradient(#000,#000) bottom / 100% calc(100% - var(--v-courbe) + 1px) no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0C38 30 68 82 100 100V100H0Z'/%3E%3C/svg%3E") top / 100% var(--v-courbe) no-repeat,linear-gradient(#000,#000) bottom / 100% calc(100% - var(--v-courbe) + 1px) no-repeat}
.v-benef-grille{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute)}
.v-benef-item{display:flex;align-items:center;gap:16px;padding:24px 30px}
.v-benef-item + .v-benef-item{border-left:1px solid var(--c-bord)}
.v-benef-item p{font-size:17px;font-weight:600;color:var(--c-marine);line-height:1.35}

/* Pages intérieures : même haut de page, hauteur libre et titre un cran plus petit */
.v-hero--page{min-height:0}
.v-hero--page .v-hero-grille{max-height:none;padding-top:clamp(40px,6vw,80px);padding-bottom:clamp(40px,5vw,64px)}
.v-hero--page h1{font-size:clamp(32px,3.4vw,50px)}
.v-hero--page:not(:has(.v-benef)) .v-hero-int{padding-bottom:0}
.v-benef-grille--4{grid-template-columns:repeat(4,minmax(0,1fr))}

/* Cartes d'aperçu : annuaire et annonces */
.v-pros{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.v-pro{padding:22px;gap:14px}
.v-pro-haut{display:flex;align-items:center;gap:14px}
.v-pro-av{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex:none;color:var(--c-fond);font-weight:600;font-size:16px}
.v-pro-av svg{width:24px;height:24px}
.v-pro-av.moe{background:var(--c-marine)}
.v-pro-av.entreprise{background:var(--c-profil-ent)}
.v-pro-nom{font-size:16.5px;font-weight:600;color:var(--c-marine);line-height:1.3}
.v-pro-lieu{display:flex;align-items:center;gap:5px;font-size:14px;color:var(--c-texte-2);margin-top:3px}
.v-pro-lieu svg{width:14px;height:14px;color:var(--c-orange);flex:none}
.v-pro-type{font-size:14px;color:var(--c-texte-2)}
.v-pro-pied{display:flex;align-items:center;justify-content:space-between;gap:10px;padding-top:14px;border-top:1px solid var(--c-bord);margin-top:auto}
.v-pro-etiq{background:var(--c-fond-clair-2);color:var(--c-marine);font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:6px}
.v-pro-voir{font-size:15px;align-self:flex-start}
.v-vide{grid-column:1/-1;text-align:center;color:var(--c-texte-2);padding:40px 24px;background:var(--c-fond);border-radius:var(--v-rayon);border:1.5px dashed var(--c-bord)}
.v-pied-sec{text-align:center;margin-top:40px}


.v-annonces{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.v-ann{padding:24px;gap:14px}
.v-ann-etiq{display:inline-block;width:fit-content;background:var(--c-fond-clair-2);color:var(--c-marine);font-size:12.5px;font-weight:600;padding:4px 10px;border-radius:6px}
.v-ann-etiq.orange{background:var(--c-orange-pale);color:var(--c-orange-btn)}
.v-ann-titre{font-size:17px;font-weight:600;color:var(--c-marine);line-height:1.35}
.v-ann-verrou{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:600;color:var(--c-texte-2)}
.v-ann-verrou svg{width:16px;height:16px}
.v-ann-meta{display:grid;gap:4px;font-size:14px;color:var(--c-texte-2)}
.v-ann-meta span{display:flex;align-items:center;gap:6px}
.v-ann-meta svg{width:14px;height:14px;color:var(--c-orange);flex:none}
.v-ann-extrait{font-size:15px;color:var(--c-texte-2);line-height:1.6}
.v-flou{height:12px;border-radius:4px;background:var(--c-fond-clair-2);filter:blur(4px)}
.v-flou.court{width:62%}
.v-ann-pied{display:flex;align-items:center;justify-content:space-between;padding-top:14px;border-top:1px solid var(--c-bord);margin-top:auto}
.v-ann-date{font-size:13.5px;color:var(--c-texte-3)}

@media (max-width:1024px){
  .v-hero-grille{gap:32px}
  .v-benef-grille--4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-benef-grille--4 .v-benef-item:nth-child(3){border-left:0}
  .v-benef-grille--4 .v-benef-item:nth-child(n+3){border-top:1px solid var(--c-bord)}
}
@media (max-width:900px){
  .v-hero{min-height:0}
  .v-hero-grille{grid-template-columns:minmax(0,1fr);gap:56px;max-height:none}
  .v-hero-visuel{max-width:440px;margin:0 auto}
  /* Accueil (29/10) : titre et boutons occupent tout le premier écran, le schéma vient au défilement.
     100svh = hauteur visible avec les barres du navigateur ; on retire la barre du site et la marge haute de la grille. */
  .v-hero--accueil .v-hero-grille>:first-child{min-height:calc(100svh - var(--v-nav-h) - clamp(24px,4svh,56px));
    display:flex;flex-direction:column;justify-content:center}
  .v-pros,.v-annonces{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
}
@media (max-width:760px){
  .v-benef-grille,.v-benef-grille--4{grid-template-columns:minmax(0,1fr)}
  .v-benef-item + .v-benef-item{border-left:0;border-top:1px solid var(--c-bord)}
  .v-benef-item{padding:20px 22px}
  .v-hero .v-plan{display:none}
  .v-pros,.v-annonces{grid-template-columns:minmax(0,1fr)}
}

/* =====================================================================
   PAGES PROFIL (MOA, MOE, entreprise) — briques réutilisables
   ===================================================================== */
.v-garanties{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:22px;font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-3)}
.v-garanties span{display:inline-flex;align-items:center;gap:14px}
.v-garanties span + span::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--c-orange)}
.v-sombre .v-garanties{color:var(--c-sur-surface-2)}
.v-centre{text-align:center}
.v-centre .v-chapo,.v-centre .v-h2{margin-left:auto;margin-right:auto}
.v-centre .v-garanties{justify-content:center}
.v-benef-item small{display:block;font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-texte-3);margin-bottom:3px}
.v-benef-item p{min-width:0}

/* Constat : texte barré en orange */
.v-constat{font-size:clamp(19px,1.7vw,23px);line-height:1.6;color:var(--c-texte-2);max-width:62ch;margin:24px auto 0}
.v-constat s{text-decoration-color:var(--c-orange);text-decoration-thickness:2px;color:var(--c-texte)}
.v-constat b{color:var(--c-marine);font-weight:600}
.v-constat-note{font-size:16px;color:var(--c-texte-3);margin-top:18px}

/* Étapes numérotées reliées par un filet */
.v-etapes{display:grid;grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:24px;counter-reset:etape;position:relative;list-style:none;padding:0;margin:0}
.v-etapes::before{content:'';position:absolute;top:24px;left:calc(100% / var(--n,4) / 2);right:calc(100% / var(--n,4) / 2);height:2px;background:var(--c-bord)}
.v-etape{position:relative;text-align:center;font-size:17px;font-weight:600;color:var(--c-marine);line-height:1.4}
.v-etape::before{counter-increment:etape;content:counter(etape);display:grid;place-items:center;width:48px;height:48px;margin:0 auto 16px;border-radius:50%;
  background:var(--c-fond);border:2px solid var(--c-marine);color:var(--c-marine);font-size:18px;font-weight:600;position:relative}
.v-etape:nth-child(odd)::before{border-color:var(--c-orange);color:var(--c-orange-btn)}
.v-etape small{display:block;font-weight:400;color:var(--c-texte-3);font-size:15px}
.v-etapes-note{text-align:center;color:var(--c-texte-2);margin-top:40px}

/* Modules : cartes avec picto */
.v-modules{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.v-module{display:flex;gap:20px;padding:28px}
.v-module h3{font-size:19px;font-weight:600;color:var(--c-marine);line-height:1.3;margin-bottom:6px}
.v-module p{font-size:16px;color:var(--c-texte-2);line-height:1.6}
.v-modules + .v-actions{margin-top:40px}
.v-actions{display:flex;flex-direction:column;align-items:center}

/* Atouts sur panneau marine */
.v-atouts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.v-atout{display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px;padding:8px}
.v-atout .v-picto{width:64px;height:64px;border-radius:18px;background:color-mix(in srgb,var(--c-sur-surface) 10%,transparent);color:var(--c-orange-clair)}
.v-atout .v-picto svg{width:28px;height:28px}
.v-atout p{font-size:18px;font-weight:600;color:var(--c-fond);line-height:1.35}

/* Bouche-à-oreille : trois idées */
.v-trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.v-trio-item{padding:32px 28px}
.v-trio-item h3{font-size:19px;font-weight:600;color:var(--c-marine);margin:20px 0 8px}
.v-trio-item p{font-size:16px;color:var(--c-texte-2);line-height:1.6}
.v-conclusion{text-align:center;font-size:22px;font-weight:600;color:var(--c-marine);margin-top:40px}

/* Aperçus annuaire / annonces : bloc de texte masqué et note */
.v-note{font-size:15px;color:var(--c-texte-3);margin-top:20px}
.v-pro .v-flou{width:70%;margin:4px 0 10px}
.v-sous-entete{margin:72px 0 32px}

/* Familles de métiers (boutons qui déplient une liste) */
.vitrine .metiers-chipbar{display:flex;flex-wrap:wrap;justify-content:center;gap:12px}
.vitrine .metiers-chip{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 18px;border-radius:999px;border:1.5px solid var(--c-bord);
  background:var(--c-fond);color:var(--c-marine);font-family:inherit;font-size:15.5px;font-weight:600;line-height:1;cursor:pointer;transition:border-color var(--v-anim),background var(--v-anim),color var(--v-anim)}
.vitrine .metiers-chip:hover{border-color:var(--c-marine)}
.vitrine .metiers-chip:focus-visible{outline:3px solid var(--c-orange-btn);outline-offset:2px}
.vitrine .metiers-chip-count{font-size:12.5px;font-weight:600;min-width:24px;height:24px;padding:0 7px;border-radius:12px;display:grid;place-items:center;background:var(--c-fond-clair-2);color:var(--c-marine)}
.vitrine .metiers-chip-arrow{width:16px;height:16px;flex:none;color:var(--c-texte-3);transition:transform var(--v-anim)}
.vitrine .metiers-chip.is-open{background:var(--c-marine);border-color:var(--c-marine);color:var(--c-fond)}
.vitrine .metiers-chip.is-open .metiers-chip-count{background:color-mix(in srgb,var(--c-fond) 18%,transparent);color:var(--c-fond)}
.vitrine .metiers-chip.is-open .metiers-chip-arrow{color:var(--c-fond);transform:rotate(180deg)}
.vitrine .metiers-panel{flex:1 1 100%;position:relative;background:var(--c-fond);border-radius:var(--v-rayon);box-shadow:var(--v-ombre);padding:24px;margin-top:4px}
.vitrine .metiers-panel[hidden]{display:none}
.vitrine .metiers-panel::before{content:'';position:absolute;top:-7px;left:var(--arrow-left,24px);width:14px;height:14px;background:var(--c-fond);transform:rotate(45deg)}
.vitrine .metiers-tags{display:flex;flex-wrap:wrap;gap:8px}
.vitrine .metier-tag{font-size:14.5px;font-weight:500;padding:8px 14px;border-radius:999px;background:var(--c-fond-clair);color:var(--c-marine)}

@media (max-width:1024px){
  .v-atouts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:40px}
}
@media (max-width:900px){
  .v-trio{grid-template-columns:minmax(0,1fr)}
  .v-etapes{grid-template-columns:minmax(0,1fr);gap:20px}
  .v-etapes::before{top:24px;bottom:24px;left:23px;right:auto;width:2px;height:auto}
  .v-etape{display:flex;align-items:center;gap:18px;text-align:left}
  .v-etape::before{margin:0;flex:none}
  .v-etapes-note{text-align:left}
}
@media (max-width:760px){
  .v-modules{grid-template-columns:minmax(0,1fr)}
  .v-module{padding:24px 20px;gap:16px}
  .v-sous-entete{margin-top:56px}
}
@media (max-width:480px){
  .v-atouts{gap:28px 12px}
  .v-atout p{font-size:16px}
  .vitrine .metiers-chip{font-size:15px;padding:0 14px}
}
.vp-appel .v-garanties{justify-content:center}
.v-hero .v-garanties{gap:6px 12px;font-size:12.5px}
.v-pros--4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1024px){.v-pros--4{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.v-pros--4{grid-template-columns:minmax(0,1fr)}}
@media (max-width:760px){
  .v-constat{text-align:left;font-size:18px}
  .v-centre .v-constat + *{text-align:left}
}
@media (max-width:560px){
  .v-garanties,.v-hero .v-garanties{display:grid;grid-template-columns:repeat(2,max-content);gap:8px 18px;justify-content:start}
  .v-centre .v-garanties,.vp-appel .v-garanties{justify-content:center}
  .v-garanties span::before,.v-garanties span + span::before{content:'';width:4px;height:4px;border-radius:50%;background:var(--c-orange);flex:none}
  .v-garanties span{gap:8px}
}
@media (max-width:360px){.v-garanties,.v-hero .v-garanties{grid-template-columns:max-content}}
/* Les 4 garanties tiennent sur une ligne sur ordinateur */
@media (min-width:1200px){
  .v-garanties{flex-wrap:nowrap;white-space:nowrap}
  .v-hero .v-garanties{font-size:12px;letter-spacing:.04em;gap:8px}
  .v-hero .v-garanties span{gap:8px}
}
/* Constat : les problèmes en orange, sans trait (comme sur le site en ligne) */
.v-constat s{text-decoration:none;color:var(--c-orange-btn)}

/* ---- Page MOE / entreprise ---- */
/* Haut de page : pile de cartes « ce que vous trouvez » */
.v-hcartes{display:grid;gap:12px;width:100%;max-width:480px;margin-left:auto}
.v-hcarte{display:flex;gap:14px;align-items:flex-start;background:var(--c-fond);border-radius:var(--v-rayon);padding:16px 18px;box-shadow:var(--v-ombre-haute);color:var(--c-texte-2)}
.v-hcarte .v-picto{width:40px;height:40px;border-radius:10px}
.v-hcarte .v-picto svg{width:20px;height:20px}
.v-hcarte-lbl{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-texte-3)}
.v-hcarte-titre{font-size:15.5px;font-weight:600;color:var(--c-marine);line-height:1.35;margin-top:2px}
.v-hcarte-txt{font-size:13.5px;line-height:1.5;margin-top:4px}
.v-hcarte .v-lien{font-size:14px;margin-top:8px;display:inline-block}

/* Trois piliers avec liste numérotée */
.v-piliers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.v-pilier{padding:32px 28px}
.v-pilier h3{font-size:20px;font-weight:600;color:var(--c-marine);margin-bottom:20px}
.v-pilier ol{list-style:none;margin:0;padding:0;display:grid;gap:14px;counter-reset:pil}
.v-pilier li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--c-texte-2);line-height:1.5}
.v-pilier li::before{counter-increment:pil;content:counter(pil);flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;
  background:var(--c-orange-pale);color:var(--c-orange-btn);font-size:13px;font-weight:600;margin-top:-1px}

/* Mention « Prochainement » */
.v-bientot{display:inline-block;vertical-align:middle;font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;
  padding:5px 12px;border-radius:999px;background:var(--c-orange-pale);color:var(--c-orange-btn);margin-left:8px}
.v-h3-sec{font-size:clamp(22px,2.2vw,28px);font-weight:600;line-height:1.3;color:var(--c-marine);margin-top:14px}

/* Offres partenaires */
.v-parts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.v-part{display:flex;gap:16px;padding:24px}
.v-part h3{font-size:17px;font-weight:600;color:var(--c-marine);margin-bottom:6px}
.v-part p{font-size:15px;color:var(--c-texte-2);line-height:1.55}

/* Modules en grille de 3 (7 cartes) */
.v-modules--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.v-modules--3 .v-module{flex-direction:column;gap:16px}

/* Atouts sur fond clair */
.v-atouts--clair .v-picto{background:var(--c-fond);color:var(--c-orange-btn);box-shadow:var(--v-ombre)}
.v-atouts--clair .v-atout p{color:var(--c-marine)}
.v-atouts--3{grid-template-columns:repeat(3,minmax(0,1fr))}

@media (max-width:1024px){
  .v-parts,.v-modules--3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .v-atouts--3{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .v-piliers{grid-template-columns:minmax(0,1fr)}
  .v-hcartes{max-width:none;margin:0}
}
@media (max-width:760px){
  .v-parts,.v-modules--3{grid-template-columns:minmax(0,1fr)}
  .v-modules--3 .v-module{flex-direction:row}
  .v-part{padding:20px}
}
.v-etapes + .v-etapes-actions{margin-top:48px}
/* Titre en 3 lignes imposées (retours à la ligne d'origine) : un cran plus petit, sans équilibrage */
.v-hero--long h1{font-size:clamp(30px,3vw,44px);text-wrap:wrap}
/* 7 modules : le dernier, seul sur sa ligne, prend toute la largeur */
@media (min-width:1025px){.v-modules--3 .v-module:last-child:nth-child(3n+1){grid-column:1 / -1;flex-direction:row}}
@media (min-width:761px) and (max-width:1024px){.v-modules--3 .v-module:last-child:nth-child(odd){grid-column:1 / -1;flex-direction:row}}
.v-sombre .v-hcarte .v-lien{color:var(--c-orange-btn)}
@media (max-width:480px){.v-hero--long h1{font-size:26px}}
@media (max-width:760px){
  .v-h3-sec br{display:none}
  .v-atouts--3{gap:16px}
  .v-atouts--3 .v-atout{padding:0}
  .v-atouts--3 .v-atout p{font-size:15px}
  .v-atouts--3 .v-picto{width:56px;height:56px}
}
.v-sec--marine .v-note{color:var(--c-sur-surface-2);margin-top:48px;font-size:15px}

/* ---- Page entreprise ---- */
.v-pilier-num{display:block;font-size:14px;font-weight:600;letter-spacing:.08em;color:var(--c-orange-btn);margin-bottom:10px}
.v-pilier ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.v-pilier ul li::before{content:'';flex:none;width:6px;height:6px;border-radius:50%;background:var(--c-orange);margin-top:9px}
.v-bandeau{margin-top:32px;text-align:center;padding:16px 24px;border-radius:var(--v-rayon);background:var(--c-statut-pale);color:var(--c-statut);font-weight:600;font-size:16px}
.v-versus{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:760px;margin:0 auto}
.v-versus-col{border-radius:16px;padding:28px;background:color-mix(in srgb,var(--c-sur-surface) 7%,transparent);border:1px solid color-mix(in srgb,var(--c-sur-surface) 14%,transparent)}
.v-versus-col h3{font-size:18px;font-weight:600;color:var(--c-fond);margin-bottom:18px}
.v-versus-col ul{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.v-versus-col li{display:flex;gap:12px;align-items:center;font-size:16.5px;color:var(--c-sur-surface-2)}
.v-versus-col li span{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:13px;font-weight:700}
.v-versus-non li span{background:color-mix(in srgb,#f87171 18%,transparent);color:#fca5a5}
.v-versus-oui li span{background:color-mix(in srgb,#4ade80 18%,transparent);color:#86efac}
.v-versus-oui{border-color:color-mix(in srgb,var(--c-orange-clair) 45%,transparent)}
.v-accroche{text-align:center;font-size:19px;font-weight:600;color:var(--c-fond);margin:-24px auto 40px;max-width:60ch}
@media (max-width:760px){
  .v-versus{grid-template-columns:minmax(0,1fr)}
  .v-versus-col{padding:22px 20px}
  .v-accroche{font-size:17px;margin-top:-16px}
}
.v-constat em{font-style:normal;color:var(--c-orange-btn)}
.v-hero--br h1{text-wrap:wrap}
@media (max-width:560px){
  .v-garanties,.v-hero .v-garanties{grid-template-columns:repeat(2,minmax(0,max-content))}
  .v-garanties span:only-child{grid-column:1 / -1}
  .v-garanties span{min-width:0;align-items:flex-start}
  .v-garanties span::before{margin-top:6px}
}
@media (max-width:360px){.v-garanties,.v-hero .v-garanties{grid-template-columns:minmax(0,max-content)}}

/* ===== Modules en 3 piliers × 2 lignes (page MOE) =====
   Placement explicite : en-têtes en ligne 1, cartes en lignes 2 et 3 ; une ligne partagée
   par les 3 colonnes donne des cartes de même hauteur. Mobile : ordre du HTML, pilier par pilier. */
.v-mods{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:auto auto auto;gap:20px 24px}
.v-mods > *{grid-column:var(--col)}
.v-mods > .v-mod{grid-row:var(--ligne)}
.v-mods > .v-mod-tete{grid-row:1;align-self:end;padding:0 4px 4px;border-bottom:2px solid var(--c-orange-btn)}
.v-mod-tete h3{font-size:20px;font-weight:600;color:var(--c-marine);line-height:1.3}
.v-mod-tete p{font-size:15px;color:var(--c-texte-2);line-height:1.5;margin-top:4px;padding-bottom:10px}
.v-mods .v-module{flex-direction:column;gap:16px}
.v-mods .v-module h3 .v-bientot{display:table;margin:6px 0 2px}
.v-mods + .v-note{margin-top:32px}
@media (max-width:900px){
  .v-mods{grid-template-columns:minmax(0,1fr);grid-template-rows:none;gap:16px}
  .v-mods > *,.v-mods > .v-mod,.v-mods > .v-mod-tete{grid-column:auto;grid-row:auto}
  .v-mods > .v-mod-tete:not(:first-child){margin-top:28px}
  .v-mods .v-module{flex-direction:row}
}

/* ===== Frise illustrée des étapes (pages profil) =====
   Un picto par étape, numéro en pastille, une phrase sous chaque titre.
   L'étape « à venir » (dernière) : pointillés et segment de ligne gris. Mobile : frise verticale. */
.v-frise{display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));gap:20px;list-style:none;padding:0;margin:0;position:relative}
.v-frise::before{content:'';position:absolute;top:36px;left:calc(100% / var(--n,5) / 2);right:calc(100% / var(--n,5) / 2);height:2px;background:var(--c-orange)}
.v-frise--avenir::before{right:calc(100% / var(--n) / 2 + (100% - 100% / var(--n)) / (var(--n) - 1))}
.v-frise--avenir::after{content:'';position:absolute;top:36px;height:2px;right:calc(100% / var(--n) / 2);width:calc((100% - 100% / var(--n)) / (var(--n) - 1));
  background:repeating-linear-gradient(90deg,var(--c-texte-3) 0 6px,transparent 6px 11px)}
.v-frise-etape{position:relative;text-align:center}
.v-frise-ic{width:72px;height:72px;margin:0 auto 18px;border-radius:20px;display:grid;place-items:center;background:var(--c-fond);box-shadow:var(--v-ombre);color:var(--c-orange-btn);position:relative}
.v-sec--blanc .v-frise-ic{box-shadow:var(--v-ombre),0 0 0 1px var(--c-bord)}
.v-frise-ic svg{width:30px;height:30px}
.v-frise-ic i{position:absolute;top:-8px;right:-8px;width:26px;height:26px;border-radius:50%;background:var(--c-marine);color:var(--c-fond);font-style:normal;font-size:13px;font-weight:600;display:grid;place-items:center}
.v-frise-etape.is-avenir .v-frise-ic{box-shadow:none;border:1.5px dashed var(--c-texte-3);background:var(--c-fond);color:var(--c-texte-3)}
.v-frise-etape.is-avenir .v-frise-ic i{background:var(--c-texte-3)}
.v-frise h3{font-size:17px;font-weight:600;color:var(--c-marine);line-height:1.35;margin-bottom:6px}
.v-frise h3 .v-bientot{display:table;margin:6px auto 2px}
.v-frise p{font-size:15.5px;color:#374151;line-height:1.5}
.v-frise + .v-etapes-actions{margin-top:48px}
@media (max-width:1024px){
  .v-frise{grid-template-columns:minmax(0,1fr);grid-auto-rows:1fr;gap:28px;max-width:560px;margin:0 auto}  /* étapes de même hauteur : icônes régulièrement espacées */
  .v-frise::before,.v-frise--avenir::before{top:28px;bottom:28px;left:27px;right:auto;width:2px;height:auto}
  .v-frise--avenir::before{bottom:calc(28px + (100% - 56px) / (var(--n) - 1))}
  .v-frise--avenir::after{top:auto;bottom:28px;left:27px;right:auto;width:2px;height:calc((100% - 56px) / (var(--n) - 1));
    background:repeating-linear-gradient(180deg,var(--c-texte-3) 0 6px,transparent 6px 11px)}
  .v-frise-etape{display:grid;grid-template-columns:56px minmax(0,1fr);gap:18px;text-align:left;align-items:start}
  .v-frise-ic{width:56px;height:56px;margin:0;border-radius:16px}
  .v-frise-ic svg{width:24px;height:24px}
  .v-frise h3{margin-top:4px}
  .v-frise h3 .v-bientot{margin:6px 0 2px}
}

/* ===== Aperçus d'interface des hauts de page MOE et Entreprise ===== */
.mq-hp-corps{padding:16px;display:grid;gap:12px}
.mq-hp-badge{font-size:11.5px;width:fit-content;padding:4px 10px}
.mq-tags{display:flex;flex-wrap:wrap;gap:6px}
.mq-tags span{font-size:11.5px;font-weight:500;color:var(--c-marine);background:var(--c-fond-clair-2);padding:3px 9px;border-radius:999px}
.mq-hp-refs{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mq-hp-ref{display:grid;gap:6px;font-size:11.5px;color:var(--c-texte-3)}
.mq-hp-ref img{display:block;width:100%;height:78px;object-fit:cover;object-position:50% 70%;border-radius:8px}
.mq-hp-photo{display:block;width:100%;height:104px;object-fit:cover;object-position:50% 30%;border-radius:10px}
.mq-hp-auteur{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--c-texte-2)}
.mq-hp-auteur-av{width:24px;height:24px;border-radius:7px;background:var(--c-orange-btn);color:var(--c-fond);display:grid;place-items:center}
.mq-hp-auteur-av svg{width:13px;height:13px}
.mq-hp-reco{display:grid;gap:8px;padding-top:12px;border-top:1px solid var(--c-bord)}
.mq-etiq--marine{background:var(--c-fond-clair-2);color:var(--c-marine)}
.mq-hp-lignes{padding:0}
.mq-hp-lignes .mq-conf-ligne{padding:8px 0;font-size:12.5px}

/* ===== Liens internes contextuels (style tertiaire, jamais en bouton) ===== */
.v-mods .v-module > div{display:flex;flex-direction:column;flex:1 1 auto}
.v-mod-lien{margin-top:auto;padding-top:14px;font-size:15px}
.v-mod-lien .v-lien{font-size:15px}
.v-pilier{display:flex;flex-direction:column}
.v-pilier-liens{margin-top:auto;padding-top:22px;font-size:14.5px;color:var(--c-texte-3);display:flex;flex-wrap:wrap;align-items:baseline;column-gap:7px;row-gap:6px}
.v-pilier-liens .v-lien{font-size:14.5px;white-space:nowrap}
.v-frise + .v-etapes-note{margin-top:44px}

/* ===== Haut de page centré (Notre projet, Comment ça marche) ===== */
.v-hero.v-hero--page.v-hero--centre .v-hero-int{text-align:center;padding-bottom:calc(var(--v-courbe) + clamp(40px,5vw,72px))}
.v-hero--centre .v-hero-grille{display:block;max-width:920px;padding-top:clamp(24px,3vw,40px);padding-bottom:0}
.v-hero--centre .v-hero-sous{margin-left:auto;margin-right:auto}
/* La section suivante recouvre les 2 derniers px du haut de page : évite le trait gris quand le bas tombe entre deux pixels */
.v-hero--centre + .v-sec{margin-top:-2px}
/* Haut centré avec bande à cheval sur le bord bas (Comment ça marche : sélecteur de profil ; Notre projet : navigation interne).
   La courbe et le chevauchement viennent de .v-benef, comme sur les pages profil. */
.v-hero.v-hero--page.v-hero--centre.v-hero--bande .v-hero-int{padding-bottom:36px}
.v-hero--centre .v-benef{text-align:left}
.v-hero--centre.v-hero--bande .v-hero-grille{padding-top:clamp(32px,4vw,56px);padding-bottom:clamp(48px,6vw,88px)}
.v-hero--centre .v-hero-courbe{position:absolute;left:0;right:0;bottom:-1px;height:var(--v-courbe);background:var(--courbe-fond,var(--c-fond));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0C38 30 68 82 100 100V100H0Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M0 0C38 30 68 82 100 100V100H0Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat}

/* ===== Notre projet ===== */
.np-citation{display:grid;grid-template-columns:auto minmax(0,1fr);gap:36px;align-items:center;max-width:880px;margin:0 auto;padding:40px 44px;border-radius:var(--v-rayon-l,24px);background:var(--c-fond-clair);position:relative}
.np-photo{width:120px;height:120px;border-radius:50%;overflow:hidden;flex:none;box-shadow:0 0 0 4px var(--c-fond),0 0 0 6px var(--c-orange);background:var(--c-marine);color:var(--c-fond);display:grid;place-items:center;font-size:36px;font-weight:600}
.np-photo img{width:100%;height:100%;object-fit:cover;display:block}
.np-citation--seule{grid-template-columns:minmax(0,1fr);text-align:center;max-width:820px;padding:44px 56px}
.np-citation blockquote{margin:0;font-family:'Fraunces',Georgia,serif;font-style:italic;font-size:clamp(20px,2vw,25px);line-height:1.5;color:var(--c-marine)}
.np-citation figcaption{margin-top:16px;font-size:15px;font-weight:600;color:var(--c-orange-btn);letter-spacing:.02em}
.np-constat{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.np-constat .v-carte{padding:28px 30px}
.np-label{font-size:12.5px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:10px}
.np-constat h3{font-size:20px;font-weight:600;color:var(--c-marine);line-height:1.3;margin-bottom:10px}
.np-constat p{font-size:16px;color:var(--c-texte-2);line-height:1.65}
.np-constat .v-lien{margin-top:auto;padding-top:18px;font-size:15px;align-self:flex-start}
.np-constat .v-carte-lien p{margin-bottom:0}
.np-mission{max-width:760px;margin:0 auto 40px;text-align:center}
.np-mission h3{font-size:clamp(21px,2vw,26px);font-weight:600;color:var(--c-marine);line-height:1.3;margin-bottom:12px}
.np-mission p{font-size:17px;color:var(--c-texte-2);line-height:1.7}
.np-valeurs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.np-valeurs .v-carte{padding:26px 24px}
.np-valeurs .v-picto{margin-bottom:16px}
.np-valeurs h4{font-size:18px;font-weight:600;color:var(--c-marine);margin-bottom:8px}
.np-valeurs p{font-size:15.5px;color:var(--c-texte-2);line-height:1.6}
.np-eng{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.np-eng-carte{padding:24px;border-radius:var(--v-rayon);background:color-mix(in srgb,var(--c-sur-surface) 6%,transparent);border:1px solid color-mix(in srgb,var(--c-sur-surface) 14%,transparent)}
.np-eng-carte h3{display:flex;gap:10px;align-items:flex-start;font-size:17px;font-weight:600;color:var(--c-sur-surface);line-height:1.35;margin-bottom:8px}
.np-eng-carte h3 span{flex:none;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--c-statut);color:var(--c-fond);font-size:12px;margin-top:1px}
.np-eng-carte p{font-size:15px;color:var(--c-sur-surface-2);line-height:1.6}
.np-non{list-style:none;padding:0;margin:36px auto 0;max-width:880px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 32px}
.np-non li{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:var(--c-sur-surface-2);line-height:1.5}
.np-non li span{flex:none;color:var(--c-orange-clair);font-weight:600}
.np-liens{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 32px;margin-top:40px}
.np-histoire{display:flex;gap:20px;align-items:flex-start;max-width:880px;margin:0 auto 28px;padding:28px 30px}
.np-histoire h3{font-size:19px;font-weight:600;color:var(--c-marine);margin-bottom:8px}
.np-histoire p{font-size:16px;color:var(--c-texte-2);line-height:1.7}
.np-membres{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;max-width:880px;margin:0 auto}
.np-membres--solo{grid-template-columns:minmax(0,1fr)}
.np-membre{padding:30px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px 22px;align-items:start}
.np-membre .np-photo{width:84px;height:84px;font-size:26px;grid-row:span 2}
.np-membre-nom{font-size:20px;font-weight:600;color:var(--c-marine);align-self:end}
.np-membre-role{font-size:14px;font-weight:600;color:var(--c-orange-btn);letter-spacing:.04em;text-transform:uppercase}
.np-membre p{grid-column:1 / -1;font-size:16px;color:var(--c-texte-2);line-height:1.7;margin-top:10px}
.np-membre .mq-tags{grid-column:1 / -1;margin-top:6px}
.np-membre .mq-tags span{font-size:13px;padding:4px 12px}
.np-presse{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:8px}
.np-presse a{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--c-fond);border:1.5px solid var(--c-bord);font-size:15px;font-weight:600;color:var(--c-marine);text-decoration:none;transition:border-color var(--v-anim)}
.np-presse a:hover{border-color:var(--c-orange-btn)}
.np-presse a:focus-visible{outline:3px solid var(--c-orange-clair);outline-offset:3px}
@media (max-width:1024px){
  .np-valeurs,.np-eng{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:760px){
  .np-citation{grid-template-columns:minmax(0,1fr);justify-items:center;text-align:center;padding:32px 22px;gap:24px}
  .np-photo{width:96px;height:96px}
  .np-constat,.np-valeurs,.np-eng,.np-non,.np-membres{grid-template-columns:minmax(0,1fr)}
  .np-constat .v-carte{padding:24px 22px}
  .np-histoire{flex-direction:column;padding:24px 22px}
  .np-membre{padding:24px 22px}
}

/* ===== Comment ça marche : onglets par profil ===== */
.cm-onglets{display:flex;justify-content:center;gap:6px;width:fit-content;max-width:100%;margin:0 auto 48px;padding:6px;border-radius:999px;background:var(--c-fond-clair-2)}
.cm-onglet{border:0;background:transparent;font-family:inherit;font-size:15.5px;font-weight:600;color:var(--c-texte-2);min-height:44px;padding:0 22px;border-radius:999px;cursor:pointer;transition:background var(--v-anim),color var(--v-anim)}
.cm-onglet:hover{color:var(--c-marine)}
.cm-onglet[aria-selected="true"]{background:var(--c-fond);color:var(--c-marine);box-shadow:var(--v-ombre)}
.cm-onglet:focus-visible{outline:3px solid var(--c-orange-clair);outline-offset:2px}
.cm-panneau[hidden]{display:none}
.cm-pied{margin-top:44px;text-align:center;display:grid;gap:14px;justify-items:center}
.cm-pied p{font-size:15px;color:var(--c-texte-3);max-width:62ch}
@media (max-width:760px){
  .cm-onglets{flex-direction:column;width:100%;border-radius:18px}
  .cm-onglet{border-radius:14px;width:100%}
}
/* Aperçu de la plateforme (contenu inchangé, habillage de la refonte) */
.cm-shots{display:grid;grid-template-columns:minmax(0,1fr);gap:56px;max-width:1040px;margin:0 auto}
.cm-shots .shot{display:flex;flex-direction:column}
.cm-shots .shot-frame{border-radius:14px;overflow:hidden;border:1px solid var(--c-bord);box-shadow:var(--v-ombre-haute);background:var(--c-fond)}
.cm-shots .shot-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--c-fond-clair);border-bottom:1px solid var(--c-bord)}
.cm-shots .shot-bar span{width:11px;height:11px;border-radius:50%;display:block;background:var(--c-bord)}
.cm-shots .shot-bar span:nth-child(1){background:var(--c-orange)}
.cm-shots .shot-bar span:nth-child(2){background:var(--c-orange-clair)}
.cm-shots .shot-bar span:nth-child(3){background:var(--c-statut)}
.cm-shots .shot-frame img{display:block;width:100%;height:auto}
.cm-shots .shot-cap{margin-bottom:16px}
.cm-shots .shot-cap .t{font-size:18px;font-weight:600;color:var(--c-marine);margin-bottom:4px}
.cm-shots .shot-cap .t::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--c-orange);margin-right:10px;vertical-align:middle}
.cm-shots .shot-cap .d{font-size:15.5px;color:var(--c-texte-2);line-height:1.6;max-width:72ch}
/* Entrée « Fiche membre » : sélecteur BASIC / ESSENTIEL en haut de la fenêtre, fiche fictive en iframe */
.cm-fiche[hidden]{display:none}
.cm-fiche-barre{display:flex;justify-content:center;padding:14px 16px;background:var(--c-fond);border-bottom:1px solid var(--c-bord)}
.cm-fiche-barre .cm-onglets{margin:0}
.cm-onglets--offre .cm-onglet{letter-spacing:.06em;min-width:120px}
.cm-fiche-cadre iframe{display:block;width:100%;height:620px;border:0;background:#f4f6fa}
.cm-fiche-pied{margin-top:16px;font-size:15px;color:var(--c-texte-2);line-height:1.6}
.cm-fiche-pied .v-lien{margin-left:6px;white-space:nowrap}
@media (max-width:760px){
  .cm-fiche-cadre iframe{height:560px}
  .cm-onglets.cm-onglets--offre{flex-direction:row;width:auto;border-radius:999px}
  .cm-fiche-barre .cm-onglets.cm-onglets--offre{width:100%;max-width:340px}
  .cm-onglets--offre .cm-onglet{min-width:0;flex:1;border-radius:999px;padding:0 10px;letter-spacing:.03em}
}
/* Sélecteur de profil posé dans la bande du haut de page : même ombre et même chevauchement que .v-benef-grille */
.cm-onglets.cm-onglets--bande{position:relative;margin:0 auto;width:fit-content;max-width:100%;padding:8px;gap:6px;background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute)}
.cm-onglets--bande .cm-onglet{min-height:52px;padding:0 26px}
.cm-onglets--bande .cm-onglet[aria-selected="true"]{background:var(--c-marine);color:var(--c-fond);box-shadow:none}
.cm-onglets--bande .cm-onglet[aria-selected="false"]:hover{background:var(--c-fond-clair-2);color:var(--c-marine)}
/* Liens sous les aperçus (annuaire, annonces, Radar) */
.cm-shot-lien{margin-top:14px;font-size:15px}
.cm-fiche-barre{gap:12px;flex-wrap:wrap}
/* Notre projet : navigation interne dans la bande */
.np-bande .v-benef-item{text-decoration:none;color:inherit;transition:background var(--v-anim)}
.np-bande .v-benef-item:hover{background:var(--c-fond-clair)}
.np-bande .v-benef-item:first-child{border-radius:16px 0 0 16px}.np-bande .v-benef-item:last-child{border-radius:0 16px 16px 0}
.np-bande .v-benef-item p span{display:block;font-size:14.5px;font-weight:400;color:var(--c-texte-2);margin-top:2px}
.np-bande .v-benef-item:hover p{color:var(--c-orange-btn)}
#np-vision,#np-qui,#np-presse{scroll-margin-top:var(--v-nav-h)}
html:has(.np-bande){scroll-behavior:smooth}
@media (max-width:760px){
  .cm-onglets.cm-onglets--bande{width:100%;flex-direction:row;justify-content:flex-start;overflow-x:auto;scrollbar-width:none;border-radius:16px}
  .cm-onglets.cm-onglets--bande::-webkit-scrollbar{display:none}
  .cm-onglets--bande .cm-onglet{flex:none;width:auto;white-space:nowrap;border-radius:999px;padding:0 18px}
  .np-bande .v-benef-item:first-child{border-radius:16px 16px 0 0}.np-bande .v-benef-item:last-child{border-radius:0 0 16px 16px}
}

/* ANIMATIONS D'OUVERTURE (Comment ça marche, Notre projet) — toutes coupées par prefers-reduced-motion (règle .vitrine * plus haut) */
@keyframes v-monte{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@keyframes v-fondu{from{opacity:0}to{opacity:1}}
.v-anim{animation:v-monte 350ms cubic-bezier(.2,.7,.3,1) var(--d,0ms) both}
.v-anim--fondu{animation-name:v-fondu}
/* Frise de Comment ça marche : la ligne se dessine, les icônes apparaissent en cascade (100 ms) ;
   le segment « Prochainement » (::after) reste statique. Rejouée à chaque affichage d'un panneau
   (un élément qui repasse de display:none à visible relance ses animations). */
@keyframes v-ligne-h{from{transform:scaleX(0)}to{transform:none}}
@keyframes v-ligne-v{from{transform:scaleY(0)}to{transform:none}}
@keyframes v-pop{from{opacity:0;transform:scale(.82)}to{opacity:1;transform:none}}
.cm-panneau{--cm-depart:550ms}
.cm-panneau .v-frise::before{transform-origin:left center;animation:v-ligne-h 700ms cubic-bezier(.4,0,.2,1) var(--cm-depart) both}
.cm-panneau .v-frise-ic{animation:v-pop 350ms cubic-bezier(.2,.7,.3,1) calc(var(--cm-depart) + var(--i,0) * 100ms) both}
@media (max-width:1024px){.cm-panneau .v-frise::before{transform-origin:center top;animation-name:v-ligne-v}}
/* Trame de plan du haut de page : se dessine une fois à l'ouverture (1 s) */
@keyframes v-trace{to{stroke-dashoffset:0}}
@media (prefers-reduced-motion:no-preference){
  .v-trame--trace .v-plan path[pathLength]{stroke-dasharray:1;stroke-dashoffset:1;animation:v-trace 1s ease-out 100ms forwards}
  .v-trame--trace .v-plan path:not([pathLength]),.v-trame--trace .v-plan text{animation:v-fondu 400ms ease 900ms both}
}
@media (max-width:760px){.cm-shots{gap:40px}}

/* ===== Annuaire public (/professionnels) ===== */
/* Filtres posés dans la bande du haut de page : même boîte, même ombre que .v-benef-grille */
.an-filtres{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;gap:12px;align-items:center;padding:14px;background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute)}
.an-filtres:has(.an-reinit){grid-template-columns:repeat(3,minmax(0,1fr)) auto auto}
.an-filtres select,.an-filtres .amo-sel-btn,.an-filtrer{height:48px;box-sizing:border-box}
.an-filtres select{appearance:none;width:100%;background:var(--c-fond-clair) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%234b5563' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat right 14px center;
  border:1px solid var(--c-bord);border-radius:10px;padding:0 34px 0 14px;font-size:15px;color:var(--c-marine);font-family:inherit;cursor:pointer}
.an-filtres .amo-sel-btn{background:var(--c-fond-clair);border-width:1px;font-size:15px}
.an-filtrer{padding:0 26px}
.an-reinit{font-size:15px;white-space:nowrap;padding:0 6px}
.v-sombre .an-filtres .v-lien{color:var(--c-orange-btn)}
.an-compte{font-size:15px;color:var(--c-texte-2);margin-bottom:20px}
.an-compte strong{color:var(--c-marine);font-weight:600}
/* Spécialités secondaires sur la carte */
.an-specs{display:flex;flex-wrap:wrap;gap:6px}
.an-specs span{background:var(--c-fond-clair-2);color:var(--c-marine);font-size:12.5px;font-weight:500;padding:4px 10px;border-radius:999px}
.an-specs--grand span{font-size:14px;padding:6px 14px}
/* Fiche publique anonymisée (/professionnels/<id>) */
.an-fiche-sec{padding-top:40px}
.an-fiche-wrap{max-width:820px}
.an-retour{margin-bottom:20px;font-size:15px}
.an-fiche{padding:36px 40px}
.an-fiche-haut{display:flex;align-items:flex-start;gap:20px}
.an-fiche-av{width:64px;height:64px;border-radius:16px}
.an-fiche-av svg{width:30px;height:30px}
.an-fiche h1{font-size:clamp(24px,2.6vw,32px);font-weight:600;color:var(--c-marine);line-height:1.2;margin:10px 0 6px}
.an-fiche-metier{font-size:16px;color:var(--c-texte-2);margin-bottom:14px}
.an-fiche-bloc{margin-top:28px;padding-top:24px;border-top:1px solid var(--c-bord)}
.an-fiche-bloc h2,.an-fiche-acces h2{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:14px}
.an-fiche-zone{font-size:16px;color:var(--c-marine)}
.an-fiche-acces{margin-top:32px;padding:28px;border-radius:var(--v-rayon);background:var(--c-fond-clair);text-align:center}
.an-fiche-acces h2{font-size:19px;letter-spacing:normal;text-transform:none;color:var(--c-marine)}
.an-fiche-acces p{font-size:15.5px;color:var(--c-texte-2);line-height:1.6;max-width:56ch;margin:0 auto 20px}
.an-fiche-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap}
.an-fiche-note{margin-top:20px;font-size:13.5px;color:var(--c-texte-3);text-align:center}
@media (max-width:900px){
  .an-filtres,.an-filtres:has(.an-reinit){grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .an-filtres select:first-child,.an-filtres .amo-sel:first-child{grid-column:1/-1}
}
@media (max-width:560px){
  .an-filtres,.an-filtres:has(.an-reinit){grid-template-columns:minmax(0,1fr)}
  .an-filtres select:first-child,.an-filtres .amo-sel:first-child{grid-column:auto}
  .an-reinit{text-align:center;padding:4px 0}
  .an-fiche{padding:24px 20px}
  .an-fiche-haut{flex-direction:column;gap:14px}
  .an-fiche-acces{padding:22px 16px}
}

/* ===== Annonces publiques (/opportunites/<id>) : lignes de l'aperçu masqué ===== */
.op-lignes{margin-top:24px;border-top:1px solid var(--c-bord)}
.op-ligne{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px;align-items:center;padding:16px 0;border-bottom:1px solid var(--c-bord)}
.op-k{display:flex;align-items:center;gap:10px;font-size:15px;color:var(--c-texte-2)}
.op-k svg{width:18px;height:18px;color:var(--c-orange-btn);flex:none}
.op-v{font-size:16px;font-weight:600;color:var(--c-marine)}
.op-ligne--verrou .op-k svg{color:var(--c-texte-3)}
.op-ligne--verrou .v-flou{margin:0;width:100%;max-width:340px}
.op-ligne--verrou .v-flou.court{max-width:140px}
@media (max-width:560px){
  .op-ligne{grid-template-columns:minmax(0,1fr);gap:6px}
}

/* ===== Radar de projets (/radar-de-projets) ===== */
/* Haut de page : colonne de texte un peu plus large pour tenir le titre sur 2 lignes (aperçu plafonné à 440 px) */
@media (min-width:1025px){.v-hero--radar .v-hero-grille{grid-template-columns:minmax(0,1.18fr) minmax(0,.82fr)}}
/* Aperçu compact du haut de page (macro mq_radar_liste) */
.mq-rl-liste{display:grid;gap:8px}
.mq-rl-ligne{background:var(--c-fond);border:1px solid var(--c-bord);border-radius:10px;padding:10px 12px;display:grid;gap:5px}
.mq-rl-ligne--fondu{opacity:.55}
.mq-rl-titre{display:flex;align-items:center;gap:6px;font-size:13.5px;font-weight:600;color:var(--c-marine)}
.mq-rl-titre svg{width:13px;height:13px;color:var(--c-orange);flex:none}
.mq-rl-meta{display:flex;flex-wrap:wrap;gap:4px 12px;font-size:11.5px;color:var(--c-texte-3)}
/* Pertinence : mêmes trois niveaux et mêmes couleurs que le Radar réel */
.mq-rl-pert{margin-left:auto;font-size:10.5px;font-weight:600;padding:3px 9px;border-radius:8px;background:#1f6e43;color:#fff;white-space:nowrap}
.mq-rl-pert--moyen{background:#e4f2ea;color:#1f6e43}
.mq-rl-pert--bas{background:#f3f4f6;color:#596475}
/* Deux sources */
.rd-sources{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.rd-source,.rd-carte{display:flex;flex-direction:column}
.rd-source{padding:32px;gap:12px}
.rd-source h3,.rd-carte h3{font-size:20px;font-weight:600;color:var(--c-marine);line-height:1.3}
.rd-src{font-size:14px;color:var(--c-texte-3)}
.rd-source p,.rd-carte p{font-size:15.5px;color:var(--c-texte-2);line-height:1.6}
.rd-liste{list-style:none;padding:0;margin:6px 0 0;display:grid;gap:10px}
.rd-liste li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:10px;font-size:15px;color:var(--c-texte);line-height:1.5}
.rd-coche{width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:var(--c-statut-pale);color:var(--c-statut);font-size:12px;font-weight:700;margin-top:1px}
/* Exemples (onglets permis / marché public) */
.rd-onglets{margin-bottom:40px}
.rd-exemple{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:56px;align-items:start}
.rd-exemple[hidden]{display:none}
.rd-fiche{border-radius:14px;overflow:hidden;border:1px solid var(--c-bord);box-shadow:var(--v-ombre-haute);background:var(--c-fond)}
.rd-fiche-bar{display:flex;align-items:center;gap:7px;padding:11px 14px;background:var(--c-fond-clair);border-bottom:1px solid var(--c-bord)}
.rd-fiche-bar span{width:11px;height:11px;border-radius:50%;display:block}
.rd-fiche-bar span:nth-child(1){background:var(--c-orange)}.rd-fiche-bar span:nth-child(2){background:var(--c-orange-clair)}.rd-fiche-bar span:nth-child(3){background:var(--c-statut)}
.rd-fiche-bar em{font-style:normal;font-size:12.5px;color:var(--c-texte-3);margin-left:8px}
.rd-fiche-corps{padding:22px 24px;display:grid;gap:16px}
.rd-f-tag{display:inline-block;font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-fond);background:var(--c-marine);padding:4px 10px;border-radius:6px}
.rd-f-sous{font-size:13px;color:var(--c-texte-3);margin-left:6px}
.rd-f-titre{font-size:19px;font-weight:600;color:var(--c-marine);margin-top:8px}
.rd-f-moa{border:1px solid var(--c-bord);border-radius:12px;padding:16px 18px}
.rd-f-nom{font-size:16px;font-weight:600;color:var(--c-marine);display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.rd-badge-membre{font-size:11.5px;font-weight:600;color:var(--c-fond);background:var(--c-orange-btn);padding:3px 9px;border-radius:999px}
.rd-f-grp{font-size:14px;color:var(--c-texte-2);margin-top:3px}
.rd-f-dl{display:grid;grid-template-columns:90px minmax(0,1fr);gap:6px 12px;margin:12px 0 0;padding-top:12px;border-top:1px solid var(--c-bord);font-size:14px}
.rd-f-dl dt{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-3);padding-top:2px}
.rd-f-dl dd{margin:0;font-weight:600;color:var(--c-marine)}
.rd-f-grille,.rd-f-dates{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.rd-f-grille .l,.rd-f-dates .l,.rd-f-crit .l{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-3)}
.rd-f-grille .v,.rd-f-dates .v{font-size:15px;font-weight:600;color:var(--c-marine);margin-top:3px}
.rd-f-dates{background:var(--c-orange-pale);border-radius:10px;padding:12px 14px}
.rd-f-lot{display:flex;align-items:center;gap:10px;flex-wrap:wrap;border:1px solid var(--c-bord);border-radius:12px;padding:12px 16px;font-size:15px;color:var(--c-texte-2)}
.rd-f-lot b{color:var(--c-marine)}
.rd-f-crit{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.rd-f-crit span:not(.l){font-size:13px;font-weight:600;color:var(--c-marine);background:var(--c-fond-clair-2);padding:4px 10px;border-radius:999px}
.rd-f-statut{background:var(--c-orange-pale);border-radius:10px;padding:12px 14px;font-size:14px;color:var(--c-texte-2)}
.rd-f-statut strong{display:block;font-size:15px;color:var(--c-orange-btn);margin-bottom:2px}
.rd-fictif{margin-top:12px}
.rd-legende{list-style:none;padding:0;margin:0;display:grid;gap:22px}
.rd-legende li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:14px}
.rd-n{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--c-orange-btn);color:var(--c-fond);font-size:14px;font-weight:600}
.rd-legende h3{font-size:17px;font-weight:600;color:var(--c-marine);margin-bottom:4px}
.rd-legende p{font-size:15px;color:var(--c-texte-2);line-height:1.6}
/* Fonctions : liste alternée texte / aperçu */
.rd-fonctions{display:grid;gap:56px;max-width:1040px;margin:0 auto}
.rd-fonction{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:center}
.rd-fonction--inverse .rd-fonction-txt{order:2}
.rd-fonction-txt{display:flex;flex-direction:column;gap:12px;align-items:flex-start}
.rd-fonction-txt h3{font-size:22px;font-weight:600;color:var(--c-marine)}
.rd-fonction-txt p{font-size:16px;color:var(--c-texte-2);line-height:1.65}
.rd-mq{max-width:440px;width:100%;justify-self:center}
.rd-mq .mq-corps{display:grid;gap:8px;padding:16px}
.rd-mq .mq-filtres{margin-bottom:0}
.rd-mq .mq-alerte{width:100%;max-width:none;box-shadow:none;border:1px solid var(--c-bord)}
.rd-mq-tri{font-size:12px;font-weight:600;color:var(--c-texte-3)}
.rd-mq-ligne{display:flex;align-items:center;gap:10px;background:var(--c-fond);border:1px solid var(--c-bord);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;color:var(--c-marine)}
.rd-mq-ligne > span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rd-mq-statut{margin-left:auto;font-size:11px;font-weight:600;padding:3px 9px;border-radius:999px;background:var(--c-fond-clair-2);color:var(--c-marine);white-space:nowrap}
.rd-mq-statut--cours{background:var(--c-orange-pale);color:var(--c-orange-btn)}
.rd-mq-statut--gagne{background:var(--c-statut-pale);color:var(--c-statut)}
.rd-mq-lien{margin-left:auto;font-size:11.5px;color:var(--c-orange-btn);white-space:nowrap}
.rd-mq-rappel{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--c-orange-btn)}
.rd-mq-rappel svg{width:14px;height:14px}
.rd-mq-recherche{display:flex;gap:10px;align-items:flex-start;background:var(--c-fond);border:1px solid var(--c-bord);border-radius:12px;padding:12px 14px;font-size:12.5px;color:var(--c-texte-2)}
.rd-mq-recherche svg{width:16px;height:16px;color:var(--c-marine);flex:none;margin-top:2px}
.rd-mq-recherche b{display:block;color:var(--c-marine);font-size:13px}
.rd-mq-moa{display:flex;align-items:center;gap:10px;background:var(--c-fond);border:1px solid var(--c-bord);border-radius:12px;padding:12px;font-size:12px;color:var(--c-texte-3)}
.rd-mq-moa .mq-av svg{width:18px;height:18px}
.rd-mq-moa b{display:block;font-size:13.5px;color:var(--c-marine)}
.rd-mq-suivi{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:var(--c-fond);background:var(--c-marine);padding:4px 9px;border-radius:999px}
.rd-mq-suivi svg{width:12px;height:12px}
.rd-mq-rang{display:grid;grid-template-columns:18px minmax(0,1fr) auto;gap:4px 10px;align-items:center;background:var(--c-fond);border:1px solid var(--c-bord);border-radius:10px;padding:10px 12px;font-size:13px;font-weight:600;color:var(--c-marine)}
.rd-mq-rang b{color:var(--c-orange-btn)}
.rd-mq-rang i{grid-column:2/3;grid-row:2;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--c-orange) var(--v),var(--c-fond-clair-2) var(--v))}
.rd-mq-rang em{font-style:normal;font-size:12px;color:var(--c-texte-3);grid-row:1/3;grid-column:3}
.rd-offre{width:fit-content;font-size:12.5px;font-weight:600;color:var(--c-orange-btn);background:var(--c-orange-pale);padding:4px 10px;border-radius:999px}
/* Selon votre métier : colonnes à filet orange, sans cartes */
.rd-metiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px}
.rd-metier{border-left:3px solid var(--c-orange);padding:4px 0 4px 22px}
.rd-metier h3{font-size:18px;font-weight:600;color:var(--c-marine);margin-bottom:8px}
.rd-metier p{font-size:15.5px;color:var(--c-texte-2);line-height:1.65}
/* Sources et limites */
.rd-grille3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.rd-carte{padding:26px;gap:12px}
.rd-carte h3{font-size:18px}
/* Comparatif : colonne ESSENTIEL mise en avant, un bouton par colonne */
#rd-offres{scroll-margin-top:var(--v-nav-h)}
.rd-tableau{overflow-x:auto;border-radius:16px;box-shadow:var(--v-ombre);border:1px solid var(--c-bord);background:var(--c-fond);max-width:960px;margin:0 auto}
.rd-comparatif{width:100%;border-collapse:collapse;font-size:15px;min-width:560px}
.rd-comparatif th{font-size:13px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--c-texte-3);padding:18px 20px;text-align:left;border-bottom:1px solid var(--c-bord);background:var(--c-fond-clair);vertical-align:bottom}
.rd-comparatif th.offre{text-align:center;color:var(--c-marine);font-size:15px;width:210px}
.rd-comparatif th.offre--essentiel{background:var(--c-marine);color:var(--c-fond)}
.rd-comparatif th .prix{display:block;font-size:13px;font-weight:500;color:var(--c-texte-2);text-transform:none;letter-spacing:0;margin-top:3px}
.rd-comparatif th.offre--essentiel .prix{color:var(--c-sur-surface-2)}
.rd-comparatif th .promo{display:block;font-size:12px;font-weight:600;color:var(--c-orange-btn);text-transform:none;letter-spacing:0;margin-top:3px}
.rd-comparatif th.offre--essentiel .promo{color:var(--c-orange-clair)}
.rd-comparatif th s{color:var(--c-texte-3);font-weight:400}
/* Même pastille que /notre-offre (.popular-tag) : minuscules, 13 px, 6 × 16 px */
.rd-populaire{display:block;width:fit-content;margin:0 auto 10px;font-size:13px;font-weight:600;letter-spacing:normal;text-transform:none;line-height:1.3;white-space:nowrap;color:var(--c-fond);background:var(--c-orange-btn);padding:6px 16px;border-radius:999px}
.rd-comparatif td{padding:15px 20px;border-bottom:1px solid var(--c-bord);line-height:1.5;color:var(--c-texte)}
.rd-comparatif tbody tr:last-child td{border-bottom:1px solid var(--c-bord)}
.rd-comparatif tfoot td{border-bottom:0;padding:18px 16px}
.rd-comparatif td.c{text-align:center;font-weight:600;color:var(--c-marine)}
.rd-comparatif td.ess{background:color-mix(in srgb,var(--c-orange) 5%,var(--c-fond))}
.rd-comparatif .oui{color:var(--c-statut);font-size:17px}
.rd-comparatif .non{color:var(--c-texte-3)}
.rd-btn-offre{width:100%;justify-content:center;padding-left:12px;padding-right:12px;font-size:14.5px;white-space:normal;text-align:center}
@media (max-width:1024px){
  .rd-grille3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .rd-exemple{grid-template-columns:minmax(0,1fr);gap:36px}
  .rd-fonction,.rd-fonction--inverse{grid-template-columns:minmax(0,1fr);gap:24px}
  .rd-fonction--inverse .rd-fonction-txt{order:0}
  .rd-mq{justify-self:start}
  .rd-metiers{grid-template-columns:minmax(0,1fr);gap:28px;max-width:640px;margin:0 auto}
}
@media (max-width:760px){
  .rd-sources,.rd-grille3{grid-template-columns:minmax(0,1fr)}
  .rd-source{padding:24px}
  .rd-fiche-corps{padding:18px}
  .rd-f-grille,.rd-f-dates{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .rd-fonctions{gap:44px}
  .rd-comparatif{min-width:0;font-size:14px}
  .rd-comparatif th,.rd-comparatif td{padding:12px 10px}
  .rd-comparatif th.offre{width:96px;font-size:12.5px;letter-spacing:.02em}
  .rd-comparatif th .prix{font-size:12px}
  /* Colonne étroite : la pastille passe sur 2 lignes, en rectangle arrondi pour que le texte reste dedans */
  .rd-populaire{white-space:normal;border-radius:12px;font-size:11.5px;padding:5px 10px;max-width:100%;text-align:center}
  .rd-comparatif tfoot td{padding:12px 6px}
  .rd-btn-offre{font-size:13px;min-height:44px}
}

/* ===== Contact (/contact, version publique) ===== */
.ct-mail{color:var(--c-marine);text-decoration:underline;text-decoration-color:var(--c-orange);text-underline-offset:3px;word-break:break-all}
.ct-mail:hover{color:var(--c-orange-btn)}
.ct-sous{display:block;font-size:14px;font-weight:400;color:var(--c-texte-2);margin-top:2px}
.ct-grille{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start;max-width:1040px}
.ct-form{padding:36px 40px}
.ct-titre{font-size:24px;font-weight:600;color:var(--c-marine)}
.ct-chapo{font-size:15.5px;color:var(--c-texte-2);margin:6px 0 24px}
.ct-form .flash-success,.ct-form .flash-error{margin-bottom:20px}
.ct-ligne{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.ct-champ{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.ct-champ label{font-size:14.5px;font-weight:600;color:var(--c-marine)}
.ct-champ input,.ct-champ select,.ct-champ textarea,.ct-champ .amo-sel-btn{width:100%;font-family:inherit;font-size:15.5px;color:var(--c-marine);background:var(--c-fond-clair);border:1px solid var(--c-bord);border-radius:10px;padding:0 14px;min-height:48px}
.ct-champ textarea{padding:12px 14px;min-height:150px;resize:vertical;line-height:1.55}
.ct-champ select{appearance:none;background:var(--c-fond-clair) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%234b5563' stroke-width='1.5' fill='none'/%3E%3C/svg%3E") no-repeat right 14px center;padding-right:34px;cursor:pointer}
.ct-champ input:focus,.ct-champ select:focus,.ct-champ textarea:focus{outline:none;border-color:var(--c-orange);box-shadow:0 0 0 3px rgba(225,98,43,.14)}
.ct-champ input::placeholder,.ct-champ textarea::placeholder{color:var(--c-texte-3)}
.ct-envoyer{margin-top:6px}
.ct-note{margin-top:14px;font-size:13.5px;color:var(--c-texte-3);line-height:1.55}
.ct-aside{position:sticky;top:calc(var(--v-nav-h) + 24px)}
.ct-membre{background:var(--v-degrade-surface);border-radius:var(--v-rayon);padding:28px;display:flex;flex-direction:column;align-items:flex-start;gap:16px}
.ct-membre p{font-size:15.5px;color:var(--c-sur-surface-2);line-height:1.6}
.ct-membre .v-picto{background:rgb(255 255 255 / .1);color:var(--c-orange-clair)}
@media (max-width:900px){
  .ct-grille{grid-template-columns:minmax(0,1fr)}
  .ct-aside{position:static}
}
@media (max-width:560px){
  .ct-form{padding:24px 20px}
  .ct-ligne{grid-template-columns:minmax(0,1fr);gap:0}
}

/* ===== FAQ (/faq) ===== */
.fq-themes{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute);overflow:hidden}
.fq-themes a{display:flex;flex-direction:column;align-items:center;gap:10px;padding:20px 12px;text-align:center;text-decoration:none;font-size:15px;font-weight:600;color:var(--c-marine);line-height:1.3;transition:background var(--v-anim)}
.fq-themes a + a{border-left:1px solid var(--c-bord)}
.fq-themes a:hover{background:var(--c-fond-clair);color:var(--c-orange-btn)}
.fq-nb{font-size:13px;font-weight:500;color:var(--c-texte-3)}
.fq-wrap{max-width:860px}
.fq-section{scroll-margin-top:calc(var(--v-nav-h) + 16px)}
.fq-section + .fq-section{margin-top:56px}
.fq-titre{display:flex;align-items:center;gap:14px;font-size:24px;font-weight:600;color:var(--c-marine);margin-bottom:18px}
.fq-item{border-bottom:1px solid var(--c-bord)}
.fq-item:first-of-type{border-top:1px solid var(--c-bord)}
.fq-item summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 4px;cursor:pointer;font-size:17px;font-weight:600;color:var(--c-marine);line-height:1.4}
.fq-item summary::-webkit-details-marker{display:none}
.fq-item summary:hover{color:var(--c-orange-btn)}
.fq-item summary:focus-visible{outline:2px solid var(--c-orange);outline-offset:2px;border-radius:6px}
.fq-plus{flex:none;width:30px;height:30px;border-radius:50%;background:var(--c-fond-clair-2);position:relative;transition:transform var(--v-anim),background var(--v-anim)}
.fq-plus::before,.fq-plus::after{content:'';position:absolute;left:50%;top:50%;width:12px;height:2px;margin:-1px 0 0 -6px;border-radius:2px;background:var(--c-marine)}
.fq-plus::after{transform:rotate(90deg);transition:transform var(--v-anim)}
.fq-item[open] .fq-plus{background:var(--c-orange-btn)}
.fq-item[open] .fq-plus::before,.fq-item[open] .fq-plus::after{background:var(--c-fond)}
.fq-item[open] .fq-plus::after{transform:rotate(0)}
.fq-rep{padding:0 54px 22px 4px;font-size:16px;color:var(--c-texte-2);line-height:1.7}
.fq-rep a{color:var(--c-orange-btn);font-weight:600}
@media (max-width:1024px){
  .fq-themes{grid-template-columns:repeat(3,minmax(0,1fr))}
  .fq-themes a:nth-child(4){border-left:0}
  .fq-themes a:nth-child(n+4){border-top:1px solid var(--c-bord)}
}
@media (max-width:560px){
  .fq-themes{grid-template-columns:repeat(2,minmax(0,1fr))}
  .fq-themes a{padding:16px 8px;font-size:14px}
  .fq-themes a:nth-child(4){border-left:1px solid var(--c-bord)}
  .fq-themes a:nth-child(odd){border-left:0}
  .fq-themes a:nth-child(n+3){border-top:1px solid var(--c-bord)}
  .fq-item summary{font-size:16px;padding:18px 0}
  .fq-rep{padding:0 0 20px}
  .fq-titre{font-size:21px}
}
.fq-lien-radar{display:inline-block;margin-top:10px}

/* ===== Presse (/presse) ===== */
.pr-wrap{max-width:960px}
.pr-liste{display:grid;gap:24px}
.pr-carte{flex-direction:row;gap:28px;padding:24px;align-items:flex-start}
.pr-vignette{flex:none;width:240px;aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--c-marine)}
.pr-vignette img{width:100%;height:100%;object-fit:cover;display:block}
.pr-vignette-repli{width:100%;height:100%;display:flex;align-items:center;justify-content:center;font-size:30px;font-weight:600;color:var(--c-orange-clair)}
.pr-corps{min-width:0;display:flex;flex-direction:column;gap:10px}
.pr-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px}
.pr-media{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn)}
.pr-date{font-size:14px;color:var(--c-texte-3)}
.pr-titre{font-size:21px;font-weight:600;color:var(--c-marine);line-height:1.3}
.pr-carte:hover .pr-titre{color:var(--c-orange-btn)}
.pr-extrait{font-size:15.5px;color:var(--c-texte-2);line-height:1.65}
.pr-lien{font-size:15px;align-self:flex-start;margin-top:4px}
@media (max-width:760px){
  .pr-carte{flex-direction:column;gap:18px;padding:18px}
  .pr-vignette{width:100%}
  .pr-titre{font-size:19px}
}

/* ===== Pages légales (mentions légales, confidentialité, CGU, CGV) : textes inchangés ===== */
.lg-page{padding-top:48px}
.lg-wrap{max-width:820px}
.lg-page .toc{background:var(--c-fond-clair);border-radius:var(--v-rayon);padding:26px 30px;margin:0 0 48px}
.lg-page .toc-title{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:14px}
.lg-page .toc-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 28px}
.lg-page .toc-list a{font-size:15px;color:var(--c-marine);text-decoration:none;padding:6px 0;line-height:1.4}
.lg-page .content h2{font-size:22px;font-weight:600;color:var(--c-marine);margin:48px 0 14px;padding-top:28px;border-top:1px solid var(--c-bord);scroll-margin-top:calc(var(--v-nav-h) + 16px)}
.lg-page .content h2:first-child{margin-top:0;padding-top:0;border-top:0}
.lg-page .content h3{font-size:17px;font-weight:600;color:var(--c-marine);margin:24px 0 8px}
.lg-page .content p{font-size:16px;color:var(--c-texte-2);line-height:1.75;margin-bottom:14px}
.lg-page .content ul{margin:8px 0 14px 22px;display:flex;flex-direction:column;gap:6px}
.lg-page .content ul li{font-size:16px;color:var(--c-texte-2);line-height:1.7}
.lg-page .content strong{font-weight:600;color:var(--c-marine)}
.lg-page .content a{color:var(--c-orange-btn);text-decoration:underline;text-underline-offset:2px;overflow-wrap:anywhere}
.lg-page .highlight-box{background:var(--c-orange-pale);border-left:3px solid var(--c-orange);border-radius:10px;padding:16px 20px;margin:18px 0}
.lg-page .highlight-box p{margin-bottom:0;color:var(--c-texte)}
/* CGU / CGV : sommaire posé à cheval sur le bas du haut de page ; liens = lien tertiaire du site (.v-lien) */
.lg-bande{max-width:900px}
.lg-bande .toc-title{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:12px}
.lg-bande .toc-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 28px}
.lg-bande .toc{background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute);padding:26px 32px;margin:0;text-align:left}
.lg-bande .toc-list a.v-lien{font-size:15.5px;justify-self:start;width:fit-content;padding:5px 0 3px;color:var(--c-orange-btn)}
.v-sombre .lg-bande .v-lien{color:var(--c-orange-btn)}
@media (max-width:760px){
  .lg-page{padding-top:28px}
  .lg-page .toc{padding:20px 18px}
  .lg-page .toc-list{grid-template-columns:minmax(0,1fr);gap:0}
  .lg-page .toc-list a{padding:9px 0;min-height:40px}
  .lg-bande .toc{padding:20px 18px}
  .lg-bande .toc-list{grid-template-columns:minmax(0,1fr)}
  .lg-page .content h2{font-size:20px}
}

/* Accessibilité : pastille d'état et tableau des axes d'amélioration (texte marine : contraste AA) */
.lg-page .lg-statut{display:inline-block;padding:3px 12px;border-radius:999px;background:var(--c-orange-pale);
  border:1px solid var(--c-orange);color:var(--c-marine);font-size:14px;font-weight:600;line-height:1.5;white-space:nowrap}
.lg-page .lg-tableau{overflow-x:auto;margin:12px 0 8px;border:1px solid var(--c-bord);border-radius:12px}
.lg-page .lg-tableau table{width:100%;border-collapse:collapse;min-width:520px}
.lg-page .lg-tableau th{background:var(--c-fond-clair);color:var(--c-marine);font-size:13px;font-weight:600;letter-spacing:.04em;
  text-transform:uppercase;text-align:left;padding:12px 16px;border-bottom:1px solid var(--c-bord)}
.lg-page .lg-tableau td{padding:12px 16px;font-size:15px;line-height:1.55;color:var(--c-texte-2);border-bottom:1px solid var(--c-bord);vertical-align:top}
.lg-page .lg-tableau td:first-child{color:var(--c-marine);font-weight:500}
.lg-page .lg-tableau tr:last-child td{border-bottom:0}
.lg-page .content code{font-size:.9em;background:var(--c-fond-clair);border-radius:5px;padding:1px 6px;color:var(--c-marine)}

/* Sélections de l'annuaire (collections) */
.co-liste{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.co-ligne{padding:24px 26px;gap:8px}
.co-titre{font-size:18px;font-weight:600;color:var(--c-marine);line-height:1.3}
.co-accroche{font-size:15px;color:var(--c-texte-2);line-height:1.6}
.co-nombre{margin-top:auto;padding-top:10px;width:fit-content;font-size:14px;font-weight:600;color:var(--c-marine)}
.co-entete{display:flex;align-items:baseline;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;margin-bottom:20px}
.co-entete .v-lien{font-size:15px}
.co-entete .an-compte{margin-bottom:0}
@media (max-width:760px){
  /* Tableau empilé : une carte par axe, la priorité annoncée en clair */
  .lg-page .lg-tableau{overflow:visible;border:0;border-radius:0}
  .lg-page .lg-tableau table{min-width:0}
  .lg-page .lg-tableau thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .lg-page .lg-tableau tr{display:block;border:1px solid var(--c-bord);border-radius:12px;padding:14px 16px;margin-bottom:10px}
  .lg-page .lg-tableau td{display:block;padding:0;border:0}
  .lg-page .lg-tableau td+td{margin-top:6px}
  .lg-page .lg-tableau td:nth-child(3){font-size:14px;font-weight:600;color:var(--c-marine)}
  .lg-page .lg-tableau td:nth-child(3)::before{content:'Priorité : ';font-weight:400;color:var(--c-texte-2)}
  .co-liste{grid-template-columns:minmax(0,1fr);gap:14px}
  .co-ligne{padding:20px}
}

/* Pied : logo LinkedIn à droite du lien */
.vp-linkedin{display:inline-flex;align-items:center;gap:8px}
.vp-linkedin svg{width:17px;height:17px;flex:none}

/* ===== Parcours de compte : écran partagé (formulaire à gauche, panneau marine à droite) ===== */
.au-body{background:var(--c-fond-clair);min-height:100svh}
body.vitrine.au-body{padding-top:0}
.au-entete{position:relative;z-index:5}
.au-entete-q{font-size:15px;color:var(--c-texte-2);margin-right:6px}
.au-page{display:grid;grid-template-columns:minmax(0,1fr) minmax(380px,40%);min-height:calc(100svh - var(--v-nav-h))}
.au-gauche{display:flex;align-items:center;justify-content:center;padding:56px var(--v-gouttiere)}
.au-form{width:100%;max-width:440px}
.au-form--large{max-width:620px}
.au-titre{font-size:clamp(26px,2.4vw,34px);font-weight:600;color:var(--c-marine);line-height:1.2;margin:10px 0 8px}
.au-chapo{font-size:16px;color:var(--c-texte-2);line-height:1.6;margin-bottom:32px}
.au-form .flash-success,.au-form .flash-error,.au-form .flash-info,.au-form .flash-warning{margin-bottom:20px}
.au-mdp{position:relative}
.au-mdp input{padding-right:52px !important}
.au-oeil{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;display:grid;place-items:center;background:none;border:0;border-radius:8px;color:var(--c-texte-3);cursor:pointer}
.au-oeil:hover{color:var(--c-marine)}
.au-ligne-options{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:-4px 0 24px}
.au-case{display:inline-flex;align-items:center;gap:9px;font-size:15px;color:var(--c-texte-2);cursor:pointer}
.au-case input{width:18px;height:18px;accent-color:var(--c-orange-btn);margin:0}
.au-ligne-options .v-lien{font-size:15px}
.au-bouton{width:100%}
.au-separateur{display:flex;align-items:center;gap:14px;margin:28px 0 18px;font-size:15px;color:var(--c-texte-3)}
.au-separateur::before,.au-separateur::after{content:'';flex:1;height:1px;background:var(--c-bord)}
.au-panneau{position:relative;overflow:hidden;background:var(--v-degrade-surface);color:var(--c-fond);display:flex;align-items:center;padding:56px clamp(32px,4vw,64px);margin:var(--v-panneau-espace) var(--v-panneau-marge) var(--v-panneau-espace) 0;border-radius:var(--v-panneau-rayon)}
.au-panneau-int{position:relative;max-width:440px}
.au-panneau .v-tag{color:var(--c-orange-clair)}
.au-panneau-titre{font-size:clamp(26px,2.4vw,34px);font-weight:500;line-height:1.2;color:var(--c-fond);margin:12px 0 16px}
.au-panneau-titre em{font-style:normal;color:var(--c-orange-clair)}
.au-panneau-sous{font-size:16px;line-height:1.65;color:var(--c-sur-surface-2);margin-bottom:28px}
.au-atouts{list-style:none;padding:0;margin:0;display:grid;gap:18px}
.au-atouts li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:14px;align-items:start}
.au-atouts .v-picto{background:rgb(255 255 255 / .08);color:var(--c-orange-clair)}
.au-atouts b{display:block;font-size:16px;font-weight:600;color:var(--c-fond);margin-bottom:2px}
.au-atouts div{line-height:1.5}
.au-atouts div > span{font-size:14.5px;line-height:1.55;color:var(--c-sur-surface-2)}
.au-panneau .mq{margin-top:28px}
@media (max-width:900px){
  .au-page{grid-template-columns:minmax(0,1fr)}
  .au-panneau{display:none}
  .au-gauche{padding:36px 16px 48px;align-items:flex-start}
}
/* Mobile : seul le lien reste (la question passait à la ligne à côté du logo) */
@media (max-width:640px){.au-entete-q{display:none}}
/* Inscription : formulaire seul, centré (pas de panneau) */
.au-page--seul{grid-template-columns:minmax(0,1fr)}
.au-gauche--haut{align-items:flex-start;padding-top:40px}
.au-page > .au-panneau{position:sticky;top:calc(var(--v-nav-h) + var(--v-panneau-espace));height:calc(100svh - var(--v-nav-h) - 2 * var(--v-panneau-espace));align-self:start}

/* ===== Pages de statut du parcours (e-mail envoyé, activation, mot de passe…) : carte centrée ===== */
.au-statut{min-height:calc(100svh - var(--v-nav-h));display:flex;align-items:flex-start;justify-content:center;padding:64px 16px 80px;position:relative}
.au-statut .wrap{width:100%;display:flex;justify-content:center}
.au-statut .card{width:100%;max-width:520px;background:var(--c-fond);border-radius:16px;box-shadow:var(--v-ombre-haute);padding:44px 40px;text-align:center}
.au-statut .card:has(form){text-align:left}
.au-statut .icon{width:64px;height:64px;border-radius:18px;display:grid;place-items:center;margin:0 auto 22px;background:var(--c-fond-clair-2)}
.au-statut .icon svg{width:30px;height:30px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.au-statut .icon:not([style]) svg{stroke:var(--c-statut)}
.au-statut .icon:not([style]){background:var(--c-statut-pale)}
.au-statut h1,.au-statut .title{font-size:clamp(24px,2.2vw,30px);font-weight:600;color:var(--c-marine);line-height:1.25;margin-bottom:12px}
.au-statut .eyebrow{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:10px}
.au-statut .eyebrow::before{content:'';width:22px;height:2px;background:currentColor;border-radius:2px}
.au-statut p,.au-statut .sub{font-size:16px;color:var(--c-texte-2);line-height:1.65;margin-bottom:16px}
.au-statut strong{color:var(--c-marine);font-weight:600}
.au-statut .profil{display:inline-block;font-size:13px;font-weight:600;color:var(--c-orange-btn);background:var(--c-orange-pale);padding:4px 12px;border-radius:999px;margin-bottom:18px}
.au-statut .email-box{font-size:16.5px;font-weight:600;color:var(--c-marine);background:var(--c-fond-clair);border:1px solid var(--c-bord);border-radius:10px;padding:12px 16px;margin:0 0 18px;word-break:break-all}
.au-statut .timer{display:flex;align-items:flex-start;gap:10px;text-align:left;font-size:14.5px;line-height:1.55;color:#7e5707;background:#fdf3e2;border-radius:10px;padding:12px 14px;margin:6px 0 24px}
.au-statut .timer svg{width:18px;height:18px;flex:none;fill:none;stroke:#b7791f;stroke-width:2;margin-top:2px}
.au-statut .info-box{font-size:15px;line-height:1.6;color:var(--c-texte-2);background:var(--c-fond-clair);border-radius:10px;padding:14px 16px;margin:0 0 24px;text-align:left}
.au-statut .btn,.au-statut .btn-terra,.au-statut .btn-navy{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;padding:0 24px;border-radius:var(--v-rayon);font-family:inherit;font-size:16px;font-weight:600;text-decoration:none;cursor:pointer;border:1.5px solid transparent;background:var(--c-orange-btn);color:var(--c-fond);box-shadow:0 6px 18px color-mix(in srgb,var(--c-orange-btn) 30%,transparent);transition:background var(--v-anim)}
.au-statut .btn:hover,.au-statut .btn-terra:hover{background:var(--c-orange-btn-survol)}
.au-statut .btn-navy{background:var(--c-marine);box-shadow:none}
.au-statut .btn-ghost{display:flex;align-items:center;justify-content:center;width:100%;min-height:52px;margin-top:12px;border-radius:var(--v-rayon);border:1.5px solid var(--c-marine);background:transparent;color:var(--c-marine);font-size:16px;font-weight:600;text-decoration:none;box-shadow:none}
.au-statut .btn-ghost:hover{background:var(--c-marine);color:var(--c-fond)}
.au-statut .btn + .btn{margin-top:12px}
/* Lien de retour = lien du site (.v-lien : soulignement dessiné au survol), centré sous le bouton */
.au-statut .back{display:table;margin:20px auto 0;font-size:15px}
.au-statut .field{display:flex;flex-direction:column;gap:7px;margin-bottom:18px}
.au-statut .field label{font-size:14.5px;font-weight:600;color:var(--c-marine)}
.au-statut .field input{width:100%;font-family:inherit;font-size:15.5px;color:var(--c-marine);background:var(--c-fond-clair);border:1px solid var(--c-bord);border-radius:10px;padding:0 14px;min-height:48px}
.au-statut .field input:focus{outline:none;border-color:var(--c-orange);box-shadow:0 0 0 3px rgba(225,98,43,.14)}
.au-statut .hint{font-size:13.5px;color:var(--c-texte-3);line-height:1.5}
.au-statut .champ-manquant{border-color:#D1351A !important;box-shadow:0 0 0 3px rgba(209,53,26,.12)}
.au-statut .sep{height:1px;background:var(--c-bord);margin:28px 0}
.au-statut .confirm-notice,.au-statut [class^="flash-"]{margin-bottom:18px;text-align:left}
.au-statut .dev-banner,.au-statut .dev-box{text-align:left;margin-top:24px;padding:14px 16px;border:1.5px dashed #b7791f;border-radius:10px;background:#fffaf0}
.au-statut .dev-label,.au-statut .dev-title{font-size:13px;font-weight:700;color:#7e5707;margin-bottom:4px}
.au-statut .dev-desc{font-size:13.5px;color:var(--c-texte-2);margin-bottom:8px}
.au-statut .dev-link{font-size:13px;color:var(--c-orange-btn);word-break:break-all}
@media (max-width:560px){
  .au-statut{padding:28px 12px 48px}
  .au-statut .card{padding:30px 20px}
}
.au-statut .confirm-notice{font-size:14.5px;line-height:1.6;border-radius:10px;padding:12px 14px}
.au-statut .confirm-notice--warning{background:#FFF8EC;border:1px solid #F0DDAE;color:#7E5707}
.au-statut .confirm-notice--error{background:#FDECEA;border:1px solid #F3C6C1;color:#A32A14}
.au-statut .confirm-notice--info{background:#F1F4FA;border:1px solid #D3DDEE;color:#1E3A6B}
.au-statut .confirm-notice--success{background:#EAF5EE;border:1px solid #BEE0CB;color:#1F6F4A}
/* Index des aperçus (local) */
.ap-wrap{padding-top:48px}
.ap-groupe{background:var(--c-fond);border-radius:var(--v-rayon);box-shadow:var(--v-ombre);padding:22px 26px;margin-bottom:18px}
.ap-groupe h2{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--c-orange-btn);margin-bottom:12px}
.ap-groupe ul{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.ap-groupe li span{font-size:14px;color:var(--c-texte-3);margin-left:6px}

/* ===== Messages (pages de la refonte) : encadrés doux au lieu du simple filet d'amo-statut.css ===== */
.vitrine .flash-success,.vitrine .flash-error,.vitrine .flash-danger,.vitrine .flash-warning,.vitrine .flash-info{
  border:1px solid;border-left-width:4px;border-radius:10px;padding:14px 16px 14px 46px;font-size:15px;line-height:1.55;margin:0 0 22px}
.vitrine .flash-success::before,.vitrine .flash-error::before,.vitrine .flash-danger::before,.vitrine .flash-warning::before,.vitrine .flash-info::before{left:16px;top:15px}
.vitrine .flash-error,.vitrine .flash-danger{background:#fdf1ef;border-color:#f3c6c1;border-left-color:#d1351a}
.vitrine .flash-warning{background:#fff8ec;border-color:#f0ddae;border-left-color:#e8a317}
.vitrine .flash-success{background:#edf7f1;border-color:#bee0cb;border-left-color:#1f6f4a}
.vitrine .flash-info{background:#f1f4fa;border-color:#d3ddee;border-left-color:#2b4c86}
.vitrine [data-amo-requis-msg]{scroll-margin-top:calc(var(--v-nav-h) + 24px)}
/* Message sous un champ (amo-requis.js) : petit, avec une pastille, sans casser la grille */
.vitrine [data-amo-err]{display:flex;align-items:flex-start;gap:6px;font-size:13.5px !important;line-height:1.45;font-weight:500;color:#a32a14 !important;margin-top:6px}
.vitrine [data-amo-err][hidden]{display:none}
.vitrine [data-amo-err]::before{content:'!';flex:none;width:16px;height:16px;margin-top:1px;border-radius:50%;background:#d1351a;color:#fff;font-size:11px;font-weight:700;display:grid;place-items:center;line-height:1}
.vitrine .champ-manquant{border-color:#d1351a !important;box-shadow:0 0 0 3px rgba(209,53,26,.12) !important}
.ct-champ .champ-manquant:focus{border-color:#d1351a !important}
/* Inscription arrivée depuis Notre offre (?plan=…&periode=…) : rappel de l'offre choisie */
.au-offre-choisie{display:flex;align-items:center;gap:12px;background:var(--c-fond);border:1px solid var(--c-bord);border-left:4px solid var(--c-orange);border-radius:10px;padding:14px 16px;margin-bottom:28px;font-size:15px;line-height:1.5;color:var(--c-texte-2)}
.au-offre-choisie b{color:var(--c-marine);font-weight:600}
.au-offre-choisie::before{content:'✓';flex:none;width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:var(--c-orange-pale);color:var(--c-orange-btn);font-size:13px;font-weight:700}
/* L'en-tête réduit garde son lien à toutes les largeurs (le menu public le replie dans le tiroir sous 1200 px) */
.au-entete .vn-droite.au-entete-droite{display:flex}
.au-entete .vn-barre{justify-content:space-between}
/* Petits écrans : le bouton redevient un simple lien pour tenir à côté du logo (jamais réduit) */
@media (max-width:640px){
  .au-entete .vn-inscription{background:none;box-shadow:none;color:var(--c-orange-btn);padding:0;min-height:0;font-size:14.5px;white-space:nowrap}
  .au-entete .vn-lien{font-size:14.5px;white-space:nowrap}
  .au-entete .vn-inscription:hover{background:none;transform:none;box-shadow:none;color:var(--c-orange-btn-survol)}
}
html:has(body.au-body){scrollbar-gutter:stable}  /* même réserve que les pages publiques (amosphere-nav.css) : logo au même endroit */
/* Pages de compte connectées (choix de l'offre, paiement, confirmation) */
.au-compte{background:var(--c-fond-clair)}
.au-fil{max-width:var(--v-largeur);margin:0 auto;padding:18px var(--v-gouttiere) 0;font-size:15px}

/* ==========================================================================
   Retours du 30/10 sur le parcours de compte (connexion, inscription, abonnement, essai)
   ========================================================================== */
/* Barre du haut des pages de compte : reste visible au défilement (elle partait avec la page) */
.au-entete{position:sticky;top:0;z-index:200}

/* Encadrés d'information (essai en cours, échéance, essai terminé…) : carte aux couleurs de la charte,
   filet coloré à gauche, titre en marine. Même rendu dans l'espace membre (body.es-habille). */
body:is(.vitrine,.es-habille) .notice{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--c-bord);border-left-width:4px;
  border-radius:var(--v-rayon);padding:16px 20px;background:var(--c-fond);box-shadow:none}
body:is(.vitrine,.es-habille) .notice-ico{flex:none;margin-top:1px}
body:is(.vitrine,.es-habille) .notice-ico svg{width:20px;height:20px}
body:is(.vitrine,.es-habille) .notice .notice-title{font-size:15px;font-weight:600;letter-spacing:0;text-transform:none;color:var(--c-marine);margin-bottom:4px}
body:is(.vitrine,.es-habille) .notice .notice-text{font-size:15px;line-height:1.6;color:var(--c-texte-2)}
body:is(.vitrine,.es-habille) .notice-text strong{color:var(--c-marine);font-weight:600}
body:is(.vitrine,.es-habille) .notice-vert{background:var(--c-statut-pale);border-color:color-mix(in srgb,var(--c-statut) 25%,transparent);border-left-color:var(--c-statut)}
body:is(.vitrine,.es-habille) .notice-vert .notice-ico{color:var(--c-statut)}
body:is(.vitrine,.es-habille) .notice-amber{background:var(--c-orange-pale);border-color:color-mix(in srgb,var(--c-orange) 30%,transparent);border-left-color:var(--c-orange)}
body:is(.vitrine,.es-habille) .notice-amber .notice-ico{color:var(--c-orange-btn)}
body:is(.vitrine,.es-habille) .notice-blue{background:var(--c-fond-clair);border-left-color:var(--c-marine)}
body:is(.vitrine,.es-habille) .notice-blue .notice-ico{color:var(--c-marine)}

/* Fil d'Ariane (Tableau de bord › Abonnements) : liens orange soulignés au survol, page en cours en marine */
.au-compte .breadcrumb{font-size:15px;color:var(--c-texte-3);gap:10px}
.au-compte .breadcrumb a:not(.v-lien){color:var(--c-orange-btn);font-weight:600;text-decoration:none}
.au-compte .breadcrumb a:not(.v-lien):hover{text-decoration:underline;text-underline-offset:3px}
.au-compte .breadcrumb span:last-child{color:var(--c-marine);font-weight:600}

/* Interrupteur Mensuel / Annuel : bleu clair en mensuel, marine en annuel */
.au-compte .toggle{background:var(--c-fond-clair-2);box-shadow:inset 0 0 0 1px var(--c-bord)}
.au-compte .toggle.annual{background:var(--c-marine);box-shadow:none}
.au-compte .toggle-knob{box-shadow:0 1px 3px var(--c-ombre-forte)}
.au-compte .toggle:focus-visible{outline:3px solid var(--c-orange-btn);outline-offset:3px}

/* Fenêtres (offre de lancement…) : même rayon, mêmes titres et boutons que le reste du site */
.au-compte .modal-box{border-radius:20px;padding:36px 32px 32px;box-shadow:var(--v-ombre-haute)}
.au-compte .modal-box h3{font-size:22px;font-weight:600;line-height:1.25;margin-bottom:12px}
.au-compte .modal-box p{font-size:15.5px;font-weight:400;color:var(--c-texte-2)}
.au-compte .modal-btn{min-height:52px;padding:0 28px;border-radius:var(--v-rayon);font-size:16px;display:inline-flex;align-items:center;justify-content:center;
  background:var(--c-statut);transition:background-color var(--v-anim),transform var(--v-anim)}
.au-compte .modal-btn:hover{opacity:1;background:color-mix(in srgb,var(--c-statut) 85%,black);transform:translateY(-1px)}
.au-compte .modal-close{width:36px;height:36px}

/* Lien d'activation valable 10 minutes : avertissement aux couleurs de la charte (orange pâle) */
.au-statut .timer{color:var(--c-marine);background:var(--c-orange-pale);border-left:4px solid var(--c-orange);border-radius:10px;padding:14px 16px}
.au-statut .timer svg{stroke:var(--c-orange-btn)}

/* SIRET vérifié (et autres messages permanents des formulaires de compte) : reste vert, coins et taille de la charte */
.au-body .amo-msg{border-radius:10px;font-size:15px;padding:12px 14px}

/* Inscription : indication du mot de passe et générateur sous les deux champs, sur toute la largeur */
.mdp-indication{margin-top:10px}
.mdp-indication .field-hint{margin-top:0}

/* Boutons de retour en tête des pages d'abonnement (remplacent le fil d'Ariane, 31/10/2026) */
.es-retours{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 28px}
.es-retour-btn{display:inline-flex;align-items:center;min-height:40px;padding:0 16px;border-radius:10px;border:1.5px solid var(--c-bord);background:var(--c-fond);
  color:var(--c-marine);font-size:14.5px;font-weight:600;text-decoration:none;transition:border-color var(--v-anim)}
.es-retour-btn:hover{border-color:var(--c-marine)}
.es-retour-btn:focus-visible{outline:3px solid var(--c-orange-btn);outline-offset:2px}
