/* Site ARGOS FORMATION — complète assets/style.css (le style du tunnel) */
.surtitre{font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--violet);margin:0 0 14px}
.bouton.grand{padding:19px 32px;font-size:17.5px}
.entete nav a[aria-current="page"]{color:var(--violet)}
.ouvrir-menu{display:none;background:#fff;border:2px solid var(--violet);color:var(--violet);border-radius:6px;padding:8px 14px;font:600 15px var(--sans);cursor:pointer}
@media (max-width:1080px){.entete nav{gap:18px;font-size:14px}}
@media (max-width:980px){
  .ouvrir-menu{display:inline-block}
  .entete nav{display:none;position:absolute;top:76px;left:0;right:0;background:#fff;border-bottom:1px solid var(--trait);flex-direction:column;align-items:flex-start;gap:0;padding:8px 24px 20px}
  .entete nav .lien{display:block;padding:12px 0;width:100%;border-bottom:1px solid var(--trait);font-size:16px}
  .entete nav .bouton{margin-top:16px}
  body.menu-ouvert .entete nav{display:flex}
}

/* En-tête des pages intérieures */
.page-tete{padding:56px 0 52px;background:#fff;border-bottom:1px solid var(--trait)}
.page-tete h1{font-size:clamp(32px,4vw,48px);line-height:1.12;font-weight:800}
.page-tete .sous-titre{font-size:22px;color:var(--violet);margin:12px 0 0}
.page-tete .chapeau{font-size:19px;line-height:1.6;max-width:760px;margin:20px 0 0}
.fil-ariane{font-size:14px;color:var(--doux);margin:0 0 18px}
.fil-ariane a{color:var(--doux)}

/* Les deux situations (liens vers le tunnel) */
.situations-choix{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:34px}
.porte-lien{text-decoration:none}
.porte-lien:hover{border-color:var(--violet);background:var(--lilas)}
.porte-lien em{display:block;font-style:normal;font-weight:700;color:var(--violet);margin-top:12px;font-size:15.5px}
.hesitation{margin:26px 0 0;font-size:17px}
.hesitation a{font-weight:600}
@media (max-width:760px){.situations-choix{grid-template-columns:1fr}}

/* Aperçu des cinq étapes */
.apercu-etapes{list-style:none;padding:0;margin:40px 0 0;display:grid;grid-template-columns:repeat(5,1fr);gap:16px}
.apercu-etapes li{background:#fff;border:1px solid var(--trait);border-top:4px solid var(--violet);border-radius:8px;padding:20px 18px}
.apercu-etapes b{display:inline-flex;width:34px;height:34px;border-radius:50%;background:var(--violet);color:#fff;align-items:center;justify-content:center;font-size:16px;margin-bottom:12px}
.apercu-etapes strong{display:block;color:var(--encre);font-size:19px;margin-bottom:6px}
.apercu-etapes span{font-size:15.5px;line-height:1.5;display:block}
@media (max-width:980px){.apercu-etapes{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.apercu-etapes{grid-template-columns:1fr}}

.bandeau-autres{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap}
.bandeau-autres>div{max-width:720px}

/* Vidéo d'exemple : étiquette pleine, sans transparence */
.video button img{opacity:1}
.etiquette-exemple{position:absolute;left:16px;top:16px;z-index:2;background:var(--note);color:#fff;font:700 13px/1 var(--sans);letter-spacing:.04em;text-transform:uppercase;padding:8px 12px;border-radius:5px;pointer-events:none}
.carte-prix .echeances div{background:#353071;border-color:#4A4490}

/* Outils de la méthode */
.outils{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:36px}
.outil{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);padding:24px}
.outil img{width:48px;height:48px;flex:none}
.outil strong{display:block;color:var(--encre);font-size:19px;margin-bottom:6px}
.outil span{font-size:16px;line-height:1.55}
@media (max-width:900px){.outils{grid-template-columns:1fr}}

/* Page Votre situation */
.sommaire-situations{padding:48px 0}
.sommaire-situations .situations-choix{margin-top:0}
.repere-situation{background:var(--nuit);padding:22px 0;scroll-margin-top:76px}
.etiquette-situation{margin:0;color:#fff;font-weight:800;font-size:clamp(22px,2.6vw,30px);text-transform:uppercase;letter-spacing:.02em}
.cta-situation{padding:44px 0;background:var(--lilas)}
.actions-situation{display:flex;gap:14px;flex-wrap:wrap}

/* Qualiopi */
.qualiopi{display:grid;grid-template-columns:auto 1fr;gap:36px;align-items:start}
@media (max-width:700px){.qualiopi{grid-template-columns:1fr}.qualiopi img{width:64px}}

/* Hervé, avec ses mots */
.colonnes-herve{display:grid;grid-template-columns:1fr 1fr;gap:28px;margin-top:36px}
.bloc-texte{background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);padding:30px 32px}
.bloc-texte h3{margin:0 0 12px}
.bloc-texte h3:not(:first-child){margin-top:26px}
.bloc-texte p{font-size:17px}
.dessin-bloc{width:220px;height:auto;margin:28px auto 0}
@media (max-width:900px){.colonnes-herve{grid-template-columns:1fr}}

/* Autres formations */
.phare{display:flex;justify-content:space-between;align-items:center;gap:28px;flex-wrap:wrap;background:var(--nuit);color:#fff;border-radius:var(--rayon);padding:32px 36px}
.phare h2{color:#fff;margin-bottom:8px}
.phare p{color:#E3E0F5;margin:0;max-width:640px}
.phare .surtitre{color:#C9C3EA}
.phare .actions{display:flex;gap:12px;flex-wrap:wrap}
.phare .bouton{background:#fff;color:var(--encre);border-color:#fff}
.phare .bouton.second{background:var(--nuit);color:#fff;border-color:#fff}
.formations{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:32px 0 24px}
.formation{background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);padding:28px 28px 26px;display:flex;flex-direction:column;scroll-margin-top:96px}
.formation-tete{display:flex;gap:16px;align-items:flex-start;margin-bottom:14px}
.formation-tete img{width:50px;height:50px;flex:none}
.formation h3{font-size:21px}
.formation-sous{margin:4px 0 0;font-size:15px;color:var(--doux)}
.formation>p{font-size:16.5px}
.formation-infos{display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;margin:4px 0 16px;padding:16px 0;border-top:1px solid var(--trait);border-bottom:1px solid var(--trait)}
.formation-infos dt{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--violet)}
.formation-infos dd{margin:2px 0 0;font-size:15.5px;line-height:1.45}
.formation details{margin-bottom:18px;font-size:16px}
.formation summary{cursor:pointer;font-weight:600;color:var(--encre)}
.formation details ul{padding-left:20px;margin:8px 0 0}
.formation .bouton{align-self:flex-start}
.formation-question{margin:auto 0 10px;font-size:15px;font-weight:600;color:var(--encre)}
@media (max-width:900px){.formations{grid-template-columns:1fr}}
@media (max-width:480px){.formation-infos{grid-template-columns:1fr}}

/* Contact */
.contact{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:start}
.coordonnees dl{margin:20px 0 26px}
.coordonnees dl div{padding:12px 0;border-bottom:1px solid var(--trait)}
.coordonnees dt{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--violet)}
.coordonnees dd{margin:2px 0 0;font-size:17px}
.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.formulaire{background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);padding:30px 32px;display:flex;flex-direction:column;gap:14px}
.formulaire label{display:flex;flex-direction:column;gap:6px;font-size:15px;font-weight:600;color:#000}
.formulaire input,.formulaire select,.formulaire textarea{font:400 16px var(--sans);padding:12px 14px;border:2px solid var(--trait);border-radius:8px;background:#fff;color:var(--texte)}
.formulaire button[disabled]{background:#8E86C4;border-color:#8E86C4;cursor:not-allowed}
@media (max-width:860px){.contact{grid-template-columns:1fr}}

/* Débordements sur téléphone */
.herve>*,.contact>*,.qualiopi>*{min-width:0}
@media (max-width:560px){.page-tete{padding:40px 0 36px}.bloc-texte,.formulaire,.formation{padding:22px 20px}.phare{padding:26px 22px}}
/* Petits bonhommes d'Hervé dans les en-têtes et les bandeaux */
.page-tete-grille{display:grid;grid-template-columns:1fr 260px;gap:40px;align-items:center}
.page-tete .dessin{width:100%;max-width:260px;height:auto;justify-self:center}
.bandeau-autres-droite{display:flex;flex-direction:column;align-items:center;gap:14px}
.bandeau-autres-droite .dessin{width:200px;height:auto}
@media (max-width:760px){.page-tete-grille{grid-template-columns:1fr;gap:18px}.page-tete .dessin{max-width:150px;justify-self:start;order:-1}.bandeau-autres-droite{align-items:flex-start}}

/* ---- V2 (2 octobre, retours de Geoffroy) ---- */
/* Menu regroupé, avec sous-menus */
.deroulant{position:relative;padding:26px 0}
.deroulant>.lien{display:inline-flex;align-items:center;gap:8px}
.deroulant.actif>.lien{color:var(--violet)}
.fleche{width:7px;height:7px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);margin-top:-4px}
.sous-menu{display:none;position:absolute;top:100%;left:-18px;min-width:230px;background:#fff;border:1px solid var(--trait);border-top:3px solid var(--violet);border-radius:0 0 8px 8px;padding:8px 0;z-index:30}
.deroulant:hover .sous-menu,.deroulant:focus-within .sous-menu{display:block}
.sous-menu a{display:block;padding:10px 18px;font-weight:600;font-size:15px;color:#000;text-decoration:none}
.sous-menu a:hover,.sous-menu a[aria-current="page"]{background:var(--lilas);color:var(--violet)}
@media (max-width:980px){
  .deroulant{padding:0;width:100%}
  .fleche{display:none}
  .sous-menu{display:block;position:static;border:0;padding:0 0 8px 16px;min-width:0;border-radius:0}
  .sous-menu a{padding:8px 0;font-size:15px;color:var(--doux);font-weight:500}
  .sous-menu a:hover{background:#fff}
}
.bouton-notes{background:#110D33;border:1px solid #4A4490;color:#BDB8DD;border-radius:6px;padding:5px 10px;font:500 12.5px var(--sans);cursor:pointer}
.bouton.contour{background:var(--violet);color:#fff;border-color:#fff}
.bouton.contour:hover{background:var(--encre);border-color:#fff}

/* Héros de l'accueil : la vidéo tourne, le rideau bleu ARGOS vient fermer un tiers de l'écran */
.heros-video{position:relative;height:clamp(540px,74vh,700px);overflow:hidden;background:var(--nuit)}
.fond-video{position:absolute;top:0;bottom:0;left:26%;width:74%;height:100%;object-fit:cover;display:block}
.rideau{position:absolute;top:0;bottom:0;left:0;width:max(48%,620px);background:var(--violet);color:#fff;display:flex;align-items:center;z-index:2;animation:rideau 1.4s cubic-bezier(.75,0,.2,1) .3s both}
.rideau::after{content:"";position:absolute;top:-12%;bottom:-12%;right:-80px;width:160px;background:var(--violet);border-radius:50%}
.rideau-contenu{position:relative;z-index:1;padding:0 48px 0 max(24px,calc((100vw - 1160px)/2 + 24px));animation:apparition .9s 1.4s both}
.rideau-marque{font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#D9D4F4;font-size:15px;margin:0 0 16px}
.rideau h1{color:#fff;font-size:clamp(40px,4.6vw,64px);line-height:1.02;font-weight:800;text-transform:uppercase;letter-spacing:-.01em}
.rideau h1 span{display:block;font-size:1.3em;letter-spacing:.02em}
.rideau-texte{font-size:19px;line-height:1.55;color:#ECE9FA;margin:22px 0 30px;max-width:380px}
.rideau .actions{display:flex;gap:14px;flex-wrap:wrap}
.bonhomme-anime{position:absolute;right:-34px;bottom:0;z-index:3;width:auto;height:min(50%,310px);transform-origin:50% 100%;animation:arrivee 1.1s cubic-bezier(.3,1.3,.5,1) 2s both,montrer 3s ease-in-out 3.3s infinite}
.note-video{position:absolute;right:24px;bottom:18px;z-index:3;max-width:420px}
@keyframes rideau{from{transform:translateX(-110%)}to{transform:none}}
@keyframes apparition{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes arrivee{from{transform:translateY(105%)}to{transform:rotate(-10deg)}}
@keyframes montrer{0%,100%{transform:rotate(-10deg)}45%{transform:rotate(-17deg) translateY(-10px)}65%{transform:rotate(-13deg) translateY(-5px)}}
@media (prefers-reduced-motion:reduce){.rideau,.rideau-contenu,.bonhomme-anime{animation:none}}
@media (max-width:860px){
  .heros-video{height:auto;display:flex;flex-direction:column;overflow:hidden}
  .fond-video{position:relative;left:0;width:100%;height:250px}
  .rideau{position:relative;width:100%;animation:none}
  .rideau::after{top:-26px;bottom:auto;left:-10%;right:-10%;width:auto;height:60px}
  .rideau-contenu{padding:30px 24px 44px;animation:none}
  .bonhomme-anime{right:14px;height:150px;animation:montrer 3s ease-in-out 1s infinite}
  .rideau-contenu{padding-bottom:150px}
  .note-video{position:static;margin:12px 24px}
}
.heros .titre-intro{font-size:clamp(30px,3.8vw,46px);line-height:1.12;font-weight:800;letter-spacing:-.01em;text-transform:none}
.heros .titre-intro span{display:block;color:var(--violet);font-weight:600}

/* En-têtes des pages intérieures : photo du site actuel et médaillon avec un petit bonhomme */
.page-tete-grille.avec-photo{grid-template-columns:1.05fr .95fr;gap:56px}
.tete-visuel{position:relative}
.tete-photo{display:block;width:100%;aspect-ratio:16/11;object-fit:cover;border-radius:var(--rayon)}
.medaillon{position:absolute;left:-40px;bottom:-30px;width:136px;height:136px;border-radius:50%;background:#fff;border:2px solid var(--encre);display:flex;align-items:center;justify-content:center}
.medaillon img{width:80%;height:80%;object-fit:contain}
.medaillon.petit{position:static;width:74px;height:74px;flex:none}
@media (max-width:760px){
  .page-tete-grille.avec-photo{grid-template-columns:1fr;gap:40px}
  .tete-visuel{order:-1}
  .medaillon{left:14px;bottom:-30px;width:94px;height:94px}
}


/* Diagnostic dans le site : la situation d'abord */
.page-tete.compacte{padding:40px 0 34px}
.page-tete.compacte .dessin{max-width:190px}
#diagnostic{padding-top:56px}
.choix-diag .portes{margin-top:26px}
body:not([data-porte]) .etape-questions{display:none}
body[data-porte] .choix-diag{display:none}
body.changer-diag .choix-diag{display:block}
.etape-questions{scroll-margin-top:90px}
.diag-situation{margin:0 0 6px;font-size:17px;color:var(--doux)}
.diag-situation strong{color:var(--encre)}
.diag-situation a{font-weight:600}
.si-a,.si-b{display:none}
body[data-porte="a"] .si-a,body[data-porte="b"] .si-b{display:inline}
body.changer-diag .etape-questions{margin-top:48px}

/* Blog */
.filtres{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:32px}
.filtres a{padding:9px 16px;border:2px solid var(--violet);border-radius:999px;color:var(--violet);font-weight:600;font-size:15px;text-decoration:none;background:#fff}
.filtres a:hover{background:var(--lilas)}
.article-vedette{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);overflow:hidden;margin-bottom:32px}
.article-vedette img{width:100%;height:100%;min-height:300px;object-fit:cover;display:block}
.article-vedette>div{padding:28px 36px 28px 0}
.article-vedette h2{text-transform:none;font-size:clamp(24px,2.6vw,32px)}
.categories{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.categorie{background:#fff;border:1px solid var(--trait);border-radius:var(--rayon);padding:26px 28px;scroll-margin-top:96px}
.categorie-tete{display:flex;gap:16px;align-items:center;margin-bottom:14px}
.categorie h3{font-size:20px}
.categorie-tete p{margin:4px 0 0;font-size:15.5px;color:var(--doux);line-height:1.5}
.articles{list-style:none;padding:0;margin:0}
.articles li{padding:12px 0;border-top:1px solid var(--trait)}
.article-titre{display:block;font-weight:600;color:#000;font-size:16.5px;line-height:1.4}
.article-date{display:block;font-size:13.5px;color:var(--doux);margin-top:3px}
@media (max-width:860px){.categories,.article-vedette{grid-template-columns:1fr}.article-vedette>div{padding:0 22px 24px}.article-vedette img{min-height:200px}}