/* ══════════════════ 1. TOKENS ══════════════════ */
:root{
  --navy:#080027;
  --navy-2:#0F0836;
  --navy-3:#1A1147;
  --coral:#FF5464;
  --blue:#195BF7;
  --teal:#36827E;
  --orange:#FCA311;
  --sky:#30BCED;
  --white:#FFFFFF;
  --ink-soft:#B8B1D6;
  --ink-dim:#7C749C;
  --line:rgba(255,255,255,.14);

  --sans:'Manrope',system-ui,-apple-system,'Segoe UI',sans-serif;
  --serif:'DM Serif Display',Georgia,serif;

  --wrap:1140px;
  --gut:clamp(20px,5vw,48px);
  --sec:clamp(72px,10vw,132px);

  --accent:var(--coral);           /* redéfini par section */

  --peek:88px;                     /* aperçu laissé sous le bandeau */
  --title-h:8.8svh;                 /* plafond des titres, calé sur la hauteur d'écran */
}

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:78px;-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--navy);color:var(--white);
  font-family:var(--sans);font-size:17px;line-height:1.65;font-weight:400;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--coral);outline-offset:3px;border-radius:2px}
@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;transition-duration:.001ms!important}
  html{scroll-behavior:auto}
}

/* ══════════════════ 2. TYPO ══════════════════ */
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:var(--gut)}

.logotype{font-family:var(--serif);font-weight:400;letter-spacing:-.01em;line-height:.9}
.logotype sup{letter-spacing:0}

h1,h2,h3,h4{margin:0;font-weight:400;letter-spacing:-.02em}
h2{text-wrap:balance;font-family:var(--serif);font-size:clamp(30px,4.6vw,52px);line-height:1.06}
h2 em{font-style:italic}
h3{font-family:var(--sans);font-weight:700;font-size:clamp(19px,2vw,23px);line-height:1.3;letter-spacing:-.015em}
p{margin:0 0 1.05em}
p:last-child{margin-bottom:0}
.lede{font-size:clamp(18px,2.1vw,21px);line-height:1.6;color:var(--ink-soft);max-width:62ch}
.small{font-size:14.5px;line-height:1.55;color:var(--ink-dim)}

/* marqueur de section : un chevron plein, pas un eyebrow tracké */
.mark{display:flex;align-items:center;gap:12px;margin-bottom:18px;font-size:14px;font-weight:700;color:var(--accent)}
.mark::before{content:"";width:15px;height:13px;background:var(--accent);
  clip-path:polygon(0 0,100% 0,50% 100%)}

/* ══════════════════ 3. MOTIF TRIANGLES ══════════════════ */
.pattern{position:absolute;inset:0;width:100%;height:100%;z-index:0}
.pattern rect{width:100%;height:100%}

/* ══════════════════ 4. NAV ══════════════════ */
.nav{position:fixed;top:0;left:0;right:0;z-index:90;
  background:rgba(8,0,39,0);backdrop-filter:blur(0px);
  border-bottom:1px solid transparent;transition:background .25s,border-color .25s,backdrop-filter .25s}
.nav.stuck{background:rgba(8,0,39,.9);backdrop-filter:blur(14px);border-bottom-color:var(--line)}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:14px var(--gut);
  display:flex;align-items:center;justify-content:space-between;gap:24px}
.nav-logo{font-size:25px;text-decoration:none;flex-shrink:0}
.nav-links{display:flex;align-items:center;gap:26px;list-style:none;margin:0;padding:0}
.nav-links a{text-decoration:none;font-size:14.5px;font-weight:600;color:var(--ink-soft);
  padding:6px 0;position:relative;transition:color .18s}
.nav-links a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:2px;
  background:var(--coral);transition:right .22s}
.nav-links a:hover,.nav-links a.on{color:var(--white)}
.nav-links a.on::after,.nav-links a:hover::after{right:0}
.nav-links .nav-cta{padding:12px 28px;border-radius:999px;background:var(--coral);color:var(--navy)!important;
  font-weight:800;font-size:14.5px;text-decoration:none;white-space:nowrap;transition:transform .15s,box-shadow .15s}
.nav-cta:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(255,84,100,.32)}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:2px;background:var(--white);margin:5px 0;transition:.22s}
.nav.open .burger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.nav.open .burger span:nth-child(2){opacity:0}
.nav.open .burger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* Seuil relevé à 1080px : l'onglet « Cérémonie de clôture » rend la
   barre trop longue pour tenir sur une ligne en dessous. */
