/*
Theme Name: BEYOND
Theme URI: https://beyond.fr
Author: BEYOND — Nella Mehissou
Description: Thème one-page BEYOND (Au-delà des possibles). Design v2 : hero animé, sections empilées, agenda connecté à l'extension « BEYOND — Événements & Inscriptions ».
Version: 1.0.0
Text Domain: beyond
*/
*{box-sizing:border-box;margin:0;padding:0}
:root{
  --p:#554182;--p2:#8B7DD4;--p3:#DED7EC;--p4:#F4F2FA;
  --g:#F0C846;--g2:#FBF1CF;--g3:#FCF7E6;
  --parme:#BEB4D2;--bleu:#8CB4C8;--orange:#E67850;--vert:#199691;
  --t:#2E2A44;--t2:#565273;--t3:#9A93B4;--bg:#FAF9FC;--dark:#221A3A;
  --title:'Poppins',sans-serif;--body:'Inter','Source Sans 3',sans-serif;
}
html{scroll-behavior:smooth}
body{font-family:var(--body);background:var(--dark);color:var(--t2);line-height:1.7;overflow-x:hidden;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}

/* scroll progress */
#prog{position:fixed;top:0;left:0;height:3px;width:0;background:linear-gradient(90deg,var(--g),#f5d35a);z-index:300;transition:width .1s linear}
/* cursor glow (desktop) */
.cg{position:fixed;pointer-events:none;z-index:298;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,rgba(240,200,70,.08) 0%,rgba(139,125,212,.05) 45%,transparent 72%);transform:translate(-50%,-50%);opacity:0;transition:opacity .4s;mix-blend-mode:screen}

