:root{--card:#fff;--line:color-mix(in srgb,var(--ink) 12%,transparent);interpolate-size:allow-keywords}
:root[data-mode=dark]{--paper:#0d1411;--ink:#e8f0ec;--card:#17221d;color-scheme:dark}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:400 1.05rem/1.6 var(--f),system-ui,sans-serif;color:var(--ink);background:var(--paper)}body.lock{overflow:hidden}
a{color:inherit;text-decoration:none}button{font:inherit;border:0;background:none;color:inherit;cursor:pointer}:focus-visible{outline:3px solid var(--b);outline-offset:3px}
.wrap{width:min(1180px,100% - 3rem);margin:auto}
header{position:fixed;inset:0 0 auto;z-index:20;color:#fff;transition:background .4s}header.sc{background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px)}
.bar{display:flex;align-items:center;gap:2rem;height:84px}.logo{font-weight:800;font-size:1.4rem;letter-spacing:-.03em;display:flex;gap:.6rem;align-items:center;transition:translate .3s}.lg{height:var(--lh);width:auto;color:var(--b)}.logo em{font-style:normal;font-size:1.1rem;animation:wb 3s ease-in-out infinite}
@keyframes wb{50%{rotate:-12deg;translate:0 -3px}}
nav{display:flex;gap:1.2rem;margin-left:auto;align-items:center}.tabs{position:relative;display:flex;isolation:isolate}.tabs .t{padding:.55rem 1.05rem;border-radius:99px;transition:color .2s}.tabs .t.on{color:var(--b)}.mk{position:absolute;left:0;top:0;height:100%;border-radius:99px;background:rgba(255,255,255,.14);z-index:-1;opacity:0;transition:transform .45s cubic-bezier(.3,1.5,.5,1),width .45s cubic-bezier(.3,1.5,.5,1),opacity .2s}
.btn{display:inline-block;padding:.85rem 1.7rem;border-radius:99px;font-weight:600;transition:transform .35s cubic-bezier(.3,1.7,.5,1),translate .25s}.btn:hover{transform:scale(1.07) rotate(-2deg)}.p{background:var(--a);color:#fff}.g{background:#e9e7ee;color:#111}
#bg{display:none;width:44px;height:44px;margin-left:auto;place-content:center;gap:6px}#bg i{display:block;width:26px;height:2.5px;background:#fff;border-radius:2px}
#menu{position:fixed;inset:0;z-index:30;background:var(--card);color:var(--ink);display:flex;flex-direction:column;visibility:hidden;clip-path:circle(0 at calc(100% - 42px) 42px);transition:clip-path .7s cubic-bezier(.7,0,.2,1),visibility 0s .7s}
#menu.open{visibility:visible;clip-path:circle(150% at calc(100% - 42px) 42px);transition:clip-path .7s cubic-bezier(.7,0,.2,1)}
.mh{background:var(--bg);color:#fff;height:84px;padding:0 1.5rem;display:flex;align-items:center;justify-content:space-between}.mh button{font-size:1.6rem}
.ml{padding:1.3rem 1.5rem;font-size:1.2rem;border-bottom:1px solid var(--line);opacity:0;translate:-30px;transition:.5s}#menu.open .ml{opacity:1;translate:0}.ml:nth-of-type(2){transition-delay:.25s}.ml:nth-of-type(3){transition-delay:.32s}.ml:nth-of-type(4){transition-delay:.39s}.ml:nth-of-type(5){transition-delay:.46s}.ml:nth-of-type(n+6){transition-delay:.5s}.mb{margin-top:auto;padding:1.5rem;display:grid;text-align:center}
.hero{position:relative;min-height:100svh;display:grid;align-items:center;color:#fff;overflow:hidden;padding:7rem 0 4rem;background:radial-gradient(120% 90% at 15% 10%,color-mix(in srgb,var(--bg) 65%,#3f9a70),var(--bg) 62%)}.hero.mini{min-height:50svh;padding:8rem 0 3rem}
.fx{position:absolute;inset:0;width:100%;height:100%}.hero-in{position:relative;display:grid;grid-template-columns:1.25fr .75fr;gap:3rem;align-items:center}.mini .hero-in{grid-template-columns:1fr}
h1{font-size:clamp(2.7rem,8vw,6.6rem);line-height:.93;font-weight:800;letter-spacing:-.04em;text-transform:uppercase}.mini h1{font-size:clamp(2.4rem,7vw,5.5rem)}
.ln{display:block}.l1{color:var(--b)}.w{display:inline-block;white-space:nowrap}h1 i{display:inline-block;font-style:normal;transition:translate .55s cubic-bezier(.2,1.6,.4,1)}
.sub{max-width:34em;margin:1.8rem 0;font-size:1.2rem;opacity:.9}.cta{display:flex;gap:1rem;align-items:center;flex-wrap:wrap}
.gw{position:relative}.blob{position:absolute;inset:-12% -8% auto auto;width:70%;aspect-ratio:1;background:var(--a);opacity:.55;filter:blur(30px);animation:mo 9s ease-in-out infinite alternate}
@keyframes mo{0%{border-radius:60% 40% 30% 70%/60% 30% 70% 40%}50%{border-radius:30% 60% 70% 40%/50% 60% 30% 60%;translate:-20px 30px}100%{border-radius:50% 50% 40% 60%/30% 70% 60% 70%;translate:15px -15px}}
.glass{position:relative;padding:1.8rem;border-radius:30px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(16px);transition:transform .25s}.glass b{display:block;font-size:5rem;line-height:1;letter-spacing:-.05em}.glass svg{width:100%;margin-top:1rem}
.sp{fill:none;stroke:var(--b);stroke-width:3;stroke-linecap:round;stroke-dasharray:420;stroke-dashoffset:420;animation:dr 2.6s 1.2s forwards}@keyframes dr{to{stroke-dashoffset:0}}
.sec{padding:4.5rem 0}.sec.hd{padding-bottom:0}h2{font-size:clamp(2rem,5vw,4rem);line-height:1;letter-spacing:-.035em;font-weight:800;max-width:16ch;margin-bottom:2rem}h3{font-size:1.5rem;line-height:1.1;letter-spacing:-.02em}
.ab p{font-size:clamp(1.2rem,2.4vw,1.8rem);max-width:32em;line-height:1.38;margin-bottom:1rem}
.cards{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}.card{position:relative;overflow:hidden;padding:2rem;min-height:260px;display:flex;flex-direction:column;justify-content:flex-end;gap:.5rem;transition:transform .25s}.ic{font-size:2.8rem;margin-bottom:auto}
.card::after,.lk::after{content:"";position:absolute;inset:0;background:radial-gradient(circle 190px at var(--x,50%) var(--y,50%),rgba(255,255,255,.28),transparent);opacity:0;transition:opacity .3s;pointer-events:none}.card:hover::after,.lk:hover::after{opacity:1}
.card:nth-child(4n+1){grid-column:span 3;background:var(--bg);color:#fff;border-radius:40px 8px 40px 8px}.card:nth-child(4n+2){grid-column:span 3;background:var(--b);color:#10231e;border-radius:8px 40px 8px 40px}
.card:nth-child(4n+3){grid-column:span 2;background:var(--card);border:2px solid var(--ink);border-radius:40px}.card:nth-child(4n){grid-column:span 4;background:var(--a);color:#fff;border-radius:8px 40px 8px 40px}
.wig{animation:wg .8s}@keyframes wg{20%{rotate:-3deg;scale:1.03}45%{rotate:2.5deg}70%{rotate:-1deg}}
.inst{display:grid;gap:.8rem}.ir{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.5rem 1.8rem;background:var(--card);border-radius:24px;border:1px solid color-mix(in srgb,var(--ink) 12%,transparent);transition:translate .35s cubic-bezier(.3,1.6,.5,1),background .3s,color .3s}.ir:hover{translate:12px 0;background:var(--bg);color:#fff}.ir p{opacity:.7}
.pill{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .9rem;border-radius:99px;font-size:.9rem;font-weight:600;white-space:nowrap;background:color-mix(in srgb,currentColor 10%,transparent)}.pill i{width:9px;height:9px;border-radius:50%;background:#2ecc71;animation:pu 1.6s infinite}.pill.mt i{background:#f5a623}.pill.off i{background:#e5484d;animation:none}@keyframes pu{50%{box-shadow:0 0 0 7px transparent;scale:1.2}0%{box-shadow:0 0 0 0 #2ecc7188}}
.lks{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:1rem}.lk{position:relative;overflow:hidden;padding:2rem;border-radius:8px 36px 8px 36px;background:var(--card);border:2px solid var(--ink);min-height:200px;display:flex;flex-direction:column;gap:.5rem;transition:transform .25s,background .3s,color .3s}.lk:hover{background:var(--a);color:#fff}.lk strong{font-size:1.8rem;letter-spacing:-.03em;line-height:1}.lk span{margin-top:auto;font-size:2rem;transition:translate .3s}.lk:hover span{translate:6px -6px}
.stats{background:var(--bg);color:#fff;padding:5rem 0}.sg{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:2rem}.sg b{display:block;font-size:clamp(3.5rem,9vw,7rem);line-height:1;letter-spacing:-.05em;color:var(--b)}
.im img{width:100%;border-radius:8px 48px 8px 48px;display:block}.im figcaption{margin-top:.6rem;opacity:.65;font-size:.95rem}
blockquote{font-size:clamp(1.6rem,4vw,3rem);line-height:1.15;letter-spacing:-.03em;font-weight:700;max-width:22em;padding-left:1.5rem;border-left:6px solid var(--a)}cite{display:block;font-size:1rem;font-weight:400;font-style:normal;opacity:.65;margin-top:1rem}
.bt .wrap{text-align:center}
.mq{overflow:hidden;background:var(--a);color:#fff;padding:1.1rem 0;rotate:-1.2deg;margin:-1rem -2rem;position:relative;z-index:2}.mt{display:flex;width:max-content;font-size:clamp(1.6rem,4vw,3rem);font-weight:800;letter-spacing:-.03em;text-transform:uppercase;white-space:nowrap}.mt span{padding-right:0}
footer{background:var(--bg);color:#fff;margin-top:4rem;padding-top:3.5rem;overflow:hidden}
.fbig{font-weight:800;line-height:.85;height:.62em;overflow:hidden;white-space:nowrap;text-align:center;text-transform:uppercase;letter-spacing:-.04em;color:transparent;-webkit-text-stroke:2px color-mix(in srgb,var(--b) 40%,transparent);background:radial-gradient(circle 240px at var(--mx,50%) var(--my,50%),var(--a),transparent 70%);-webkit-background-clip:text;background-clip:text}
.frow{display:flex;gap:1.5rem;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:1.8rem 0 2rem}.frow span{opacity:.6}.frow nav{margin:0;gap:1.4rem}.frow nav a{opacity:.8}.frow nav a:hover{opacity:1;color:var(--b)}#up{width:46px;height:46px;border-radius:50%;background:var(--a);font-size:1.3rem;transition:translate .3s cubic-bezier(.3,1.7,.5,1)}#up:hover{translate:0 -6px}
#th{position:fixed;inset:0;width:100%;height:100%;z-index:5;pointer-events:none}
#cu{position:fixed;left:0;top:0;width:10px;height:10px;margin:-5px 0 0 -5px;border-radius:50%;background:var(--a);box-shadow:0 0 0 1.5px rgba(255,255,255,.85);pointer-events:none;z-index:90;opacity:0;transition:opacity .2s,width .2s,height .2s,margin .2s,background .2s;will-change:transform}#cu.on{opacity:.9}#cu.big{width:28px;height:28px;margin:-14px 0 0 -14px;background:transparent;box-shadow:0 0 0 2px var(--a)}#cu.dn{opacity:.5}#cu.txt{opacity:0!important}@media(pointer:coarse){#cu{display:none}}
.cur{position:fixed;inset:0;z-index:100;display:flex;pointer-events:none}.cur i{flex:1;background:var(--a);transform:scaleY(0);transform-origin:bottom;transition:transform .55s cubic-bezier(.7,0,.2,1)}.cur i:nth-child(even){background:var(--bg)}.go .cur{pointer-events:all}.go .cur i{transform:scaleY(1)}.pt .cur i{transform:scaleY(1);transform-origin:top;transition:none}
#ck{position:fixed;left:1rem;bottom:1rem;z-index:60;display:flex;gap:1rem;align-items:center;max-width:min(460px,calc(100% - 2rem));padding:1rem 1.3rem 1rem 1rem;border-radius:32px 8px 32px 8px;background:var(--bg);color:#fff;box-shadow:0 20px 50px rgba(0,0,0,.35);transform:translateY(160%) rotate(-5deg);transition:transform .8s cubic-bezier(.2,1.5,.4,1)}#ck.show{transform:none}#ck.roll{animation:rl 1.1s forwards cubic-bezier(.5,0,1,1)}@keyframes rl{to{transform:translateX(120vw) rotate(900deg)}}
#cookie{width:88px;flex:none;animation:cw 3.2s ease-in-out infinite}@keyframes cw{50%{rotate:10deg;translate:0 -4px}}.bite{fill:#000;r:0;transition:r .35s cubic-bezier(.3,1.8,.5,1)}.bite.on{r:22}
#ck h3{font-size:1.2rem}#ck p{font-size:.95rem;opacity:.85;margin:.3rem 0 .8rem}.ckb{display:flex;gap:.5rem}.ckb .btn{padding:.55rem 1.1rem;font-size:.95rem}
.cr{position:fixed;width:var(--s);height:var(--s);background:#d9a05b;border-radius:50%;z-index:70;pointer-events:none;animation:fl 1.1s forwards}@keyframes fl{to{transform:translate(var(--dx),170px);opacity:0}}
#ckr{position:fixed;left:1rem;bottom:1rem;z-index:59;width:46px;height:46px;border-radius:50%;background:var(--bg);font-size:1.4rem;transition:scale .3s cubic-bezier(.3,1.7,.5,1)}#ckr:hover{scale:1.15}
@media(max-width:1360px){header nav{display:none}#bg{display:grid}}
@media(max-width:860px){.hero-in{grid-template-columns:1fr}.card:nth-child(n){grid-column:span 6}.sec{padding:3.2rem 0}.ir{flex-direction:column;align-items:flex-start}.frow{justify-content:center;text-align:center}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.sp{stroke-dashoffset:0}}

/* ═════════════ NOUVEAUTÉS ═════════════ */
.skip{position:fixed;left:1rem;top:-5rem;z-index:200;background:var(--a);color:#fff;padding:.7rem 1.2rem;border-radius:99px;font-weight:700;transition:top .2s}.skip:focus{top:1rem}
.wrap.narrow{width:min(860px,100% - 3rem)}
/* barre de progression de lecture */
#pg{position:fixed;left:0;top:0;height:4px;width:100%;z-index:50;background:linear-gradient(90deg,var(--a),var(--b));transform:scaleX(0);transform-origin:left;pointer-events:none}
/* boutons ronds du header */
.ib{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.14);color:#fff;transition:background .25s,transform .35s cubic-bezier(.3,1.7,.5,1)}.ib:hover{background:rgba(255,255,255,.28);transform:scale(1.1) rotate(-8deg)}
#md .moon{display:none}:root[data-mode=dark] #md .sun{display:none}:root[data-mode=dark] #md .moon{display:block}
#menu .mb{gap:.7rem}#menu .mb .btn{width:100%}
.draft{position:fixed;left:50%;bottom:1rem;translate:-50% 0;z-index:80;background:#ffd23f;color:#251a00;padding:.6rem 1.2rem;border-radius:99px;font-weight:700;font-size:.9rem;box-shadow:0 10px 30px rgba(0,0,0,.3)}
/* indice de scroll dans le hero */
.scrl{position:absolute;left:50%;bottom:1.6rem;translate:-50% 0;width:28px;height:46px;border:2px solid rgba(255,255,255,.55);border-radius:99px;display:grid;justify-items:center;padding-top:8px;opacity:.85}.scrl i{width:4px;height:9px;border-radius:4px;background:#fff;animation:sd 1.8s ease-in-out infinite}@keyframes sd{0%{translate:0 0;opacity:1}70%{translate:0 14px;opacity:0}100%{opacity:0}}
@media(max-width:860px){.scrl{display:none}}
/* écran d'arrivée */
#ld{position:fixed;inset:0;z-index:300;display:none;place-items:center;background:var(--bg);color:#fff;clip-path:circle(150% at 50% 50%);animation:ldx 1.5s 1.15s cubic-bezier(.7,0,.2,1) forwards}
.ld #ld{display:grid}.ldi{display:grid;justify-items:center;gap:1.1rem;text-align:center;padding:1rem}.ldi b{font-size:clamp(1.6rem,6vw,3.4rem);letter-spacing:-.04em;text-transform:uppercase;line-height:1;animation:ldu .8s .1s backwards cubic-bezier(.2,1.4,.4,1)}
.bellx{font-size:3.6rem;display:block;transform-origin:50% 0;animation:ring .9s ease-in-out 2}@keyframes ring{20%{rotate:22deg}40%{rotate:-20deg}60%{rotate:14deg}80%{rotate:-8deg}}
.ldb{display:block;width:min(260px,60vw);height:5px;border-radius:5px;background:rgba(255,255,255,.2);overflow:hidden}.ldb::after{content:"";display:block;height:100%;background:linear-gradient(90deg,var(--a),var(--b));transform-origin:left;animation:ldb 1.1s cubic-bezier(.6,0,.2,1) forwards}
@keyframes ldb{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes ldu{from{translate:0 30px;opacity:0}}
@keyframes ldx{to{clip-path:circle(0 at 50% 50%);visibility:hidden}}
/* palette de recherche Ctrl+K */
#pal{border:0;padding:0;background:none;color:var(--ink);width:min(640px,calc(100% - 2rem));margin:12vh auto auto;overflow:visible}#pal::backdrop{background:rgba(6,14,11,.62);backdrop-filter:blur(6px)}
#pal[open] .pbox{animation:pin .35s cubic-bezier(.2,1.4,.4,1)}@keyframes pin{from{opacity:0;transform:translateY(-20px) scale(.96)}}
.pbox{background:var(--card);border:2px solid var(--ink);border-radius:8px 32px 8px 32px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45)}
.pin{display:flex;align-items:center;gap:.8rem;padding:1rem 1.3rem;border-bottom:1px solid var(--line)}.pin input{flex:1;border:0;outline:0;background:none;font:inherit;font-size:1.15rem;color:inherit;min-width:0}
kbd{font:600 .75rem/1 var(--f),system-ui;border:1px solid var(--line);border-bottom-width:2px;border-radius:6px;padding:.25rem .45rem;margin:0 .15rem;background:color-mix(in srgb,var(--ink) 6%,transparent)}
#pl{list-style:none;padding:.5rem;max-height:min(50vh,420px);overflow:auto;margin:0}
#pl li a,#pl li button{display:flex;align-items:center;gap:.9rem;width:100%;text-align:left;padding:.7rem .9rem;border-radius:14px;color:inherit}
#pl li[aria-selected=true] a,#pl li[aria-selected=true] button{background:var(--a);color:#fff}
#pl .k{font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:.25rem .55rem;border-radius:99px;background:color-mix(in srgb,currentColor 14%,transparent);white-space:nowrap}
#pl .t{flex:1;min-width:0}#pl .t b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#pl .t small{opacity:.65;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#pl .none{padding:1.4rem;text-align:center;opacity:.6}
.pft{display:flex;gap:1.2rem;padding:.7rem 1.3rem;border-top:1px solid var(--line);font-size:.8rem;opacity:.7}
@media(max-width:560px){.pft{display:none}}
/* toast */
#toast{position:fixed;left:50%;bottom:1.4rem;z-index:150;translate:-50% 160%;background:var(--ink);color:var(--paper);padding:.8rem 1.4rem;border-radius:99px;font-weight:600;transition:translate .5s cubic-bezier(.2,1.5,.4,1);pointer-events:none;max-width:calc(100% - 2rem);text-align:center}#toast.on{translate:-50% 0}
/* FAQ */
.faq{display:grid;gap:.8rem}.fq{background:var(--card);border:2px solid var(--ink);border-radius:8px 28px 8px 28px;overflow:hidden;transition:background .3s,color .3s}.fq[open]{background:var(--bg);color:#fff}
.fq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1.2rem 1.5rem;font-weight:700;font-size:1.15rem;letter-spacing:-.01em}.fq summary::-webkit-details-marker{display:none}
.fq summary i{flex:none;width:34px;height:34px;border-radius:50%;background:var(--a);position:relative;transition:rotate .4s cubic-bezier(.3,1.6,.5,1)}.fq summary i::before,.fq summary i::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2.5px;background:#fff;border-radius:2px;translate:-50% -50%}.fq summary i::after{rotate:90deg}.fq[open] summary i{rotate:135deg}
.fq div{padding:0 1.5rem 1.3rem;opacity:.9}.fq::details-content{block-size:0;overflow:clip;transition:block-size .4s,content-visibility .4s allow-discrete}.fq[open]::details-content{block-size:auto}
/* Équipe */
.team{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:1rem}.tm{position:relative;background:var(--card);border:2px solid var(--ink);border-radius:8px 36px 8px 36px;padding:1.6rem;display:grid;gap:.35rem;transition:transform .25s}.tm:nth-child(even){border-radius:36px 8px 36px 8px}
.tm .av{width:84px;height:84px;border-radius:50%;background:var(--a);display:grid;place-items:center;font-size:2.4rem;font-weight:800;color:#fff;overflow:hidden;margin-bottom:.6rem;box-shadow:0 0 0 5px var(--card),0 0 0 7px var(--b)}.tm:nth-child(3n+2) .av{background:var(--bg)}.tm:nth-child(3n) .av{background:var(--b);color:#10231e}.tm .av img{width:100%;height:100%;object-fit:cover}
.tm b{color:var(--a);font-size:.95rem;text-transform:uppercase;letter-spacing:.06em}.tm p{opacity:.75;font-size:.98rem}
/* Chronologie */
.tls{list-style:none;padding:0;position:relative;--p:0;margin-left:.5rem}.tls::before,.tls::after{content:"";position:absolute;left:11px;top:6px;bottom:6px;width:4px;border-radius:4px;background:var(--line)}.tls::after{background:linear-gradient(var(--a),var(--b));transform-origin:top;transform:scaleY(var(--p))}
.tl{position:relative;display:grid;grid-template-columns:minmax(80px,140px) 1fr;gap:1.5rem;padding:0 0 2.6rem 3rem}.tl:last-child{padding-bottom:0}.tl::before{content:"";position:absolute;left:3px;top:5px;width:20px;height:20px;border-radius:50%;background:var(--paper);border:4px solid var(--a);z-index:1;transition:background .3s,scale .4s cubic-bezier(.3,1.8,.5,1)}.tl.in::before{background:var(--a);scale:1.15}
.tl time{font-weight:800;font-size:clamp(1.4rem,3vw,2.2rem);letter-spacing:-.04em;color:var(--a);line-height:1}.tl p{opacity:.75;margin-top:.3rem;max-width:34em}
@media(max-width:620px){.tl{grid-template-columns:1fr;gap:.3rem}}
/* Galerie + lightbox */
.gal{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));grid-auto-rows:210px;grid-auto-flow:dense;gap:.8rem}.gi{position:relative;overflow:hidden;border-radius:8px 28px 8px 28px;background:var(--line)}.gi:nth-child(5n+1){grid-row:span 2}.gi:nth-child(7n+3){grid-column:span 2}.gi:nth-child(even){border-radius:28px 8px 28px 8px}
.gi img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.gi:hover img{transform:scale(1.08)}.gi::after{content:attr(data-cap);position:absolute;inset:auto 0 0;padding:2.2rem 1rem .8rem;color:#fff;font-weight:600;background:linear-gradient(transparent,rgba(0,0,0,.7));opacity:0;translate:0 12px;transition:.35s}.gi:hover::after{opacity:1;translate:0}
#lb{border:0;background:none;color:#fff;width:100%;max-width:none;height:100%;max-height:none;padding:0;overflow:hidden}#lb::backdrop{background:rgba(5,10,8,.92)}.lbi{position:fixed;inset:0;display:grid;place-items:center;padding:3.5rem 1rem 4.5rem}.lbi img{max-width:100%;max-height:100%;border-radius:12px;box-shadow:0 20px 80px rgba(0,0,0,.6);animation:lbz .45s cubic-bezier(.2,1.3,.4,1)}@keyframes lbz{from{scale:.85;opacity:0}}
.lbc{position:fixed;inset:auto 0 1.2rem;text-align:center;font-weight:600}.lbb{position:fixed;top:50%;translate:0 -50%;width:50px;height:50px;border-radius:50%;background:rgba(255,255,255,.16);font-size:1.4rem}.lbb:hover{background:var(--a)}.lbp{left:1rem}.lbn{right:1rem}.lbx{position:fixed;top:1rem;right:1rem;width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.16);font-size:1.3rem}
/* Compte à rebours */
.cd{background:var(--bg);color:#fff;border-radius:8px 56px 8px 56px;padding:clamp(1.6rem,4vw,3rem);position:relative;overflow:hidden}.cd::before{content:"";position:absolute;right:-60px;top:-80px;width:280px;aspect-ratio:1;background:var(--a);opacity:.5;filter:blur(40px);border-radius:50%;animation:mo 9s ease-in-out infinite alternate}
.cd small{position:relative;font-size:1.05rem;text-transform:uppercase;letter-spacing:.12em;opacity:.8;font-weight:700}.cdg{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(.5rem,2vw,1.5rem);margin-top:1rem}
.cdg div{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:20px;padding:1rem .4rem;text-align:center;backdrop-filter:blur(8px)}.cdg b{display:block;font-size:clamp(2.2rem,8vw,5.5rem);line-height:1;letter-spacing:-.05em;color:var(--b);font-variant-numeric:tabular-nums}.cdg span{font-size:.9rem;opacity:.75}.cdg b.tick{animation:tk .4s}@keyframes tk{from{translate:0 -10px;opacity:.2}}
.cde{position:relative;font-size:clamp(1.6rem,4vw,3rem);font-weight:800;margin-top:1rem;letter-spacing:-.03em}
/* Cloche / emploi du temps */
.bl{display:grid;grid-template-columns:1.1fr .9fr;gap:1rem;align-items:stretch}.bln{background:var(--a);color:#fff;border-radius:8px 48px 8px 48px;padding:clamp(1.5rem,3vw,2.4rem);display:flex;flex-direction:column;gap:.7rem;justify-content:center;position:relative;overflow:hidden}
.bln small{text-transform:uppercase;letter-spacing:.12em;font-weight:700;opacity:.8}.bnow{font-size:clamp(2rem,5vw,3.8rem);line-height:1;letter-spacing:-.04em;font-weight:800}.bbar{height:10px;border-radius:10px;background:rgba(255,255,255,.28);overflow:hidden}.bbar i{display:block;height:100%;width:100%;background:#fff;border-radius:10px;transform-origin:left;transform:scaleX(0);transition:transform 1s linear}
.bcd2 strong{font-variant-numeric:tabular-nums;font-size:1.3em}.rbell{display:none;position:absolute;right:1.4rem;top:1rem;width:2.6rem;transform-origin:50% 0}.rbell svg{width:100%;height:auto}.bln.ring .rbell{display:block;animation:ring .9s ease-in-out 3}
.blr{list-style:none;padding:0;display:grid;gap:.45rem;align-content:start}.blr li{display:flex;gap:1rem;align-items:center;padding:.65rem 1.1rem;border-radius:16px;background:var(--card);border:1px solid var(--line);transition:.3s}.blr time{font-weight:800;font-variant-numeric:tabular-nums;min-width:3.3em;color:var(--a)}.blr li.past{opacity:.4}.blr li.on{background:var(--bg);color:#fff;border-color:var(--bg);translate:10px 0;font-weight:700}.blr li.on time{color:var(--b)}
@media(max-width:760px){.bl{grid-template-columns:1fr}}
/* Générateur de carte d'élève */
.idg{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(1.5rem,4vw,4rem);align-items:center}.idi p{font-size:1.15rem;opacity:.8;max-width:30em;margin-bottom:1.2rem}.idf{display:grid;gap:1rem}.idf label{display:grid;gap:.35rem;font-weight:700;font-size:.9rem}.idf small{font-weight:400;opacity:.65}
.idf input,.idf select,.fm input,.fm select,.fm textarea{font:inherit;font-weight:500;color:inherit;background:var(--card);border:2px solid var(--ink);border-radius:14px;padding:.8rem 1rem;width:100%;transition:box-shadow .2s,border-color .2s}.idf input:focus,.idf select:focus,.fm input:focus,.fm select:focus,.fm textarea:focus{outline:0;border-color:var(--a);box-shadow:0 0 0 4px color-mix(in srgb,var(--a) 28%,transparent)}
.idf input[type=file]{padding:.6rem}.idf .btn{justify-self:start}
.idw{perspective:1100px}.idt{position:relative;border-radius:34px;transition:transform .2s;transform-style:preserve-3d;box-shadow:0 30px 60px -20px rgba(0,0,0,.45);aspect-ratio:1012/640}.idt canvas{width:100%;height:100%;display:block;border-radius:34px}
.holo{position:absolute;inset:0;border-radius:34px;pointer-events:none;mix-blend-mode:color-dodge;opacity:.55;background:radial-gradient(circle at var(--hx,50%) var(--hy,30%),rgba(255,255,255,.9),transparent 38%),linear-gradient(115deg,transparent 20%,rgba(255,60,200,.55) 35%,rgba(60,255,220,.55) 50%,rgba(255,230,60,.55) 65%,transparent 80%);background-size:100% 100%,260% 260%;background-position:0 0,var(--hp,50%) 50%;transition:opacity .3s}
@media(max-width:860px){.idg{grid-template-columns:1fr}}
/* Formulaire */
.fm{display:grid;gap:1.1rem;background:var(--card);border:2px solid var(--ink);border-radius:8px 44px 8px 44px;padding:clamp(1.4rem,4vw,2.6rem)}.ff{display:grid;gap:.4rem;font-weight:700}.ff span em{color:var(--a);font-style:normal}.ff textarea{resize:vertical;min-height:120px}
.fck{display:flex;gap:.8rem;align-items:flex-start;font-weight:600;cursor:pointer}.fck input{width:22px;height:22px;flex:none;accent-color:var(--a);margin-top:.15rem;padding:0}
.fm .btn{justify-self:start;font-size:1.05rem}.fm.busy .btn{opacity:.6;pointer-events:none}.fmsg{min-height:1.5em;font-weight:700}.fmsg.err{color:#e5484d}.fmsg.ok{color:#1f9d55}
.fm.done{text-align:center;padding-block:3rem}.fm.done .fmsg{font-size:1.6rem;color:var(--a)}
.hp{position:absolute!important;left:-9999px;width:1px;height:1px;overflow:hidden}
.ff input:invalid:not(:placeholder-shown):not(:focus){border-color:#e5484d}
/* Statut live des instances */
.pill.chk i{background:#9aa;animation:pu 1s infinite}.pill small{opacity:.65;font-weight:500}
/* Mini-jeu */
.gm{background:var(--bg);border-radius:8px 44px 8px 44px;padding:1rem;color:#fff;text-align:center}.gm canvas{width:100%;height:auto;aspect-ratio:2/1;border-radius:8px 32px 8px 32px;background:#dff3ea;display:block;touch-action:manipulation;cursor:pointer}.gm p{padding:.9rem 0 .2rem;opacity:.8;font-size:.95rem}
/* confettis (mode récré) */
.cf{position:fixed;top:-20px;width:10px;height:14px;z-index:400;pointer-events:none;animation:cff linear forwards}@keyframes cff{to{transform:translate(var(--dx),110vh) rotate(var(--r))}}
:root[data-mode=dark] .g{background:#2a3730;color:#fff}:root[data-mode=dark] .hero{--x:0}
@media(prefers-reduced-motion:reduce){#ld{display:none!important}}
@keyframes hue{to{filter:hue-rotate(360deg)}}html.recre{animation:hue 6s linear infinite}

.tabs .t,.logo span{white-space:nowrap}.tabs .t{padding:.55rem .85rem}header nav{gap:.6rem}.bar{gap:1.2rem}.frow nav{flex-wrap:wrap;justify-content:center}

/* Icônes maison */
.ico{width:1.2em;height:1.2em;vertical-align:-.2em;flex:none}.ic{display:block;color:inherit}.ic .ico{width:2.9rem;height:2.9rem}.card:nth-child(4n+2) .ic{color:var(--bg)}
.tm .av .ico{width:46px;height:46px}.logo em{display:grid;font-style:normal;animation:wb 3s ease-in-out infinite;color:var(--b)}.logo em .ico{width:1.45rem;height:1.45rem}
.bellx{display:block;transform-origin:50% 0;animation:ring .9s ease-in-out 2}.bellx .ico{width:4rem;height:4rem;color:var(--b)}
#ckr .ico{width:26px;height:26px;color:#d9a05b}#menu .mb .btn .ico{margin-right:.3rem}
.ib .ico{width:18px;height:18px}
/* Cadrage mobile : rien ne doit dépasser de l'écran (le bandeau incliné élargissait la page) */
html,body{overflow-x:clip;max-width:100%}main,footer{overflow-x:clip}
@media(max-width:860px){.logo{font-size:1.1rem}.bar{height:72px}.hero{padding-top:6rem}.hero-in{gap:2rem}.sub{font-size:1.08rem}.card{min-height:200px;padding:1.5rem}.wrap{width:min(1180px,100% - 2rem)}.wrap.narrow{width:min(860px,100% - 2rem)}.mq{margin:-.5rem -2rem}.tls{margin-left:0}.cd{border-radius:8px 36px 8px 36px}.glass b{font-size:4rem}#ck{left:.6rem;right:.6rem;bottom:.6rem;max-width:none;padding:.8rem}#cookie{width:64px}}
#toast{opacity:0;visibility:hidden;transition:translate .5s cubic-bezier(.2,1.5,.4,1),opacity .3s,visibility 0s .5s}#toast.on{opacity:1;visibility:visible;transition:translate .5s cubic-bezier(.2,1.5,.4,1),opacity .3s}
body.lock #ckr,body.lock #ck{display:none}

/* ═════════════ FINITIONS ═════════════ */
::selection{background:var(--a);color:#fff}
html{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--a) 70%,transparent) transparent}
::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--a) 65%,transparent);border-radius:10px;border:2px solid var(--paper)}::-webkit-scrollbar-track{background:transparent}
body{background:var(--paper) radial-gradient(60rem 40rem at 105% 8%,color-mix(in srgb,var(--a) 9%,transparent),transparent 70%) no-repeat,radial-gradient(50rem 36rem at -10% 55%,color-mix(in srgb,var(--b) 14%,transparent),transparent 70%) no-repeat;background-attachment:scroll}
:focus-visible{outline:3px solid var(--a);outline-offset:3px;border-radius:8px}
header.sc{box-shadow:0 10px 40px -18px rgba(0,0,0,.55);border-bottom:1px solid rgba(255,255,255,.08)}
.sec h2::after{content:"";display:block;width:52px;height:6px;border-radius:6px;margin-top:1rem;background:linear-gradient(90deg,var(--a),var(--b))}
.ab h2::after,.hd h2::after{margin-top:1.1rem}
.btn{box-shadow:0 1px 0 rgba(255,255,255,.25) inset}.btn.p{background:linear-gradient(135deg,var(--a),color-mix(in srgb,var(--a) 72%,#000));box-shadow:0 10px 26px -10px var(--a),0 1px 0 rgba(255,255,255,.3) inset}.btn:active{transform:scale(.97)}
.card,.lk,.tm,.ir,.fq{box-shadow:0 1px 0 rgba(255,255,255,.04) inset}
.card:hover,.lk:hover,.tm:hover{box-shadow:0 26px 50px -26px rgba(0,0,0,.5)}
.ir:hover{box-shadow:0 18px 40px -24px rgba(0,0,0,.6)}
footer{border-top:4px solid transparent;border-image:linear-gradient(90deg,var(--a),var(--b)) 1}
.cd,.bln,.gm{box-shadow:0 30px 60px -34px rgba(0,0,0,.55)}
.glass{box-shadow:0 30px 60px -30px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.35) inset}
#ck{border:1px solid rgba(255,255,255,.12)}

/* Formulaire : plus doux, plus lisible */
.fm{position:relative;gap:1.3rem;box-shadow:0 40px 70px -46px rgba(0,0,0,.55);overflow:hidden}
.fm::before{content:"";position:absolute;left:0;right:0;top:0;height:6px;background:linear-gradient(90deg,var(--a),var(--b))}
.ff>span{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;opacity:.85}
.fm input:not([type=checkbox]),.fm select,.fm textarea{background:color-mix(in srgb,var(--ink) 4%,var(--card));border:2px solid color-mix(in srgb,var(--ink) 16%,transparent);border-radius:16px;padding:.95rem 1.1rem;font-size:1.02rem}
.fm input::placeholder,.fm textarea::placeholder{opacity:.45}
.fm input:not([type=checkbox]):hover,.fm select:hover,.fm textarea:hover{border-color:color-mix(in srgb,var(--a) 55%,transparent)}
.fm select{appearance:none;-webkit-appearance:none;padding-right:2.8rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238b4dff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-size:18px}
.fck{padding:.9rem 1rem;border-radius:16px;background:color-mix(in srgb,var(--ink) 4%,var(--card));border:2px solid transparent;transition:border-color .2s}.fck:hover{border-color:color-mix(in srgb,var(--a) 45%,transparent)}
.fck input{appearance:none;-webkit-appearance:none;width:24px;height:24px;border-radius:8px;border:2px solid color-mix(in srgb,var(--ink) 35%,transparent);background:var(--card);display:grid;place-content:center;transition:.2s;cursor:pointer;margin-top:.05rem;padding:0}
.fck input::after{content:"";width:12px;height:7px;border-left:3px solid #fff;border-bottom:3px solid #fff;rotate:-45deg;translate:0 -1px;scale:0;transition:scale .25s cubic-bezier(.3,1.8,.5,1)}
.fck input:checked{background:var(--a);border-color:var(--a)}.fck input:checked::after{scale:1}
.fm .btn{position:relative;min-width:12rem;justify-self:start;font-size:1.05rem;padding:1rem 2rem}
.fm.busy .btn span{opacity:0}.fm.busy .btn::after{content:"";position:absolute;left:50%;top:50%;width:22px;height:22px;margin:-11px;border:3px solid rgba(255,255,255,.35);border-top-color:#fff;border-radius:50%;animation:spn .7s linear infinite}@keyframes spn{to{rotate:360deg}}
.fmsg:empty{display:none}.fmsg.err{background:color-mix(in srgb,#e5484d 12%,transparent);padding:.7rem 1rem;border-radius:12px}
.fm.shake{animation:shk .45s}@keyframes shk{20%{translate:-8px 0}40%{translate:7px 0}60%{translate:-5px 0}80%{translate:3px 0}}
.ts{display:flex;min-height:65px;align-items:center}
.okc{width:84px;height:84px;margin:0 auto .5rem;display:block}.okc circle{fill:color-mix(in srgb,var(--a) 14%,transparent);stroke:var(--a);stroke-width:3;stroke-dasharray:150;stroke-dashoffset:150;animation:dr2 .7s forwards}.okc path{fill:none;stroke:var(--a);stroke-width:4.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:40;stroke-dashoffset:40;animation:dr2 .5s .55s forwards}@keyframes dr2{to{stroke-dashoffset:0}}

/* ── Avis, articles, logos, maquettes (inspiration Goodstack) ── */
.avs{background:color-mix(in srgb,var(--ink) 5%,var(--paper))}.avh{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-bottom:2rem}.avh h2{margin:0}.avh h2::after{display:none}
.avn{display:flex;gap:.6rem}.avn button{width:56px;height:56px;border-radius:50%;background:color-mix(in srgb,var(--a) 14%,var(--card));font-size:1.4rem;transition:transform .25s,background .25s}.avn button:hover{transform:scale(1.08);background:var(--a);color:#fff}
.avt{display:flex;gap:1rem;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding-bottom:.5rem}.avt::-webkit-scrollbar{display:none}
.av2{flex:0 0 min(520px,86%);scroll-snap-align:start;background:var(--card);border-radius:32px;padding:2rem;display:flex;flex-direction:column;justify-content:space-between;gap:1.6rem}
.av2 blockquote{font-size:1.3rem;line-height:1.5;opacity:.82;padding:0;border:0;background:none}.av2 figcaption{display:flex;gap:1rem;align-items:center}.av2 small{display:block;opacity:.65}
.avp{width:60px;height:60px;border-radius:50%;background:var(--a);color:#fff;display:grid;place-items:center;font-weight:800;overflow:hidden}.avp img{width:100%;height:100%;object-fit:cover}.avp .ico{width:30px;height:30px}
.ars{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:2rem}.ar{display:flex;flex-direction:column;gap:1rem}.arm{aspect-ratio:16/10;border-radius:32px;overflow:hidden;background:var(--bg)}.arm img{width:100%;height:100%;object-fit:cover}
.ph{display:grid;place-content:center;justify-items:center;gap:.6rem;height:100%;color:#fff;background:radial-gradient(90% 90% at 20% 10%,var(--a),var(--bg))}.ph .ico{width:2.6rem;height:2.6rem;color:var(--b)}.ph b{font-size:1.3rem}
.ar h3{font-size:clamp(1.6rem,4vw,2.2rem);line-height:1.05}.arb em{display:inline-flex;gap:.5rem;align-items:center;font-style:normal;padding:.5rem 1.1rem;border-radius:99px;background:color-mix(in srgb,var(--a) 14%,var(--card));color:var(--a);font-weight:600}
.arc{display:flex;gap:1.6rem;opacity:.65}.arf{display:flex;justify-content:space-between;align-items:center;border-top:2px solid var(--line);padding-top:1rem}.arf i,.vtl i{font-style:normal;display:grid;place-items:center;width:56px;height:38px;border-radius:99px;background:var(--a);color:#fff;transition:transform .3s}.ar:hover .arf i,.vtl:hover i{transform:translateX(6px)}
.lgs{padding:2.5rem 0}.lgt{text-align:center;opacity:.65;margin-bottom:1.4rem}.lgr{display:flex;flex-wrap:wrap;justify-content:center;gap:1rem 2.4rem}.lgo{display:flex;align-items:center;gap:.7rem;opacity:.75;font-size:1.25rem;transition:opacity .25s}.lgo:hover{opacity:1}.lgo span{width:42px;height:42px;border-radius:12px;background:var(--a);color:#fff;display:grid;place-items:center}.lgo .ico{width:24px;height:24px}
.vt{border-radius:36px;padding:clamp(1.2rem,4vw,2.4rem);background:linear-gradient(160deg,var(--bg),color-mix(in srgb,var(--bg) 55%,#000));color:#fff;display:grid;gap:1rem;overflow:hidden}.vt-discord{background:linear-gradient(135deg,#5865f2,#8b4dff 55%,#ff3da5)}.vt-pronote{background:linear-gradient(160deg,#0f3b5f,#1d7fa8)}.vt-mac{background:linear-gradient(160deg,#2a1357,#5b2bb5)}
.vt h2{margin:1rem 0 0;max-width:20ch}.vt h2::after{display:none}.vt p{max-width:36em;opacity:.9}.vtl{display:inline-flex;gap:.8rem;align-items:center;font-weight:600}
.vtm{display:grid;place-items:center;padding:clamp(.5rem,3vw,2rem) 0}.mkw{width:min(720px,100%);border-radius:16px;background:rgba(20,22,30,.78);border:1px solid rgba(255,255,255,.22);backdrop-filter:blur(14px);box-shadow:0 30px 60px -30px #000;overflow:hidden;font-size:.82rem;color:#fff;animation:fl 7s ease-in-out infinite alternate}@keyframes fl{to{translate:0 -8px}}
.mkb{display:flex;gap:7px;padding:.7rem .9rem;background:rgba(255,255,255,.07)}.mkb i{width:11px;height:11px;border-radius:50%;background:#ff5f57}.mkb i:nth-child(2){background:#febc2e}.mkb i:nth-child(3){background:#28c840}
.mk-dc{display:grid;grid-template-columns:54px 150px 1fr;min-height:300px}.dcs{background:rgba(0,0,0,.35);display:grid;align-content:start;gap:.6rem;padding:.8rem}.dcs b{width:34px;height:34px;border-radius:50%;background:#5865f2}.dcs b:nth-child(2){background:#3ba55d}.dcs b:nth-child(3){background:#faa81a}.dcs b:nth-child(4){background:#ed4245}
.dcc{background:rgba(255,255,255,.05);padding:.8rem;display:grid;align-content:start;gap:.2rem}.dcc small{padding:.35rem .5rem;border-radius:6px;opacity:.75}.dcc .on{background:rgba(255,255,255,.14);opacity:1}.dcm{padding:1rem;display:grid;align-content:start;gap:.9rem}
.mg{display:flex;gap:.7rem}.mg i{flex:none;width:34px;height:34px;border-radius:50%;background:#5865f2}.mg .a2{background:#3ba55d}.mg .a3{background:#faa81a}.mg p{display:grid}.mg b{color:#c9d1ff}.mg span{opacity:.85}.emb{border-left:4px solid #8b4dff;background:rgba(255,255,255,.08);border-radius:6px;padding:.6rem .8rem;display:grid}
.mcb{display:grid;grid-template-columns:160px 1fr;min-height:280px}.mcs{background:rgba(255,255,255,.05);padding:1rem;display:grid;align-content:start;gap:.3rem}.mcs span{padding:.45rem .6rem;border-radius:8px;opacity:.75}.mcs .on{background:rgba(255,255,255,.14);opacity:1}
.mcm{padding:1rem;display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;align-content:start}.kp{background:rgba(255,255,255,.08);border-radius:12px;padding:.8rem}.kp b{display:block;font-size:1.5rem}.kp small{opacity:.7}.gr{grid-column:1/-1;height:120px;display:flex;align-items:end;gap:.6rem;background:rgba(255,255,255,.06);border-radius:12px;padding:.8rem}.gr i{flex:1;background:linear-gradient(var(--b),var(--a));border-radius:6px 6px 0 0}
.mk-pr{background:#f4f7fa;color:#17324a}.mk-pr .mkb{background:#dfe7ee}.prh{display:flex;justify-content:space-between;padding:.8rem 1rem;background:#1d7fa8;color:#fff}.prg{display:grid;grid-template-columns:repeat(5,1fr);gap:.4rem;padding:1rem;min-height:230px;align-content:start}.prg span{font-weight:700;text-align:center}.prg i{font-style:normal;border-radius:8px;padding:.5rem;background:#cfe9f5;grid-row:2}.prg .c2{background:#d8f2d4}.prg .c3{background:#fde7c3}.prg .c4{background:#e6d9fa;grid-row:3}.prg .c5{background:#fbd5dc;grid-row:3}.prg small{opacity:.7}
.pnb{display:grid;grid-template-columns:1.2fr 1fr;min-height:260px}.pl,.pc{padding:1rem;display:grid;align-content:start;gap:.5rem}.pl span{padding:.5rem .7rem;border-radius:8px;background:rgba(255,255,255,.07)}.pl .ok::before,.pl .mt::before{content:"●";margin-right:.5rem;color:#3ddc84}.pl .mt::before{color:#faa81a}.pbar{height:12px;border-radius:9px;background:rgba(255,255,255,.1)}.pbar i{display:block;height:100%;border-radius:9px;background:linear-gradient(90deg,var(--a),var(--b))}
@media(max-width:700px){.mk-dc{grid-template-columns:44px 1fr}.dcc{display:none}.mcb{grid-template-columns:1fr}.mcs{display:none}.pnb{grid-template-columns:1fr}.avn button{width:48px;height:48px}}
@media(prefers-reduced-motion:reduce){.mkw{animation:none}}
/* ── Globe hero ── */
.globe-w{position:relative;width:min(440px,92%);aspect-ratio:1;margin:auto}.globe{width:100%;height:100%;filter:drop-shadow(0 30px 50px rgba(0,0,0,.45));animation:fl 8s ease-in-out infinite alternate}.gcont{animation:rot 46s linear infinite}@keyframes rot{to{transform:translateX(-200px)}}
.chip{position:absolute;z-index:2;display:flex;gap:.6rem;align-items:center;padding:.5rem 1rem .5rem .5rem;border-radius:18px;background:rgba(255,255,255,.94);color:#10231e;box-shadow:0 18px 40px -16px rgba(0,0,0,.6);animation:fl 6s ease-in-out infinite alternate}.chip>i{flex:none;width:38px;height:38px;border-radius:11px;display:grid;place-items:center;color:#fff;font-style:normal;font-weight:800;font-size:1.1rem}.chip .ico{width:22px;height:22px}.chip b{display:block;line-height:1.1;font-size:1rem}.chip small{display:block;opacity:.6;font-size:.72rem;white-space:nowrap}
.c1{top:6%;right:-6%}.c2{top:36%;left:-10%;animation-delay:-2s}.c3{bottom:26%;right:-8%;animation-delay:-3.5s}.c5{bottom:4%;left:4%;animation-delay:-1s}.c4{top:-2%;left:6%;animation-delay:-4s}.c4>i{background:var(--a)}
@media(max-width:860px){.globe-w{width:min(340px,80%)}.c1{right:-4%}.c2{left:-4%}.c3{right:-4%}.chip b{font-size:.9rem}}
/* ── Menu : bouton rond + animation ── */
#bg{width:52px;height:52px;border-radius:50%;background:#fff;box-shadow:0 10px 26px -10px rgba(0,0,0,.5);gap:5px;transition:transform .35s cubic-bezier(.3,1.6,.5,1)}#bg:active{transform:scale(.92)}#bg i{width:22px;height:2.5px;background:#10231e;transition:transform .45s cubic-bezier(.7,0,.2,1),opacity .25s,width .3s}
#bg[aria-expanded=true] i:nth-child(1){transform:translateY(7.5px) rotate(45deg)}#bg[aria-expanded=true] i:nth-child(2){opacity:0;width:0}#bg[aria-expanded=true] i:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
#menu{z-index:15;background:var(--bg);color:#fff;padding-top:100px;clip-path:circle(0 at calc(100% - 50px) 48px)}#menu.open{clip-path:circle(150% at calc(100% - 50px) 48px)}#menu .mh{display:none}
#menu .ml{font-size:clamp(1.9rem,8vw,2.8rem);font-weight:800;letter-spacing:-.035em;padding:1rem 1.5rem;border-bottom:1px solid rgba(255,255,255,.14);transition:.55s cubic-bezier(.2,.8,.2,1)}#menu .ml:hover{color:var(--b);padding-left:2rem}
/* ── Pied de page façon leak.fun ── */
.fcol{display:grid;justify-items:center;text-align:center;gap:1.4rem;padding:1rem 0 2rem}.flogo{font-size:2.2rem;font-weight:800;letter-spacing:-.04em}.fcp{opacity:.65}
.soc{display:flex;gap:1.6rem}.soc a{opacity:.65;transition:opacity .2s,transform .3s}.soc a:hover{opacity:1;transform:translateY(-3px)}.soc .ico{width:24px;height:24px}
.fctl{display:flex;gap:1rem;flex-wrap:wrap;justify-content:center}.seg,.lang{display:flex;align-items:center;border:1px solid rgba(255,255,255,.2);border-radius:99px;padding:5px;background:rgba(255,255,255,.04)}
.seg button{width:44px;height:40px;border-radius:99px;display:grid;place-items:center;opacity:.6;transition:background .3s,color .3s,opacity .3s}.seg button.on{background:#fff;color:#10231e;opacity:1}
.lang{gap:.5rem;padding:5px 14px;position:relative}.lang select{appearance:none;background:none;border:0;color:#fff;font:inherit;font-weight:600;padding:.55rem 1.2rem .55rem 0;cursor:pointer}.lang select option{color:#111}.lang::after{content:"▾";position:absolute;right:12px;opacity:.7;pointer-events:none}
.fls{display:grid;gap:2.2rem;margin-top:1rem;width:100%}.fls h4{font-size:1.05rem;margin-bottom:.9rem}.fls a{display:block;padding:.55rem;opacity:.65;transition:opacity .2s}.fls a:hover{opacity:1}
@media(min-width:760px){.fls{grid-template-columns:repeat(3,1fr)}}
footer #up{position:absolute;right:1rem;top:1rem}footer{position:relative}
@media(prefers-reduced-motion:reduce){.globe,.gcont,.chip{animation:none}}
/* ── En-tête épuré : pilule flottante (logo + bouton rond) ── */
.logo em{display:none}
@media(max-width:1360px){
header{inset:max(10px,env(safe-area-inset-top)) 10px auto;border-radius:99px;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px -16px rgba(0,0,0,.6)}
header.sc{border-radius:99px;border:1px solid rgba(255,255,255,.14);background:color-mix(in srgb,var(--bg) 88%,transparent)}
header .bar{width:100%;margin:0;height:64px;padding:0 8px 0 20px;gap:.8rem}
.logo{font-size:1.05rem;min-width:0}.logo span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.lg{height:30px}
#bg{width:48px;height:48px;flex:none}
#menu{padding-top:112px;clip-path:circle(0 at calc(100% - 42px) 42px)}#menu.open{clip-path:circle(150% at calc(100% - 42px) 42px)}}
/* ── Sélecteur de langue avec drapeaux ── */
.lgx{position:relative}.lgb{display:flex;align-items:center;gap:.6rem;height:52px;padding:0 16px;border:1px solid rgba(255,255,255,.2);border-radius:99px;background:rgba(255,255,255,.04);font-weight:700}.lgb em{font-style:normal;opacity:.7;transition:rotate .3s}.lgb[aria-expanded=true] em{rotate:180deg}
.lgl{position:absolute;left:50%;bottom:calc(100% + 8px);translate:-50% 0;min-width:190px;list-style:none;padding:6px;margin:0;border-radius:20px;background:#17161f;border:1px solid rgba(255,255,255,.18);box-shadow:0 24px 50px -16px #000;z-index:30;text-align:left}.lgl[hidden]{display:none}
.lgl button{display:flex;align-items:center;gap:.7rem;width:100%;padding:.6rem .8rem;border-radius:14px;font-weight:600}.lgl button:hover{background:rgba(255,255,255,.1)}
.fl{display:inline-block;width:28px;height:20px;border-radius:4px;box-shadow:0 0 0 1px rgba(255,255,255,.25);flex:none}
.fl-fr{background:linear-gradient(90deg,#0055a4 33%,#fff 33% 66%,#ef4135 66%)}.fl-de{background:linear-gradient(#000 33%,#dd0000 33% 66%,#ffce00 66%)}.fl-it{background:linear-gradient(90deg,#009246 33%,#fff 33% 66%,#ce2b37 66%)}.fl-es{background:linear-gradient(#aa151b 25%,#f1bf00 25% 75%,#aa151b 75%)}.fl-pt{background:linear-gradient(90deg,#046a38 40%,#da291c 40%)}.fl-ar{background:#006c35}
.fl-en{background:linear-gradient(#c8102e,#c8102e) center/100% 22% no-repeat,linear-gradient(#c8102e,#c8102e) center/22% 100% no-repeat,linear-gradient(#fff,#fff) center/100% 40% no-repeat,linear-gradient(#fff,#fff) center/40% 100% no-repeat,#012169}
/* En-tête : plus de forme derrière la pilule */
header,header.sc{background:none!important;border:0!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
@media(max-width:1360px){header .bar{border-radius:99px;background:color-mix(in srgb,var(--bg) 78%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px -16px rgba(0,0,0,.6)}}
/* Étapes pixel + nouvelles maquettes */
.etp{background:#0a0910;color:#fff;padding:5rem 0;margin:2rem 0}.ess{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:4rem 2rem}.es{display:grid;gap:.9rem;align-content:start;justify-items:start}
.eg{width:100%;aspect-ratio:1/.8;display:grid;place-items:center;background:radial-gradient(closest-side,color-mix(in srgb,var(--a) 38%,transparent),transparent 75%)}.pix{width:min(300px,70%);filter:drop-shadow(0 0 22px color-mix(in srgb,var(--a) 70%,transparent));animation:fl 6s ease-in-out infinite alternate}
.en{font:600 .95rem ui-monospace,Menlo,monospace;letter-spacing:.18em;text-transform:uppercase;color:var(--b)}.es h2{margin:0;max-width:none}.es h2::after{display:none}.es p:last-child{opacity:.7;max-width:34em}
.mk-ds{min-height:300px;background:linear-gradient(160deg,#3b2a7a,#c4501c);position:relative;display:grid;grid-template-rows:auto 1fr auto}.mbar{display:flex;gap:1rem;align-items:center;padding:.4rem .9rem;background:rgba(0,0,0,.35)}.mbar em{margin-left:auto;font-style:normal;opacity:.8}.dsw{padding:1.2rem;display:grid;place-items:center}.dwin{width:min(420px,100%);border-radius:12px;background:rgba(20,22,30,.85);overflow:hidden}.dwb{padding:1rem;display:grid;gap:.5rem}.dwb span{padding:.5rem .7rem;border-radius:8px;background:rgba(255,255,255,.08)}.dwb .ok::before{content:"●";margin-right:.5rem;color:#3ddc84}
.dock{justify-self:center;display:flex;gap:.6rem;padding:.5rem .8rem;margin-bottom:.8rem;border-radius:18px;background:rgba(255,255,255,.2);backdrop-filter:blur(10px)}.dock i{width:40px;height:40px;border-radius:11px}
.mk-tr{background:#0d0d14}.mk-tr pre{padding:1rem;margin:0;font:.85rem/1.7 ui-monospace,Menlo,monospace;color:#9be8b4;white-space:pre-wrap;min-height:220px}.mk-tr pre i{display:inline-block;width:.6em;height:1.1em;background:#9be8b4;vertical-align:-.2em;animation:bk 1s steps(2) infinite}@keyframes bk{50%{opacity:0}}
.vt-desktop{background:linear-gradient(135deg,#2a1357,#7a3df0)}.vt-terminal{background:linear-gradient(160deg,#10231e,#0b2e24)}
/* Transitions douces : page (fondu léger) et thème (fondu fluide) */
.cur{display:none!important}
@keyframes pin{from{opacity:0;transform:translateY(10px)}}
main{animation:pin .45s cubic-bezier(.2,.7,.2,1) both}
html.go main,html.go footer{opacity:0;transform:translateY(-6px);transition:opacity .2s ease,transform .2s ease}
::view-transition-old(root),::view-transition-new(root){animation-duration:.55s;animation-timing-function:cubic-bezier(.4,0,.2,1)}
@media(prefers-reduced-motion:reduce){main{animation:none}html.go main,html.go footer{transition:none}}
/* Maquette Mac : application macOS (modèle fourni) */
.vt-mac{background:linear-gradient(160deg,#6c6c72,#8b8b91)}
.mk-app{width:min(860px,100%);background:#2b2b2e;border:1px solid rgba(0,0,0,.5);color:#e9e9ec;font-size:.78rem}.mk-app .mkb{background:#3a3a3d}
.apb{display:grid;grid-template-columns:150px 1fr 190px;min-height:330px}.aps{background:#3a3a3d;padding:.8rem;display:grid;align-content:start;gap:.25rem}.aps small{opacity:.55;margin:.5rem 0 .2rem}.aps span{display:flex;justify-content:space-between;padding:.35rem .5rem;border-radius:7px}.aps em{font-style:normal;opacity:.6}.aps .on{background:#d9743a;color:#fff}.aps .add{opacity:.55;margin-top:auto}
.apm{padding:.7rem;display:grid;grid-template-rows:auto 1fr;gap:.6rem}.aph{display:flex;gap:.6rem;align-items:baseline}.aph small{opacity:.55}
.apg{display:grid;grid-template-columns:repeat(4,1fr);gap:.5rem;align-content:start}.tle{aspect-ratio:1;border-radius:8px;display:grid;place-items:center;overflow:hidden;box-shadow:0 0 0 1px rgba(255,255,255,.08)}.tle .pix{width:68%;filter:drop-shadow(0 2px 6px rgba(0,0,0,.5));animation:none}.tle.sel{box-shadow:0 0 0 2px #d9743a}.tle.add2{background:#232326;display:grid;align-content:center;justify-items:center;opacity:.7;font-size:.7rem}.tle.add2 b{font-size:1.4rem;line-height:1}
.api{background:#2f2f32;padding:.7rem;display:grid;align-content:start;gap:.6rem;border-left:1px solid rgba(0,0,0,.4)}.tle.pv{border-radius:10px;box-shadow:0 0 0 3px #4a4a4e}.apt{background:#1f1f22;border-radius:8px;padding:.6rem;min-height:70px}.apr{display:flex;align-items:center;gap:.5rem}.apr i{flex:1;height:5px;border-radius:5px;background:#4a4a4e}.apr u{display:block;width:60%;height:100%;border-radius:5px;background:#d9743a}.apr b{background:#555;padding:.1rem .5rem;border-radius:5px}
.apbt{display:flex;gap:.4rem}.apbt span{flex:1;text-align:center;background:#545458;border-radius:7px;padding:.4rem}.apbt span:last-child{flex:none;padding:.4rem .7rem}.apo{text-align:center;background:#d9743a;color:#fff;border-radius:7px;padding:.5rem;font-weight:700}
@media(max-width:760px){.apb{grid-template-columns:1fr}.aps{display:none}.api{border-left:0}.apg{grid-template-columns:repeat(3,1fr)}}
/* Menu : défilement complet, boutons harmonisés, bas de page propre */
#menu{height:100vh;height:100dvh;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
#menu .ml{flex:none;font-size:clamp(1.5rem,6.2vw,2.1rem);padding:.85rem 1.5rem}
#menu .mb{flex:none;margin-top:auto;padding:1.5rem 1.5rem calc(2rem + env(safe-area-inset-bottom,0px))}
#menu .mb .btn.g{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);color:#fff}
#menu .mb .btn.g:active{background:rgba(255,255,255,.16)}
/* Grand nom du pied de page : mots empilés, dégradé, effet lumineux */
.fbig{display:block;height:auto;overflow:hidden;white-space:normal;font-weight:900;line-height:.8;letter-spacing:-.05em;text-align:center;text-transform:uppercase;padding:2rem 3vw 0;margin:0;background:none;-webkit-text-stroke:0;color:inherit;user-select:none;pointer-events:none}
.fbig span{display:block;font-size:calc(94vw / (var(--w) * .64));padding-bottom:.08em;color:transparent;background:radial-gradient(circle 160px at var(--mx,50%) var(--my,60%),rgba(255,255,255,.75),transparent 70%),linear-gradient(180deg,var(--b) 0%,var(--a) 60%,color-mix(in srgb,var(--a) 15%,transparent) 100%);-webkit-background-clip:text;background-clip:text}
@media(min-width:900px){.fbig span{display:inline-block;font-size:calc(min(94vw,1500px) / (var(--n) * .64))}}
/* Garde-fous : rien ne déborde, même avec une police de secours */
.fbig span{font-size:calc(94vw / (var(--w) * .76));line-height:.95;padding-top:.12em;padding-bottom:.06em}
@media(min-width:900px){.fbig span{font-size:calc(min(94vw,1500px) / (var(--n) * .76))}}
.hero-in>*{min-width:0}
@media(max-width:700px){.hero h1{font-size:min(8.4vw,4.2rem);overflow-wrap:break-word}}
@media(max-width:760px){.tle.pv{max-width:170px;margin:0 auto}.hero:not(.mini){padding-top:7.5rem}}
/* Pied de page : nom défilant sur une seule ligne */
.fmq{overflow:hidden;padding:2.2rem 0 1rem;user-select:none;pointer-events:none;-webkit-mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent);mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)}
.fmq .ft{display:flex;width:max-content;animation:fmq 38s linear infinite}.fmq .fg{display:flex;align-items:center;flex:none}
.fmq b{font-size:clamp(4.5rem,20vw,13rem);font-weight:900;line-height:1.05;text-transform:uppercase;letter-spacing:-.05em;padding:0 .2em .04em;white-space:nowrap;color:transparent;background:linear-gradient(180deg,var(--b) 0%,var(--a) 62%,color-mix(in srgb,var(--a) 15%,transparent) 100%);-webkit-background-clip:text;background-clip:text}
.fmq b.o{background:none;-webkit-text-stroke:2px var(--b);color:transparent}
.fmq i{font-style:normal;font-size:clamp(1.8rem,7vw,4.5rem);color:var(--a);opacity:.9}
@keyframes fmq{to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.fmq .ft{animation:none}}
/* Pied de page : nom fixe, sur une ligne, ajusté à la largeur de l'écran */
.fit{display:block;overflow:hidden;padding:1.6rem 3vw .4rem;text-align:center;line-height:1;user-select:none;pointer-events:none}
.fit b{display:inline-block;white-space:nowrap;font-weight:900;text-transform:uppercase;letter-spacing:-.055em;line-height:1.08;padding:.08em .02em .02em;font-size:calc(94vw / (var(--n) * .58));color:transparent;background:linear-gradient(180deg,var(--b) 0%,var(--a) 62%,color-mix(in srgb,var(--a) 18%,transparent) 100%);-webkit-background-clip:text;background-clip:text}
@media(min-width:1200px){.fit b{font-size:calc(1120px / (var(--n) * .58))}}

/* ── Header : une pilule propre sur une seule ligne, rien ne s'étire ── */
header nav,.tabs{flex-wrap:nowrap}header nav a,header nav .btn,.tabs .t,.logo span{white-space:nowrap}
header nav .btn{flex:none;align-self:center;line-height:1.1;padding:.75rem 1.4rem}header nav .btn:hover{transform:none}
.ib{flex:none}.mk{height:100%}
@media(min-width:1361px){
 header{inset:12px 0 auto}
 header .bar{width:min(1440px,100% - 2rem);height:64px;padding:0 10px 0 22px;gap:1rem;border-radius:99px;background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.14);box-shadow:0 14px 34px -18px rgba(0,0,0,.6)}
 header .logo{flex:none;font-size:1.3rem}header nav{gap:.5rem}
 .tabs .t{padding:.5rem .75rem;font-size:.97rem}
 header nav .btn{padding:.7rem 1.2rem;font-size:.97rem}
}
/* ── Page statut ── */
.stn{margin:-.4rem 0 1.2rem;opacity:.75}
.sbn{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;padding:1.1rem 1.4rem;margin-bottom:1rem;border-radius:20px;background:color-mix(in srgb,#9aa 16%,var(--card));border:1px solid var(--line);font-weight:700}
.sbn i{flex:none;width:14px;height:14px;border-radius:50%;background:#9aa;animation:pu 1s infinite}.sbn small{margin-left:auto;font-weight:500;opacity:.65}
.sbn.ok{background:color-mix(in srgb,#2ecc71 16%,var(--card))}.sbn.ok i{background:#2ecc71;animation:none}
.sbn.mt{background:color-mix(in srgb,#f5a623 18%,var(--card))}.sbn.mt i{background:#f5a623;animation:none}
.sbn.off{background:color-mix(in srgb,#e5484d 18%,var(--card))}.sbn.off i{background:#e5484d;animation:none}

/* ── Réseaux sociaux du pied de page : vrais logos, couleur de marque au survol ── */
.soc{display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center}
.soc .sl{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);color:#fff;transition:background .25s,transform .35s cubic-bezier(.3,1.7,.5,1),border-color .25s}
.soc .sl svg{width:22px;height:22px}.soc .sl-gouv svg,.soc .sl-mail svg{width:24px;height:24px}
.soc .sl:hover,.soc .sl:focus-visible{background:var(--bc);border-color:var(--bc);transform:translateY(-4px) scale(1.08)}
.soc .sl-x:hover,.soc .sl-tiktok:hover,.soc .sl-github:hover{background:#000;border-color:rgba(255,255,255,.5)}
.soc a.sl{opacity:1}