/* =====================================================================
   FORMATION SKETCHNOTE "AURORA" edition
   Insuffle Académie brand palette (extraite du thème officiel) :
     aubergine  #1A0518   violet  #8E2183   profond #4A0E44 / #6B1563
     or         #FFD466 / #FFB300
   Dark editorial + aurora gradients + parallax + motion
   ===================================================================== */

:root{
  --plum:        #160314;   /* base background */
  --plum-2:      #210720;   /* panel */
  --plum-3:      #2c0a2a;   /* raised panel */
  --violet:      #8E2183;   /* signature */
  --violet-2:    #6B1563;
  --violet-deep: #4A0E44;
  --magenta:     #C13BAE;   /* brighter glow */
  --gold:        #FFD466;
  --gold-2:      #FFB300;

  --text:    #F4E9F2;
  --dim:     #CBB2CC;
  --faint:   #957C97;
  --line:    rgba(255,212,102,.16);
  --glass:   rgba(255,255,255,.04);
  --glass-bd:rgba(214,150,205,.18);

  --display:"Bricolage Grotesque", system-ui, sans-serif;
  --body:"Hanken Grotesque", system-ui, sans-serif;
  --hand:"Caveat", cursive;

  --gutter: clamp(20px, 5vw, 96px);
  --maxw: 1320px;
  --ease: cubic-bezier(.22,1,.36,1);

  --par: 1; /* parallax intensity multiplier (tweakable) */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto;}}
body{
  margin:0;font-family:var(--body);color:var(--text);background:var(--plum);
  font-size:18px;line-height:1.62;-webkit-font-smoothing:antialiased;
  overflow-x:hidden;
}
img{max-width:100%;height:auto;display:block;}
a{color:inherit;text-decoration:none;}
button{font-family:inherit;cursor:pointer;color:inherit;}
::selection{background:var(--gold);color:var(--plum);}

/* ---------------- AURORA BACKGROUND ---------------- */
.aurora{position:fixed;inset:0;z-index:-2;overflow:hidden;pointer-events:none;background:
  radial-gradient(120% 80% at 50% -10%, #2a0726 0%, var(--plum) 55%);}
.aurora span{position:absolute;border-radius:50%;filter:blur(70px);opacity:.55;mix-blend-mode:screen;
  will-change:transform;}
.aurora .b1{width:52vw;height:52vw;left:-10vw;top:-8vw;background:radial-gradient(circle,var(--violet),transparent 68%);animation:drift1 26s var(--ease) infinite alternate;}
.aurora .b2{width:46vw;height:46vw;right:-12vw;top:6vw;background:radial-gradient(circle,var(--magenta),transparent 66%);animation:drift2 32s var(--ease) infinite alternate;opacity:.4;}
.aurora .b3{width:40vw;height:40vw;left:20vw;top:40vh;background:radial-gradient(circle,var(--violet-2),transparent 70%);animation:drift3 30s var(--ease) infinite alternate;}
.aurora .b4{width:34vw;height:34vw;right:4vw;bottom:-10vw;background:radial-gradient(circle,var(--gold-2),transparent 72%);opacity:.16;animation:drift1 38s var(--ease) infinite alternate;}
@keyframes drift1{to{transform:translate(8vw,6vh) scale(1.15);}}
@keyframes drift2{to{transform:translate(-7vw,9vh) scale(1.1);}}
@keyframes drift3{to{transform:translate(6vw,-7vh) scale(1.2);}}
/* grain + noise veil */
.aurora::after{content:"";position:absolute;inset:0;opacity:.5;
  background:radial-gradient(140% 100% at 50% 120%, transparent 55%, var(--plum) 92%);}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;mix-blend-mode:soft-light;
  background-image:radial-gradient(rgba(255,255,255,.025) 1px, transparent 1px);background-size:3px 3px;}
body[data-aurora="off"] .aurora span{animation:none;}
body[data-aurora="off"] .aurora .b2,body[data-aurora="off"] .aurora .b4{opacity:.12;}

/* cursor glow */
.cursor-glow{position:fixed;top:0;left:0;width:520px;height:520px;border-radius:50%;z-index:0;
  transform:translate(-50%,-50%);pointer-events:none;will-change:transform;
  background:radial-gradient(circle, rgba(193,59,174,.16), transparent 62%);transition:opacity .4s;}
@media (hover:none){.cursor-glow{display:none;}}

/* scroll progress (gold nib line) */
.progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:80;transform-origin:0 50%;
  transform:scaleX(0);background:linear-gradient(90deg,var(--gold-2),var(--gold),var(--magenta));}

/* ---------------- TYPE ---------------- */
.eyebrow{font-family:var(--hand);font-weight:700;font-size:clamp(20px,2.2vw,28px);
  color:var(--gold);display:inline-flex;align-items:center;gap:.45em;line-height:1;}
h1,h2,h3{font-family:var(--display);font-weight:800;letter-spacing:-.025em;line-height:.96;margin:0;}
h1{font-size:clamp(30px,5.4vw,86px);}
h2{font-size:clamp(34px,5.4vw,76px);}
h3{font-size:clamp(20px,1.7vw,26px);font-weight:700;letter-spacing:-.01em;line-height:1.1;}
p{margin:0 0 1em;text-wrap:pretty;}
.lead{font-size:clamp(18px,1.5vw,23px);color:var(--dim);line-height:1.55;}
.gold{color:var(--gold);}
.grad{background:linear-gradient(100deg,var(--gold) 0%,#F08AD8 48%,var(--gold) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto;
  animation:shine 7s linear infinite;}
@keyframes shine{to{background-position:200% center;}}

.wrap{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);}
section{position:relative;}
.block{padding:clamp(80px,11vw,160px) 0;}
.shead{max-width:50rem;margin-bottom:clamp(38px,5vw,68px);}
.shead .eyebrow{margin-bottom:16px;}
.shead p{margin-top:18px;}

/* draw-on underline */
.draw{position:relative;white-space:nowrap;}
.draw svg{position:absolute;left:-3%;width:106%;height:.5em;bottom:-.26em;overflow:visible;pointer-events:none;}
.draw svg path{fill:none;stroke:var(--gold);stroke-width:5;stroke-linecap:round;
  stroke-dasharray:var(--len,400);stroke-dashoffset:var(--len,400);transition:stroke-dashoffset 1s var(--ease) .15s;}
.in .draw svg path,.draw.in svg path{stroke-dashoffset:0;}

/* ---------------- BUTTONS (magnetic) ---------------- */
.btn{position:relative;display:inline-flex;align-items:center;gap:.6em;white-space:nowrap;
  font-family:var(--display);font-weight:700;font-size:17px;letter-spacing:-.01em;
  padding:16px 28px;border-radius:999px;border:1.5px solid transparent;
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),background .3s;will-change:transform;}
.btn svg{width:18px;height:18px;}
.btn--gold{background:linear-gradient(120deg,var(--gold),var(--gold-2));color:var(--plum);
  box-shadow:0 8px 30px rgba(255,179,0,.28);}
.btn--gold:hover{box-shadow:0 14px 44px rgba(255,179,0,.42);}
.btn--glass{background:var(--glass);color:var(--text);border-color:var(--glass-bd);backdrop-filter:blur(10px);}
.btn--glass:hover{background:rgba(193,59,174,.16);border-color:var(--magenta);}
.btn .arr{transition:transform .3s var(--ease);}
.btn:hover .arr{transform:translateX(4px);}