@media(max-width:1080px){
  .burger{display:block}
  .nav-links{position:fixed;inset:66px 0 auto 0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--navy);border-bottom:1px solid var(--line);padding:8px var(--gut) 22px;
    transform:translateY(-120%);transition:transform .3s cubic-bezier(.4,0,.2,1);max-height:calc(100vh - 66px);overflow:auto}
  .nav.open .nav-links{transform:translateY(0)}
  .nav-links li{border-bottom:1px solid rgba(255,255,255,.07)}
  .nav-links li:last-child{border:0}
  .nav-links a{display:block;padding:15px 0;font-size:17px}
  .nav-links a::after{display:none}
  .nav-links .nav-cta{display:inline-block;margin-top:16px;text-align:center}
}

/* ══════════════════ 4bis. LOGO DIGITAL WALLONIA ══════════════════
   Logo officiel, détouré depuis les visuels de la charte et embarqué en base64
   pour que le fichier reste autonome. Pour le remplacer par le fichier officiel :
   .dw-logo{background-image:url('assets/digital-wallonia.svg')} */
.dw-logo{background:url("img/digital-wallonia.png") center/contain no-repeat}
.hero-dw{position:absolute;z-index:3;top:clamp(84px,9vh,110px);right:var(--gut);
  width:clamp(104px,10vw,146px);aspect-ratio:400/276;display:block;
  opacity:.96;transition:opacity .18s}
.hero-dw:hover{opacity:1}
@media(max-width:940px){.hero-dw{top:84px;width:92px}}
@media(max-width:520px){.hero-dw{width:78px;top:78px}}

/* ══════════════════ 5. HERO ══════════════════ */
/* Le bandeau partenaires est le dernier enfant du hero. On cale donc la
   hauteur du hero sur l'écran moins un aperçu de la section suivante
   (--peek) : toutes les pages s'arrêtent au même niveau et laissent voir
   ce qui suit. Le contenu est centré par margin-block:auto. */
.hero{position:relative;min-height:calc(100svh - var(--peek));
  display:flex;flex-direction:column;
  padding:clamp(88px,11vh,116px) 0 0;overflow:hidden}
.hero::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(26% 20% at 91% 15%,rgba(8,0,39,.9) 0%,rgba(8,0,39,0) 100%),
    linear-gradient(180deg,rgba(8,0,39,.7) 0%,rgba(8,0,39,0) 15%,rgba(8,0,39,0) 76%,rgba(8,0,39,.88) 100%),
    linear-gradient(97deg,rgba(8,0,39,.93) 0%,rgba(8,0,39,.88) 32%,rgba(8,0,39,.42) 58%,rgba(8,0,39,0) 82%)}
.hero-in{position:relative;z-index:2;width:100%;margin-block:0 auto;padding-bottom:clamp(26px,3.4vw,44px)}
.hero-kicker{font-size:clamp(15px,1.7vw,18px);font-weight:800;letter-spacing:.005em;margin:0 0 clamp(14px,2.2vw,22px)}
.hero-title{font-family:var(--serif);font-weight:400;line-height:.92;letter-spacing:-.025em;
  font-size:min(clamp(54px,10.5vw,150px),var(--title-h));margin:0}
/* marge sous le nom du moment : l'exposant 26 monte haut et viendrait
   sinon toucher les descendantes de la ligne du dessus */
.hero-title .ht-cre{display:block;font-style:italic;margin-bottom:.24em}

.hero-sub{margin:clamp(18px,2.4vw,26px) 0 0;font-size:clamp(17px,2vw,22px);line-height:1.4;
  font-weight:500;max-width:44ch}
.hero-meta{display:flex;flex-wrap:wrap;gap:10px 26px;margin-top:clamp(16px,2vw,22px);font-size:clamp(15px,1.8vw,18px);font-weight:700}
.hero-meta span{display:flex;align-items:center;gap:9px}
.ico-cal{width:17px;height:17px;flex-shrink:0;color:var(--coral)}
.pin{width:13px;height:13px;flex-shrink:0;background:var(--coral);border-radius:50% 50% 50% 0;transform:rotate(-45deg)}
.hero-btns{display:flex;flex-wrap:wrap;gap:14px;margin-top:clamp(22px,2.8vw,32px)}
.btn{display:inline-flex;align-items:center;gap:10px;padding:16px 30px;border-radius:999px;
  font-weight:800;font-size:16px;text-decoration:none;border:2px solid transparent;
  transition:transform .16s,background .18s,box-shadow .18s,color .18s;cursor:pointer;font-family:inherit}
.btn:hover{transform:translateY(-2px)}
.btn-1{background:var(--coral);color:var(--navy);border-color:var(--coral)}
.btn-1:hover{box-shadow:0 12px 32px rgba(255,84,100,.36)}
.btn-2{background:transparent;color:var(--white);border-color:rgba(255,255,255,.42)}
.btn-2:hover{background:var(--white);color:var(--navy);border-color:var(--white)}
.btn-w{background:var(--white);color:var(--navy);border-color:var(--white)}
.btn-w:hover{box-shadow:0 12px 32px rgba(255,255,255,.22)}