/* ─── NAV ─── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,5vw,64px);height:74px;transition:background .5s,box-shadow .5s,backdrop-filter .5s}
nav.sc{background:rgba(255,255,255,0.92);backdrop-filter:blur(20px);box-shadow:0 2px 28px rgba(85,65,130,0.08)}
.logo{display:flex;align-items:center;gap:11px;text-decoration:none}
.logo svg{height:34px;width:auto}
.wm{font-family:var(--title);font-size:20px;font-weight:300;letter-spacing:.2em;transition:color .5s}
.wm b{color:var(--g);font-weight:500}
nav:not(.sc) .wm{color:#fff}
nav.sc .wm{color:var(--t)}
.nl{display:flex;align-items:center;gap:34px}
.nl a{font-family:var(--title);font-size:11px;font-weight:300;letter-spacing:.13em;text-transform:uppercase;text-decoration:none;transition:color .3s;position:relative}
.nl a::after{content:'';position:absolute;left:0;bottom:-5px;width:0;height:1px;background:currentColor;transition:width .3s}
.nl a:hover::after{width:100%}
nav:not(.sc) .nl a{color:rgba(255,255,255,.8)}
nav:not(.sc) .nl a:hover{color:#fff}
nav.sc .nl a{color:var(--t3)}
nav.sc .nl a:hover{color:var(--p)}
.nc{font-family:var(--title);background:var(--g);color:var(--p);font-size:11px;font-weight:500;letter-spacing:.1em;text-transform:uppercase;padding:12px 24px;border-radius:8px;border:none;cursor:pointer;transition:all .3s;white-space:nowrap}
.nc:hover{transform:translateY(-2px);box-shadow:0 10px 26px rgba(240,200,70,.35)}
.hbg{display:none;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:4px}
.hbg span{display:block;width:22px;height:1.5px;border-radius:2px;transition:all .25s}
nav:not(.sc) .hbg span{background:#fff}
nav.sc .hbg span{background:var(--t)}
.mob-menu{display:none;position:fixed;top:74px;left:0;right:0;background:#fff;padding:20px 24px;flex-direction:column;z-index:199;box-shadow:0 8px 24px rgba(85,65,130,0.1)}
.mob-menu.open{display:flex}
.mob-menu a{font-family:var(--title);font-size:14px;font-weight:300;color:var(--t2);text-decoration:none;padding:14px 0;border-bottom:.5px solid rgba(85,65,130,.08)}
.mob-cta{font-family:var(--title);margin-top:18px;background:var(--p);color:#fff;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:15px;border-radius:8px;border:none;cursor:pointer}

/* shared */
.w{max-width:1200px;margin:0 auto;padding:0 clamp(20px,5vw,64px)}
.ey{font-family:var(--title);font-size:11px;font-weight:300;letter-spacing:.24em;text-transform:uppercase;color:var(--p);margin-bottom:18px;display:flex;align-items:center;gap:12px}
.ey::before{content:'';width:26px;height:1px;background:var(--g)}
.ey.c{justify-content:center}
.ey.lt{color:rgba(255,255,255,.6)}
.sh{font-family:var(--title);font-size:clamp(30px,4vw,50px);font-weight:300;color:var(--t);line-height:1.18;letter-spacing:.01em}
.sh em{font-style:normal;color:var(--p)}
.sh.lt{color:#fff}.sh.lt em{color:var(--g)}
.bp{font-family:var(--title);background:var(--p);color:#fff;font-size:12px;font-weight:400;letter-spacing:.09em;text-transform:uppercase;padding:16px 34px;border-radius:8px;border:none;cursor:pointer;transition:all .3s;display:inline-block;text-decoration:none}
.bp:hover{background:#6b52a0;transform:translateY(-2px);box-shadow:0 12px 30px rgba(85,65,130,.28)}
.bp.gold{background:var(--g);color:var(--p)}.bp.gold:hover{background:#f5d35a;box-shadow:0 12px 30px rgba(240,200,70,.35)}
.bghost{font-family:var(--title);font-size:13px;font-weight:300;color:#fff;background:none;border:1px solid rgba(255,255,255,.35);padding:15px 26px;border-radius:8px;cursor:pointer;transition:all .3s}
.bghost:hover{background:rgba(255,255,255,.1);border-color:#fff}

/* reveal + stagger */
.js .rv{opacity:0;transform:translateY(30px);transition:opacity .9s cubic-bezier(.22,1,.36,1),transform .9s cubic-bezier(.22,1,.36,1)}
.js .rv.on{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.18s}.d3{transition-delay:.28s}.d4{transition-delay:.38s}.d5{transition-delay:.48s}

/* keyframes */
@keyframes gradShift{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
@keyframes orbDrift{0%{transform:translate(0,0) scale(1)}33%{transform:translate(24px,-18px) scale(1.06)}66%{transform:translate(-14px,16px) scale(.95)}100%{transform:translate(0,0) scale(1)}}
@keyframes floatY{0%,100%{transform:translateY(0)}50%{transform:translateY(-18px)}}
@keyframes pulseO{0%,100%{opacity:1}50%{opacity:.6;text-shadow:0 0 16px rgba(240,200,70,.75)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(26px)}to{opacity:1;transform:none}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
@keyframes scrollX{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.wm b,.wm2 b{animation:pulseO 3.4s ease-in-out infinite}

/* ─── HERO ─── */
#hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;padding:120px 24px 90px;overflow:hidden;background:linear-gradient(135deg,#241A46,#554182,#7E6BB0,#3A2C5E);background-size:300% 300%;animation:gradShift 16s ease infinite}
.horb{position:absolute;border-radius:50%;pointer-events:none}
.hcurve{position:absolute;top:8%;right:-40px;opacity:.7;pointer-events:none}
.hero-in{position:relative;z-index:3;max-width:1180px;width:100%;display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:center;text-align:left}
.hero-copy{min-width:0}
.hero-vis{position:relative;justify-self:center;opacity:0;animation:fadeUp 1s cubic-bezier(.22,1,.36,1) 1.25s forwards}
.hero-portrait{position:relative;z-index:1;width:100%;max-width:360px;aspect-ratio:3/4;object-fit:cover;object-position:center 8%;border-radius:18px;box-shadow:0 34px 84px rgba(0,0,0,.42)}
.hero-frame{position:absolute;z-index:0;inset:22px -22px -22px 22px;max-width:360px;border:1px solid rgba(240,200,70,.55);border-radius:18px}
.hero-dot{position:absolute;z-index:2;bottom:-14px;left:26px;width:56px;height:56px;border-radius:50%;background:var(--g);box-shadow:0 8px 24px rgba(240,200,70,.4)}
.hero-chip{position:absolute;z-index:3;background:#fff;border-radius:12px;padding:11px 15px;display:flex;align-items:center;gap:9px;box-shadow:0 12px 30px rgba(0,0,0,.18);white-space:nowrap;animation:floatY 6s ease-in-out infinite}
.hero-chip .cd{width:8px;height:8px;border-radius:50%;background:var(--g);flex-shrink:0}
.hero-chip .ct{font-family:var(--title);font-size:11px;font-weight:400;color:var(--t)}
.hero-chip.tl{top:24px;left:-26px}
.hero-stat{position:absolute;z-index:3;right:-18px;bottom:64px;background:rgba(34,26,58,.85);backdrop-filter:blur(10px);border:.5px solid rgba(255,255,255,.16);border-radius:12px;padding:14px 18px;text-align:center;animation:floatY 7s ease-in-out infinite 1s}
.hero-stat .n{font-family:var(--title);font-size:28px;font-weight:300;color:#fff;line-height:1}
.hero-stat .n b{color:var(--g);font-weight:400}
.hero-stat .l{font-family:var(--title);font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-top:4px}
.hero-ey{font-family:var(--title);font-size:12px;font-weight:300;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.66);margin-bottom:30px;opacity:0;animation:fadeUp .9s ease .3s forwards}
.hero-h1{font-family:var(--title);font-weight:300;font-size:clamp(42px,7vw,88px);line-height:1.06;color:#fff;letter-spacing:.01em;margin-bottom:26px}
.hero-h1 .word{display:inline-block;opacity:0;animation:fadeUp .8s cubic-bezier(.22,1,.36,1) forwards}
.hero-h1 em{font-style:normal;color:var(--g)}
.hero-sub{font-size:17px;font-weight:300;color:rgba(255,255,255,.82);line-height:1.85;max-width:520px;margin:0 0 42px;opacity:0;animation:fadeUp .9s ease 1.15s forwards}
.hero-ctas{display:flex;gap:16px;justify-content:flex-start;flex-wrap:wrap;opacity:0;animation:fadeUp .9s ease 1.35s forwards}
.hero-trust{display:flex;gap:34px;justify-content:flex-start;flex-wrap:wrap;margin-top:48px;opacity:0;animation:fadeUp .9s ease 1.6s forwards}
.htr{text-align:center}
.htr .n{font-family:var(--title);font-size:30px;font-weight:300;color:#fff;line-height:1}
.htr .n b{color:var(--g);font-weight:400}
.htr .l{font-family:var(--title);font-size:10px;font-weight:300;letter-spacing:.13em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-top:6px}
.htr .sep{width:1px;align-self:stretch;background:rgba(255,255,255,.16)}
.scrollcue{position:absolute;bottom:26px;left:50%;transform:translateX(-50%);z-index:3;color:rgba(255,255,255,.6);font-family:var(--title);font-size:10px;letter-spacing:.2em;text-transform:uppercase;display:flex;flex-direction:column;align-items:center;gap:8px;animation:bob 2.4s ease-in-out infinite}

/* ─── STACK wrapper (sticky layered sections) ─── */
.stack{position:relative;z-index:5}
.sk{position:sticky;top:0;overflow:hidden;box-shadow:0 -10px 60px rgba(0,0,0,.16);will-change:transform}

/* ─── MANIFESTE ─── */
#manif{background:#fff;padding:clamp(90px,12vh,150px) 0}
.manif-w{max-width:940px;margin:0 auto;text-align:center}
.wing{margin:0 auto 26px;opacity:.5}
.manif-h{font-family:var(--title);font-weight:300;font-size:clamp(26px,3.6vw,44px);line-height:1.32;color:var(--t);letter-spacing:.01em}
.manif-h b{color:var(--p);font-weight:400}
.manif-q{margin-top:40px;font-family:var(--body);font-style:italic;font-size:clamp(18px,2.4vw,26px);color:var(--p);line-height:1.5}

/* ─── PILIERS (horizontal) ─── */
#pil{background:var(--p4);padding:clamp(80px,10vh,130px) 0}
.pil-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-bottom:56px}
.pil-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.pil-c{background:#fff;border-radius:16px;padding:34px 28px;border:.5px solid rgba(85,65,130,.08);transition:transform .35s,box-shadow .35s}
.pil-c:hover{transform:translateY(-8px);box-shadow:0 22px 54px rgba(85,65,130,.14)}
.pil-i{width:48px;height:48px;border-radius:12px;background:var(--p4);display:flex;align-items:center;justify-content:center;font-size:18px;color:var(--p);margin-bottom:20px}
.pil-c:nth-child(1) .pil-i{background:var(--g3);color:#b8902a}
.pil-c:nth-child(2) .pil-i{background:#e7f1f4;color:#3f7f95}
.pil-c:nth-child(3) .pil-i{background:#fbe9e2;color:#c25a35}
.pil-c:nth-child(4) .pil-i{background:var(--p4);color:var(--p)}
.pil-t{font-family:var(--title);font-size:16px;font-weight:400;color:var(--t);margin-bottom:10px}
.pil-d{font-size:13.5px;font-weight:300;color:var(--t3);line-height:1.65}

/* ─── POUR QUI (split panels) ─── */
#fw{background:#fff;padding:clamp(80px,10vh,130px) 0}
.fw-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:52px}
.fw-p{position:relative;border-radius:18px;padding:52px 46px;overflow:hidden;color:#fff;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .4s}
.fw-p:hover{transform:translateY(-6px)}
.fw-p.a{background:linear-gradient(150deg,#6f5aa6,#554182)}
.fw-p.b{background:linear-gradient(150deg,#c98a6a,#a85f45)}
.fw-p .num{position:absolute;top:26px;right:34px;font-family:var(--title);font-size:90px;font-weight:300;color:rgba(255,255,255,.14);line-height:1}
.fw-p h3{font-family:var(--title);font-size:23px;font-weight:400;margin-bottom:14px;position:relative}
.fw-p p{font-size:14.5px;font-weight:300;color:rgba(255,255,255,.82);line-height:1.75;position:relative}

/* ─── OFFRES (two cards) ─── */
#of{background:var(--p4);padding:clamp(80px,10vh,130px) 0}
.of-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:52px}
.of-c{background:#fff;border-radius:18px;padding:46px;border:.5px solid rgba(85,65,130,.08);position:relative;overflow:hidden;transition:transform .35s,box-shadow .35s}
.of-c:hover{transform:translateY(-6px);box-shadow:0 22px 60px rgba(85,65,130,.14)}
.of-c::after{content:'';position:absolute;top:-16px;right:36px;width:30px;height:30px;border-radius:50%;background:var(--g)}
.of-tag{font-family:var(--title);font-size:10px;font-weight:400;letter-spacing:.16em;text-transform:uppercase;color:var(--p2);margin-bottom:14px}
.of-h{font-family:var(--title);font-size:23px;font-weight:400;color:var(--t);margin-bottom:12px}
.of-s{font-size:14.5px;font-weight:300;color:var(--t3);line-height:1.72;margin-bottom:26px}
.of-l{list-style:none;display:flex;flex-direction:column;gap:12px;margin-bottom:28px}
.of-l li{font-size:14px;font-weight:300;color:var(--t2);display:flex;gap:12px;align-items:flex-start;line-height:1.6}
.of-l .fd{width:6px;height:6px;border-radius:50%;background:var(--g);flex-shrink:0;margin-top:8px}
.of-meta{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.of-meta span{font-family:var(--title);font-size:11px;font-weight:300;color:var(--p);background:var(--p4);border-radius:50px;padding:6px 14px}

/* ─── CHEMIN (timeline, dark animated) ─── */
#chemin{padding:clamp(90px,12vh,150px) 0;position:relative;overflow:hidden;background:linear-gradient(135deg,#241A46,#554182,#3A2C5E);background-size:300% 300%;animation:gradShift 18s ease infinite}
.tl{max-width:820px;margin:56px auto 0;position:relative;padding-left:6px}
.tl::before{content:'';position:absolute;left:26px;top:8px;bottom:8px;width:2px;background:linear-gradient(var(--g),rgba(240,200,70,.15));transform:scaleY(0);transform-origin:top;transition:transform 1.4s ease}
.tl.on::before{transform:scaleY(1)}
.tl-step{position:relative;padding:0 0 52px 82px}
.tl-step:last-child{padding-bottom:0}
.tl-dot{position:absolute;left:16px;top:2px;width:22px;height:22px;border-radius:50%;background:var(--g);box-shadow:0 0 0 6px rgba(240,200,70,.16);display:flex;align-items:center;justify-content:center;font-family:var(--title);font-size:10px;font-weight:500;color:var(--p)}
.tl-n{font-family:var(--title);font-size:13px;font-weight:300;letter-spacing:.2em;color:var(--g);margin-bottom:8px}
.tl-t{font-family:var(--title);font-size:22px;font-weight:400;color:#fff;margin-bottom:10px}
.tl-d{font-size:15px;font-weight:300;color:rgba(255,255,255,.72);line-height:1.75}

/* ─── NELLA (offset portrait, dark) ─── */
#nella{background:#fff;padding:clamp(80px,10vh,130px) 0}
.ng{display:grid;grid-template-columns:.9fr 1.1fr;gap:80px;align-items:center}
.np{position:relative;display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.np-photo{position:relative;width:100%;max-width:400px}
.np-photo .frame{position:absolute;inset:22px -22px -22px 22px;border:1px solid var(--g);border-radius:20px;pointer-events:none;z-index:0}
.np-photo img{position:relative;z-index:1;width:100%;aspect-ratio:3/4;object-fit:cover;object-position:center 8%;border-radius:20px;box-shadow:0 26px 74px rgba(85,65,130,.2)}
.np-photo .dot{position:absolute;z-index:2;bottom:-18px;right:8px;width:56px;height:56px;border-radius:50%;background:var(--g)}
.nbadges{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:16px}
.nbadge{display:block;width:76px;height:76px;border-radius:50%;overflow:hidden;transition:transform .3s,box-shadow .3s;text-decoration:none;flex-shrink:0}
.nbadge img{width:100%;height:100%;object-fit:contain}
.nbadge:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 10px 26px rgba(85,65,130,.24)}
.nbadge.txt{display:flex;align-items:center;justify-content:center;background:var(--p4);border:1px solid rgba(85,65,130,.18)}
.nbadge.txt span{font-family:var(--title);font-size:9.5px;font-weight:400;line-height:1.28;color:var(--p);text-align:center}
.nbcap{font-family:var(--title);font-size:10px;font-weight:300;letter-spacing:.05em;color:var(--t3);display:flex;align-items:center;gap:6px}
.npre{font-family:var(--title);font-size:11px;font-weight:300;letter-spacing:.22em;text-transform:uppercase;color:var(--p);margin-bottom:14px;display:flex;align-items:center;gap:12px}
.npre::before{content:'';width:22px;height:1px;background:var(--g)}
.nn{font-family:var(--title);font-size:clamp(40px,5.5vw,64px);font-weight:300;color:var(--p);line-height:.95;letter-spacing:.03em}
.ns{font-family:var(--title);font-size:clamp(18px,3vw,26px);font-weight:300;color:var(--t3);margin-bottom:18px;letter-spacing:.06em}
.ntl{font-style:italic;color:var(--p2);font-size:15px;margin-bottom:20px}
.nb{font-size:15px;font-weight:300;color:var(--t2);line-height:1.82;margin-bottom:12px}
.ntags{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0}
.tg{font-family:var(--title);font-size:11px;font-weight:300;color:var(--p);border:.5px solid rgba(85,65,130,.22);border-radius:50px;padding:6px 15px;background:var(--p4)}
.nst{display:flex;flex-wrap:wrap;gap:34px;padding:22px 0;margin:8px 0 24px;border-top:.5px solid #EAE8F4;border-bottom:.5px solid #EAE8F4}
.sn{font-family:var(--title);font-size:32px;font-weight:300;color:var(--p);line-height:1}
.sn b{color:var(--g);font-weight:400}
.sl{font-size:11.5px;font-weight:300;color:var(--t3);margin-top:4px;max-width:130px}

/* ─── UNIVERS (marquee, dark) ─── */
#univ{background:linear-gradient(165deg,#2A2044,#554182);padding:clamp(90px,11vh,140px) 0;overflow:hidden}
.uhead{text-align:center;max-width:600px;margin:0 auto 52px}
.uhead p{font-size:15px;font-weight:300;color:rgba(255,255,255,.6);line-height:1.8;margin-top:12px}
.marquee{overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.mtrack{display:flex;gap:18px;width:max-content;animation:scrollX 42s linear infinite}
.marquee:hover .mtrack{animation-play-state:paused}
.mcard{width:340px;height:240px;border-radius:16px;overflow:hidden;flex-shrink:0;position:relative}
.mcard img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.mcard:hover img{transform:scale(1.06)}
.mcap{position:absolute;left:0;right:0;bottom:0;padding:16px 20px;background:linear-gradient(transparent,rgba(34,26,58,.85));font-family:var(--title);font-size:13px;font-weight:300;color:#fff}
.mcard.ph{background:rgba(255,255,255,.05);border:1px dashed rgba(240,200,70,.4);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center;padding:20px}
.mcard.ph .play{width:54px;height:54px;border-radius:50%;background:rgba(240,200,70,.16);display:flex;align-items:center;justify-content:center}
.mcard.ph .t{font-family:var(--title);font-size:13px;color:#fff}
.mcard.ph .d{font-size:12px;font-weight:300;color:rgba(255,255,255,.55)}
.ecp{display:flex;align-items:center;gap:22px;max-width:820px;margin:44px auto 0;padding:26px 32px;background:rgba(255,255,255,.05);border:.5px solid rgba(255,255,255,.1);border-radius:14px}
.ecp .i{width:46px;height:46px;border-radius:50%;background:var(--g);display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--p)}
.ecp h4{font-family:var(--title);font-size:16px;font-weight:400;color:#fff;margin-bottom:4px}
.ecp p{font-size:13px;font-weight:300;color:rgba(255,255,255,.6);line-height:1.6}

/* ─── TÉMOIGNAGES (marquee) ─── */
#tm{background:var(--bg);padding:clamp(80px,10vh,130px) 0;overflow:hidden}
.li{max-width:1200px;margin:44px auto 0;display:flex;align-items:center;gap:18px;background:var(--p4);border-radius:14px;padding:22px 30px;border:.5px solid rgba(85,65,130,.1);flex-wrap:wrap}
.li .in{width:34px;height:34px;border-radius:7px;background:#0A66C2;color:#fff;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.li .tx{flex:1;min-width:220px;font-size:13.5px;font-weight:300;color:var(--t2)}
.li .tx b{color:var(--t);font-weight:500}
.li a{font-family:var(--title);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#0A66C2;text-decoration:none;padding:10px 18px;border-radius:7px;transition:background .25s;white-space:nowrap}
.li a:hover{background:#0954a0}
.tmarq{margin-top:24px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.ttrack{display:flex;gap:18px;width:max-content;animation:scrollX 60s linear infinite}
.tmarq:hover .ttrack{animation-play-state:paused}
.tc{width:420px;flex-shrink:0;background:#fff;border-radius:16px;padding:38px;border:.5px solid rgba(85,65,130,.07);display:flex;flex-direction:column}
.tc.hl{background:linear-gradient(135deg,var(--p),#3D2E60)}
.tq{font-family:var(--title);font-size:46px;color:var(--g);line-height:.6;margin-bottom:16px}
.tt{font-size:14.5px;font-weight:300;font-style:italic;color:var(--t2);line-height:1.8;margin-bottom:22px;flex:1}
.tc.hl .tt{color:rgba(255,255,255,.9)}
.ta{display:flex;align-items:center;gap:12px}
.tav{width:40px;height:40px;border-radius:50%;background:var(--p);color:#fff;font-family:var(--title);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tc.hl .tav{background:rgba(255,255,255,.2)}
.tn{font-family:var(--title);font-size:13.5px;font-weight:500;color:var(--t)}
.tc.hl .tn{color:#fff}
.trole{font-size:12px;font-weight:300;color:var(--t3)}
.tc.hl .trole{color:rgba(255,255,255,.6)}
.tbadge{display:inline-block;margin-top:8px;font-family:var(--title);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--p);background:var(--p4);padding:4px 12px;border-radius:50px}
.tc.hl .tbadge{background:rgba(255,255,255,.16);color:rgba(255,255,255,.8)}

/* ─── AGENDA ─── */
#ag{background:#fff;padding:clamp(80px,10vh,130px) 0}
.evl{display:flex;flex-direction:column;gap:12px;margin-top:52px}
.evr{display:flex;align-items:center;gap:22px;padding:24px 30px;border-radius:14px;border:.5px solid rgba(85,65,130,.1);cursor:pointer;transition:all .3s;flex-wrap:wrap}
.evr:hover{border-color:rgba(85,65,130,.28);box-shadow:0 8px 28px rgba(85,65,130,.09);transform:translateX(6px)}
.evd{font-family:var(--title);font-size:11px;font-weight:400;letter-spacing:.1em;text-transform:uppercase;color:var(--g);min-width:130px}
.evd b{color:var(--p);font-weight:500}
.evt{font-family:var(--title);font-size:16px;font-weight:400;color:var(--t);flex:1;min-width:220px;line-height:1.4}
.evbg{font-family:var(--title);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--p);background:var(--p4);padding:6px 13px;border-radius:50px;white-space:nowrap}
.evbg.open{color:#fff;background:var(--vert)}
.evar{color:var(--p);font-size:16px;opacity:.5;transition:all .25s}
.evr:hover .evar{opacity:1;transform:translateX(3px)}

/* ─── INSPIRATION / ARTICLES ─── */
#inspi{background:var(--bg);padding:clamp(80px,10vh,130px) 0}
.art-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:52px}
.art-c{position:relative;border-radius:18px;overflow:hidden;min-height:340px;display:flex;flex-direction:column;justify-content:flex-end;padding:32px 30px;cursor:pointer;color:#fff;transition:transform .4s,box-shadow .4s}
.art-c:hover{transform:translateY(-6px);box-shadow:0 24px 60px rgba(85,65,130,.22)}
.art-c::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(34,26,58,.82) 0%,rgba(34,26,58,.35) 45%,rgba(85,65,130,.15) 100%);z-index:1}
.art-c>*{position:relative;z-index:2}
.art-c.hasimg{background-size:cover;background-position:center}
.art-c.g1{background:linear-gradient(150deg,#6f5aa6,#554182)}
.art-c.g2{background:linear-gradient(150deg,#3A2C5E,#554182)}
.art-c.g3{background:linear-gradient(150deg,#8CB4C8,#554182)}
.art-lbl{font-family:var(--title);font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--g);margin-bottom:10px}
.art-t{font-family:var(--title);font-size:20px;font-weight:400;line-height:1.3;margin-bottom:10px}
.art-p{font-size:13.5px;font-weight:300;color:rgba(255,255,255,.82);line-height:1.7;margin-bottom:16px}
.art-more{font-family:var(--title);font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--g)}

/* ─── MODAL (prévisualisation articles & événements) ─── */
.modal{position:fixed;inset:0;z-index:1000;background:rgba(22,16,42,.72);backdrop-filter:blur(8px);display:none;align-items:center;justify-content:center;padding:5%}
.modal.open{display:flex;animation:mfade .3s ease}
@keyframes mfade{from{opacity:0}to{opacity:1}}
.modal-box{background:#fff;border-radius:18px;max-width:660px;width:100%;max-height:86vh;overflow-y:auto;position:relative;box-shadow:0 40px 100px rgba(0,0,0,.3);animation:mpop .35s cubic-bezier(.22,1,.36,1)}
@keyframes mpop{from{opacity:0;transform:scale(.96) translateY(10px)}to{opacity:1;transform:none}}
.modal-cover{height:180px;position:relative;overflow:hidden;border-radius:18px 18px 0 0}
.modal-cover.g1{background:linear-gradient(150deg,#6f5aa6,#554182)}
.modal-cover.g2{background:linear-gradient(150deg,#3A2C5E,#554182)}
.modal-cover.g3{background:linear-gradient(150deg,#8CB4C8,#554182)}
.modal-cover.gv{background:linear-gradient(150deg,#199691,#554182)}
.modal-cover.go{background:linear-gradient(150deg,#E67850,#554182)}
.modal-cover img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.modal-cover::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(34,26,58,.75),rgba(85,65,130,.15));z-index:1}
.modal-cover .lbl{position:absolute;bottom:20px;left:36px;font-family:var(--title);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--g);z-index:2}
.modal-body{padding:32px 44px 44px}
.modal-meta{display:flex;gap:18px;flex-wrap:wrap;margin-bottom:16px}
.modal-meta span{font-family:var(--title);font-size:12px;font-weight:300;color:var(--p)}
.modal-body h3{font-family:var(--title);font-size:clamp(20px,2.6vw,28px);font-weight:400;color:var(--p);line-height:1.32;margin-bottom:22px}
.modal-body p{font-size:15.5px;font-weight:300;color:var(--t2);line-height:1.85;margin-bottom:18px}
.modal-body p.em{font-style:italic;color:var(--p)}
.modal-actions{margin-top:26px;padding-top:24px;border-top:.5px solid rgba(85,65,130,.12);display:flex;gap:12px;flex-wrap:wrap}
.modal-close{position:absolute;top:14px;right:14px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,.9);border:none;cursor:pointer;font-size:22px;line-height:1;color:var(--p);display:flex;align-items:center;justify-content:center;z-index:5}
.btn-sec{font-family:var(--title);font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--p);background:transparent;border:1px solid var(--p);padding:14px 26px;border-radius:8px;cursor:pointer;transition:background .25s}
.btn-sec:hover{background:var(--p4)}

/* ─── CTA ─── */
#cta{position:relative;overflow:hidden;padding:clamp(100px,14vh,170px) 0;text-align:center;background:linear-gradient(135deg,#2E2150,#554182,#241A46);background-size:300% 300%;animation:gradShift 18s ease infinite}
.corb{position:absolute;width:560px;height:560px;border-radius:50%;border:1px solid rgba(255,255,255,.06);top:50%;left:50%;transform:translate(-50%,-50%);pointer-events:none}
.ci{max-width:640px;margin:0 auto;position:relative;z-index:2;padding:0 24px}
.cpre{font-family:var(--title);font-size:11px;font-weight:300;letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.5);margin-bottom:22px}
.ch{font-family:var(--title);font-size:clamp(34px,4.4vw,58px);font-weight:300;color:#fff;line-height:1.16;margin-bottom:18px}
.ch em{font-style:normal;color:var(--g)}
.csub{font-size:16px;font-weight:300;color:rgba(255,255,255,.75);line-height:1.8;margin-bottom:42px;max-width:500px;margin:0 auto 42px}
.cmeta{font-family:var(--title);font-size:12px;font-weight:300;color:rgba(255,255,255,.5);margin-top:18px}
.clink{display:inline-block;margin-top:24px;font-family:var(--title);font-size:13px;font-weight:300;color:rgba(255,255,255,.7);text-decoration:none;border-bottom:1px solid rgba(255,255,255,.3);padding-bottom:2px}
.clink:hover{color:#fff;border-color:#fff}

/* ─── FOOTER ─── */
footer{background:#1A1430;padding:72px clamp(20px,5vw,64px) 40px}
.ft{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1.15fr;gap:52px;padding-bottom:44px;border-bottom:.5px solid rgba(255,255,255,.07)}
.fbtn{display:inline-flex;align-items:center;gap:9px;margin-top:20px;font-family:var(--title);font-size:12px;font-weight:400;letter-spacing:.06em;text-transform:uppercase;color:var(--p);background:var(--g);text-decoration:none;padding:12px 20px;border-radius:8px;transition:all .3s}
.fbtn:hover{background:#f5d35a;transform:translateY(-2px)}
.fbr{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.wm2{font-family:var(--title);font-size:20px;font-weight:300;letter-spacing:.2em;color:#fff}
.wm2 b{color:var(--g);font-weight:500}
.fbl{font-family:var(--title);font-size:10px;font-weight:300;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.4);margin-bottom:14px}
.fd2{font-size:13.5px;font-weight:300;color:rgba(255,255,255,.4);line-height:1.8;max-width:300px}
.fct{font-family:var(--title);font-size:9px;font-weight:400;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.3);margin-bottom:16px}
.fn{display:flex;flex-direction:column;gap:12px}
.fn a{font-family:var(--title);font-size:13px;font-weight:300;color:rgba(255,255,255,.5);text-decoration:none;transition:color .25s}
.fn a:hover{color:#fff}
.fb{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;align-items:center;padding-top:26px;flex-wrap:wrap;gap:12px}
.fc{font-size:11px;font-weight:300;color:rgba(255,255,255,.28)}
.fl{display:flex;gap:22px;flex-wrap:wrap}
.fl a{font-family:var(--title);font-size:11px;font-weight:300;color:rgba(255,255,255,.28);text-decoration:none}

@media (prefers-reduced-motion:reduce){
  .js .rv{opacity:1 !important;transform:none !important;transition:none !important}
  *{animation:none !important}
  .hero-ey,.hero-sub,.hero-ctas,.hero-trust,.hero-h1 .word,.hero-vis{opacity:1 !important}
  html{scroll-behavior:auto}
}

/* ─── RESPONSIVE ─── */
@media(max-width:960px){
  .pil-grid{grid-template-columns:1fr 1fr}
  .art-grid{grid-template-columns:1fr 1fr}
  .ng{grid-template-columns:1fr;gap:52px;justify-items:start}
  .np-photo{max-width:340px}
  .ft{grid-template-columns:1fr 1fr}.ft>div:first-child{grid-column:span 2}
}
@media(max-width:768px){
  .nl,.nc{display:none}.hbg{display:flex}
  .fw-grid,.of-grid{grid-template-columns:1fr}
  #hero{padding:110px 20px 84px}
  #hero .hero-in{grid-template-columns:1fr;gap:44px;text-align:center;max-width:560px}
  .hero-copy .hero-sub{margin:0 auto 36px;max-width:100%}
  .hero-ctas{justify-content:center}
  .hero-trust{justify-content:center;gap:22px}
  .htr .sep{display:none}
  .hero-vis{order:2}
  .hero-frame,.hero-chip{display:none}
  .hero-portrait{max-width:250px;margin:0 auto}
  .hero-stat{right:0;bottom:8px}
  .mcard,.tc{width:280px}
  .tc{padding:30px}
  .art-grid{grid-template-columns:1fr}
  .modal-body{padding:28px 26px 34px}
  .evd{min-width:auto}.evbg{display:none}
  .ft{grid-template-columns:1fr}.ft>div:first-child{grid-column:span 1}
  .fb{flex-direction:column;align-items:flex-start;gap:10px}
}
@media(max-width:480px){
  .pil-grid{grid-template-columns:1fr}
  .tl-step{padding-left:66px}
}

/* ─── Correctifs mobile / iOS Safari ─── */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
@media(max-width:768px){
  /* Désactive l'empilement « sticky » (bug d'affichage/chevauchement sur iOS Safari) */
  .stack{position:static}
  .sk{position:static !important;transform:none !important;box-shadow:none !important;will-change:auto}
}