/* ---------------- NAV ---------------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:70;display:flex;align-items:center;justify-content:space-between;
  gap:24px;padding:16px var(--gutter);transition:padding .3s,background .3s,box-shadow .3s;}
.nav.scrolled{background:rgba(22,3,20,.72);backdrop-filter:blur(16px) saturate(1.2);
  box-shadow:0 1px 0 var(--line);padding-top:11px;padding-bottom:11px;}
.nav__logo{display:flex;align-items:center;gap:12px;font-family:var(--display);font-weight:800;font-size:20px;white-space:nowrap;}
.nav__logo-img{height:38px;width:auto;display:block;}
.nav.scrolled .nav__logo-img{height:34px;transition:height .3s;}
.nav__mark{width:40px;height:40px;border-radius:12px;flex:none;display:grid;place-items:center;
  font-weight:800;font-size:22px;color:var(--plum);background:linear-gradient(135deg,var(--gold),var(--magenta));
  box-shadow:0 6px 20px rgba(193,59,174,.4);}
.nav__links{display:flex;gap:30px;align-items:center;}
.nav__links a{font-weight:600;font-size:16px;color:var(--dim);position:relative;padding:4px 0;transition:color .2s;}
.nav__links a::after{content:"";position:absolute;left:0;right:100%;bottom:-2px;height:2px;
  background:linear-gradient(90deg,var(--gold),var(--magenta));transition:right .3s var(--ease);}
.nav__links a:hover{color:var(--text);}
.nav__links a:hover::after,.nav__links a.active::after{right:0;}
.nav__links a.active{color:var(--text);}
.nav__cta{display:flex;align-items:center;gap:14px;}
.nav .btn{padding:11px 22px;font-size:15px;}
.nav__burger{display:none;width:46px;height:46px;border:1.5px solid var(--glass-bd);border-radius:12px;
  background:var(--glass);backdrop-filter:blur(8px);place-items:center;}
.nav__burger span,.nav__burger span::before,.nav__burger span::after{content:"";display:block;width:20px;height:2px;background:var(--text);border-radius:2px;position:relative;}
.nav__burger span::before{position:absolute;top:-6px;}.nav__burger span::after{position:absolute;top:6px;}
@media (max-width:920px){
  .nav__links{position:absolute;top:calc(100% + 8px);right:var(--gutter);left:var(--gutter);flex-direction:column;
    align-items:flex-start;gap:8px;background:rgba(33,7,32,.96);backdrop-filter:blur(18px);
    border:1px solid var(--glass-bd);border-radius:20px;padding:20px 24px;
    transform:translateY(-10px) scale(.98);opacity:0;visibility:hidden;transition:.3s var(--ease);}
  .nav__links.open{transform:none;opacity:1;visibility:visible;}
  .nav__links a{font-size:20px;}
  .nav__burger{display:grid;}
  .nav__cta .btn{display:none;}
}

/* ---------------- HERO ---------------- */
.hero{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:140px 0 60px;position:relative;}
.hero__head{max-width:var(--maxw);margin:0 auto;padding-inline:var(--gutter);width:100%;}
.hero__row{max-width:var(--maxw);margin:clamp(26px,3.4vw,46px) auto 0;padding-inline:var(--gutter);width:100%;
  display:grid;grid-template-columns:1fr .82fr;gap:clamp(30px,4vw,66px);align-items:center;}
.hero__eyebrow{margin-bottom:20px;}
.hero h1{margin-bottom:26px;}
.hero h1 .line{display:block;overflow:hidden;}
.hero h1 .line span{display:inline-block;transform:translateY(110%);
  animation:rise .9s var(--ease) forwards;}
.hero h1 .line:nth-child(2) span{animation-delay:.12s;}
@keyframes rise{to{transform:none;}}
@media (prefers-reduced-motion:reduce){.hero h1 .line span{transform:none;animation:none;}}
.hero__lead{max-width:30em;margin-bottom:34px;}
.hero__cta{display:flex;flex-wrap:wrap;gap:16px;align-items:center;}
.hero__note{font-family:var(--hand);font-size:22px;color:var(--gold);display:flex;align-items:center;gap:10px;margin-top:28px;}

.hero__visual{position:relative;}
.hero__card{position:relative;border-radius:26px;overflow:hidden;border:1px solid var(--glass-bd);
  box-shadow:0 40px 90px -30px rgba(0,0,0,.8), 0 0 0 1px rgba(193,59,174,.1);
  background:#fff;will-change:transform;}
.hero__card img{width:100%;aspect-ratio:2048/1448;object-fit:contain;background:#fff;}
/* vidéo d'ambiance en fond de hero, très discrète */
.hero__bg{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none;}
.hero__bg video{width:100%;height:100%;object-fit:cover;opacity:.14;filter:saturate(.7) contrast(1.05);}
.hero__bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(22,3,20,.72) 0%,rgba(22,3,20,.28) 38%,rgba(22,3,20,.86) 88%,var(--plum) 100%);}
.hero__head,.hero__row,.hero__stats{position:relative;z-index:1;}
@media (prefers-reduced-motion:reduce){.hero__bg video{display:none;}}
body[data-motion="off"] .hero__bg video{display:none;}
.hero__card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(160deg,transparent 72%,rgba(22,3,20,.14));}
.float{position:absolute;color:var(--gold);will-change:transform;z-index:3;filter:drop-shadow(0 6px 16px rgba(0,0,0,.4));}
.float svg{width:100%;height:100%;}
.hero__badge{position:absolute;z-index:4;display:grid;place-content:center;text-align:center;border-radius:50%;
  width:120px;height:120px;font-family:var(--display);line-height:1;background:linear-gradient(135deg,var(--gold),var(--gold-2));
  color:var(--plum);transform:rotate(-10deg);box-shadow:0 18px 40px rgba(255,179,0,.35);top:-22px;right:-18px;}
.hero__badge b{font-size:18px;font-weight:800;}.hero__badge span{font-size:11px;font-weight:700;letter-spacing:.08em;}

/* stats */
.hero__stats{max-width:var(--maxw);margin:clamp(48px,6vw,84px) auto 0;padding-inline:var(--gutter);
  display:grid;grid-template-columns:repeat(3,1fr);gap:18px;}
.stat{padding:26px 24px;border-radius:20px;background:var(--glass);border:1px solid var(--glass-bd);
  backdrop-filter:blur(8px);position:relative;overflow:hidden;}
.stat b{font-family:var(--display);font-weight:800;font-size:clamp(40px,5vw,64px);line-height:.9;display:block;}
.stat b .grad{display:inline;}
.stat > span{font-size:15px;color:var(--dim);font-weight:600;}
@media (max-width:920px){
  .hero__row{grid-template-columns:1fr;}
  .hero__visual{order:-1;max-width:480px;}
}
@media (max-width:600px){.hero__stats{grid-template-columns:1fr;}}

/* ---------------- GLASS CARDS ---------------- */
.cards{display:grid;gap:20px;}
.cards--3{grid-template-columns:repeat(3,1fr);}
.cards--2{grid-template-columns:repeat(2,1fr);}
.gcard{position:relative;border-radius:22px;padding:32px 30px;background:var(--glass);
  border:1px solid var(--glass-bd);backdrop-filter:blur(8px);overflow:hidden;
  transition:transform .4s var(--ease),border-color .4s,box-shadow .4s;will-change:transform;}