.cd-cap{margin:clamp(20px,2.6vw,28px) 0 8px;font-size:14px;font-weight:700;color:var(--ink-soft)}
.countdown{display:flex;gap:clamp(18px,3vw,34px);flex-wrap:wrap}
.cd-unit{min-width:56px}
.cd-n{font-family:var(--serif);font-size:clamp(26px,3.2vw,38px);line-height:1;display:block}
.cd-l{font-size:11.5px;font-weight:700;color:var(--ink-dim);margin-top:5px;display:block}

/* bandeau déroulant : un seul espacement entre tous les éléments, jointure comprise */
.marquee{position:relative;z-index:2;background:#fff;overflow:hidden;
  padding:clamp(16px,2vw,22px) 0;border-top:1px solid rgba(8,0,39,.08)}
.marquee::before,.marquee::after{content:"";position:absolute;top:0;bottom:0;width:clamp(28px,6vw,90px);z-index:1;pointer-events:none}
.marquee::before{left:0;background:linear-gradient(90deg,#fff,rgba(255,255,255,0))}
.marquee::after{right:0;background:linear-gradient(-90deg,#fff,rgba(255,255,255,0))}
.mq-track{display:flex;width:max-content;animation:mq 38s linear infinite}
.marquee:hover .mq-track{animation-play-state:paused}
.mq-group{--g:clamp(34px,4vw,60px);display:flex;align-items:center;gap:var(--g);padding-right:var(--g);flex-shrink:0}
.mq-group .lg{display:block;width:var(--w);height:var(--h);background-position:center;background-size:contain;background-repeat:no-repeat;flex-shrink:0}
.lg-adn{background-image:url("img/logo-adn.webp")}
.lg-noshaq{background-image:url("img/logo-noshaq.webp")}
.lg-hand{background-image:url("img/logo-hand.webp")}
.lg-wallonie{background-image:url("img/logo-wallonie.webp")}
.lg-miil{background-image:url("img/logo-miil.webp")}
.lg-amplo{background-image:url("img/logo-amplo.webp")}
.lg-wake{background-image:url("img/logo-wake.webp")}
.lg-pod{background-image:url("img/logo-pod.webp")}
.lg-sacd{background-image:url("img/logo-sacd.webp")}
.mq-lab{font-size:12.5px;font-weight:800;color:var(--navy);white-space:nowrap;opacity:.7}
.mq-sep{width:1px;height:36px;background:rgba(8,0,39,.16);flex-shrink:0}
@keyframes mq{to{transform:translateX(-50%)}}
@media(max-width:700px){
  .mq-group .lg{width:calc(var(--w) * .72);height:calc(var(--h) * .72)}
  .mq-track{animation-duration:30s}
}
/* sans animation : un seul groupe, centré, qui passe à la ligne si besoin */
@media (prefers-reduced-motion:reduce){
  .mq-track{animation:none!important;width:auto;justify-content:center}
  .mq-group[aria-hidden="true"]{display:none}
  .mq-group{flex-wrap:wrap;justify-content:center;padding:0 var(--gut);flex-shrink:1;width:100%;row-gap:18px}
  .mq-group > .mq-sep:last-child{display:none}
}

/* ══════════════════ 6. SECTIONS ══════════════════ */
section{position:relative}
.sec{padding-block:var(--sec)}
.sec-alt{background:var(--navy-2)}
.head{max-width:70ch;margin-bottom:clamp(38px,5vw,60px)}
.head h2{margin-bottom:20px}

/* bandeau de triangles entre les sections */
.band{position:relative;height:clamp(46px,7vw,86px);overflow:hidden}
.band svg{position:absolute;inset:0;width:100%;height:100%}

/* ══════════════════ 7. PILIERS ══════════════════ */
.pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:2px;background:var(--line);
  border:1px solid var(--line)}
.pillar{background:var(--navy);padding:clamp(26px,3.4vw,38px)}
.pillar h3{color:var(--coral);font-family:var(--serif);font-weight:400;font-size:clamp(25px,3vw,34px);font-style:italic;margin-bottom:14px}
.pillar p{font-size:16px;color:var(--ink-soft);margin:0}
@media(max-width:820px){.pillars{grid-template-columns:1fr}}


/* ══════════════════ 8. PARCOURS ══════════════════ */
.parcours{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(12,auto);
  column-gap:clamp(18px,2.2vw,26px);row-gap:0}
@media(max-width:1000px){
  /* une seule colonne : plus rien à aligner, on repasse en flux normal */
  .parcours{grid-template-columns:1fr;max-width:680px;row-gap:clamp(18px,2.2vw,26px)}
  .parcours .pc,.parcours .pc-out{display:block;grid-row:auto;grid-template-rows:none}
}

/* subgrid : les quatre bandes d'une carte (visuel, accroche, specs, détails)
   s'alignent d'une carte à l'autre, quelle que soit la longueur des textes */
.pc{position:relative;border:1px solid var(--line);background:var(--navy);
  display:grid;grid-row:span 12;grid-template-rows:subgrid;
  transition:border-color .22s}
@supports not (grid-template-rows:subgrid){
  .pc{grid-row:auto;grid-template-rows:auto auto auto auto 1fr}
  .pc-out{grid-row:auto;grid-template-rows:none;display:block}
}
.pc:hover{border-color:var(--c)}
.pc-vis{position:relative;height:186px;overflow:hidden;display:flex;align-items:flex-end;padding:22px}
.pc-vis svg{position:absolute;inset:0;width:100%;height:100%}
.pc-vis::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,0,39,.25),rgba(8,0,39,.86))}
.pc-vis-txt{position:relative;z-index:2}
.pc-vis-txt .lg{font-family:var(--serif);font-size:22px;display:block;line-height:1}

