/* Prêt à céder · direction « Atelier français » (accueil)
   Bleu de travail, rouge de marquage (celui du logo), blanc craie, acier. Archivo variable. */
@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-stretch:62% 125%;font-display:swap;src:url(../fonts/Archivo-latin-var.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

body.atelier{
  --bleu:#23468C; --bleu-2:#1A3770; --bleu-nuit:#11244D;
  --rouge:#D53D28; --rouge-2:#B5301D;
  --craie:#F3F3F0; --craie-2:#E7E8E5; --acier:#1E2329; --acier-2:#4F5863;
  /* les jetons historiques pointent vers le nouvel univers */
  --navy:var(--bleu-nuit); --navy-2:#0B1838; --navy-soft:var(--bleu-2);
  --cream:var(--craie-2); --paper:var(--craie); --line:#C6CBD0; --line-2:#DADDE0;
  --ink:var(--acier); --muted:var(--acier-2);
  --gold:var(--rouge); --gold-l:var(--rouge); --gold-ink:#A12A19;
  --on-navy:#D3DCEE; --good:#21683F; --good-d:#9BE3B4;
  --serif:"Archivo","Arial Narrow",Arial,sans-serif;
  --sans:"Archivo","Segoe UI",Arial,sans-serif;
  font-family:var(--sans);font-size:18px;font-stretch:100%;
  background:var(--craie);
}
.atelier ::selection{background:var(--rouge);color:#fff}
.atelier :focus-visible{outline:3px solid var(--rouge);outline-offset:3px}
.atelier h1,.atelier h2,.atelier h3,.atelier h4,.atelier summary,.atelier legend{font-family:var(--serif);font-stretch:112%;font-weight:750;letter-spacing:-.015em;color:var(--bleu-nuit)}
.atelier h1{font-stretch:118%;font-weight:820;letter-spacing:-.025em;line-height:1.02}
.atelier h2{font-size:clamp(30px,3.3vw,46px);line-height:1.08}
.atelier h3{font-stretch:104%;font-weight:700;letter-spacing:-.005em}
.atelier .lead{font-size:20px;line-height:1.55;color:var(--acier-2)}
.atelier em{font-style:normal}

/* Boutons : plaques nettes, angles vifs */
.atelier .btn{border-radius:0;font-weight:700;font-stretch:108%;letter-spacing:.005em}
.atelier .btn-navy{background:var(--bleu);color:#fff}
.atelier .btn-navy:hover{background:var(--bleu-nuit)}
.atelier .btn-line{border-color:var(--bleu-nuit);color:var(--bleu-nuit)}
.atelier .btn-line:hover{background:var(--bleu-nuit);color:#fff}
.atelier .btn-gold,.atelier .btn-jaune{background:var(--rouge);color:#fff;border-color:var(--rouge)}
.atelier .btn-gold:hover,.atelier .btn-jaune:hover{background:var(--rouge-2);border-color:var(--rouge-2)}
.atelier .btn-acier{background:var(--acier);color:#fff}
.atelier .btn-acier:hover{background:#000}
.atelier .btn small{font-weight:500}
.atelier .call .btn{white-space:nowrap}

/* Bandeau et en-tête */
.atelier .strip{background:var(--bleu-nuit);color:#DCE3F1}
.atelier header.top{background:var(--craie);border-bottom:1px solid var(--line)}
.atelier .logo{display:block;line-height:0}
.atelier .logo img{height:52px;width:auto}
.atelier nav.links a{font-weight:600;color:var(--acier)}
.atelier nav.links a:hover{text-decoration-color:var(--rouge);text-decoration-thickness:3px}

/* Haut de page : la France qui travaille, en mouvement */
.atelier .hero{position:relative;isolation:isolate;overflow:hidden;background:var(--bleu-nuit) url(/media/atelier-poster.jpg) center/cover no-repeat;border-bottom:0;color:#fff;min-height:min(780px,calc(100svh - 128px))}
.atelier .hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.atelier .hero::before{content:"";position:absolute;inset:0;z-index:-1;background:
  linear-gradient(90deg,rgba(11,24,56,.92) 0%,rgba(11,24,56,.78) 38%,rgba(11,24,56,.25) 72%,rgba(11,24,56,.35) 100%),
  linear-gradient(0deg,rgba(11,24,56,.6) 0%,rgba(11,24,56,0) 40%)}
.atelier .hero .wrap{display:grid;grid-template-columns:1.25fr .75fr;gap:56px;align-items:end;padding-top:clamp(72px,10vh,120px);padding-bottom:64px;min-height:inherit}
.atelier .hero-text{gap:24px;padding:0}
.atelier .hero h1{color:#fff;font-size:clamp(38px,4.1vw,60px);max-width:17ch}
.atelier .hero h1 em{font-style:normal;color:#fff;font-weight:820;text-decoration:underline;text-decoration-color:var(--rouge);text-decoration-thickness:.12em;text-underline-offset:.1em;text-decoration-skip-ink:none}
.atelier .hero .lead{color:#E3E8F2;max-width:46ch;font-size:clamp(18px,1.45vw,21px)}
.atelier .hero-ctas{gap:12px}
.atelier .btn-film{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
.atelier .btn-film:hover{background:#fff;color:var(--bleu-nuit);border-color:#fff}
.atelier .btn-film svg{width:20px;height:20px}
.atelier .avec{border-top:1px solid rgba(255,255,255,.22);max-width:560px}
.atelier .avec p{color:#D3DCEE}
.atelier .avec b{color:#fff}
.atelier .avec a{color:#fff;text-decoration-color:var(--rouge)}
.atelier .avec img{filter:grayscale(1) contrast(1.05)}

/* Fiche d'exemple : un bon de travail posé sur l'établi */
.atelier .hero-carte{background:var(--craie);color:var(--acier);box-shadow:0 24px 48px -24px rgba(0,0,0,.6);padding:26px 26px 24px;position:relative;border-top:8px solid var(--rouge)}
.atelier .hero-carte .hc-ex{color:var(--acier-2);font-weight:700;letter-spacing:.1em;font-size:12.5px}
.atelier .hc-score b{font-family:var(--serif);font-stretch:118%;font-weight:820;color:var(--bleu-nuit);font-size:72px;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.atelier .hc-score small,.atelier .hc-score span{color:var(--acier-2)}
.atelier .hero-carte dl{border-top:1px solid var(--line)}
.atelier .hero-carte dt{color:var(--acier-2)}
.atelier .hero-carte dd{color:var(--acier)}
.atelier .hero-carte .hc-gap{color:var(--good)}
.atelier .hc-faibles{color:var(--acier-2)}
.atelier .hc-faibles b{color:var(--acier)}

/* Engagements : le bleu de travail */
.atelier .rassure{background:var(--bleu)}
.atelier .rassure b{font-family:var(--serif);font-stretch:110%;font-weight:750;color:#fff;font-size:20px}
.atelier .rassure b::before{content:"";display:block;width:28px;height:4px;background:var(--rouge);margin-bottom:12px}
.atelier .rassure span{color:#D7E0F2}
.atelier .rassure .wrap > div{border-left-color:rgba(255,255,255,.2)}

/* Le cycle : un marquage au sol avec quatre postes */
.atelier #parcours{background:var(--craie)}
.atelier .cycle{border:0;background:none;position:relative;gap:0;padding-top:46px}
.atelier .cycle::before{content:"";position:absolute;left:0;right:0;top:20px;height:6px;background:repeating-linear-gradient(90deg,var(--rouge) 0 48px,transparent 48px 64px)}
.atelier .cycle > li{border-left:0;padding:0 26px 0 0;background:none}
.atelier .cycle > li.cle{background:none}
.atelier .c-n{position:absolute;top:0;width:46px;height:46px;display:grid;place-items:center;background:var(--acier);color:#fff;font-family:var(--serif);font-stretch:118%;font-weight:820;font-size:22px;margin-top:0}
.atelier .cycle > li{position:relative;padding-top:24px}
.atelier .cycle > li .c-n{top:-46px;transform:translateY(0)}
.atelier .cycle > li.cle .c-n{background:var(--bleu);color:#fff}
.atelier .cycle h3{font-size:26px;font-stretch:115%;font-weight:800}
.atelier .c-q{font-weight:600;color:var(--acier)}
.atelier .cycle ul{color:var(--acier-2)}
.atelier .c-p{border-top:1px solid var(--line);padding-top:12px;margin-top:auto;font-weight:700;color:var(--bleu-nuit)}

/* Sections */
.atelier section.alt{background:var(--craie-2);border-color:var(--line)}
.atelier .item{border-top:2px solid var(--acier)}
.atelier a.item:hover h3{text-decoration:underline;text-decoration-color:var(--rouge);text-decoration-thickness:4px;text-underline-offset:6px}
.atelier a.item .go{color:var(--bleu)}
.atelier .fig{border-top:6px solid var(--rouge)}
.atelier .fig b{font-family:var(--serif);font-stretch:118%;font-weight:820;color:var(--bleu-nuit);letter-spacing:-.03em;font-size:52px}
.atelier .vt th{background:var(--craie-2)}
.atelier .vt td:last-child{color:var(--good)}
.atelier .ladder{border-top:6px solid var(--acier)}
.atelier .rung .price{font-family:var(--serif);font-stretch:115%;font-weight:800;color:var(--bleu-nuit)}
.atelier .rung.key{background:var(--bleu);color:#fff}
.atelier .rung.key h3,.atelier .rung.key h4,.atelier .rung.key .prices b{color:#fff}
.atelier .rung.key p,.atelier .rung.key .prices span,.atelier .rung.key .step-n{color:#D7E0F2}
.atelier .rung.key .sub-offer{border-top-color:var(--rouge)}
.atelier .rung.key .prices{border-top-color:rgba(255,255,255,.25)}
.atelier .rung.key .prices div{border-bottom-color:rgba(255,255,255,.14)}
.atelier .rung.key .exemple{background:var(--bleu-nuit);border-color:transparent;color:#D7E0F2}
.atelier .rung.key .exemple b{color:#fff}
.atelier .rung.key .btn-navy{background:var(--rouge);color:#fff}
.atelier .rung.key .btn-navy:hover{background:var(--rouge-2)}
.atelier .badge{background:var(--rouge);color:#fff}
.atelier .guar{background:var(--craie-2);border-color:var(--line)}
.atelier .box{background:#fff;border-color:var(--line)}
.atelier .case{background:#fff}
.atelier .case .k{font-family:var(--serif);font-stretch:118%;font-weight:820;color:var(--bleu)}
.atelier .founder blockquote{font-style:normal;font-stretch:108%;font-weight:600}
.atelier .founder blockquote::before{background:var(--rouge);height:6px}
.atelier .cv b{font-family:var(--serif);font-stretch:115%;font-weight:800}
.atelier summary{font-stretch:104%;font-weight:650;font-size:21px}
.atelier summary::after{color:var(--bleu)}

/* Simulateur */
.atelier .res{background:var(--bleu-nuit)}
.atelier .score .big{font-family:var(--serif);font-stretch:118%;font-weight:820;letter-spacing:-.03em}
.atelier .capture{border-top:6px solid var(--rouge)}
.atelier .ex{background:var(--rouge);color:#fff}

/* Contact */
.atelier .final{background:var(--bleu)}
.atelier .final h2,.atelier .final h3{color:#fff}
.atelier .final .btn-gold{background:var(--rouge);color:#fff}
.atelier footer{background:var(--bleu-nuit)}

/* Film */
.film{padding:56px 0 0;border:0;background:transparent;max-width:min(1100px,94vw);width:100%;color:#fff}
.film::backdrop{background:rgba(8,16,36,.9)}
.film-in{position:relative}
.film video{display:block;width:100%;aspect-ratio:16/9;background:#000}
.film-x{position:absolute;right:0;top:-56px;width:44px;height:44px;display:grid;place-items:center;background:#D53D28;color:#fff;border:0;cursor:pointer}
.film-x svg{width:22px;height:22px}
.film-note{margin:12px 0 0;font:15px/1.5 "Archivo",Arial,sans-serif;color:#C9D3E6}

@media (max-width:1080px){
  .atelier .hero .wrap{grid-template-columns:1fr 1fr;gap:36px}
  .atelier .cycle{grid-template-columns:1fr 1fr;row-gap:64px}
  .atelier .cycle::before{display:none}
  .atelier .cycle > li{border-top:6px solid var(--rouge);padding-top:34px}
  .atelier .cycle > li .c-n{top:-26px}
}
@media (max-width:860px){
  .atelier .hero{min-height:0;background-position:62% center}
  .atelier .hero::before{background:linear-gradient(0deg,rgba(11,24,56,.95) 0%,rgba(11,24,56,.82) 55%,rgba(11,24,56,.55) 100%)}
  .atelier .hero .wrap{grid-template-columns:1fr;padding-top:56px;padding-bottom:40px;gap:32px}
  .atelier .hero h1{font-size:clamp(34px,9.4vw,48px)}
  .atelier .hero-ctas .btn{width:100%}
  .atelier .logo img{height:40px}
  .atelier .cycle{grid-template-columns:1fr}
}
@media (prefers-reduced-motion:reduce){.atelier .hero-vid{display:none}}

/* Corrections issues de l'audit (vérifiées) */
/* Haut de page « plein cadre maîtrisé » */
.atelier .hero{min-height:min(760px,calc(100svh - 128px))}
.atelier .hero .wrap{grid-template-columns:minmax(0,780px);align-items:center;padding-top:clamp(40px,7vh,88px);padding-bottom:clamp(56px,8vh,96px)}
.atelier .hero::before{background:
  linear-gradient(90deg,rgba(11,24,56,.9) 0%,rgba(11,24,56,.8) 42%,rgba(11,24,56,.22) 74%,rgba(11,24,56,.3) 100%),
  linear-gradient(0deg,rgba(11,24,56,.55) 0%,rgba(11,24,56,0) 35%)}
.atelier .hero-text{gap:20px}
.atelier .hero h1{font-size:clamp(40px,5vw,72px);max-width:14ch;margin:0}
.atelier .hero .lead{max-width:44ch;margin:0}
.atelier .hero .avec{border-top:0;padding-top:4px}
.atelier .hero-pause{position:absolute;right:max(16px,calc((100vw - 1216px)/2));bottom:24px;width:44px;height:44px;display:grid;place-items:center;background:rgba(11,24,56,.6);color:#fff;border:1px solid rgba(255,255,255,.6);cursor:pointer}
.atelier .hero-pause[hidden]{display:none}
.atelier .hero-pause svg{width:20px;height:20px}
.atelier .hero-pause .i-play,.atelier .hero-pause[aria-pressed="true"] .i-pause{display:none}
.atelier .hero-pause[aria-pressed="true"] .i-play{display:block}
.atelier .btn-gold small{opacity:1}

/* Exemple de score sous le haut de page */
.atelier .ex-score{background:var(--craie);padding:88px 0}
.atelier .ex-score .wrap{display:grid;grid-template-columns:1.1fr .9fr;gap:56px;align-items:center}
.atelier .ex-score .wrap > div:first-child{display:flex;flex-direction:column;gap:20px;align-items:flex-start}
.atelier .hc-note{margin:0;font-size:14px;color:var(--acier-2);line-height:1.45}

/* Cas particuliers */
.atelier .situations{margin-top:48px;border-top:2px solid var(--acier);padding-top:24px}
.atelier .situations h3{margin-bottom:8px}
.atelier .situations details{border-bottom:1px solid var(--line)}
.atelier .situations summary{font-size:19px;padding:18px 48px 18px 0}
.atelier .situations details>p{max-width:72ch}

/* En-tête : logo jamais écrasé, menu mobile */
.atelier header.top .logo{flex:none}
.atelier header.top .wrap{gap:20px}
.atelier nav.links{gap:14px}
.atelier nav.links a{font-size:15px}
@media (max-width:1240px){.atelier .call .t-long{display:none}}
.menu-m{display:none;position:relative}
.menu-m summary{list-style:none;cursor:pointer;min-height:44px;display:inline-flex;align-items:center;padding:0 14px;border:2px solid var(--bleu-nuit,#11244D);font:700 16px/1 var(--sans);color:var(--bleu-nuit,#11244D)}
.menu-m summary::-webkit-details-marker{display:none}
.menu-m summary::after{content:none}
.menu-m nav{position:absolute;right:0;top:calc(100% + 8px);z-index:40;display:flex;flex-direction:column;min-width:240px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -20px rgba(0,0,0,.45)}
.menu-m nav a{padding:14px 18px;color:var(--acier);text-decoration:none;font-weight:600;border-bottom:1px solid var(--line-2)}
.menu-m nav a:hover{background:var(--craie)}
@media (max-width:1080px){.atelier .menu-m{display:block;margin-left:auto}.atelier .call{margin-left:0}}

/* Pied de page : signature */
.atelier footer .sig{margin:0;color:#fff;font-weight:700;font-stretch:108%;flex-basis:100%;order:-1}

/* Simulateur : titre et petits textes lisibles sur le bleu nuit */
.atelier .res h3{color:#fff}
.atelier .res .weak-t,.atelier .res .ph .num,.atelier .weak li::before,.atelier .weak .act::before{color:#FF8A75}
.atelier .final :focus-visible,.atelier .rassure :focus-visible,.atelier .res :focus-visible,.atelier .rung.key :focus-visible,.atelier .hero :focus-visible{outline-color:#fff}

/* Barre d'actions mobile : compacte, ne masque plus le focus */
@media (max-width:860px){
  .atelier .mbar{padding:10px 14px calc(10px + env(safe-area-inset-bottom))}
  .atelier .mbar .btn{min-height:48px}
  html{scroll-padding-bottom:96px}
  .atelier footer{padding-bottom:96px}
  .atelier .ex-score{padding:56px 0}
  .atelier .ex-score .wrap{grid-template-columns:1fr;gap:28px}
  .atelier .hero .wrap{padding-top:32px;padding-bottom:32px}
}
/* Très petits écrans */
.atelier h1{overflow-wrap:break-word;hyphens:auto}
@media (max-width:360px){.atelier .case .k{font-size:30px}}
.film-texte{margin-top:8px;color:#C9D3E6;font:15px/1.5 "Archivo",Arial,sans-serif}
.film-texte summary{cursor:pointer;color:#fff;font:600 15px/1.5 "Archivo",Arial,sans-serif;padding:6px 0}
.film-texte p{margin:6px 0 0;max-width:80ch}
@media (max-width:520px){.atelier .hero-ctas .btn-gold small{display:inline}}
@media (max-width:400px){.atelier header.top .call{display:none}}
.atelier .final a:not(.btn){color:#fff}
.atelier .rung.key .exemple a{color:#fff}
@media (max-width:860px){.atelier .hero::before{background:linear-gradient(0deg,rgba(11,24,56,.95) 0%,rgba(11,24,56,.9) 60%,rgba(11,24,56,.72) 100%)}}