.gcard::before{content:"";position:absolute;inset:0;opacity:0;transition:opacity .4s;pointer-events:none;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,0%),rgba(193,59,174,.16),transparent 60%);}
.gcard:hover{transform:translateY(-6px);border-color:rgba(193,59,174,.5);box-shadow:0 30px 60px -28px rgba(193,59,174,.5);}
.gcard:hover::before{opacity:1;}
.gcard__ico{width:56px;height:56px;border-radius:16px;display:grid;place-items:center;font-size:27px;margin-bottom:20px;
  background:linear-gradient(135deg,rgba(255,212,102,.2),rgba(193,59,174,.2));border:1px solid var(--glass-bd);}
.gcard h3{margin-bottom:10px;position:relative;z-index:1;}
.gcard p{font-size:16px;color:var(--dim);margin:0;position:relative;z-index:1;}
.gcard__n{position:absolute;top:20px;right:24px;z-index:0;font-family:var(--display);font-weight:800;font-size:44px;
  line-height:1;color:transparent;-webkit-text-stroke:1.4px rgba(255,212,102,.28);pointer-events:none;}
@media (max-width:940px){.cards--3{grid-template-columns:1fr 1fr;}}
@media (max-width:600px){.cards--3,.cards--2{grid-template-columns:1fr;}}

/* ---------------- ABOUT ---------------- */
.about{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(30px,5vw,80px);align-items:center;}
.about__img{position:relative;border-radius:24px;overflow:hidden;border:1px solid var(--glass-bd);
  box-shadow:0 40px 90px -36px rgba(0,0,0,.8);will-change:transform;}
.about__img img{width:100%;aspect-ratio:1024/724;object-fit:cover;}
.about__quote{font-family:var(--hand);font-size:clamp(30px,3.6vw,52px);color:var(--gold);line-height:1.02;margin:0 0 16px;font-weight:700;}
@media (max-width:880px){.about{grid-template-columns:1fr;}.about__img{max-width:520px;}}

/* objectives */
.obj{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,5vw,72px);align-items:start;}
.obj__img{border-radius:24px;overflow:hidden;border:1px solid var(--glass-bd);box-shadow:0 40px 90px -36px rgba(0,0,0,.8);will-change:transform;}
.obj__img img{width:100%;aspect-ratio:1024/768;object-fit:cover;}
@media (max-width:880px){.obj{grid-template-columns:1fr;}.obj__img{max-width:520px;}}

/* ---------------- TESTIMONIALS marquee ---------------- */
.marq{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);}
.marq__t{display:flex;gap:22px;width:max-content;animation:scrollx 46s linear infinite;}
.marq:hover .marq__t{animation-play-state:paused;}
@keyframes scrollx{to{transform:translateX(-50%);}}
@media (prefers-reduced-motion:reduce){.marq__t{animation:none;flex-wrap:wrap;width:auto;justify-content:center;}}
body[data-motion="off"] .marq__t{animation:none;flex-wrap:wrap;width:auto;justify-content:center;}
.qcard{flex:none;width:370px;border-radius:20px;padding:30px 30px 26px;background:var(--glass);
  border:1px solid var(--glass-bd);backdrop-filter:blur(8px);position:relative;}
.qcard .stars{color:var(--gold);letter-spacing:2px;font-size:15px;margin-bottom:14px;}
.qcard p{font-size:18px;color:var(--text);font-weight:500;margin:0 0 16px;line-height:1.45;}
.qcard .who{font-family:var(--hand);font-size:21px;color:var(--magenta);}

/* ---------------- PROGRAM timeline ---------------- */
.tl{position:relative;max-width:980px;}
.tl__line{position:absolute;left:33px;top:14px;bottom:14px;width:3px;background:rgba(255,212,102,.14);border-radius:3px;overflow:hidden;}
.tl__line i{position:absolute;inset:0;transform-origin:top;transform:scaleY(var(--p,0));
  background:linear-gradient(var(--gold),var(--magenta));}
.mod{position:relative;padding-left:90px;margin-bottom:18px;}
.mod__dot{position:absolute;left:12px;top:6px;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:20px;color:var(--plum);z-index:2;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));box-shadow:0 0 0 6px var(--plum),0 8px 22px rgba(255,179,0,.4);transition:transform .3s;}
.mod.open .mod__dot{transform:scale(1.08);}
.mod__panel{border-radius:20px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);overflow:hidden;transition:border-color .3s;}
.mod.open .mod__panel{border-color:rgba(193,59,174,.45);}
.mod__head{display:flex;align-items:center;gap:16px;width:100%;background:none;border:none;text-align:left;padding:24px 26px;}
.mod__head h3{flex:1;min-width:0;}
.mod__head .dur{flex:none;white-space:nowrap;font-family:var(--hand);font-size:19px;color:var(--gold);}
.mod__plus{flex:none;width:36px;height:36px;border-radius:50%;position:relative;transition:transform .4s var(--ease);
  background:rgba(255,212,102,.1);border:1px solid var(--glass-bd);}
.mod__plus::before,.mod__plus::after{content:"";position:absolute;background:var(--gold);border-radius:2px;}
.mod__plus::before{top:50%;left:9px;right:9px;height:2.5px;transform:translateY(-50%);}
.mod__plus::after{left:50%;top:9px;bottom:9px;width:2.5px;transform:translateX(-50%);transition:opacity .3s;}
.mod.open .mod__plus{transform:rotate(180deg);}.mod.open .mod__plus::after{opacity:0;}
.mod__body{max-height:0;overflow:hidden;transition:max-height .5s var(--ease);}
.mod__inner{padding:2px 28px 30px;}
.mod__inner h4{font-family:var(--display);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--faint);margin:0 0 14px;}
.mod__list{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:11px;}
.mod__list li{display:flex;gap:12px;font-size:16px;color:var(--dim);align-items:flex-start;}
.mod__list li::before{content:"";flex:none;width:21px;height:21px;margin-top:1px;border-radius:7px;
  background:linear-gradient(135deg,var(--gold),var(--gold-2));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 13l4 4L19 7' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/86% no-repeat,linear-gradient(#000,#000);
  -webkit-mask-composite:source-in;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 13l4 4L19 7' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/86% no-repeat;mask-composite:exclude;}
.mod__goal{font-size:16px;color:var(--dim);border-left:3px solid var(--gold);padding:12px 0 12px 18px;}
.mod__goal b{font-family:var(--display);color:var(--text);}
@media (max-width:560px){.tl__line,.mod__dot{display:none;}.mod{padding-left:0;}}

/* ---------------- GALLERY ---------------- */
.gallery{columns:3;column-gap:18px;}
.gitem{break-inside:avoid;margin-bottom:18px;border-radius:16px;overflow:hidden;position:relative;cursor:pointer;
  border:1px solid var(--glass-bd);background:var(--plum-2);transition:transform .4s var(--ease),box-shadow .4s;will-change:transform;}
.gitem img{width:100%;height:auto;transition:transform .6s var(--ease);}
.gitem:hover{transform:translateY(-5px);box-shadow:0 26px 50px -22px rgba(193,59,174,.6);}
.gitem:hover img{transform:scale(1.05);}
.gitem figcaption{position:absolute;inset:auto 0 0 0;padding:18px 16px 14px;font-family:var(--hand);font-size:20px;color:var(--gold);
  background:linear-gradient(transparent,rgba(22,3,20,.9));opacity:0;transform:translateY(8px);transition:.3s var(--ease);}
.gitem:hover figcaption{opacity:1;transform:none;}
@media (max-width:900px){.gallery{columns:2;}}
@media (max-width:540px){.gallery{columns:1;}}

/* lightbox */
.lb{position:fixed;inset:0;z-index:120;background:rgba(10,1,9,.92);backdrop-filter:blur(8px);
  display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transition:.3s;padding:28px;}
.lb.open{opacity:1;visibility:visible;}
.lb img{max-width:92vw;max-height:84vh;border-radius:12px;border:1px solid var(--glass-bd);box-shadow:0 40px 100px rgba(0,0,0,.6);}
.lb__cap{position:absolute;bottom:24px;left:0;right:0;text-align:center;font-family:var(--hand);font-size:23px;color:var(--gold);}
.lb__x,.lb__nav{position:absolute;width:54px;height:54px;border-radius:50%;display:grid;place-items:center;font-size:22px;font-weight:700;
  background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);color:var(--text);transition:.2s;}