.pc-vis-txt .nm{font-family:var(--serif);font-style:italic;font-size:clamp(29px,3.4vw,38px);line-height:1.05;display:block;margin-top:4px}
.pc>*{--pad:clamp(22px,2.6vw,28px)}
.pc-punch,.pc-lead,.pc-specs,.pc-out{padding-inline:var(--pad)}
.pc-punch{font-size:16.5px;font-weight:600;line-height:1.5;margin:0;padding-top:var(--pad)}
.pc-lead{margin:0;font-size:15px;line-height:1.55;color:var(--ink-soft);padding-block:12px 0}
.pc-specs{list-style:none;margin:0;padding-block:18px 0;display:flex;flex-direction:column;gap:8px}
.pc-specs li{display:flex;gap:10px;font-size:14.5px;color:var(--ink-soft);line-height:1.45}
.pc-specs li::before{content:"";width:9px;height:8px;margin-top:7px;flex-shrink:0;background:var(--c);
  clip-path:polygon(0 0,100% 0,50% 100%)}
.pc-out{border-top:1px solid var(--line);margin-top:20px;padding-top:18px;padding-bottom:var(--pad);
  display:grid;grid-row:span 8;grid-template-rows:subgrid}
.pc-out dt{font-size:12px;font-weight:700;color:var(--ink-dim);margin-bottom:5px}
.pc-out dd{margin:0 0 14px;font-size:15px;line-height:1.45}
.pc-out dd:last-child{margin-bottom:0}
.pc-out .who{font-weight:700}
.pc-out .xp{color:inherit;text-decoration:underline;text-decoration-color:rgba(255,255,255,.3);
  text-underline-offset:3px;text-decoration-thickness:1px;transition:color .16s,text-decoration-color .16s}
.pc-out .xp:hover{color:var(--c);text-decoration-color:currentColor}
.pc-out .xp-2{display:inline-block;margin-top:8px}
.pc-out .xp .ext{width:10px;height:10px;margin-left:5px;vertical-align:1px;opacity:.6}
.pc-out .who small{display:block;font-weight:500;color:var(--ink-dim);font-size:13.5px}

/* ══════════════════ BULLES CORAIL ══════════════════ */
.bubble{background:var(--coral);color:var(--navy);border-radius:20px;font-weight:600}
.bubble-inline{display:flex;align-items:center;gap:12px;margin:24px 0 0;padding:14px 22px;
  font-size:clamp(15px,1.6vw,16.5px);line-height:1.45;text-wrap:balance;
  width:max-content;max-width:calc(100vw - 2 * var(--gut))}
.ico-bubble{width:21px;height:21px;flex-shrink:0}
.bubble-block{margin-top:clamp(28px,3.5vw,40px);padding:clamp(24px,3.2vw,34px) clamp(24px,3.6vw,40px)}
.bubble-t{font-family:var(--serif);font-style:italic;font-weight:500;font-size:clamp(22px,2.6vw,28px);
  letter-spacing:-.01em;line-height:1.15;margin:0 0 12px;color:var(--navy)}
.bubble-block p{margin:0;font-size:clamp(16px,1.8vw,19px);line-height:1.55;max-width:78ch}

/* ══════════════════ 9. HORAIRE ══════════════════ */
.days{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:34px}
.day-tab{background:transparent;border:1px solid var(--line);color:var(--ink-soft);
  padding:11px 18px;border-radius:999px;font-family:inherit;font-size:14.5px;font-weight:700;cursor:pointer;
  transition:.18s;white-space:nowrap}
