/* =============================================================================
   BLOOMDAYZ × MATHÉSCIENCES — Livret des stages scientifiques  (v2)
   Charte navy/or · semaines-aventures MIXTES · schémas SVG · prépa en amont.
   Tokens d'échelle inspirés d'Open Props (type/espace/ombre/rayon), sans dépendance.
   ============================================================================= */

/* ---------- Polices locales ---------- */
@font-face{font-family:"Anton";src:url("fonts/Anton-Regular.woff2") format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Caveat";src:url("fonts/Caveat-Bold.woff2") format("woff2");font-weight:600 700;font-display:block}
@font-face{font-family:"Inter";src:url("fonts/inter-v20-latin-regular.woff2") format("woff2");font-weight:400;font-display:block}
@font-face{font-family:"Inter";src:url("fonts/inter-v20-latin-500.woff2") format("woff2");font-weight:500;font-display:block}
@font-face{font-family:"Inter";src:url("fonts/inter-v20-latin-600.woff2") format("woff2");font-weight:600;font-display:block}
@font-face{font-family:"Inter";src:url("fonts/inter-v20-latin-700.woff2") format("woff2");font-weight:700;font-display:block}
@font-face{font-family:"Inter";src:url("fonts/inter-v20-latin-900.woff2") format("woff2");font-weight:900;font-display:block}

:root{
  /* — charte — */
  --navy:#0f1f34; --navy-2:#16294a;
  --gold:#efcf53; --gold-deep:#b8932f; --gold-text:#7a6320;
  --cream:#fbf3d0; --cream-soft:#fdf8e6; --page:#efe7d4;
  --ink:#26313f; --ink-strong:#15233a; --muted:#6b7686;
  --hair:#e7e0c8; --hair-cool:#e8ecf1;
  /* — tokens (Open Props-like) — */
  --r-1:8px; --r-2:12px; --r-3:16px; --r-4:22px;
  --sh-1:0 1px 2px rgba(15,31,52,.06),0 1px 1px rgba(15,31,52,.04);
  --sh-2:0 4px 12px rgba(15,31,52,.07),0 2px 4px rgba(15,31,52,.05);
  --sh-3:0 16px 34px rgba(15,31,52,.13),0 6px 12px rgba(15,31,52,.06);
  /* — accent (surchargé par volet) — */
  --accent:#b8932f; --accent-bg:#fdf8e6; --accent-soft:#f6efd9; --accent-ink:#7a6320;
}
body.volet-info{--accent:#2f6df0;--accent-bg:#eef4ff;--accent-soft:#dbe8ff;--accent-ink:#1d4ec0}
body.volet-sciences{--accent:#2f9e6b;--accent-bg:#eafaf2;--accent-soft:#cdeedd;--accent-ink:#1f7a50}
body.volet-petits{--accent:#e8743b;--accent-bg:#fff1ea;--accent-soft:#ffdcc9;--accent-ink:#bf5526}
body.volet-mercredi{--accent:#6d4bd6;--accent-bg:#f2eeff;--accent-soft:#ded3ff;--accent-ink:#523aa6}

@page{size:A4;margin:14mm 14mm 13mm;
  @bottom-right{content:counter(page) " / " counter(pages);font-family:"Inter",sans-serif;font-size:8.5pt;color:#9aa3b0}
  @bottom-left{content:"Bloomdayz × Mathésciences — Stages scientifiques";font-family:"Inter",sans-serif;font-size:8.5pt;color:#9aa3b0}}

*{box-sizing:border-box}
html,body{margin:0}
body{font-family:"Inter",Verdana,Calibri,system-ui,sans-serif;color:var(--ink);font-size:11.4pt;line-height:1.6;
  background:#fff;-webkit-font-smoothing:antialiased;text-wrap:pretty;orphans:3;widows:3}
h1,h2,h3,h4{text-wrap:balance}
p{margin:0 0 .65em}
strong,b{color:var(--ink-strong);font-weight:700}
a{color:var(--accent-ink)}

.kicker{font-size:8.6pt;font-weight:800;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);
  margin:0 0 6px;display:flex;align-items:center;gap:8px}
.kicker::before{content:"";width:18px;height:2px;background:var(--accent);border-radius:2px}
h2.sec{font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.012em;
  color:var(--navy);font-size:17pt;line-height:1.12;margin:0 0 .5em}

/* =============================================================================
   FEUILLE
   ============================================================================= */
@media screen{
  body.fiche{background:var(--page);padding:26px 14px 70px}
  .sheet{width:210mm;max-width:100%;background:#fff;margin:0 auto;padding:16mm 15mm 13mm;
    box-shadow:var(--sh-3);border-radius:6px}
}

/* ---------- En-tête ---------- */
.prog-head{margin:0 0 7mm}
.eyebrow-row{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:9px}
.pnum{font-family:"Anton",sans-serif;font-size:13pt;color:#fff;background:var(--accent);border-radius:9px;
  padding:2px 12px;line-height:1.3;letter-spacing:.02em}
.chip{font-size:8.6pt;font-weight:800;letter-spacing:.05em;text-transform:uppercase;padding:4px 11px;border-radius:999px;
  background:var(--accent-soft);color:var(--accent-ink)}
.chip.dark{background:var(--navy);color:var(--gold)}
.chip.soft{font-weight:600;color:var(--muted);background:var(--cream-soft);border:1px solid var(--hair);text-transform:none;letter-spacing:0}
.prog-persona{font-family:"Caveat",cursive;font-weight:700;color:var(--accent);font-size:17pt;line-height:1;margin:0 0 2px}
.prog-head h1{font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;letter-spacing:.01em;
  color:var(--navy);font-size:27pt;line-height:1.03;margin:.05em 0 .1em}
.prog-sub{color:var(--muted);font-size:11pt;margin:0 0 .6em;font-weight:600}
.lead{font-size:12.5pt;line-height:1.5;color:var(--ink-strong);max-width:40em;
  border-left:4px solid var(--accent);padding-left:14px;margin:.4em 0 0}
.domaines{display:flex;flex-wrap:wrap;gap:6px;margin-top:9px}
.domaines span{font-size:8.6pt;font-weight:700;color:var(--accent-ink);background:var(--accent-bg);
  border:1px solid var(--accent-soft);border-radius:7px;padding:3px 9px;text-transform:uppercase;letter-spacing:.03em}
.domaines span::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin-right:6px;vertical-align:middle}

/* ---------- Héros (photo + schéma) ---------- */
.hero-figure{margin:7mm 0;break-inside:avoid}
.hero-figure .hero-main{position:relative;border-radius:var(--r-3);overflow:hidden;background:var(--navy);
  border-bottom:5px solid var(--accent);min-height:46mm}
.hero-figure img{display:block;width:100%;height:58mm;object-fit:cover}
.hero-figure .hero-svg{display:flex;align-items:center;justify-content:center;height:50mm;
  background:linear-gradient(135deg,var(--navy),var(--navy-2));color:var(--gold)}
.hero-figure .hero-svg svg{height:34mm;width:auto}
.hero-figure .hero-badge{position:absolute;right:12px;bottom:12px;width:54px;height:54px;border-radius:14px;
  background:#fff;box-shadow:var(--sh-2);display:flex;align-items:center;justify-content:center;color:var(--accent)}
.hero-figure .hero-badge svg{width:38px;height:38px}
.hero-credit{margin:5px 2px 0;font-size:.72rem;line-height:1.4;color:var(--muted)}
.hero-credit a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.hero-cap{display:flex;gap:11px;align-items:flex-start;margin-top:8px;padding:0 2px}
.hero-cap .a-k{font-family:"Caveat",cursive;font-weight:700;color:var(--accent);font-size:14pt;line-height:1;white-space:nowrap}
.hero-cap p{margin:0;font-size:11pt;line-height:1.5;color:var(--ink-strong)}

/* ---------- AVANT DE COMMENCER (prépa en amont) ---------- */
.prep{background:var(--cream-soft);border:1px solid var(--hair);border-radius:var(--r-3);padding:6mm 7mm;margin:0 0 6mm}
.prep .prep-grid{display:flex;flex-direction:column;gap:5mm}
.prep .prep-two{display:grid;grid-template-columns:1fr 1fr;gap:5mm 8mm;border-top:1px dashed var(--hair);padding-top:5mm}
.prep .pcol .sn-label{font-size:8.4pt;font-weight:800;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);
  display:flex;align-items:center;gap:7px;margin-bottom:5px}
.prep .pcol .sn-label .i{width:15px;height:15px;background:center/contain no-repeat;flex:0 0 auto}
.prep .chips{display:flex;flex-wrap:wrap;gap:5px}
.prep .chips span{font-size:9.4pt;color:var(--ink);background:#fff;border:1px solid var(--hair);border-radius:7px;padding:2px 8px}
.prep ul{margin:.1em 0 0;padding-left:1.05em}
.prep ul li{margin:.22em 0;font-size:10.4pt;line-height:1.45}
.prep .tools{list-style:none;padding:0;margin:.1em 0 0}
.prep .tools li{margin:.28em 0;font-size:10.4pt}
.prep .tools li b{color:var(--navy)}
.prep .tools li .u{color:var(--muted);font-size:9pt;display:block}
.prep .pfull{border-top:1px dashed var(--hair);padding-top:5mm}
.prep .secu-list li{color:#8a3d28;break-inside:avoid}
.prep .tools li a.tool-link{color:inherit;text-decoration:none;display:block}
.prep .tools li a.tool-link:hover b{text-decoration:underline}

/* ---------- Compétences (bandeau) ---------- */
.goals{display:flex;gap:12px;align-items:flex-start;background:var(--accent-bg);border-radius:var(--r-3);
  padding:5mm 6mm;break-inside:avoid;margin:0 0 7mm}
.goals .i{width:24px;height:24px;flex:0 0 auto;margin-top:1px;background:center/contain no-repeat}
.goals .g-k{font-weight:800;color:var(--accent-ink);font-size:8.4pt;letter-spacing:.06em;text-transform:uppercase;display:block;margin-bottom:3px}
.goals ul{margin:0;padding-left:1.05em;columns:2;column-gap:8mm}
.goals li{margin:.2em 0;font-size:10.4pt;line-height:1.4}

/* =============================================================================
   JOURS / ATELIERS
   ============================================================================= */
.jours{display:flex;flex-direction:column;gap:8mm;margin-top:2mm}
.step-k{font-size:7.8pt;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 2.5mm}
.jour{break-inside:avoid;border:1px solid var(--hair-cool);border-radius:var(--r-3);overflow:hidden;background:#fff;box-shadow:var(--sh-1)}
.jour-head{display:flex;align-items:center;gap:13px;background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#fff;padding:4mm 6mm}
.jour-head .j-schema{width:42px;height:42px;border-radius:11px;background:rgba(255,255,255,.1);
  display:flex;align-items:center;justify-content:center;color:var(--gold);flex:0 0 auto}
.jour-head .j-schema svg{width:30px;height:30px}
.jour-head .j-num{font-family:"Anton",sans-serif;font-size:14pt;color:var(--navy);background:var(--gold);border-radius:9px;
  min-width:1.9em;text-align:center;padding:2px 7px;line-height:1.25}
.jour-head .j-meta{flex:1 1 auto;min-width:0}
.jour-head .j-meta .j-label{font-size:7.8pt;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--gold)}
.jour-head .j-meta .j-titre{font-family:"Anton",sans-serif;font-weight:400;font-size:14pt;line-height:1.1;letter-spacing:.01em}
.jour-head .j-dom{font-size:8.2pt;font-weight:800;text-transform:uppercase;letter-spacing:.04em;color:var(--navy);
  background:var(--gold);border-radius:999px;padding:3px 11px;white-space:nowrap}
.jour-body{padding:5.5mm 6mm 6mm}
.jour-accroche{color:var(--muted);font-size:10.4pt;font-style:italic;margin:0 0 4mm}

.exp{border:1px solid var(--hair-cool);border-left:3px solid var(--accent);border-radius:var(--r-2);
  padding:5mm 5.5mm;margin:0 0 5mm;break-inside:avoid}
.exp:last-child{margin-bottom:0}
.exp-head{display:flex;align-items:baseline;gap:10px;margin-bottom:5px}
.exp-head .e-n{font-weight:800;color:var(--navy);font-size:11.4pt;line-height:1.2}
.exp-head .e-d{margin-left:auto;font-size:8.2pt;font-weight:700;color:var(--accent-ink);background:var(--accent-bg);
  border-radius:999px;padding:2px 9px;white-space:nowrap}
.exp .e-mat{margin:1px 0 9px;font-size:9.2pt;color:var(--muted);line-height:1.45}
.exp .e-mat .e-mat-k{font-weight:800;color:var(--accent-ink);text-transform:uppercase;letter-spacing:.05em;font-size:7.4pt;margin-right:7px}
.exp ol.e-steps{margin:.2em 0 .4em;padding-left:1.3em;counter-reset:st}
.exp ol.e-steps li{margin:.34em 0;font-size:10.4pt;line-height:1.5}
.exp .e-savoir{display:flex;gap:9px;align-items:flex-start;background:var(--accent-bg);border-radius:var(--r-2);padding:3mm 4mm;margin-top:7px}
.exp .e-savoir .i{width:17px;height:17px;flex:0 0 auto;margin-top:1px;background:center/contain no-repeat}
.exp .e-savoir p{margin:0;font-size:10.2pt;line-height:1.48}
.exp .e-savoir .s-k{font-weight:800;color:var(--accent-ink);font-size:8.2pt;letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:1px}
.exp .e-secu{display:flex;gap:8px;align-items:flex-start;margin-top:7px;background:#fdf2ec;border:1px solid #f1d3c6;border-radius:var(--r-2);padding:2.6mm 4mm}
.exp .e-secu .i{width:16px;height:16px;flex:0 0 auto;margin-top:1px;background:center/contain no-repeat}
.exp .e-secu p{margin:0;font-size:9.6pt;line-height:1.42;color:#8a3d28}
/* sous-étapes (puces non numérotées d'une activité) */
.exp ol.e-steps>li{margin:.42em 0}
.exp ol.e-steps ul.e-sub{list-style:disc;margin:.3em 0 .15em;padding-left:1.2em}
.exp ol.e-steps ul.e-sub li{margin:.22em 0;font-size:10.1pt;line-height:1.45;color:var(--ink)}
/* encadré « à expliquer aux enfants » — couleur dédiée (prune/violet), distincte des autres */
.exp .e-explique{display:flex;gap:9px;align-items:flex-start;background:#f5f1fb;border:1px solid #e1d6f3;border-left:4px solid #7c53c3;border-radius:var(--r-2);padding:3mm 4mm;margin-top:7px}
.exp .e-explique .i{width:17px;height:17px;flex:0 0 auto;margin-top:1px;background:center/contain no-repeat}
.exp .e-explique .x-k{display:block;font-weight:800;color:#5b3a9c;font-size:8.2pt;letter-spacing:.05em;text-transform:uppercase;margin-bottom:2px}
.exp .e-explique p{margin:0 0 .4em;font-size:10.2pt;line-height:1.5;color:#3a2a5c}
.exp .e-explique p:last-child{margin-bottom:0}
.exp .e-explique ul{margin:.1em 0 0;padding-left:1.15em}
.exp .e-explique li{margin:.26em 0;font-size:10.2pt;line-height:1.46;color:#3a2a5c}
/* histoire de la semaine (Jour 1) */
.intro-semaine{background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#eef3fa;border-radius:var(--r-3);padding:5mm 6mm;margin:0 0 6mm;border-left:5px solid var(--gold);break-inside:avoid}
.intro-semaine .iw-k{display:block;font-weight:800;color:var(--gold);font-size:8.4pt;letter-spacing:.06em;text-transform:uppercase;margin-bottom:4px}
.intro-semaine p{margin:0 0 .5em;font-size:10.8pt;line-height:1.55}
.intro-semaine p:last-child{margin-bottom:0}
/* intro de séance (chaque jour) */
.intro-seance{background:var(--cream-soft);border:1px solid var(--hair);border-left:4px solid var(--gold-deep);border-radius:var(--r-2);padding:3mm 4mm;margin:0 0 4mm}
.intro-seance .is-k{display:block;font-weight:800;color:var(--gold-text);font-size:7.8pt;letter-spacing:.06em;text-transform:uppercase;margin-bottom:2px}
.intro-seance p{margin:0;font-size:10.4pt;line-height:1.5}

.jour-foot{display:grid;grid-template-columns:1fr;gap:3.5mm;margin-top:4.5mm}
.trace,.maison{border-radius:var(--r-2);padding:3.4mm 4.5mm;break-inside:avoid}
.trace{background:var(--navy);color:#eaf0f7}
.trace .t-k{font-weight:800;color:var(--gold);font-size:8.2pt;letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:2px}
.trace p{margin:0;font-size:10pt;line-height:1.48}
.maison{background:var(--cream);border-left:5px solid var(--gold-deep)}
.maison .m-k{font-weight:800;color:var(--gold-text);font-size:8.2pt;letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:2px}
.maison p{margin:0;font-size:10pt;line-height:1.48}

/* --- la grande activité : 2 niveaux au choix --- */
.jour.has-opts{break-inside:auto}
.opts{margin-top:4.5mm;border:1px solid var(--hair-cool);border-radius:var(--r-2);overflow:hidden;background:var(--cream-soft)}
.opts-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;padding:2.8mm 4.5mm;background:linear-gradient(120deg,var(--navy),var(--navy-2))}
.opts-head .o-k{font-weight:800;color:var(--gold);font-size:8.6pt;letter-spacing:.08em;text-transform:uppercase}
.opts-head .o-note{color:#eaf0f7;font-size:8.6pt;font-style:italic}
.opt{padding:3mm 4.5mm 3.5mm;break-inside:avoid}
.opt+.opt{border-top:1px dashed var(--gold-deep)}
.opt .opt-tag{display:flex;align-items:baseline;gap:9px;margin-bottom:2mm;flex-wrap:wrap}
.opt .opt-tag b{font-size:8.4pt;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--navy);background:var(--gold);border-radius:999px;padding:3px 11px;white-space:nowrap}
.opt.expert .opt-tag b{background:var(--navy);color:var(--gold)}
.opt .opt-tag span{font-size:8.8pt;color:var(--muted);font-style:italic}
.opt .exp{margin-bottom:0;background:#fff}
.jour-head .j-time{font-size:7.8pt;font-weight:700;color:#eaf0f7;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:3px 10px;white-space:nowrap}

/* ---------- Kit La Poste ---------- */
.kit{display:flex;gap:14px;align-items:flex-start;background:var(--accent-bg);border:1px solid var(--accent-soft);
  border-radius:var(--r-3);padding:5mm 6mm;break-inside:avoid;margin:0 0 6mm}
.kit .i{width:30px;height:30px;flex:0 0 auto;margin-top:2px;background:center/contain no-repeat}
.kit .k-k{font-weight:800;color:var(--accent-ink);font-size:8.6pt;letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:4px}
.kit ul{margin:.1em 0 0;padding-left:1.1em}
.kit li{margin:.2em 0;font-size:10.4pt}
.kit li b{color:var(--navy)}

/* ---------- Galerie vidéo (clips filmés pendant les tests) ---------- */
.videos-gallery{margin:0 0 8mm}
.videos-gallery .vid-grid{display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x proximity;
  padding:4px 4px 12px;margin:0 -4px;-webkit-overflow-scrolling:touch}
.videos-gallery .vid-grid::-webkit-scrollbar{height:8px}
.videos-gallery .vid-grid::-webkit-scrollbar-thumb{background:var(--hair);border-radius:99px}
.videos-gallery .vid-grid::-webkit-scrollbar-track{background:transparent}
.vid-card{flex:0 0 auto;width:172px;scroll-snap-align:start;display:flex;flex-direction:column;gap:9px}
.vid-frame{position:relative;width:172px;aspect-ratio:9/16;border-radius:var(--r-3);overflow:hidden;
  background:var(--navy);box-shadow:var(--sh-2);border:1px solid var(--hair-cool)}
.vid-frame video{width:100%;height:100%;object-fit:cover;display:block;background:var(--navy)}
.vid-jour{position:absolute;left:8px;top:8px;font-size:.62rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;
  color:#fff;background:rgba(15,31,52,.72);backdrop-filter:blur(2px);border-radius:999px;padding:3px 9px;pointer-events:none}
.vid-cap .vid-t{font-weight:800;color:var(--navy);font-size:.86rem;line-height:1.25;margin-bottom:3px}
.vid-cap p{margin:0;font-size:.76rem;line-height:1.4;color:var(--muted)}
@media screen and (max-width:600px){
  .vid-card,.vid-frame{width:148px}
}

/* ---------- Bilan ---------- */
.bilan{display:flex;gap:12px;align-items:center;background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#eaf0f7;
  border-radius:var(--r-3);padding:5mm 6mm;break-inside:avoid;margin-top:7mm;border-left:5px solid var(--gold)}
.bilan .b-k{font-family:"Caveat",cursive;font-weight:700;color:var(--gold);font-size:15pt;line-height:1;white-space:nowrap}
.bilan p{margin:0;font-size:11pt;line-height:1.5}
.bilan strong{color:#fff}

.fiche-foot{margin-top:8mm;padding-top:5mm;border-top:1px solid var(--hair);display:flex;flex-wrap:wrap;gap:5px 14px;align-items:baseline;font-size:9pt;color:var(--muted)}
.fiche-foot .dom{font-weight:700;color:var(--navy)}
.fiche-foot .src{margin-left:auto}

/* ---------- Page Idées d'activités ---------- */
.idee-groupe{margin:0 0 9mm;break-inside:avoid}
.idee-rep{background:#fdf2ec;border-left:4px solid #d0563f;border-radius:var(--r-2);padding:3mm 4.5mm;margin:0 0 4mm}
.idee-rep .rep-k{font-weight:800;color:#b34a2f;font-size:8pt;letter-spacing:.05em;text-transform:uppercase;margin-right:9px}
.idee-rep b{color:var(--navy)}
.idee-rep .rep-pb{display:block;color:var(--muted);font-size:9.4pt;font-style:italic;margin-top:4px;line-height:1.4}
.idee-pair{display:grid;grid-template-columns:1fr 1fr;gap:5mm}
.idee.exp{border:1px solid var(--hair-cool);border-top:4px solid var(--accent);border-left:1px solid var(--hair-cool);margin:0}
.idee .idee-h{display:flex;flex-direction:column;gap:6px;margin-bottom:6px}
.idee .i-titre{font-family:"Anton",sans-serif;font-weight:400;font-size:13pt;color:var(--navy);line-height:1.12}
.idee .i-tags{display:flex;gap:6px;flex-wrap:wrap}
.idee .i-pitch{font-style:italic;color:var(--accent-ink);font-size:10.4pt;line-height:1.45;margin:0 0 7px}
.idee .i-why{margin-top:8px;background:var(--accent-bg);border-radius:var(--r-2);padding:3mm 4mm}
.idee .i-why .w-k{font-weight:800;color:var(--accent-ink);font-size:7.8pt;letter-spacing:.05em;text-transform:uppercase;display:block;margin-bottom:2px}
.idee .i-why p{margin:0;font-size:9.6pt;line-height:1.45}
@media(max-width:820px){.idee-pair{grid-template-columns:1fr}}

/* =============================================================================
   PICTOS
   ============================================================================= */
.i-mat{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b8932f'%20stroke-width='2'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%207l9-4%209%204-9%204z'/%3E%3Cpath%20d='M3%207v10l9%204%209-4V7'/%3E%3C/svg%3E")}
.i-tool{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b8932f'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M14.7%206.3a4%204%200%2000-5.4%205.4L4%2017v3h3l5.3-5.3a4%204%200%20005.4-5.4l-2.5%202.5-2-2%202.5-2.5z'/%3E%3C/svg%3E")}
.i-secu{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23d0563f'%20stroke-width='2'%20stroke-linejoin='round'%3E%3Cpath%20d='M12%203l8%203v5c0%204.5-3%208-8%2010-5-2-8-5.5-8-10V6z'/%3E%3C/svg%3E")}
.i-skill{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b8932f'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M20%206L9%2017l-5-5'/%3E%3C/svg%3E")}
.i-bulb{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23b8932f'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M9%2018h6M10%2021h4'/%3E%3Cpath%20d='M12%203a6%206%200%200%200-4%2010c1%201%201.2%202%201.2%203h5.6c0-1%20.2-2%201.2-3a6%206%200%200%200-4-10z'/%3E%3C/svg%3E")}
.i-box{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23e8743b'%20stroke-width='2'%20stroke-linejoin='round'%3E%3Cpath%20d='M3%207l9-4%209%204-9%204z'/%3E%3Cpath%20d='M3%207v10l9%204%209-4V7'/%3E%3Cpath%20d='M12%2011v9'/%3E%3C/svg%3E")}
.i-say{background-image:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%237c53c3'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21%2012a8%208%200%200%201-11.3%207.3L3%2021l1.7-6.7A8%208%200%201%201%2021%2012z'/%3E%3Cpath%20d='M8.5%2010.5h7M8.5%2013.5h4'/%3E%3C/svg%3E")}

/* =============================================================================
   ACCUEIL (index)
   ============================================================================= */
.home{max-width:960px;margin:0 auto;padding:0 20px 64px}
.cover2{position:relative;overflow:hidden;color:#fff;border-radius:var(--r-4);margin:26px 0 0;
  padding:56px 44px 50px;text-align:center;border-bottom:6px solid var(--gold);box-shadow:var(--sh-3);
  background:
    radial-gradient(120% 80% at 50% -20%, rgba(242,198,63,.13), transparent 60%),
    linear-gradient(160deg, var(--navy), var(--navy-2))}
@media screen{.cover2{animation:rise .55s cubic-bezier(.2,.7,.3,1) both}}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.cover2 .logo{width:108px;height:108px;border-radius:26px;padding:12px;object-fit:contain;margin:0 auto 18px;display:block;
  box-shadow:0 8px 24px rgba(0,0,0,.25)}
.cover2 .eyebrow{color:var(--gold);font-weight:700;letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;margin-bottom:12px}
.cover2 h1{font-family:"Anton",sans-serif;font-weight:400;text-transform:uppercase;font-size:2.8rem;line-height:1.03;margin:0 0 6px}
.cover2 h1 .hl{color:var(--gold)}
.cover2 .tag{color:#c8d2e0;max-width:620px;margin:12px auto 0;line-height:1.6;font-size:1rem}
.cover2 strong{color:#fff}
.cover2 .facts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:24px}
.cover2 .fact{background:rgba(255,255,255,.07);border:1px solid #2c3e57;border-radius:13px;padding:10px 16px;font-size:.85rem;color:#eaf0f7;
  transition:transform .18s ease,border-color .18s ease,background .18s ease}
.cover2 .fact:hover{transform:translateY(-2px);border-color:rgba(242,198,63,.5);background:rgba(255,255,255,.1)}
.cover2 .fact b{display:block;color:var(--gold);font-family:"Anton",sans-serif;font-weight:400;font-size:1.2rem}

.toc-vol{display:flex;align-items:center;gap:11px;margin:48px 0 10px;font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:.84rem;color:var(--navy);flex-wrap:wrap}
.toc-vol .yr{color:#fff;border-radius:999px;padding:4px 14px;font-size:.74rem}
.toc-vol.info .yr{background:#2f6df0}.toc-vol.sciences .yr{background:#2f9e6b}.toc-vol.petits .yr{background:#e8743b}.toc-vol.mercredi .yr{background:#6d4bd6}
.toc-vol small{color:var(--muted);font-weight:600;text-transform:none;letter-spacing:0}
.cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:22px}
.card2{display:flex;flex-direction:column;overflow:hidden;text-decoration:none;color:inherit;background:#fff;
  border:1px solid var(--hair-cool);border-top:4px solid var(--hair-cool);border-radius:var(--r-3);box-shadow:var(--sh-1);
  transition:box-shadow .2s ease,transform .2s ease}
.card2.info{border-top-color:#2f6df0}.card2.sciences{border-top-color:#2f9e6b}.card2.petits{border-top-color:#e8743b}.card2.mercredi{border-top-color:#6d4bd6}
.card2:hover{box-shadow:var(--sh-2);transform:translateY(-3px)}
/* bannière photo en haut de carte */
.card-photo{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--cream-soft)}
.card-photo img{width:100%;height:100%;object-fit:cover;display:block}
.card-photo.is-ph{display:flex;align-items:center;justify-content:center}
.card2.info .card-photo.is-ph{background:#eef4ff}.card2.sciences .card-photo.is-ph{background:#eafaf2}.card2.petits .card-photo.is-ph{background:#fff1ea}.card2.mercredi .card-photo.is-ph{background:#f2eeff}
.card-photo .ph-svg{width:58px;height:58px;opacity:.5}
.card2.info .ph-svg{color:#2f6df0}.card2.sciences .ph-svg{color:#2f9e6b}.card2.petits .ph-svg{color:#e8743b}.card2.mercredi .ph-svg{color:#6d4bd6}
.card-no{position:absolute;right:11px;bottom:8px;font-family:"Anton",sans-serif;font-size:1.7rem;line-height:1;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.card-body{display:flex;flex-direction:column;gap:8px;padding:15px 18px 18px;flex:1}
.card2 .c-top{display:flex;align-items:center;gap:11px}
.card2 .c-svg{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.card2.info .c-svg{background:#eef4ff;color:#2f6df0}.card2.sciences .c-svg{background:#eafaf2;color:#2f9e6b}.card2.petits .c-svg{background:#fff1ea;color:#e8743b}.card2.mercredi .c-svg{background:#f2eeff;color:#6d4bd6}
.card2 .c-svg svg{width:34px;height:34px}
.card2 .n{font-family:"Anton",sans-serif;font-size:1.95rem;line-height:.9;margin-left:auto;opacity:.92}
.card2.info .n{color:#2f6df0}.card2.sciences .n{color:#2f9e6b}.card2.petits .n{color:#e8743b}.card2.mercredi .n{color:#6d4bd6}
.card2 .pp{font-family:"Caveat",cursive;font-weight:700;font-size:1rem;line-height:1}
.card2.info .pp{color:#2f6df0}.card2.sciences .pp{color:#2f9e6b}.card2.petits .pp{color:#e8743b}.card2.mercredi .pp{color:#6d4bd6}
.card2 .t{font-weight:800;color:var(--navy);line-height:1.25;font-size:1.02rem}
.card2 .c{font-size:.82rem;color:var(--muted);line-height:1.45;flex:1 1 auto;
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.card2 .m{display:flex;gap:5px;flex-wrap:wrap}
.card2 .m span{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:2px 7px;border-radius:999px;background:var(--cream-soft);color:var(--gold-text);border:1px solid var(--hair)}
.card2 .m span.age{background:var(--navy);color:var(--gold);border-color:var(--navy)}
.home .sub{color:var(--muted);margin:2px 0 0}
.home h2.sec{font-size:1.6rem;margin:46px 0 2px;display:flex;align-items:center;gap:13px}
.home h2.sec::before{content:"";flex:0 0 auto;width:28px;height:4px;border-radius:3px;
  background:linear-gradient(90deg,var(--gold),var(--gold-deep))}
.annex-cards{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:14px}
.annex{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;background:var(--cream-soft);border:1px solid var(--hair);border-radius:var(--r-3);padding:14px 16px;
  transition:box-shadow .2s ease,transform .2s ease,border-color .2s ease}
.annex:hover{box-shadow:var(--sh-2);transform:translateY(-2px);border-color:var(--gold)}
.annex .ic{font-family:"Anton";color:var(--gold-text);font-size:1.2rem;background:var(--cream);border-radius:11px;width:40px;height:40px;display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.annex .t{font-weight:700;color:var(--navy);line-height:1.2}
.annex .c{font-size:.76rem;color:var(--muted)}
.home-foot{color:var(--muted);font-size:.82rem;text-align:center;margin-top:36px;line-height:1.7}
.home-foot b{color:var(--navy)}

/* ---------- Doc (cadre) + Sommaire matériel ---------- */
.doc{max-width:820px;margin:0 auto;padding:0 22px 64px}
.doc h2.sec{font-size:1.4rem;margin:34px 0 8px;padding-top:18px;border-top:1px solid var(--hair)}
.doc h2.sec:first-of-type{border-top:none;padding-top:0}
.doc h3{color:var(--navy);font-size:1.04rem;margin:18px 0 4px}
.doc p{margin:.5em 0}.doc ul{padding-left:1.2em}.doc ul li{margin:.3em 0}
.doc .callout{background:var(--cream);border-left:5px solid var(--gold-deep);border-radius:var(--r-2);padding:13px 17px;margin:14px 0}
.doc .callout b{color:var(--navy)}
.journee{list-style:none;padding:0;margin:10px 0;border:1px solid var(--hair);border-radius:var(--r-3);overflow:hidden}
.journee li{display:flex;gap:14px;padding:9px 15px;font-size:.92rem;border-top:1px solid var(--hair)}
.journee li:first-child{border-top:none}.journee li:nth-child(even){background:var(--cream-soft)}
.journee .h{font-weight:800;color:var(--gold-text);min-width:96px;white-space:nowrap}
.vol-block{border:1px solid var(--hair-cool);border-radius:var(--r-3);padding:16px 20px;margin:14px 0;border-left-width:5px}
.vol-block.info{border-left-color:#2f6df0}.vol-block.sciences{border-left-color:#2f9e6b}.vol-block.petits{border-left-color:#e8743b}
.vol-block h3{margin-top:0}.vol-block .meta{font-size:.8rem;color:var(--muted);font-weight:600;margin-bottom:6px}

.mat-prog{border:1px solid var(--hair-cool);border-radius:var(--r-3);padding:15px 18px;margin:12px 0;border-left:5px solid var(--hair-cool);box-shadow:var(--sh-1)}
.mat-prog.info{border-left-color:#2f6df0}.mat-prog.sciences{border-left-color:#2f9e6b}.mat-prog.petits{border-left-color:#e8743b}
.mat-prog .mp-h{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.mat-prog .mp-h .pp{font-family:"Caveat",cursive;font-weight:700;font-size:1.05rem}
.mat-prog.info .pp{color:#2f6df0}.mat-prog.sciences .pp{color:#2f9e6b}.mat-prog.petits .pp{color:#e8743b}
.mat-prog .mp-h .t{font-weight:800;color:var(--navy)}
.mat-prog .mp-h .nn{margin-left:auto;font-family:"Anton";color:var(--muted)}
.mat-prog .resume{color:var(--ink);font-size:.92rem;margin:6px 0 8px}
.mat-prog .mat{display:flex;flex-wrap:wrap;gap:5px}
.mat-prog .mat span{font-size:.8rem;background:var(--cream-soft);border:1px solid var(--hair);border-radius:7px;padding:2px 8px}
.courses{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}
.rayon{background:var(--cream-soft);border:1px solid var(--hair);border-radius:var(--r-3);padding:14px 18px;break-inside:avoid}
.rayon h3{margin:0 0 6px;color:var(--gold-text);font-size:.92rem;text-transform:uppercase;letter-spacing:.04em}
.rayon ul{list-style:none;padding:0;margin:0}
.rayon li{position:relative;padding-left:22px;margin:.28em 0;font-size:.9rem}
.rayon li::before{content:"";position:absolute;left:0;top:3px;width:13px;height:13px;border:2px solid var(--gold-deep);border-radius:4px}

/* ---------- Liste de courses ACTIONNABLE (prix + liens) ---------- */
.budget{display:flex;align-items:center;gap:18px;background:linear-gradient(120deg,var(--navy),var(--navy-2));color:#eaf0f7;
  border-radius:var(--r-3);padding:18px 24px;margin:12px 0 8px;border-left:6px solid var(--gold);flex-wrap:wrap}
.budget .amt{font-family:"Anton",sans-serif;color:var(--gold);font-size:2.2rem;line-height:1}
.budget .lbl{font-size:.92rem;line-height:1.5}.budget .lbl b{color:#fff}
.budget .lbl small{color:#aeb9c9;display:block;font-size:.78rem}
.course-rayon{border:1px solid var(--hair-cool);border-radius:var(--r-3);margin:14px 0;overflow:hidden;box-shadow:var(--sh-1);break-inside:avoid}
.course-rayon>h3{display:flex;align-items:center;gap:10px;margin:0;background:var(--cream-soft);padding:11px 16px;color:var(--navy);font-size:1rem;border-bottom:1px solid var(--hair)}
.course-rayon>h3 .sub{margin-left:auto;font-family:"Anton",sans-serif;color:var(--gold-text);font-size:1.05rem;font-weight:400}
.course-row{display:grid;grid-template-columns:auto 1fr auto 72px auto;gap:12px;align-items:center;padding:8px 16px;border-top:1px solid var(--hair-cool);font-size:.9rem}
.course-row:first-of-type{border-top:none}
.course-row .nm b{color:var(--navy)}.course-row .nm .q{color:var(--muted);font-size:.8rem}
.course-row .nm .nt{display:block;color:var(--muted);font-size:.76rem;font-style:italic}
.canal{font-size:.64rem;font-weight:700;text-transform:uppercase;letter-spacing:.03em;padding:3px 9px;border-radius:999px;background:var(--cream);color:var(--gold-text);border:1px solid var(--hair);white-space:nowrap}
.course-row .px{font-weight:800;color:var(--navy);white-space:nowrap;text-align:right}
.course-row .px.free{color:var(--muted);font-weight:600;font-size:.78rem}
.buy{font-size:.72rem;font-weight:700;text-decoration:none;color:#fff;background:var(--gold-deep);border-radius:999px;padding:5px 12px;white-space:nowrap}
.buy:hover{background:var(--navy)}
.course-note{font-size:.8rem;color:var(--muted);margin-top:8px}
.course-row .st{font-size:.6rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em;padding:2px 8px;border-radius:999px;white-space:nowrap;margin-left:8px;vertical-align:middle}
.st-have{background:#e7f6ee;color:#1f7a50;border:1px solid #bfe6d2}
.st-check{background:#fff4e0;color:#a9701a;border:1px solid #f2dba8}
.st-reuse{background:var(--cream);color:var(--gold-text);border:1px solid var(--gold)}
.st-conso{background:#eef2f8;color:var(--navy-2);border:1px solid #c9d6e8}
.exp ol.e-steps li.qfq{font-style:italic;color:var(--navy-2)}
.exp ol.e-steps li.qfq em{font-style:italic}
.course-row.st-dispo{background:#fafdfb}
.course-row.st-verifier{background:#fffdf6}
.course-row .nt.tuas{color:#1f7a50;font-weight:700;font-style:normal}
.course-row .px.est{color:#a9701a;font-weight:800;font-style:italic;font-size:.82rem}
.course-row .ck{display:flex;align-items:center;justify-content:center;cursor:pointer}
.course-row .ck input{width:18px;height:18px;accent-color:var(--gold-text);cursor:pointer;margin:0}
.course-row.done{opacity:.5}
.course-row.done .nm b{text-decoration:line-through}
.buy-progress{display:flex;gap:12px 18px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:.82rem;color:var(--muted);background:var(--cream-soft);border:1px solid var(--hair);border-radius:var(--r-3);padding:8px 14px;margin:4px 0 10px}
.buy-progress b{color:var(--navy);font-size:1.05rem;font-family:"Anton",sans-serif;font-weight:400}
.buy-progress a{color:var(--gold-text);font-weight:700;text-decoration:none;white-space:nowrap}
.buy-progress a:hover{text-decoration:underline}
.legende{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;font-size:.78rem;color:var(--muted);margin:2px 0 12px}
.legende .px-demo{font-weight:800;color:var(--navy)}
@media print{.buy{background:#fff;color:var(--gold-text);border:1px solid var(--gold-deep)}}
@media(max-width:680px){.course-row{grid-template-columns:auto 1fr auto auto}.course-row .canal{grid-column:1/-1}}

/* ---------- Nav ---------- */
.topnav{position:sticky;top:0;z-index:30;background:var(--navy);border-bottom:3px solid var(--gold);display:flex;align-items:center;gap:14px;padding:9px 18px;color:var(--cream)}
.topnav img{height:34px;width:34px;border-radius:9px;background:var(--navy)}
.topnav .b{font-weight:900;letter-spacing:.02em;font-size:.9rem}
.topnav .b small{display:block;font-weight:600;color:var(--gold);font-size:.7rem}
.topnav .l{margin-left:auto;display:flex;gap:8px}
.topnav a{font-size:.82rem;font-weight:700;text-decoration:none;color:var(--navy);background:var(--gold);border-radius:999px;padding:7px 14px}
.topnav a.ghost{background:transparent;color:var(--cream);border:1.5px solid #3a4d68}
.topnav a[aria-disabled="true"]{opacity:.35;pointer-events:none}

/* ---------- Impression ---------- */
@media print{
  *{-webkit-print-color-adjust:exact !important;print-color-adjust:exact !important}
  .topnav,.no-print{display:none !important}
  body.fiche{background:#fff;padding:0}
  .sheet{box-shadow:none;border-radius:0;padding:0;width:auto;max-width:none}
  .home,.doc{max-width:none}
  a{color:inherit;text-decoration:none}
  .jour,.exp,.goals,.hero-figure,.kit,.bilan,.rayon,.mat-prog{break-inside:avoid}
}
@media (max-width:820px){
  .prep .prep-grid,.cards,.annex-cards,.courses,.goals ul{grid-template-columns:1fr;columns:1}
  .cover2 h1{font-size:2.1rem}
  .jour-head{flex-wrap:wrap}.jour-head .j-dom{margin-left:54px}
  .sheet{padding:20px 15px}
}

/* ---------- Accessibilité & confort (écran) ---------- */
.skip-link{position:absolute;left:8px;top:-48px;z-index:100;background:var(--navy);color:#fff;
  padding:8px 14px;border-radius:8px;font-weight:700;text-decoration:none;transition:top .15s}
.skip-link:focus{top:8px}
[id="main"]:focus{outline:none}
@media screen{
  :focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:4px}
}
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.001ms !important;animation-iteration-count:1 !important;
    transition-duration:.001ms !important;scroll-behavior:auto !important}
}

/* =============================================================================
   RESPONSIVE écran — tablette puis téléphone
   Grilles dégressives 3→2→1, topnav adaptatif, paddings resserrés.
   (n'affecte pas @media print : tout est en @media screen)
   ============================================================================= */
@media screen and (max-width:980px){
  .cards,.annex-cards{grid-template-columns:1fr 1fr}   /* tablette : 2 colonnes */
}
@media screen and (max-width:820px){
  .topnav{flex-wrap:wrap;gap:8px 10px;padding:8px 12px}
  .cover2{padding:38px 24px 32px}
  .prep .prep-two{grid-template-columns:1fr}
}
@media screen and (max-width:600px){
  /* téléphone : tout en 1 colonne */
  .cards,.annex-cards,.courses,.idee-pair,.prep .prep-two{grid-template-columns:1fr}
  /* topnav : retire le sous-titre (utilité faible sur petit écran) */
  .topnav .b small{display:none}
  .topnav .b{font-size:.82rem;line-height:1.1}
  .topnav .l{margin-left:auto}
  .topnav a{font-size:.76rem;padding:6px 11px}
  .cover2{padding:30px 18px 26px}
  .cover2 h1{font-size:1.85rem}
  .cover2 .tag{font-size:.92rem}
  .cover2 .logo{width:88px;height:88px}
  .home,.doc{padding-left:14px;padding-right:14px}
  body.fiche{padding:14px 8px 56px}
  .sheet{padding:16px 13px}
  .prog-head h1{font-size:22pt}
  .home h2.sec{font-size:1.3rem}
}
@media screen and (max-width:430px){
  .cover2 h1{font-size:1.55rem}
  .prog-head h1{font-size:19pt}
  .budget{padding:14px 16px}.budget .amt{font-size:1.8rem}
  .course-row{font-size:.84rem;gap:6px 8px}
  .buy{padding:5px 10px}
}