.lb__x{top:22px;right:22px;}.lb__nav{top:50%;transform:translateY(-50%);}.lb__prev{left:22px;}.lb__next{right:22px;}
.lb__x:hover,.lb__nav:hover{background:var(--magenta);border-color:var(--magenta);}

/* ---------------- AVANT / APRÈS comparator ---------------- */
.ba{position:relative;max-width:1040px;margin:0 auto;width:100%;aspect-ratio:16/10;border-radius:24px;
  overflow:hidden;border:1px solid var(--glass-bd);box-shadow:0 40px 90px -36px rgba(0,0,0,.8);
  background:#fff;user-select:none;touch-action:pan-y;}
.ba image-slot{width:100%;height:100%;display:block;}
.ba__after{position:absolute;inset:0;}
.ba__before{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos,50%)) 0 0);}
.ba__tag{position:absolute;top:16px;z-index:5;font-family:var(--display);font-weight:700;font-size:13px;
  letter-spacing:.1em;text-transform:uppercase;padding:7px 15px;border-radius:999px;pointer-events:none;}
.ba__tag--a{left:16px;background:rgba(22,3,20,.62);color:var(--gold);border:1px solid rgba(255,212,102,.4);backdrop-filter:blur(6px);}
.ba__tag--b{right:16px;background:linear-gradient(120deg,var(--gold),var(--gold-2));color:var(--plum);}
.ba__handle{position:absolute;top:0;bottom:0;left:var(--pos,50%);width:3px;transform:translateX(-50%);z-index:6;
  background:linear-gradient(var(--gold),var(--magenta));cursor:ew-resize;}
.ba__grip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;
  background:rgba(22,3,20,.72);backdrop-filter:blur(8px);border:2px solid var(--gold);display:grid;place-items:center;
  color:var(--gold);box-shadow:0 10px 28px rgba(0,0,0,.55);cursor:ew-resize;transition:transform .2s;}
.ba__handle:hover .ba__grip,.ba.dragging .ba__grip{transform:translate(-50%,-50%) scale(1.08);}
.ba__grip svg{width:24px;height:24px;}

/* ---------------- LEARN / PROSE / FAQ (SEO content) ---------------- */
.learn{display:grid;grid-template-columns:1.6fr .9fr;gap:clamp(30px,4vw,64px);align-items:start;}
.prose{max-width:64ch;}
.prose .lead{color:var(--text);margin-bottom:22px;}
.prose h3{font-size:clamp(20px,1.9vw,27px);margin:36px 0 12px;}
.prose p{color:var(--dim);margin:0 0 16px;font-size:18px;line-height:1.72;}
.prose p strong{color:var(--text);font-weight:700;}
.prose em{color:var(--gold);font-style:normal;}
.brief{position:sticky;top:96px;border-radius:22px;padding:28px 28px 30px;background:var(--glass);
  border:1px solid var(--glass-bd);backdrop-filter:blur(8px);}
.brief h3{font-family:var(--display);font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin:0 0 18px;}
.brief ul{list-style:none;padding:0;margin:0;display:grid;gap:16px;}
.brief li{display:grid;gap:3px;}
.brief li b{font-family:var(--display);font-weight:700;font-size:15px;color:var(--text);}
.brief li span{font-size:14px;color:var(--dim);line-height:1.45;}
@media (max-width:860px){.learn{grid-template-columns:1fr;}.brief{position:static;}}

.faq{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(34px,4vw,56px);}
.faq__item{border-radius:18px;padding:26px 28px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);transition:border-color .3s;}
.faq__item:hover{border-color:rgba(193,59,174,.4);}
.faq__item h3{font-size:19px;margin:0 0 9px;}
.faq__item p{font-size:16px;color:var(--dim);margin:0;line-height:1.6;}
@media (max-width:720px){.faq{grid-template-columns:1fr;}}