.day-tab:hover{color:var(--white);border-color:rgba(255,255,255,.4)}
.day-tab[aria-selected="true"]{background:var(--white);color:var(--navy);border-color:var(--white)}
.day-tab small{display:block;font-weight:600;font-size:11.5px;opacity:.62;margin-top:1px}

.day-panel[hidden]{display:none}
.day-note{font-size:15px;color:var(--ink-soft);margin-bottom:26px;max-width:66ch}
.tl{border-left:2px solid var(--line);padding-left:clamp(20px,3vw,34px);margin:0}
.tl-row{position:relative;display:grid;grid-template-columns:78px 1fr;gap:clamp(14px,2.5vw,28px);
  padding:18px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.tl-row:last-child{border-bottom:0}
.tl-row::before{content:"";position:absolute;left:calc(-1 * clamp(20px,3vw,34px) - 7px);top:25px;
  width:12px;height:10px;background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%)}
.tl-h{font-family:var(--serif);font-size:19px;line-height:1.3;padding-top:1px}
.tl-t{font-weight:700;font-size:16.5px;line-height:1.35;margin:0 0 4px}
.tl-d{font-size:14.5px;color:var(--ink-soft);line-height:1.5;margin:0}
@media(max-width:600px){
  .tl-row{grid-template-columns:1fr;gap:4px}
  .tl-h{font-size:17px;color:var(--accent)}
}

/* ══════════════════ 10. DISCORD ══════════════════ */
.dc{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(32px,5vw,68px);align-items:start}
@media(min-width:941px){.dc-card{margin-top:clamp(40px,5vw,64px)}}
@media(max-width:940px){.dc{grid-template-columns:1fr}}
.dc-list{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:13px}
.dc-list li{display:flex;gap:12px;font-size:16px;line-height:1.5}
.dc-list li::before{content:"";width:11px;height:9px;margin-top:9px;flex-shrink:0;background:var(--accent);
  clip-path:polygon(0 0,100% 0,50% 100%)}
.dc-card{position:relative;border:1px solid var(--line);padding:clamp(28px,4vw,44px);overflow:hidden;
  background:var(--navy)}
.dc-card svg.pattern{opacity:.16}
.dc-card-in{position:relative;z-index:2}
.dc-card h3{margin-bottom:12px;font-size:clamp(21px,2.4vw,26px)}
.dc-card p{font-size:15.5px;color:var(--ink-soft)}
.dc-note{margin-top:30px;padding:18px 20px;border:1px solid var(--line);border-left:3px solid var(--coral);
  background:rgba(255,84,100,.07);font-size:15px;line-height:1.6}
.dc-note p{margin:0 0 10px}
.dc-note p:last-child{margin:0}
.dc-note-t{font-size:12.5px;font-weight:800;color:var(--coral)}

/* ══════════════════ 13. FAQ ══════════════════ */
.faq{max-width:820px;border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:22px 42px 22px 0;position:relative;
  font-weight:700;font-size:17px;line-height:1.4;transition:color .18s}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--coral)}
.faq summary::after{content:"";position:absolute;right:6px;top:30px;width:13px;height:11px;
  background:var(--coral);clip-path:polygon(0 0,100% 0,50% 100%);transition:transform .22s}
.faq details[open] summary::after{transform:rotate(180deg)}
.faq .a{padding:0 0 24px;color:var(--ink-soft);font-size:16px;max-width:66ch}

/* ══════════════════ 14. PIED DE PAGE ══════════════════ */
footer{background:var(--navy-2);border-top:1px solid var(--line);padding:clamp(46px,6vw,68px) 0 34px}
.ft-top{display:flex;justify-content:space-between;align-items:flex-start;
  gap:clamp(28px,5vw,64px);flex-wrap:wrap;
  padding-bottom:34px;border-bottom:1px solid var(--line)}
.ft-people{display:flex;gap:clamp(32px,7vw,100px);flex-wrap:wrap}
.ft-person .role{font-size:12px;font-weight:700;color:var(--ink-dim);margin:0 0 6px}
.ft-person .who{font-family:var(--serif);font-size:20px;font-weight:400;margin:0 0 8px;line-height:1.1}
.ft-person a{display:block;text-decoration:none;font-size:14.5px;color:var(--ink-soft);
  padding:2px 0;transition:color .16s}
.ft-person a:hover{color:var(--coral)}
.ft-nav{display:flex;gap:28px;flex-wrap:wrap}
.ft-nav a{text-decoration:none;font-size:14.5px;font-weight:600;color:var(--ink-soft);transition:color .16s}
.ft-nav a:hover{color:var(--white)}
.ft-bot{padding-top:24px;display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;
  font-size:13.5px;color:var(--ink-dim)}