/* keyword ribbon (text play + SEO) */
.kwrib{position:relative;z-index:1;overflow:hidden;margin:clamp(28px,4vw,52px) 0 0;
  -webkit-mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.kwrib__t{display:flex;gap:30px;width:max-content;align-items:center;animation:scrollx 40s linear infinite;}
.kwrib:hover .kwrib__t{animation-play-state:paused;}
.kwrib s{text-decoration:none;font-family:var(--display);font-weight:800;font-size:clamp(26px,4vw,52px);letter-spacing:-.02em;white-space:nowrap;
  color:transparent;-webkit-text-stroke:1.2px rgba(255,212,102,.34);}
.kwrib s.on{-webkit-text-stroke:0;background:linear-gradient(100deg,var(--gold),#F08AD8);-webkit-background-clip:text;background-clip:text;}
.kwrib i{color:var(--magenta);font-size:22px;font-style:normal;}
body[data-motion="off"] .kwrib__t{animation:none;}
@media (prefers-reduced-motion:reduce){.kwrib__t{animation:none;}}

/* glowing stat callout (light play) */
.callout{position:relative;z-index:1;text-align:center;padding:clamp(40px,6vw,78px) 0 clamp(20px,3vw,36px);}
.callout__glow{position:absolute;left:50%;top:46%;width:min(560px,80vw);height:300px;transform:translate(-50%,-50%);
  background:radial-gradient(circle,rgba(193,59,174,.4),transparent 64%);filter:blur(40px);z-index:-1;pointer-events:none;
  animation:breathe 6s ease-in-out infinite;}
@keyframes breathe{0%,100%{opacity:.7;transform:translate(-50%,-50%) scale(1);}50%{opacity:1;transform:translate(-50%,-50%) scale(1.12);}}
body[data-motion="off"] .callout__glow{animation:none;}
.callout b{display:block;font-family:var(--display);font-weight:800;font-size:clamp(82px,17vw,210px);line-height:.82;}
.callout p{font-family:var(--hand);font-size:clamp(22px,2.6vw,34px);color:var(--gold);margin:2px 0 0;}

/* giant faint watermark */
.seoword{position:absolute;right:-1%;top:-7%;font-family:var(--display);font-weight:800;line-height:.8;
  font-size:clamp(110px,21vw,300px);color:transparent;-webkit-text-stroke:1.2px rgba(255,212,102,.07);
  pointer-events:none;user-select:none;z-index:0;}
#comprendre{overflow:hidden;}
#comprendre .wrap{position:relative;}

/* ---------------- CONTACT ---------------- */
.contact__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(36px,5vw,80px);align-items:center;}
.contact__meta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px;}
.chip{display:inline-flex;align-items:center;gap:9px;border:1px solid var(--glass-bd);background:var(--glass);
  border-radius:999px;padding:10px 18px;font-weight:600;font-size:15px;color:var(--text);backdrop-filter:blur(8px);}
.chip svg{width:16px;height:16px;}
.handi{font-size:14px;color:var(--faint);margin-top:22px;max-width:34em;}
.form{border-radius:26px;padding:clamp(26px,3vw,42px);background:var(--glass);border:1px solid var(--glass-bd);
  backdrop-filter:blur(12px);box-shadow:0 40px 90px -40px rgba(0,0,0,.8);}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.field{display:flex;flex-direction:column;gap:7px;margin-bottom:16px;}
.field label{font-weight:700;font-size:14px;color:var(--dim);}
.field input,.field textarea,.field select{font-family:inherit;font-size:16px;color:var(--text);
  background:rgba(22,3,20,.5);border:1.5px solid var(--glass-bd);border-radius:13px;padding:14px 16px;transition:border-color .2s,box-shadow .2s;}
.field input::placeholder,.field textarea::placeholder{color:var(--faint);}
.field textarea{resize:vertical;min-height:96px;}
.field select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23FFD466' stroke-width='3'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 16px center;}
.field input:focus,.field textarea:focus,.field select:focus{outline:none;border-color:var(--magenta);box-shadow:0 0 0 4px rgba(193,59,174,.18);}
.field.err input,.field.err textarea{border-color:#ff6b6b;}
.field .msg{font-size:13px;color:#ff8787;font-weight:600;display:none;}
.field.err .msg{display:block;}
.form .btn{width:100%;justify-content:center;margin-top:6px;}
.form__ok{display:none;text-align:center;padding:30px 10px;}
.form__ok.show{display:block;}
.form__ok .big{font-family:var(--display);font-weight:800;font-size:30px;margin-bottom:8px;}
.form__ok .hand{font-family:var(--hand);font-size:23px;color:var(--gold);}
@media (max-width:880px){.contact__grid{grid-template-columns:1fr;}.form__row{grid-template-columns:1fr;}}

/* ---------------- FOOTER ---------------- */
.footer{position:relative;padding:90px var(--gutter) 40px;border-top:1px solid var(--line);overflow:hidden;}
.footer__big{font-family:var(--display);font-weight:800;font-size:clamp(60px,18vw,260px);line-height:.8;letter-spacing:-.04em;
  color:transparent;-webkit-text-stroke:1.4px rgba(255,212,102,.16);text-align:center;margin-bottom:60px;user-select:none;pointer-events:none;}
.footer__grid{max-width:var(--maxw);margin:0 auto;display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:36px;}
.footer h4{font-family:var(--display);font-weight:800;font-size:17px;margin:0 0 16px;}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:9px;}
.footer a{color:var(--dim);font-size:15px;transition:color .2s;}
.footer a:hover{color:var(--gold);}
.footer__brand p{font-size:15px;color:var(--dim);max-width:30em;}
.footer__bottom{max-width:var(--maxw);margin:48px auto 0;padding-top:24px;border-top:1px solid var(--line);font-size:13px;color:var(--faint);}
@media (max-width:880px){.footer__grid{grid-template-columns:1fr 1fr;}}
@media (max-width:520px){.footer__grid{grid-template-columns:1fr;}}

/* ---------------- REVEAL ---------------- */
.reveal{opacity:0;transform:translateY(34px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.reveal.in{opacity:1;transform:none;}
.reveal[data-d="1"]{transition-delay:.09s;}
.reveal[data-d="2"]{transition-delay:.18s;}
.reveal[data-d="3"]{transition-delay:.27s;}
.reveal[data-d="4"]{transition-delay:.36s;}
.reveal[data-d="5"]{transition-delay:.45s;}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}}
body[data-motion="off"] .reveal{opacity:1;transform:none;transition:none;}
body[data-motion="off"] .hero h1 .line span{transform:none;animation:none;}


/* résultats mesurés : progression avant / après */
.prog{display:grid;gap:18px;max-width:940px;}
.prog__row{border-radius:18px;padding:22px 26px;background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);}
.prog__t{font-family:var(--display);font-weight:700;font-size:clamp(15px,1.3vw,18px);line-height:1.25;
  margin-bottom:15px;display:flex;justify-content:space-between;gap:18px;align-items:baseline;}
.prog__gain{flex:none;font-family:var(--hand);font-size:22px;color:var(--gold);}
.prog__bars{display:grid;gap:9px;}
.prog__bar{display:flex;align-items:center;gap:12px;font-size:12px;}
.prog__bar b{flex:none;width:56px;font-weight:600;color:var(--faint);text-transform:uppercase;letter-spacing:.06em;font-size:11px;}
.prog__track{flex:1;height:11px;border-radius:99px;background:rgba(255,255,255,.07);overflow:hidden;}
.prog__fill{height:100%;border-radius:99px;transform-origin:left center;transform:scaleX(0);transition:transform 1.1s var(--ease) .1s;}
.reveal.in .prog__fill{transform:scaleX(var(--v,0));}
.prog__fill--b{background:rgba(203,178,204,.32);}
.prog__fill--a{background:linear-gradient(90deg,var(--gold-2),var(--gold));}
.prog__val{flex:none;width:38px;text-align:right;font-weight:800;font-family:var(--display);color:var(--text);font-size:14px;}
.scores{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.scores span{display:inline-flex;align-items:baseline;gap:7px;border:1px solid var(--glass-bd);background:var(--glass);
  border-radius:999px;padding:9px 17px;font-size:14px;color:var(--dim);backdrop-filter:blur(8px);}
.scores span b{font-family:var(--display);font-weight:800;font-size:16px;color:var(--gold);}
.srcnote{font-size:13px;color:var(--faint);margin-top:20px;max-width:60em;}

/* badge satisfaction (données API Insuffle Académie) */
.satisf{display:inline-flex;align-items:center;gap:22px;margin-top:24px;padding:18px 28px;border-radius:20px;
  background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);}
.satisf__stars{color:var(--gold);font-size:18px;letter-spacing:3px;line-height:1;margin-bottom:6px;}
.satisf__note{font-family:var(--display);font-weight:800;font-size:clamp(30px,3.6vw,44px);line-height:1;}
.satisf__lbl{font-size:15px;color:var(--text);font-weight:700;line-height:1.35;}
.satisf__lbl span{display:block;font-weight:500;font-size:13px;color:var(--faint);}
@media (max-width:480px){.satisf{gap:16px;padding:16px 20px;}}

/* live sessions (données API) */
.sessions{display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(26px,3vw,48px);align-items:center;border-radius:24px;padding:clamp(26px,3vw,44px);background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(10px);}
.sessions__meta{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 18px;}
.sessions__list{display:grid;gap:12px;}
.sess{display:flex;align-items:center;gap:14px;border-radius:14px;padding:16px 18px;background:rgba(22,3,20,.4);border:1px solid var(--glass-bd);}
.sess__city{font-size:12px;color:var(--faint);font-weight:600;text-transform:uppercase;letter-spacing:.08em;}
.sess__date{font-family:var(--display);font-weight:800;font-size:18px;color:var(--text);}
.sess__place{font-family:var(--hand);font-size:18px;color:var(--gold);white-space:nowrap;margin-left:auto;}
@media (max-width:760px){.sessions{grid-template-columns:1fr;}}

/* bande call-to-action (redirection Insuffle Académie) */
.cta-band{max-width:880px;margin:0 auto;text-align:center;border-radius:28px;padding:clamp(40px,6vw,72px) clamp(24px,4vw,56px);background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(12px);box-shadow:0 40px 90px -40px rgba(0,0,0,.8);}
.cta-band .eyebrow{margin-bottom:14px;}
.cta-band h2{margin-bottom:18px;}
.cta-band .lead{max-width:48ch;margin:0 auto 28px;}
.cta-band .btn{font-size:19px;padding:18px 36px;}
.cta-band__alt{display:inline-block;margin-top:18px;font-family:var(--hand);font-size:21px;color:var(--gold);}

@media (max-width:900px){
  .hero h1 .draw, h2 .draw{white-space:normal;}
  .hero h1 .draw svg, h2 .draw svg{display:none;}
}
.toc{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px;margin:30px 0 0;}
.toc a{display:block;border-radius:14px;padding:16px 20px;background:var(--glass);
  border:1px solid var(--glass-bd);backdrop-filter:blur(8px);transition:.25s var(--ease);}
.toc a:hover{border-color:var(--magenta);transform:translateY(-3px);}
.toc a b{display:block;font-family:var(--display);font-weight:700;font-size:16px;color:var(--text);margin-bottom:3px;}
.toc a span{font-size:13.5px;color:var(--dim);line-height:1.45;}
.etapes{display:grid;gap:14px;max-width:920px;}
.etape{display:flex;gap:18px;align-items:flex-start;border-radius:16px;padding:18px 22px;
  background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);}
.etape b{flex:none;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  font-family:var(--display);font-weight:800;font-size:15px;color:var(--plum);
  background:linear-gradient(135deg,var(--gold),var(--gold-2));}
.etape span{font-size:16px;color:var(--dim);line-height:1.5;}
.etape span i{display:block;font-style:normal;font-family:var(--display);font-weight:700;font-size:16px;color:var(--text);margin-bottom:3px;}
.tbl{width:100%;border-collapse:collapse;font-size:15.5px;margin:8px 0 0;}
.tbl th,.tbl td{text-align:left;padding:13px 16px;border-bottom:1px solid var(--glass-bd);vertical-align:top;}
.tbl th{font-family:var(--display);font-weight:700;color:var(--gold);font-size:14px;}
.tbl td{color:var(--dim);} .tbl td strong{color:var(--text);}
.tblwrap{overflow-x:auto;border-radius:16px;background:var(--glass);border:1px solid var(--glass-bd);padding:6px 4px;}
.scores{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;}
.scores span{display:inline-flex;align-items:baseline;gap:7px;border:1px solid var(--glass-bd);
  background:var(--glass);border-radius:999px;padding:9px 17px;font-size:14px;color:var(--dim);backdrop-filter:blur(8px);}
.scores span b{font-family:var(--display);font-weight:800;font-size:16px;color:var(--gold);}
.srcnote{font-size:13px;color:var(--faint);margin-top:20px;max-width:64em;}
.suite{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:14px;margin-top:20px;}
.suite a{display:block;border-radius:16px;padding:20px 22px;background:var(--glass);
  border:1px solid var(--glass-bd);backdrop-filter:blur(8px);transition:.25s var(--ease);}
.suite a:hover{border-color:var(--magenta);transform:translateY(-3px);}
.suite a b{display:block;font-family:var(--display);font-weight:700;font-size:16.5px;color:var(--gold);margin-bottom:5px;}
.suite a span{font-size:14px;color:var(--dim);line-height:1.5;}
.satisf{display:inline-flex;align-items:center;gap:22px;margin-top:24px;padding:18px 28px;border-radius:20px;
  background:var(--glass);border:1px solid var(--glass-bd);backdrop-filter:blur(8px);}
.satisf__stars{color:var(--gold);font-size:18px;letter-spacing:3px;line-height:1;margin-bottom:6px;}
.satisf__note{font-family:var(--display);font-weight:800;font-size:clamp(30px,3.6vw,44px);line-height:1;}
.satisf__lbl{font-size:15px;color:var(--text);font-weight:700;line-height:1.35;}
.satisf__lbl span{display:block;font-weight:500;font-size:13px;color:var(--faint);}

/* ---- Accessibilite ---- */
/* Lien d'evitement : premier element focusable, permet de sauter la navigation. */
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--gold);color:var(--plum);
  padding:12px 20px;border-radius:0 0 12px 0;font-family:var(--display);font-weight:700;}
.skip:focus{left:0;}
/* Focus visible au clavier, sans polluer la souris. */
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px;border-radius:6px;}
/* Cibles tactiles : 44px minimum (recommandation WCAG 2.5.5). */
.nav__links a,.footer a,.crumb a{min-height:44px;display:inline-flex;align-items:center;}
@media (prefers-reduced-motion:reduce){
  .aurora span,.marq__t,.kwrib__t{animation:none!important;}
  .reveal{opacity:1!important;transform:none!important;transition:none!important;}
}
/* ---- Fil d'ariane visible (double le BreadcrumbList du JSON-LD) ---- */
.crumb{font-size:14px;color:var(--faint);margin-bottom:18px;display:flex;flex-wrap:wrap;gap:8px;align-items:center;}
.crumb a{color:var(--dim);text-decoration:none;}
.crumb a:hover{color:var(--gold);}
.crumb span{color:var(--faint);}
/* ---- Sommaire ancre dans la page ---- */
.anchors{display:flex;flex-wrap:wrap;gap:9px;margin:26px 0 0;}
.anchors a{font-size:14px;color:var(--dim);border:1px solid var(--glass-bd);background:var(--glass);
  border-radius:999px;padding:9px 16px;min-height:44px;display:inline-flex;align-items:center;transition:.2s var(--ease);}
.anchors a:hover{border-color:var(--magenta);color:var(--text);}
.meta-lecture{font-size:13px;color:var(--faint);margin-top:14px;}
/* Barre de sommaire : dans la grille, et collee au hero plutot qu'isolee. */
.ancres{padding:6px 0 0;}
.ancres .anchors{margin:0;}
html{scroll-padding-top:100px;}
/* Le logo ne participe pas au retrecissement flex de la nav : sans cela, une barre
   chargee (6 liens + un CTA long) le comprimait a quelques pixels de large. */
.nav__logo{flex:0 0 auto;}
.nav__logo-img{flex:0 0 auto;width:auto;max-width:none;object-fit:contain;}

/* Filet : le contenu ne depend jamais d'une animation. */
.reveal{opacity:1;transform:none;}
.js .reveal{opacity:0;transform:translateY(34px);}
.js .reveal.in{opacity:1;transform:none;}

/* ---------- alias de palette ----------
   Les composants de contenu ont ete ecrits avec --soft / --ink / --muted / --acc /
   --serif / --soft2. Le gabarit herite expose --glass / --text / --dim / --magenta /
   --display. On mappe les uns sur les autres ici, une fois, pour les deux chartes. */
:root{
  --soft:  var(--glass);
  --soft2: rgba(255,212,102,.07);
  --ink:   var(--text);
  --muted: var(--dim);
  --acc:   var(--magenta);
  --serif: var(--display);
}

/* ---------- univers Insuffle : maillage inter-sites ---------- */
.reseau{padding:0 0 clamp(60px,8vw,110px);}
.reseau__maisons{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:34px;}
.maison{display:block;text-decoration:none;padding:30px 32px;border-radius:22px;
  border:1px solid var(--line);background:var(--soft);transition:.35s cubic-bezier(.16,1,.3,1);}
.maison:hover{transform:translateY(-4px);border-color:var(--gold);background:var(--soft2);}
.maison b{display:block;font-family:var(--serif);font-size:clamp(21px,2.2vw,27px);
  color:var(--ink);margin-bottom:8px;letter-spacing:-.01em;}