/* ══════════════════ 15. PLACEHOLDERS ÉDITORIAUX ══════════════════ */
[data-mode="edit"] .todo{
  background:rgba(255,214,0,.12);box-shadow:inset 0 0 0 1px rgba(255,214,0,.4);
  border-radius:3px;padding:2px 7px;color:#FFE79A}
[data-mode="edit"] .todo::before{content:"\270E\00A0";color:#FFD600;font-weight:800}
[data-mode="edit"] .todo-block{
  border:1px dashed rgba(255,214,0,.5);background:rgba(255,214,0,.07);padding:18px 20px;border-radius:5px}
[data-mode="live"] .todo::before{content:none}
[data-mode="edit"] .faq .a.todo{padding:16px 18px;margin-bottom:22px;display:block}
[data-mode="edit"] .tl-d.todo,[data-mode="edit"] .day-note.todo{display:block}

/* accent par section */
#creathon{--accent:var(--coral)}
#discord{--accent:var(--coral)}
#horaire{--accent:var(--coral)}

/* ══════════════════ 16. RÉVÉLATION AU SCROLL (unique, discrète) ══════════════════ */
.rv{opacity:0;transform:translateY(16px)}
.rv.in{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.22,.8,.3,1)}

/* ══════════════════ OPTION IMAGES ══════════════════
   Pour utiliser les vrais visuels au lieu du motif SVG :
   1. déposez ia-days-generique.jpg dans /assets
   2. décommentez le bloc ci-dessous
.hero{background:url('assets/ia-days-generique.jpg') center/cover no-repeat}
.hero .pattern{display:none}
   ══════════════════════════════════════════════════ */


/* ═══════════════════════════════════════════════════════════════════
   AJOUTS POUR LE SITE MULTI-PAGES (hub + pages par type d'événement)
   La couleur d'accent de chaque page est fixée par la classe posée sur
   <body> : .t-coral .t-teal .t-blue .t-orange
   ═══════════════════════════════════════════════════════════════════ */
body.t-coral  {--accent:var(--coral)}
body.t-teal   {--accent:var(--teal)}
body.t-blue   {--accent:var(--blue)}
body.t-orange {--accent:var(--orange)}
body.t-sky    {--accent:var(--sky)}
body.t-coral  .btn-1{background:var(--coral);border-color:var(--coral);color:var(--navy)}
body.t-teal   .btn-1{background:var(--teal);border-color:var(--teal);color:var(--navy)}
body.t-blue   .btn-1{background:var(--blue);border-color:var(--blue);color:var(--white)}
body.t-orange .btn-1{background:var(--orange);border-color:var(--orange);color:var(--navy)}
body.t-sky    .btn-1{background:var(--sky);border-color:var(--sky);color:var(--navy)}
body.t-teal   .nav-links .nav-cta{background:var(--teal)}
body.t-blue   .nav-links .nav-cta{background:var(--blue);color:var(--white)!important}
body.t-orange .nav-links .nav-cta{background:var(--orange)}
body.t-sky    .nav-links .nav-cta{background:var(--sky)}
body.t-teal .nav-links a::after,body.t-blue .nav-links a::after,
body.t-orange .nav-links a::after,body.t-sky .nav-links a::after{background:var(--accent)}
body:not(.t-coral) :focus-visible{outline-color:var(--accent)}
.pin{background:var(--accent)}
.ico-cal{color:var(--accent)}

/* Les pages intérieures partagent désormais exactement la géométrie du
   hero d'accueil : même hauteur, même rythme. Rien à surcharger ici. */
.hero-eyebrow{font-size:14px;font-weight:800;color:var(--accent);margin:0 0 18px}

/* ── cartes des quatre temps (accueil) ── */
.temps{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(16px,2vw,24px)}
@media(max-width:860px){.temps{grid-template-columns:1fr}}
.temps a{position:relative;display:flex;flex-direction:column;overflow:hidden;
  border:1px solid var(--line);background:var(--navy);text-decoration:none;
  transition:border-color .2s,transform .2s}
.temps a:hover{border-color:var(--c);transform:translateY(-2px)}
.tp-vis{position:relative;height:150px;overflow:hidden;display:flex;align-items:flex-end;padding:20px}
.tp-vis svg{position:absolute;inset:0;width:100%;height:100%}
.tp-vis::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(8,0,39,.2),rgba(8,0,39,.9))}
.tp-vis span{position:relative;z-index:2;font-family:var(--serif);font-style:italic;
  font-size:clamp(25px,3vw,34px);line-height:1.05}