.maison i{font-style:normal;display:inline-block;font-size:11px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--gold);margin-bottom:12px;}
.maison span{display:block;color:var(--muted);font-size:15px;line-height:1.62;}
.maison em{font-style:normal;display:inline-flex;align-items:center;gap:7px;margin-top:14px;
  color:var(--gold);font-size:14.5px;font-weight:650;}
.reseau__grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.rsite{display:block;text-decoration:none;padding:20px 22px;border-radius:16px;
  border:1px solid var(--line);transition:.3s cubic-bezier(.16,1,.3,1);min-height:44px;}
.rsite:hover{border-color:var(--acc);background:var(--soft);transform:translateY(-3px);}
.rsite[aria-current]{border-color:var(--gold);background:var(--soft2);}
.rsite b{display:block;color:var(--ink);font-weight:650;font-size:16px;margin-bottom:5px;}
.rsite span{display:block;color:var(--muted);font-size:13.5px;line-height:1.55;}
.rsite u{text-decoration:none;display:block;font-size:12px;letter-spacing:.08em;
  color:var(--dim);margin-top:9px;}
@media(max-width:900px){.reseau__maisons{grid-template-columns:1fr;}
  .reseau__grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.reseau__grid{grid-template-columns:1fr;}}

/* ---------- hero : deux colonnes, faits reels, appels a l'action ----------
   Objectif : que le visiteur sache en un ecran ce qu'est la formation, combien
   de temps elle dure, ce qu'elle vaut et ou cliquer. L'ancien hero faisait
   826 px de haut et poussait tout le contenu sous la ligne de flottaison. */
.hero{min-height:auto;padding:132px 0 24px;}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(28px,4vw,64px);
  align-items:center;}
.hero__col{min-width:0;}
.hero__eyebrow{margin-bottom:10px;}
.hero h1{margin:0;}
.hero .lead{max-width:34em;margin-top:20px;}

/* faits : uniquement des donnees verifiees (duree, format, satisfaction, tarif) */
.hfacts{display:flex;flex-wrap:wrap;gap:10px;margin-top:26px;list-style:none;padding:0;}
.hfacts li{display:flex;flex-direction:column;gap:2px;padding:12px 18px;border-radius:14px;
  border:1px solid var(--line);background:var(--soft);backdrop-filter:blur(6px);min-width:0;}
.hfacts b{font-family:var(--display);font-weight:800;font-size:clamp(17px,1.7vw,21px);
  color:var(--gold);line-height:1.1;letter-spacing:-.01em;white-space:nowrap;}
.hfacts span{font-size:12px;color:var(--dim);letter-spacing:.03em;white-space:nowrap;}

.hcta{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px;}
.hcta .btn{min-height:48px;}
.hnote{margin-top:14px;font-size:13.5px;color:var(--faint);}
.hnote a{color:var(--dim);}
.hnote a:hover{color:var(--gold);}

.hero__visual{max-width:none;margin:0;}
.hero__card{border-radius:24px;overflow:hidden;position:relative;}
.hero__card img{width:100%;height:auto;display:block;aspect-ratio:4/3;object-fit:cover;background:#fff;}
.hero__card::after{content:"";position:absolute;inset:0;pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);border-radius:24px;}

@media (max-width:960px){
  .hero{padding:118px 0 16px;}
  .hero__grid{grid-template-columns:1fr;gap:26px;}
  .hero__visual{order:2;}
  .hfacts li{flex:1 1 auto;}
}
@media (max-width:560px){
  .hfacts{gap:8px;}
  .hfacts li{padding:10px 14px;}
  .hcta .btn{flex:1 1 100%;justify-content:center;}
}

/* ---------- animations d'entree, echelonnees ----------
   Neutralisees sous prefers-reduced-motion (regle plus bas). */
@keyframes hmontee{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}
@keyframes hfondu{from{opacity:0;}to{opacity:1;}}
@keyframes hzoom{from{opacity:0;transform:scale(.965);}to{opacity:1;transform:none;}}
.js .hero__anim{opacity:0;animation:hmontee .74s cubic-bezier(.16,1,.3,1) forwards;
  animation-delay:calc(var(--i,0) * 90ms);}
.js .hero__visual{opacity:0;animation:hzoom .9s cubic-bezier(.16,1,.3,1) .22s forwards;}
.js .hfacts li{opacity:0;animation:hmontee .6s cubic-bezier(.16,1,.3,1) forwards;
  animation-delay:calc(340ms + var(--i,0) * 70ms);}
/* Le soulignement dessine du titre part apres l'entree du titre. */
.hero .draw svg path{animation-delay:.5s;}

@media (prefers-reduced-motion:reduce){
  .js .hero__anim,.js .hero__visual,.js .hfacts li{animation:none!important;opacity:1!important;transform:none!important;}
}

/* ---------- alias de palette ----------
   Les composants de contenu ont ete ecrits avec --soft / --ink / --muted / --acc /
   --serif / --soft2. Le gabarit herite expose --glass / --text / --dim / --magenta /
   --display. On mappe les uns sur les autres ici, une fois, pour les deux chartes. */
:root{
  --soft:  var(--glass);
  --soft2: rgba(255,212,102,.07);
  --ink:   var(--text);
  --muted: var(--dim);
  --acc:   var(--magenta);
  --serif: var(--display);
}

/* ---------- composants de contenu ----------
   Prefixe volontaire (.pmod, pas .mod) : le moteur d'animation herite du site
   sketchnote interroge deja .mod / .mod__head / .mod__body pour son accordeon.
   Reutiliser ce nom faisait planter tout le moteur sur la page programme. */
.pmods{display:grid;gap:14px;}
.pmod{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start;
  padding:26px 30px;border:1px solid var(--line);border-radius:20px;background:var(--soft);
  transition:.35s cubic-bezier(.16,1,.3,1);}
.pmod:hover{border-color:var(--gold);transform:translateX(4px);}
.pmod__n{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold);
  white-space:nowrap;padding-top:6px;font-weight:700;}
.pmod__b h3{font-family:var(--serif);font-size:clamp(19px,2vw,24px);color:var(--ink);
  margin:0 0 9px;letter-spacing:-.01em;line-height:1.25;}
.pmod__d{display:inline-block;font-family:var(--sans);font-size:12px;letter-spacing:.08em;
  color:var(--faint);font-weight:600;margin-left:8px;vertical-align:middle;}
.pmod__b p{color:var(--muted);font-size:15.5px;line-height:1.68;margin:0;}
@media(max-width:640px){.pmod{grid-template-columns:1fr;gap:10px;padding:22px 24px;}
  .pmod__n{padding-top:0;}}

.avis-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.avis{margin:0;padding:26px 28px;border:1px solid var(--line);border-radius:20px;
  background:var(--soft);display:flex;flex-direction:column;gap:14px;
  transition:.35s cubic-bezier(.16,1,.3,1);}
.avis:hover{border-color:var(--gold);transform:translateY(-4px);}
.avis__stars{color:var(--gold);letter-spacing:.14em;font-size:15px;line-height:1;}
.avis blockquote{margin:0;color:var(--ink);font-size:16px;line-height:1.66;flex:1;}
.avis blockquote::before{content:"“";}
.avis blockquote::after{content:"”";}
.avis figcaption{color:var(--faint);font-size:13px;letter-spacing:.06em;}
@media(max-width:900px){.avis-grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.avis-grid{grid-template-columns:1fr;}}

.faq{display:grid;gap:10px;}
.faq details{border:1px solid var(--line);border-radius:16px;background:var(--soft);
  overflow:hidden;transition:.3s;}
.faq details[open]{border-color:var(--gold);background:var(--soft2);}
.faq summary{cursor:pointer;list-style:none;padding:20px 26px;min-height:44px;
  font-weight:640;color:var(--ink);font-size:16.5px;line-height:1.45;
  display:flex;align-items:center;justify-content:space-between;gap:18px;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";color:var(--gold);font-size:22px;line-height:1;
  flex:0 0 auto;transition:transform .3s;}
.faq details[open] summary::after{transform:rotate(45deg);}
.faq summary:hover{color:var(--gold);}
.faq__a{padding:0 26px 22px;color:var(--muted);font-size:15.5px;line-height:1.72;}
.faq__a p{margin:0;}

.btn--ghost{background:transparent;border:1px solid var(--line);color:var(--ink);}
.btn--ghost:hover{border-color:var(--gold);color:var(--gold);background:var(--soft);}
.cta-band{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
/* ---------- sessions live et repartition des notes ---------- */
.sess__droite{display:flex;align-items:center;gap:14px;flex-shrink:0;}
.sess__lien{font-size:13.5px;color:var(--gold);border:1px solid var(--line);border-radius:999px;
  padding:8px 16px;min-height:40px;display:inline-flex;align-items:center;transition:.25s var(--ease);}
.sess__lien:hover{background:var(--gold);color:var(--plum);border-color:var(--gold);}
.sess--urgence{border-color:rgba(220,38,38,.5);}
.sess--urgence .sess__place{color:#ff9a9a;font-weight:650;}
@media(max-width:600px){.sess{flex-direction:column;align-items:flex-start;gap:12px;}
  .sess__droite{width:100%;justify-content:space-between;}}

.jauges{display:grid;gap:8px;max-width:420px;}
.jauge{display:grid;grid-template-columns:44px 1fr 28px;align-items:center;gap:12px;}
.jauge__n{font-size:13px;color:var(--gold);white-space:nowrap;}
.jauge__b{height:9px;border-radius:99px;background:var(--glass);border:1px solid var(--line);overflow:hidden;}
.jauge__b i{display:block;height:100%;background:linear-gradient(90deg,var(--magenta),var(--gold));
  border-radius:99px;transform-origin:left;animation:jaugeIn .9s cubic-bezier(.16,1,.3,1) both;}
.jauge__v{font-size:13px;color:var(--dim);text-align:right;}
@keyframes jaugeIn{from{transform:scaleX(0);}to{transform:scaleX(1);}}

/* ---------- figures chiffrees en SVG ---------- */
.figs{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;}
.fig{padding:26px 28px;border:1px solid var(--line);border-radius:20px;background:var(--soft);
  display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;}
.fig svg{width:100%;max-width:180px;height:auto;overflow:visible;}
.fig h3{font-family:var(--display);font-size:16px;color:var(--ink);margin:0;}
.fig p{margin:0;font-size:14px;color:var(--muted);line-height:1.6;}
.fig__src{font-size:12px;color:var(--dim);}
.fig__src a{color:var(--faint);text-decoration:underline;text-underline-offset:2px;}
.fig__src a:hover{color:var(--gold);}
.arc{fill:none;stroke-linecap:round;}
.arc--fond{stroke:var(--glass-bd);}
.arc--val{stroke:var(--gold);stroke-dasharray:var(--dash);stroke-dashoffset:var(--dash);
  animation:arcIn 1.4s cubic-bezier(.16,1,.3,1) .2s forwards;}
@keyframes arcIn{to{stroke-dashoffset:var(--reste);}}
.fig__val{font-family:var(--display);font-weight:800;fill:var(--gold);text-anchor:middle;}
.fig__sub{fill:var(--dim);text-anchor:middle;font-size:11px;}
.barres{display:flex;align-items:flex-end;gap:10px;height:110px;width:100%;justify-content:center;}
.barre{width:34px;border-radius:8px 8px 3px 3px;background:linear-gradient(180deg,var(--gold),var(--magenta));
  transform-origin:bottom;animation:barreIn .9s cubic-bezier(.16,1,.3,1) both;position:relative;}
.barre span{position:absolute;bottom:-22px;left:0;right:0;text-align:center;font-size:12px;color:var(--dim);}
@keyframes barreIn{from{transform:scaleY(0);}to{transform:scaleY(1);}}

/* ---------- references externes ---------- */
.refs-liste{display:grid;gap:12px;}
.refs-liste a{display:block;padding:20px 24px;border:1px solid var(--line);border-radius:16px;
  background:var(--soft);text-decoration:none;transition:.3s var(--ease);}
.refs-liste a:hover{border-color:var(--gold);transform:translateY(-3px);}
.refs-liste b{display:block;color:var(--ink);font-weight:640;font-size:16px;margin-bottom:5px;}
.refs-liste span{display:block;color:var(--muted);font-size:14.5px;line-height:1.6;}
.refs-liste u{text-decoration:none;display:block;font-size:11.5px;color:var(--faint);margin-top:8px;}
@media (prefers-reduced-motion:reduce){
  .jauge__b i,.arc--val,.barre{animation:none!important;transform:none!important;stroke-dashoffset:var(--reste)!important;}
}

/* Les intertitres du corps sont des h2 (hierarchie correcte) mais gardent
   l'echelle typographique d'un sous-titre. */
.prose h2.sub{font-family:var(--display);font-weight:700;letter-spacing:-.01em;
  color:var(--text);font-size:clamp(20px,1.9vw,27px);margin:36px 0 12px;line-height:1.25;}
.prose h2.sub:first-child{margin-top:0;}
/* Titre de l'encadre lateral : h2 pour la hierarchie, echelle d'un h3 a l'oeil. */
.brief__t{font-family:var(--display);font-weight:700;font-size:15px;letter-spacing:.02em;
  color:var(--gold);margin:0 0 14px;text-transform:uppercase;}
.pitems{margin:0;padding-left:20px;color:var(--muted);font-size:15.5px;line-height:1.7;}
.pitems li{margin-bottom:5px;}
.pitems li::marker{color:var(--gold);}
@media(max-width:560px){
  .hfacts{display:grid;grid-template-columns:1fr 1fr;}
  .hfacts li{min-width:0;}
  .hfacts b,.hfacts span{white-space:normal;}
}


.objs{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.obj{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:start;padding:22px 26px;
  border:1px solid var(--line);border-radius:18px;background:var(--soft);transition:.35s cubic-bezier(.16,1,.3,1);}
.obj:hover{border-color:var(--gold);transform:translateY(-3px);}
.obj__n{font-family:var(--serif);font-size:26px;line-height:1;color:var(--gold);opacity:.8;}
.obj p{margin:0;color:var(--muted);font-size:15.5px;line-height:1.62;}
@media(max-width:760px){.objs{grid-template-columns:1fr;}}

.refs{color:var(--muted);font-size:16.5px;line-height:1.9;text-align:center;
  max-width:900px;margin:0 auto;padding:30px 34px;border:1px solid var(--line);
  border-radius:22px;background:var(--soft);}

.sess{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 26px;
  border:1px solid var(--line);border-radius:16px;background:var(--soft);margin-bottom:10px;}
.sess__city{font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);}
.sess__date{color:var(--ink);font-weight:640;font-size:16.5px;margin-top:3px;}
.sess__place{font-size:13.5px;color:var(--muted);white-space:nowrap;}

h1{font-size:clamp(26px,4.3vw,56px);}