.tp-body{padding:clamp(20px,2.6vw,28px);display:flex;flex-direction:column;gap:12px;flex:1}
.tp-when{font-size:13px;font-weight:800;color:var(--c)}
.tp-body p{margin:0;font-size:15.5px;line-height:1.55;color:var(--ink-soft)}
.tp-go{margin-top:auto;padding-top:14px;font-size:15px;font-weight:700;color:var(--white)}
.tp-go i{font-style:normal;display:inline-block;margin-left:6px;transition:transform .2s}
.temps a:hover .tp-go i{transform:translateX(4px)}

/* ── calendrier de la semaine ── */
.week{border:1px solid var(--line);border-bottom:0}
.wk-row{display:grid;grid-template-columns:150px 1fr;border-bottom:1px solid var(--line)}
@media(max-width:760px){.wk-row{grid-template-columns:1fr}}
.wk-day{padding:20px clamp(18px,2.4vw,26px);border-right:1px solid var(--line);background:rgba(255,255,255,.02)}
@media(max-width:760px){.wk-day{border-right:0;border-bottom:1px solid var(--line);padding-bottom:12px}}
.wk-day b{display:block;font-family:var(--serif);font-size:23px;font-weight:400;line-height:1.1}
.wk-day span{font-size:13px;color:var(--ink-dim)}
.wk-items{display:flex;flex-direction:column}
.wk-i{display:grid;grid-template-columns:84px 1fr;gap:16px;padding:16px clamp(18px,2.4vw,26px);
  border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none;transition:background .16s}
.wk-i:last-child{border-bottom:0}
.wk-i:hover{background:rgba(255,255,255,.035)}
@media(max-width:560px){.wk-i{grid-template-columns:1fr;gap:3px}}
.wk-h{font-family:var(--serif);font-size:17px;color:var(--ink-soft)}
.wk-t{display:block;font-weight:700;font-size:16px;line-height:1.35;margin:0 0 3px}
.wk-d{display:block;font-size:14px;color:var(--ink-dim);line-height:1.45;margin:0}
.dot{display:inline-block;width:9px;height:8px;margin-right:8px;vertical-align:1px;
  clip-path:polygon(0 0,100% 0,50% 100%)}
.dot-coral{background:var(--coral)}.dot-teal{background:var(--teal)}
.dot-blue{background:var(--blue)}.dot-orange{background:var(--orange)}
.dot-sky{background:var(--sky)}

/* ── fiches événement (moments d'inspiration) ── */
.evts{display:flex;flex-direction:column;gap:clamp(18px,2.4vw,26px)}
.evt{border:1px solid var(--line);background:var(--navy);
  display:grid;grid-template-columns:210px 1fr;transition:border-color .2s}
.evt:hover{border-color:var(--accent)}
@media(max-width:820px){.evt{grid-template-columns:1fr}}
.evt-when{padding:clamp(22px,2.6vw,30px);border-right:1px solid var(--line);
  display:flex;flex-direction:column;gap:6px;background:rgba(255,255,255,.02)}
@media(max-width:820px){.evt-when{border-right:0;border-bottom:1px solid var(--line);
  flex-direction:row;align-items:baseline;gap:14px;flex-wrap:wrap}}
.evt-day{font-family:var(--serif);font-size:clamp(24px,2.7vw,30px);line-height:1.05}
.evt-hour{font-size:15px;font-weight:700;color:var(--accent)}
.evt-place{font-size:13.5px;color:var(--ink-dim);line-height:1.45}
.evt-main{padding:clamp(22px,2.6vw,30px);display:flex;flex-direction:column;gap:14px}
.evt-main h3{font-family:var(--serif);font-weight:400;font-size:clamp(21px,2.4vw,27px);line-height:1.2}
.evt-main p{margin:0;font-size:15.5px;line-height:1.6;color:var(--ink-soft)}
.evt-who{display:flex;flex-direction:column;gap:10px;padding-top:4px}
.evt-p{font-size:15px;line-height:1.45}
.evt-p b{font-weight:700}
.evt-p span{display:block;color:var(--ink-dim);font-size:13.5px}
.evt-prog{border-top:1px solid rgba(255,255,255,.08);padding-top:12px}
.evt-prog summary{list-style:none;cursor:pointer;font-size:14.5px;font-weight:700;color:var(--accent);
  display:flex;align-items:center;gap:9px;transition:opacity .16s}
.evt-prog summary::-webkit-details-marker{display:none}
.evt-prog summary::before{content:"";width:11px;height:9px;background:var(--accent);
  clip-path:polygon(0 0,100% 0,50% 100%);transition:transform .2s}
.evt-prog[open] summary::before{transform:rotate(180deg)}
.evt-prog summary:hover{opacity:.78}
.evt-prog .pg-people{margin-top:12px}
.evt-when{min-width:0}
.evt-foot{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);
  display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.evt-link{font-size:15px;font-weight:700;text-decoration:none;color:var(--accent);
  border-bottom:1px solid transparent;transition:border-color .16s}
.evt-link:hover{border-bottom-color:currentColor}
.evt-meta{font-size:13.5px;color:var(--ink-dim)}
.tag{display:inline-block;font-size:11.5px;font-weight:800;padding:4px 10px;border-radius:999px;
  background:rgba(255,255,255,.1);color:var(--ink-soft)}

/* ── programme détaillé (journée scientifique, clôture) ── */
.prog{border-left:2px solid var(--line);padding-left:clamp(20px,3vw,34px);margin:0}
.pg{position:relative;display:grid;grid-template-columns:120px 1fr;gap:clamp(14px,2.5vw,28px);
  padding:20px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.pg:last-child{border-bottom:0}
.pg::before{content:"";position:absolute;left:calc(-1 * clamp(20px,3vw,34px) - 7px);top:27px;
  width:12px;height:10px;background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%)}
@media(max-width:620px){.pg{grid-template-columns:1fr;gap:4px}.pg::before{top:24px}}
.pg-h{font-family:var(--serif);font-size:18px;line-height:1.3;color:var(--ink-soft);padding-top:1px}
@media(max-width:620px){.pg-h{color:var(--accent);font-size:16px}}
.pg-eb{font-size:12.5px;font-weight:800;color:var(--accent);margin:0 0 5px}
.pg-t{font-weight:700;font-size:17px;line-height:1.35;margin:0 0 6px}
.pg-d{font-size:15px;color:var(--ink-soft);line-height:1.55;margin:0}
.pg-people{margin:8px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:6px}
.pg-people li{font-size:14.5px;line-height:1.45;color:var(--ink-soft);display:flex;gap:10px}
.pg-people li::before{content:"";width:9px;height:8px;margin-top:7px;flex-shrink:0;
  background:var(--accent);clip-path:polygon(0 0,100% 0,50% 100%)}
.pg-people b{color:var(--white);font-weight:700}
.pause .pg-t{font-weight:600;color:var(--ink-dim);font-size:15.5px}
.prog .pg:first-child .pg-t{font-weight:800;color:var(--white)}
.pause::before{opacity:.35}

/* ── encart d'information pratique ── */
.infos{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line);
  border:1px solid var(--line)}
@media(max-width:820px){.infos{grid-template-columns:repeat(2,1fr)}}
@media(max-width:460px){.infos{grid-template-columns:1fr}}
.info{background:var(--navy);padding:24px}
.info dt{font-size:12.5px;font-weight:700;color:var(--ink-dim);margin-bottom:7px}
.info dd{margin:0;font-size:16.5px;font-weight:700;line-height:1.35}
.info dd small{display:block;font-weight:500;font-size:14px;color:var(--ink-soft);margin-top:3px}

/* ── bandeau d'appel final ── */
.cta{border:1px solid var(--line);padding:clamp(28px,4vw,48px);text-align:center;
  display:flex;flex-direction:column;align-items:center;gap:18px}
.cta h2{margin:0}
.cta p{margin:0;max-width:56ch;color:var(--ink-soft)}

/* ── Lettrage « IAdays²⁶ » ─────────────────────────────────────────
   Proportions relevées sur le visuel officiel ia-days-générique :
   le 26 fait 0,60 du corps et sa ligne de pied est remontée de 0,72
   de son propre corps. Une seule règle pour tous les emplacements,
   afin que le lettrage soit identique partout. */
sup{font-size:.6em;vertical-align:baseline;position:relative;top:-.72em}

/* ── Écrans peu hauts (portables 768–880 px) ───────────────────────
   Le créathon porte en plus un compte à rebours. On le compacte et on
   réduit l'aperçu pour que les cinq pages s'arrêtent au même niveau. */
@media (max-height:880px){
  :root{--peek:56px;--title-h:8.4svh}
  .hero{padding-top:clamp(72px,9vh,92px)}
  .hero-in{padding-bottom:clamp(22px,2.4vw,28px)}
  .cd-cap{margin:clamp(12px,1.6vw,16px) 0 4px;font-size:12.5px}
  .cd-n{font-size:clamp(24px,2.6vw,28px)}
  .cd-l{font-size:10.5px;margin-top:3px}
}

/* Écrans très peu hauts : on resserre encore et on réduit l'aperçu. */
@media (max-height:745px){
  :root{--peek:36px;--title-h:7.4svh}
  .hero{padding-top:clamp(60px,8vh,76px)}
  .cd-cap{margin:8px 0 3px}
  .cd-n{font-size:22px}
}