/* ================================================================
   RESET & VARIABLES
   ================================================================ */
*,*::before,*::after{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}
html{scroll-behavior:smooth;overflow-x:hidden}
body{font-family:'Barlow',sans-serif;background:#f4f4f4;overflow-x:hidden;color:#1f2937;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
img{max-width:100%;height:auto;display:block}
a{text-decoration:none}
button{cursor:pointer;border:none;background:none}
ul{list-style:none}
:focus-visible{outline:3px solid #dc2626;outline-offset:2px}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none}
address{font-style:normal}

:root{
  --red:#dc2626;--red-dark:#991b1b;--blue:#1e3a8a;--blue-mid:#2563eb;
  --ink:#060606;--gray-900:#111827;--gray-800:#1f2937;--gray-700:#374151;
  --gray-500:#6b7280;--gray-400:#9ca3af;--gray-200:#e5e7eb;--gray-100:#f3f4f6;--gray-50:#f9fafb;
  --surface-dark:#242a3a;--surface-darker:#1a1f2e;--border-dark:#2f3a50;
  --fd:'Barlow Condensed',sans-serif;--fb:'Barlow',sans-serif;
}

/* ================================================================
   SKIP + NOISE
   ================================================================ */
.skip-link{position:absolute;top:-40px;left:0;background:var(--red);color:#fff;padding:8px 16px;z-index:9999;font-weight:700;transition:top .2s}
.skip-link:focus{top:0}
.noise{position:absolute;inset:0;opacity:.04;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:128px;pointer-events:none;z-index:1}

/* ================================================================
   LAYOUT
   ================================================================ */
.container{width:100%;margin-inline:auto;padding-inline:clamp(1rem,5vw,5rem);max-width:1280px}
.container--narrow{max-width:860px}
.text-center{text-align:center}

/* ================================================================
   NAVBAR
   ================================================================ */
.navbar{position:fixed;top:0;width:100%;z-index:100;background:var(--ink);border-bottom:2px solid rgba(220,38,38,.35);transition:transform .3s ease}
.navbar__inner{display:flex;justify-content:space-between;align-items:center;padding:1rem clamp(1rem,5.5vw,5.5rem);gap:2rem}
.navbar__brand{display:flex;align-items:center;gap:.75rem;color:#fff}
.navbar__brand:hover .navbar__logo{transform:rotate(-5deg) scale(1.05)}
.navbar__logo{width:52px;height:52px;border-radius:50%;background:#fff;padding:3px;transition:transform .3s ease;flex-shrink:0}
.navbar__name{display:block;font-family:var(--fd);font-weight:900;font-size:clamp(1.5rem,2.5vw,2rem);letter-spacing:.22em;text-transform:uppercase;color:#fe0505;line-height:1}
.navbar__sub{display:block;font-family:var(--fd);font-weight:700;font-size:clamp(.6rem,1vw,.8rem);letter-spacing:.3em;text-transform:uppercase;color:var(--white);line-height:1}
.navbar__desktop{display:none;align-items:center;gap:2rem}
.nav-links{display:flex;align-items:center;gap:clamp(1rem,1.8vw,1.5rem)}
.nav-links a{font-family:var(--fd);font-weight:700;font-size:clamp(.85rem,1vw,1.1rem);letter-spacing:.08em;text-transform:uppercase;color:#d1d5db;position:relative;transition:color .2s;white-space:nowrap}
.nav-links a::after{content:'';position:absolute;bottom:-4px;left:0;width:0;height:2px;background:var(--red);transition:width .2s}
.nav-links a:hover,.nav-links a.active{color:#fff}
.nav-links a:hover::after,.nav-links a.active::after{width:100%}
.nav-links a.active{color:var(--red)}
.navbar__burger{display:flex;align-items:center;justify-content:center;width:40px;height:40px;color:var(--red);font-size:1.4rem}
.navbar__burger:hover{color:#ef4444}

/* mobile menu */
.mob-menu{background:var(--ink);max-height:0;overflow:hidden;border-top:0 solid var(--red);transition:max-height .45s cubic-bezier(.4,0,.2,1),border-top-width .1s ease}
.mob-menu.open{max-height:900px;border-top-width:2px}
.mob-menu li{opacity:0;transform:translateX(-18px);transition:opacity .25s ease,transform .25s ease}
.mob-menu.open li{opacity:1;transform:translateX(0)}
.mob-menu.open li:nth-child(1){transition-delay:.04s}
.mob-menu.open li:nth-child(2){transition-delay:.08s}
.mob-menu.open li:nth-child(3){transition-delay:.12s}
.mob-menu.open li:nth-child(4){transition-delay:.16s}
.mob-menu.open li:nth-child(5){transition-delay:.20s}
.mob-menu.open li:nth-child(6){transition-delay:.24s}
.mob-menu.open li:nth-child(7){transition-delay:.28s}
.mob-menu.open li:nth-child(8){transition-delay:.32s}
.mob-link{display:flex;align-items:center;gap:.75rem;padding:1rem 2rem;font-family:var(--fd);font-size:1rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#d1d5db;border-bottom:1px solid #111827;position:relative;transition:color .2s,background .2s,padding-left .2s}
.mob-link i{font-size:.95rem;width:1.1rem;text-align:center;color:#4b5563;transition:color .2s,transform .2s}
.mob-link::before{content:'';position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--red);transform:scaleY(0);transition:transform .2s}
.mob-link:hover,.mob-link:active{color:var(--red);background:#0d0d0d;padding-left:2.5rem}
.mob-link:hover i,.mob-link:active i{color:var(--red);transform:scale(1.15)}
.mob-link:hover::before,.mob-link:active::before{transform:scaleY(1)}
.mob-link.active{color:var(--red);background:#0a0a0a;padding-left:2.5rem}
.mob-link.active i{color:var(--red)}
.mob-link.active::before{transform:scaleY(1)}
.mob-link .ripple{position:absolute;border-radius:50%;background:rgba(220,38,38,.25);transform:scale(0);animation:ripple .5s linear;pointer-events:none}

/* lang */
.lang-wrap{position:relative}
.lang-btn{display:flex;align-items:center;justify-content:center;padding:4px 6px;border-radius:6px;transition:background .2s;position:relative;overflow:hidden}
.lang-btn img{max-height:22px;width:auto;object-fit:contain;border-radius:2px}
.lang-btn::after{content:'';position:absolute;inset:0;background:rgba(220,38,38,.15);border-radius:6px;opacity:0;transform:scale(.6);transition:opacity .25s,transform .25s}
.lang-btn:hover::after,.lang-btn:focus::after{opacity:1;transform:scale(1)}
.lang-btn:hover{background:rgba(220,38,38,.08)}
.lang-drop{position:absolute;top:calc(100% + 8px);right:0;background:#111827;border:1px solid var(--border-dark);border-radius:8px;min-width:160px;z-index:200;overflow:hidden;transform:scaleY(0);transform-origin:top right;opacity:0;pointer-events:none;transition:transform .25s,opacity .2s}
.lang-drop.open{transform:scaleY(1);opacity:1;pointer-events:auto}
.lang-drop a{display:flex;align-items:center;gap:10px;padding:10px 16px;color:#fff;font-family:var(--fd);font-weight:700;letter-spacing:.05em;font-size:14px;transition:background .2s}
.lang-drop a:hover{background:var(--border-dark)}
.lang-drop a img{width:26px;height:19px;object-fit:cover;border-radius:2px}
.mob-lang{padding:1.25rem 1.5rem 1.75rem;background:#050505;border-top:1px solid #1f2937}
.mob-lang__lbl{display:flex;align-items:center;gap:.5rem;font-family:var(--fd);font-size:.6rem;font-weight:900;letter-spacing:.25em;text-transform:uppercase;color:#4b5563;margin-bottom:.75rem}
.mob-lang__lbl::before,.mob-lang__lbl::after{content:'';flex:1;height:1px;background:#1f2937}
.mob-lang__flags{display:flex;gap:.6rem;flex-wrap:wrap}
.flag-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:14px 8px;border-radius:10px;border:1px solid #1f2937;background:#111827;flex:1;min-height:75px;transition:border-color .2s,background .2s,transform .15s}
.flag-btn img{width:40px;height:27px;object-fit:cover;border-radius:4px}
.flag-btn span{font-family:var(--fd);font-size:.65rem;font-weight:900;letter-spacing:.12em;color:#6b7280;text-transform:uppercase}
.flag-btn:hover,.flag-btn:focus{border-color:var(--red);background:#1a0a0a;transform:translateY(-2px)}
.flag-btn:hover span,.flag-btn:focus span,.flag-btn.active span{color:var(--red)}
.flag-btn.active{border-color:var(--red);background:#1a0808}

@media(min-width:1180px){.navbar__desktop{display:flex}.navbar__burger{display:none}}
@media(max-width:1099px){.navbar.hide{transform:translateY(-100%)}}


/* ================================================================
   COMMON SECTION ELEMENTS
   ================================================================ */
.eyebrow{display:inline-flex;align-items:center;gap:6px;font-family:var(--fd);font-size:1.1rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:.75rem}
.eyebrow::before{content:'';display:block;width:20px;height:2px;background:var(--red)}

.eyebrow--center{justify-content:center}
.eyebrow--dark{color:rgba(220,38,38,.8)}

.section-title{font-family:var(--fd);font-weight:900;letter-spacing:-.01em;text-transform:uppercase;font-size:clamp(2rem,5vw,3rem);line-height:1}
.section-title span{color:var(--red)}

.section-title--light{color:#fff}
.section-title--sm{font-size:clamp(1.5rem,3vw,2.2rem);margin-bottom:1.25rem}

.divider{display:flex;align-items:center;gap:12px;margin:0 auto 2.5rem;width:fit-content}
.divider::before,.divider::after{content:'';display:block;width:40px;height:2px;background:var(--red)}
.divider i{color:var(--red);font-size:.75rem}

.divider--flush{margin-bottom:0}
.divider--sm{margin-bottom:1rem}

.section-header{margin-bottom:3.5rem}

.reveal{opacity:0;transform:translateY(30px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-l{opacity:0;transform:translateX(-40px);transition:opacity .7s ease,transform .7s ease}
.reveal-l.visible{opacity:1;transform:translateX(0)}
.reveal-r{opacity:0;transform:translateX(40px);transition:opacity .7s ease,transform .7s ease}
.reveal-r.visible{opacity:1;transform:translateX(0)}

/* ================================================================
   BUTTONS
   ================================================================ */
.btn{display:inline-flex;align-items:center;gap:8px;font-family:var(--fd);font-weight:800;font-size:1rem;letter-spacing:.1em;text-transform:uppercase;padding:.9rem 1.75rem;transition:background .2s,transform .2s,color .2s,border-color .2s;white-space:nowrap}
.btn:hover{transform:translateY(-2px)}
.btn--red{background:var(--red);color:#fff;border:2px solid var(--red)}
.btn--red:hover{background:#b91c1c;border-color:#b91c1c}
.btn--outline{background:transparent;color:#fff;border:2px solid rgba(255,255,255,.4)}
.btn--outline:hover{background:#fff;color:#000;border-color:#fff}

/* ================================================================
   HERO
   ================================================================ */
.hero{min-height:100vh;background:radial-gradient(ellipse at 70% 50%,rgba(37,99,235,.25) 0%,transparent 60%),radial-gradient(ellipse at 20% 80%,rgba(220,38,38,.15) 0%,transparent 50%),linear-gradient(135deg,#000 0%,#0d1b3e 55%,#0a1628 100%);position:relative;overflow:hidden;display:flex;align-items:center;padding-top:80px;color:#fff}
.hero::before{content:'';position:absolute;right:-5%;top:-10%;width:55%;height:120%;background-image:repeating-linear-gradient(60deg,rgba(220,38,38,.04) 0,rgba(220,38,38,.04) 1px,transparent 1px,transparent 30px),repeating-linear-gradient(120deg,rgba(37,99,235,.04) 0,rgba(37,99,235,.04) 1px,transparent 1px,transparent 30px);pointer-events:none;z-index:0}
.hero::after{content:'';position:absolute;left:0;bottom:0;width:100%;height:6px;background:linear-gradient(90deg,var(--red) 0%,var(--blue-mid) 50%,transparent 100%);z-index:2}
.hero__inner{position:relative;z-index:2;display:grid;grid-template-columns:1fr;gap:3rem;align-items:center;width:100%;padding:4rem clamp(1rem,5vw,5rem)}
@media(min-width:768px){.hero__inner{grid-template-columns:1fr 1fr}}
.hero__content{display:flex;flex-direction:column;gap:2rem}
.hero__eyebrow{display:flex;align-items:center;gap:10px;font-family:var(--fd);font-size:1.3rem;font-weight:800;letter-spacing:.25em;text-transform:uppercase;color:rgba(220,38,38,.9);opacity:0;transform:translateX(-20px);animation:fadeL .7s ease .1s forwards}
.hero__eyebrow::before{content:'';display:block;width:28px;height:2px;background:var(--red)}
.hero__title{font-family:var(--fd);font-weight:900;line-height:.95;letter-spacing:-.01em}
.htl{overflow:hidden;display:block}
.hero__small{display:block;font-size:clamp(1rem,2.5vw,1.75rem);font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:rgba(255,255,255,.9);opacity:0;transform:translateY(100%);animation:slideU .7s cubic-bezier(.16,1,.3,1) .15s forwards}
.hero__main{display:block;font-size:clamp(3rem,9vw,7.5rem);color:#ef4444;text-transform:uppercase;opacity:0;transform:translateY(100%);animation:slideU .7s cubic-bezier(.16,1,.3,1) .3s forwards}
.hero__sub{display:block;font-size:clamp(2.5rem,7vw,6rem);color:#60a5fa;text-transform:uppercase;opacity:0;transform:translateY(100%);animation:slideU .7s cubic-bezier(.16,1,.3,1) .45s forwards}
.hero__quote{background:rgba(255,255,255,.05);border-left:4px solid var(--red);padding:1.25rem 1.5rem 1.25rem 2.75rem;position:relative;opacity:0;transform:translateX(-20px);animation:fadeL .8s ease .7s forwards}
.hero__quote::before{content:'\201C';position:absolute;left:10px;top:-12px;font-size:4.5rem;line-height:1;color:var(--red);opacity:.25;font-family:Georgia,serif}
.hero__quote p{font-style:italic;color:rgba(255,255,255,.85);font-size:1rem;line-height:1.6}
.hero__quote cite{display:block;font-family:var(--fd);font-weight:800;font-size:.8rem;letter-spacing:.1em;text-transform:uppercase;color:#fff;margin-top:.5rem;font-style:normal}
.hero__cta{display:flex;flex-wrap:wrap;gap:1rem;opacity:0;transform:translateY(15px);animation:fadeU .7s ease .9s forwards}
.hero__visual{display:flex;justify-content:center;opacity:0;transform:scale(.85) rotate(-5deg);animation:logoIn 1s cubic-bezier(.34,1.56,.64,1) .5s forwards}
.hero__visual-wrap{position:relative;width:100%;max-width:clamp(160px,30vw,360px)}
.hero__glow{position:absolute;inset:-30%;background:radial-gradient(ellipse,rgba(37,99,235,.3) 0%,transparent 70%);pointer-events:none}
.hero__img{width:100%;height:auto;position:relative;z-index:1;filter:drop-shadow(0 0 40px rgba(37,99,235,.4))}

/* ================================================================
   TAEKWONDO SECTION
   ================================================================ */
.tkd{padding:5rem 0;background:var(--gray-50)}
.tkd__grid{display:grid;grid-template-columns:1fr;gap:4rem;align-items:center}
@media(min-width:768px){.tkd__grid{grid-template-columns:1fr 1fr}}
.tkd__text p{color:var(--gray-700);font-size:1.1rem;line-height:1.7;margin-bottom:1.25rem}
.tkd__text p:last-child{margin-bottom:0}
.tkd__text strong{color:var(--gray-900)}
.martial-quote{position:relative;padding:1.5rem 2rem 1.5rem 3rem;border-left:5px solid var(--red);background:#fff;box-shadow:0 10px 30px rgba(0,0,0,.08)}
.martial-quote::before{content:'\201C';position:absolute;left:12px;top:-10px;font-size:5rem;line-height:1;color:var(--red);opacity:.3;font-family:Georgia,serif}
.martial-quote p{color:var(--gray-800);font-weight:700;font-size:1.1rem;font-style:italic;line-height:1.6}
.valeur-grid{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;list-style:none;padding:0;margin:0}
.vc{border-radius:0;padding:1.5rem 2rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:160px;color:#fff;position:relative;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.25);transition:transform .3s,box-shadow .3s}
.vc::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at center,rgba(255,255,255,.08) 0%,transparent 60%);opacity:0;transition:opacity .3s}
.vc:hover::before{opacity:1}
.vc:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.4)}
.vc i{font-size:1.8rem;margin-bottom:.75rem}
.vc h3{font-family:var(--fd);font-weight:800;font-size:1rem;letter-spacing:.05em;text-transform:uppercase;margin-bottom:4px}
.vc p{font-size:1rem;opacity:.75;line-height:1.4}
.vc--black{background:linear-gradient(135deg,#581c87,#2e1065)}
.vc--blue{background:linear-gradient(135deg,#1d4ed8,#1e3a8a)}
.vc--red{background:linear-gradient(135deg,#dc2626,#7f1d1d)}
.vc--slate{background:linear-gradient(135deg,#134e4a,#042f2e)}

.fondateur{margin-top:4rem;background:#f8f8f8;border-top:10px solid var(--red);box-shadow:0 20px 60px rgba(0,0,0,.1);overflow:hidden}
.fondateur__grid{display:grid;grid-template-columns:1fr}
@media(min-width:768px){.fondateur__grid{grid-template-columns:260px 1fr}}
.fondateur__portrait{display:flex;flex-direction:column;align-items:center;justify-content:stretch;padding:1rem;background:#f0f0f0;align-self:stretch}
@media(min-width:768px){.fondateur__portrait{border-right:1px solid #e5e7eb}}
.fondateur__figure{background:#ffffff;box-shadow:0 8px 30px rgba(0,0,0,.12);padding:1.25rem 1.25rem 1rem;width:100%;max-width:200px;margin:0;display:flex;flex-direction:column;flex:1;height:100%}
.fondateur__figure img{width:100%;flex:1;object-fit:cover;object-position:top}
.fondateur__caption{padding-top:.75rem;border-top:2px solid var(--red);margin-top:.75rem;text-align:center}
.fondateur__name{font-family:var(--fd);font-weight:900;font-size:.95rem;letter-spacing:.05em;text-transform:uppercase;color:#111}
.fondateur__dates{font-size:.7rem;color:#030000;letter-spacing:.15em;text-transform:uppercase;margin-top:4px}
.fondateur__text{background:#fff;padding:2rem 2.5rem;display:flex;flex-direction:column;justify-content:center}
.fondateur__text p{color:var(--gray-700);line-height:1.7;font-size:1rem;margin-bottom:1rem}
.fondateur__text p:last-child{margin-bottom:0}

/* ================================================================
   PRINCIPES
   ================================================================ */
.principes{padding:0;background:#000;color:#fff}
.principes__header{padding:3.5rem 1rem 2.5rem;text-align:center}
.principes__grid{display:grid;grid-template-columns:repeat(2,1fr);list-style:none;padding:0;margin:0}
@media(min-width:1024px){.principes__grid{grid-template-columns:repeat(5,1fr)}}
.pc{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:200px;padding:2rem 1.5rem;text-align:center;position:relative;overflow:hidden;transition:transform .3s}
.pc::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;transform:scaleX(0);transition:transform .3s}
.pc:hover{transform:translateY(-4px)}
.pc:hover::after{transform:scaleX(1)}
.pc__n{font-family:var(--fd);font-size:4rem;font-weight:900;opacity:.08;position:absolute;top:-10px;right:10px;line-height:1;color:#fff;pointer-events:none}
.pc i{font-size:2rem;margin-bottom:.75rem;display:block}
.pc h3{font-family:var(--fd);font-size:1.05rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.5rem;color:#fff}
.pc p{font-size:1rem;color:rgba(255,255,255,.78);line-height:1.4}
.pc--r{background:linear-gradient(160deg,#dc2626 0%,#7f1d1d 100%)}.pc--r::after{background:#fca5a5}
.pc--b{background:linear-gradient(160deg,#2563eb 0%,#1e3a8a 100%)}.pc--b::after{background:#93c5fd}
.pc--y{background:linear-gradient(160deg,#d97706 0%,#78350f 100%)}.pc--y::after{background:#fcd34d}
.pc--g{background:linear-gradient(160deg,#16a34a 0%,#14532d 100%)}.pc--g::after{background:#86efac}
.pc--v{background:linear-gradient(160deg,#9333ea 0%,#581c87 100%)}.pc--v::after{background:#d8b4fe}

/* ================================================================
   COURS
   ================================================================ */
.cours{padding:5rem 0;background:var(--gray-50)}
.cours__grid{display:grid;grid-template-columns:1fr;gap:1.5rem;max-width:860px;margin:0 auto 2.5rem}
@media(min-width:640px){.cours__grid{grid-template-columns:1fr 1fr}}
.cc{background:#fff;overflow:hidden;box-shadow:0 10px 40px rgba(0,0,0,.1);transition:transform .3s,box-shadow .3s}
.cc:hover{transform:translateY(-4px);box-shadow:0 20px 50px rgba(0,0,0,.15)}
.cc__head{padding:2rem 2rem 1.5rem;position:relative;overflow:hidden}
.cc__head::before{content:'';position:absolute;right:-20px;top:-20px;width:100px;height:100px;border-radius:50%;background:rgba(255,255,255,.1)}
.cc__head--blue{background:#1d4ed8}
.cc__head--red{background:var(--red)}
.cc__age{font-family:var(--fd);font-size:.95rem;font-weight:800;letter-spacing:.15em;text-transform:uppercase;opacity:.75;color:#fff}
.cc__title{font-family:var(--fd);font-weight:900;font-size:2rem;letter-spacing:-.01em;text-transform:uppercase;color:#fff;margin-top:4px}
.cc__body{padding:2rem}
.h-row{display:flex;justify-content:space-between;align-items:center;padding:1.25rem 0;border-bottom:1px solid var(--gray-100);gap:1rem}
.h-row:last-child{border-bottom:none}
.h-jour{font-family:var(--fd);font-weight:700;font-size:1rem;letter-spacing:.05em;text-transform:uppercase;color:var(--gray-700)}
.h-heure{font-family:var(--fd);font-weight:900;font-size:1.3rem;color:var(--red);letter-spacing:-.01em}
.h-badge{font-family:var(--fd);font-weight:800;font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;padding:4px 12px;flex-shrink:0;white-space:nowrap}
.h-badge--bl{background:#dbeafe;color:#1d4ed8}
.h-badge--gr{background:#dcfce7;color:#16a34a}
.cours__info{background:#eff6ff;border:2px solid #1d4ed8;border-left:5px solid #1d4ed8;padding:1.5rem 2rem;max-width:860px;margin:0 auto;border-radius:.5rem}
.cours__info-row{display:flex;align-items:flex-start;gap:.75rem;font-size:.95rem;color:var(--gray-800)}
.cours__info-row+.cours__info-row{margin-top:.75rem}
.cours__info-row i{color:#2563eb;margin-top:3px;flex-shrink:0}

/* ================================================================
   EQUIPE
   ================================================================ */
.equipe{background:var(--gray-50);padding:0 0 3rem}
.equipe__head{padding-top:1.5rem;margin-bottom:1.5rem}
.prof-card{background:var(--surface-dark);border:1px solid var(--border-dark);border-top:4px solid var(--red);max-width:520px;width:100%;margin:55px auto 0;position:relative}
.prof-card-wrap{display:flex;justify-content:center}
.prof-ava{position:absolute;left:50%;transform:translateX(-50%);top:-50px;z-index:2}
.prof-ava img{width:100px;height:100px;border-radius:50%;border:3px solid var(--red);object-fit:cover;object-position:center 5%;box-shadow:0 6px 20px rgba(220,38,38,.3),0 0 0 5px var(--surface-dark)}
.prof-ava__badge{position:absolute;bottom:-6px;left:50%;transform:translateX(-50%);background:var(--red);color:#fff;font-family:var(--fd);font-weight:900;font-size:.75rem;letter-spacing:.2em;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.4);box-shadow: 0 2px 8px rgba(0,0,0,.35) ;padding:5px 14px; border: 2px solid #0a0000;white-space:nowrap}
.prof-body{padding:62px 1.75rem 1.75rem;text-align:center}
.prof-name{font-family:var(--fd);font-weight:900;font-size:1.6rem;letter-spacing:.02em;text-transform:uppercase;color:#fff;margin-bottom:2px}
.prof-role{font-family:var(--fd);font-weight:700;font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--red);margin-bottom:1rem}
.prof-bio{color:var(--gray-400);line-height:1.6;margin-bottom:1.25rem;font-size:.92rem}
.prof-stats{display:flex;gap:.75rem;justify-content:center;margin-bottom:1.25rem;flex-wrap:wrap}
.prof-stat{display:flex;flex-direction:column;align-items:center;padding:1rem;border:1px solid rgba(220,38,38,.2);background:rgba(220,38,38,.05);flex:1;transition:transform .2s,box-shadow .2s,background .2s}
@media(hover:hover){.prof-stat:hover{transform:scale(1.08);background:rgba(220,38,38,.12);box-shadow:0 8px 20px rgba(220,38,38,.2)}}
.prof-stat__n{font-family:var(--fd);font-size:2rem;font-weight:900;color:var(--red);line-height:1}
.prof-stat__l{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin-top:4px;text-align:center}
.prof-badges{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:1.25rem}
.pb{display:inline-flex;align-items:center;gap:6px;padding:4px 12px;border-radius:20px;font-family:var(--fd);font-size:.72rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase;transition:transform .2s,box-shadow .2s}
@media(hover:hover){.pb:hover{transform:scale(1.1);box-shadow:0 6px 16px rgba(0,0,0,.3)}}
.pb--red{background:rgba(220,38,38,.15);color:#fca5a5;border:1px solid rgba(220,38,38,.3)}
.pb--blue{background:rgba(37,99,235,.15);color:#93c5fd;border:1px solid rgba(37,99,235,.3)}
.pb--green{background:rgba(22,163,74,.15);color:#86efac;border:1px solid rgba(22,163,74,.3)}
.pb--yellow{background:rgba(217,119,6,.15);color:#fcd34d;border:1px solid rgba(217,119,6,.3)}
.pb--purple{background:rgba(147,51,234,.15);color:#d8b4fe;border:1px solid rgba(147,51,234,.3)}
.prof-footer{border-top:1px solid var(--border-dark);padding-top:1rem}
.prof-email{display:inline-flex;align-items:center;gap:8px;color:var(--red);font-family:var(--fd);font-weight:800;font-size:.88rem;letter-spacing:.1em;text-transform:uppercase;transition:color .2s}
.prof-email:hover{color:#fff}

/* ================================================================
   GALERIE
   ================================================================ */
.galerie{padding:5rem 0;background:var(--gray-50)}
.carousel-wrap{position:relative;overflow:hidden;max-width:680px;margin:0 auto;box-shadow:0 30px 60px rgba(0,0,0,.25)}
.carousel-track{display:flex;transition:transform .4s cubic-bezier(.4,0,.2,1);will-change:transform}
.c-slide{min-width:100%;max-height:420px;overflow:hidden;display:flex;align-items:center;justify-content:center;position:relative;background-size:cover;background-position:center}
.c-slide::before{content:'';position:absolute;inset:0;background-image:inherit;background-size:cover;background-position:center;filter:blur(20px);transform:scale(1.1);z-index:0}
.c-slide img{position:relative;z-index:1;width:100%;max-height:420px;object-fit:contain;pointer-events:none;user-select:none}
.c-slide video{position:relative;z-index:1;width:100%;max-height:420px;object-fit:contain}
.c-slide--video{min-width:100%;width:100%;flex-shrink:0}
.c-slide--video video{width:100%;object-fit:contain;position:relative;z-index:1;max-height:420px}
.c-btn{position:absolute;top:50%;transform:translateY(-50%);background:rgba(0,0,0,.6);color:#fff;border:1px solid rgba(255,255,255,.1);width:44px;height:44px;display:flex;align-items:center;justify-content:center;font-size:.9rem;z-index:10;transition:background .2s,border-color .2s}
.c-btn:hover{background:rgba(220,38,38,.9);border-color:var(--red)}
.c-btn--p{left:0}
.c-btn--n{right:0}
.c-counter{position:absolute;top:12px;right:0;background:var(--red);color:#fff;font-family:var(--fd);font-size:13px;font-weight:800;letter-spacing:.05em;padding:4px 12px;z-index:10}
.c-dots{display:flex;justify-content:center;gap:6px;margin-top:16px}
.c-dot{width:6px;height:6px;background:#d1d5db;border:none;padding:0;transition:background .2s,width .2s;cursor:pointer}
.c-dot.active{background:var(--red);width:24px}
.c-caption{position:absolute;bottom:0;left:0;right:0;z-index:5;padding:.75rem 1.25rem;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.4) 75%,transparent 100%);display:flex;align-items:center;gap:.6rem;pointer-events:none}
.c-caption__ico{width:28px;height:28px;background:var(--red);display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:.65rem;color:#fff}
.c-caption__t{font-family:var(--fd);font-size:.85rem;font-weight:800;color:#fff;letter-spacing:.08em;text-transform:uppercase;line-height:1.2;text-shadow:0 1px 4px rgba(0,0,0,.5)}
.c-caption__d{font-size:.7rem;color:rgba(255,255,255,.7);line-height:1.3;text-shadow:0 1px 3px rgba(0,0,0,.5)}
.lightbox{display:none;position:fixed;inset:0;background:rgba(0,0,0,.96);z-index:9999;align-items:center;justify-content:center}
.lightbox.open{display:flex}
.lightbox img{max-width:90vw;max-height:85vh;object-fit:contain;box-shadow:0 0 80px rgba(0,0,0,.8)}
.lb-close{position:absolute;top:20px;right:24px;color:#fff;font-size:2rem;background:none;border:none;line-height:1}
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-size:1.5rem;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);padding:14px 18px;transition:background .2s}
.lb-nav:hover{background:rgba(220,38,38,.7)}
.lb-prev{left:16px}
.lb-next{right:16px}
.c-slide--video {background: #000;min-height: 420px;align-items: stretch;}

/* ================================================================
   INFOS
   ================================================================ */
.infos{padding:5rem 0;background:var(--gray-50)}
.map-block{display:grid;grid-template-columns:1fr;box-shadow:0 20px 60px rgba(0,0,0,.12);border-top:4px solid var(--red);overflow:hidden;margin-bottom:4rem}
@media(min-width:640px){.map-block{grid-template-columns:1fr 1fr}}
.map-block__map{height:280px;width:100%}
.map-block__map iframe{width:100%;height:100%;display:block;border:0}
@media(min-width:640px){.map-block__map{height:auto;min-height:320px}}
.map-block__addr{background:var(--gray-900);color:#fff;padding:2.5rem;display:flex;flex-direction:column;justify-content:center;gap:1.5rem}
.info-row{display:flex;align-items:flex-start;gap:1rem}
.info-row__ico{color:var(--red);font-size:1.1rem;margin-top:3px;flex-shrink:0}
.info-row__lbl{font-family:var(--fd);font-weight:800;font-size:.75rem;letter-spacing:.15em;text-transform:uppercase;color:var(--gray-400);margin-bottom:4px}
.info-row__val{color:#fff;font-size:1rem}
.info-row__val a{color:#fff;transition:color .2s}
.info-row__val a:hover{color:#ef4444}
.info-row__sub{color:#d1d5db;font-size:.88rem;font-weight:600;display:block;margin-top:4px}

.tarifs-eyebrow{margin-bottom:.5rem}
.tarifs-title{font-family:var(--fd);font-weight:900;font-size:2.2rem;text-transform:uppercase;color:var(--gray-900);margin-bottom:2rem}
.tarifs-title i{color:var(--red);margin-right:.5rem}
.tarifs-grid{display:grid;grid-template-columns:1fr;gap:1rem}
@media(min-width:640px){.tarifs-grid{grid-template-columns:1fr 1fr}}
.tarif{background:#fff;padding:1.5rem;position:relative;overflow:hidden;border-left:5px solid transparent;transition:transform .3s,box-shadow .3s}
.tarif::before{content:'';position:absolute;top:0;right:0;width:60px;height:60px;background:currentColor;opacity:.04;clip-path:polygon(100% 0,0 0,100% 100%)}
.tarif:hover{transform:translateY(-4px);box-shadow:0 15px 35px rgba(0,0,0,.1)}
.tarif--essai{border-left-color:#1d4ed8}
.tarif--mensuel{border-left-color:var(--red)}
.tarif--trimestriel{border-left-color:#16a34a}
.tarif--annuel{border-left-color:#d97706}
.tarif__price{font-family:var(--fd);font-size:2.5rem;font-weight:900;color:var(--red);letter-spacing:-.02em;line-height:1}
.tarif__lbl{font-family:var(--fd);font-weight:700;font-size:1.05rem;letter-spacing:.03em;text-transform:uppercase;color:#111;margin-bottom:4px}
.tarif__desc { font-size: 1rem; color: var(--gray-700); margin-top: .5rem; }
.tarif__family{border-top:1px solid var(--gray-100);padding-top:.75rem;margin-top:.75rem}
.tarif__family-title{font-family:var(--fd);font-weight:800;font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:#6b7280;margin-bottom:.5rem}
.tarif__family-row{font-size:.85rem;color:var(--gray-700);margin-bottom:2px}
.tarif__family-row strong{color:#d97706}
.dobok-banner{background:#1a1f2e;color:#fff;padding:1.5rem 2rem;margin-top:1.5rem;text-align:center;border:1px solid var(--border-dark);border-left:4px solid var(--red)}
.dobok-banner p{font-family:var(--fd);font-weight:800;font-size:1.05rem;letter-spacing:.1em;text-transform:uppercase}
.dobok-banner i{color:var(--red);margin-right:.5rem}
.dobok-banner{padding:0;overflow:hidden}
.dobok-banner__toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.5rem 2rem;background:none;color:#fff;text-align:left;cursor:pointer;transition:background .2s}
.dobok-banner__toggle:hover{background:rgba(255,255,255,.03)}
.dobok-banner__toggle p{font-family:var(--fd);font-weight:800;font-size:1.05rem;letter-spacing:.1em;text-transform:uppercase;margin:0}
.dobok-banner__toggle i.fa-tshirt{color:var(--red);margin-right:.5rem}
.dobok-banner__chevron{color:var(--red);font-size:1rem;flex-shrink:0;transition:transform .25s ease}
.dobok-banner.open .dobok-banner__chevron{transform:rotate(180deg)}
.dobok-banner__detail{max-height:0;overflow:hidden;transition:max-height .35s ease;background:#151a26;border-top:0px solid var(--border-dark)}
.dobok-banner.open .dobok-banner__detail{border-top-width:1px}
.dobok-banner__content{display:flex;gap:1.5rem;align-items:center;padding:1.5rem 2rem}
.dobok-banner__img{width:140px;height:140px;object-fit:cover;flex-shrink:0;border:1px solid var(--border-dark)}
.dobok-banner__text p{color:var(--gray-400);font-size:.92rem;line-height:1.6;margin-bottom:.6rem}
.dobok-banner__text p:last-child{margin-bottom:0}
@media(max-width:540px){.dobok-banner__content{flex-direction:column;text-align:center}.dobok-banner__img{width:100%;max-width:220px;height:auto}}
.duo-banner{background:#1a1f2e;margin-top:1.5rem;border:1px solid var(--border-dark);border-left:4px solid #d97706;overflow:hidden}
.duo-banner__toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1.5rem 2rem;background:none;color:#fff;text-align:left;cursor:pointer;transition:background .2s}
.duo-banner__toggle:hover{background:rgba(255,255,255,.03)}
.duo-banner__toggle p{font-family:var(--fd);font-weight:800;font-size:1.05rem;letter-spacing:.1em;text-transform:uppercase;margin:0}
.duo-banner__toggle i.fa-users{color:#d97706;margin-right:.5rem}
.duo-banner__chevron{color:#d97706;font-size:1rem;flex-shrink:0;transition:transform .25s ease}
.duo-banner.open .duo-banner__chevron{transform:rotate(180deg)}
.duo-banner__detail{max-height:0;overflow:hidden;transition:max-height .35s ease;background:#151a26;border-top:0px solid var(--border-dark)}
.duo-banner.open .duo-banner__detail{border-top-width:1px}
.duo-banner__detail p{padding:0 2rem;color:var(--gray-400);font-size:.92rem;line-height:1.6;margin:0}
.duo-banner__detail p:first-child{padding-top:1.1rem}
.duo-banner__detail p:last-child{padding-bottom:1.1rem}

/* ================================================================
   CONTACT
   ================================================================ */
.contact{padding:3.5rem 0;background:var(--surface-darker)}
.form-wrap{background:var(--surface-dark);border-top:4px solid var(--red);padding:2rem}
.form-group{margin-bottom:1rem}
.form-label{display:block;font-family:var(--fd);font-weight:700;font-size:.88rem;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-400);margin-bottom:.5rem}
.form-label .req{color:var(--red)}
.form-input{width:100%;padding:.65rem 1rem;border:2px solid var(--border-dark);background:var(--surface-darker);color:#fff;font-family:var(--fb);font-size:1rem;transition:border-color .2s,box-shadow .2s}
.form-input::placeholder{color:#4b5563}
.form-input:focus{outline:none;border-color:var(--red);box-shadow:0 0 0 3px rgba(220,38,38,.15)}
.form-input.err{border-color:#dc2626;box-shadow:0 0 0 3px rgba(220,38,38,.25)}
.form-input.ok{border-color:#16a34a;box-shadow:0 0 0 3px rgba(22,163,74,.15)}
.select.form-input option{background:var(--surface-darker);color:#fff}
.form-submit{text-align:center}

/* ---- Formulaire Dynamis (deux colonnes + validation) ---- */
.dyn-form .dyn-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media(max-width:540px){.dyn-form .dyn-row{grid-template-columns:1fr}}
.dyn-form .dyn-group{display:flex;flex-direction:column;gap:6px;margin-bottom:1.2rem}
.dyn-form .dyn-label{font-family:var(--fd);font-weight:700;font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#9ca3af}
.dyn-form .dyn-label .req{color:var(--red);margin-left:2px}
.dyn-form .dyn-input{background:var(--surface-darker);border:1px solid var(--border-dark);border-radius:0;padding:.75rem 1rem;color:#f3f4f6;font-family:var(--fb);font-size:15px;outline:none;transition:border-color .2s,background .2s;width:100%;box-sizing:border-box;appearance:none;-webkit-appearance:none}
.dyn-form .dyn-input:focus{border-color:var(--red);background:#1e1e1e}
.dyn-form .dyn-input::placeholder{color:#4b5563}
.dyn-form select.dyn-input{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236b7280' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;background-color:var(--surface-darker);padding-right:2.5rem;cursor:pointer}
.dyn-form select.dyn-input option{background:var(--surface-darker);color:#f3f4f6}
.dyn-form textarea.dyn-input{resize:vertical;min-height:140px}
.dyn-form .dyn-divider{border:none;border-top:1px solid var(--border-dark);margin:.5rem 0 1.2rem}
.dyn-form .dyn-input.error{border-color:var(--red)}
.dyn-form .dyn-error-msg{color:#f87171;font-size:12px;margin-top:2px;display:none}
.dyn-form .dyn-error-msg.visible{display:block}

/* ================================================================
   TOAST
   ================================================================ */
.toast{position:fixed;bottom:30px;left:50%;transform:translateX(-50%) translateY(100px);padding:16px 28px;font-family:var(--fd);font-weight:700;letter-spacing:.05em;font-size:16px;z-index:9999;opacity:0;transition:all .4s ease;pointer-events:none}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}
.toast--ok{background:#16a34a;color:#fff}
.toast--err{background:var(--red);color:#fff}

/* ================================================================
   FAB
   ================================================================ */
 /* --- BOUTON FLOTTANT (FAB) DÉFINITIF --- */
/* --- BOUTON FLOTTANT (FAB) DÉFINITIF --- */
#fab {position:fixed;bottom:30px;right:30px;z-index:9000;display:flex;flex-direction:column;align-items:center;justify-content:center;}

/* Bouton principal */
.fab__main {position:relative;width:72px;height:72px;background:var(--red, #dc2626);border-radius:50%;display:flex;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.34,1.56,.64,1);z-index:2;box-shadow:0 4px 15px rgba(220, 38, 38, 0.4);border:none;cursor:pointer;margin:0;padding:0;}
.fab__main:hover {transform:scale(1.08); background:#b91c1c;}

/* État ouvert du bouton principal */
.fab__main.open {background:#1a1a1a;box-shadow:0 6px 16px rgba(0, 0, 0, 0.3);transform:rotate(90deg) scale(1.05)}
.fab__main i {font-size:1.6rem;color:#fff;transition:all .3s;pointer-events:none;}
.fab__main.open i {color:var(--red, #dc2626)}

/* Conteneur du sous-menu - Centrage absolu FORCÉ */
.fab__fan {position:absolute;bottom:80px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:none;visibility:hidden;margin:0;padding:0;}

/* Les petits boutons (Liens) */
.fab__item {
  width:64px;
  height:64px;
  background:#1a1a1a;
  border-radius:50%;
  color:#fff !important;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:1.5rem;
  text-decoration:none;
  opacity:0;
  visibility:hidden;
  margin-bottom:-15px; /* Pour l'effet de glissement vertical à l'ouverture */
  transition:all .3s cubic-bezier(.34,1.56,.64,1);
  box-shadow:0 4px 10px rgba(0,0,0,0.25);
}

/* FORÇAGE : Nettoyage de l'ancienne balise span pour supprimer le bug d'affichage */
.fab__ico {
  display:flex;
  align-items:center;
  justify-content:center;
  width:100% !important;
  height:100% !important;
  background:transparent !important;
  border:none !important;
  transform:none !important;
}

/* Délais d'animation d'apparition fluide */
.fab__item:nth-child(1) {transition-delay:0s}
.fab__item:nth-child(2) {transition-delay:.07s}
.fab__item:nth-child(3) {transition-delay:.14s}

/* Ouverture du menu */
.fab__fan.open {visibility:visible;}
.fab__fan.open .fab__item {
  opacity:1;
  visibility:visible;
  margin-bottom:0;
  pointer-events:auto;
}

/* Effets au survol avec le dégradé conservé */
.fab__item--ph:hover {background:var(--red, #dc2626);transform:scale(1.15)}
.fab__item--em:hover {background:#1e40af;transform:scale(1.15)}
.fab__item--ig:hover {background:linear-gradient(135deg,#f59e0b,#dc2626,#9333ea);transform:scale(1.15)}
/* Tooltips au survol (souris uniquement) */
.fab__item{position:relative}
.fab__item::after{
  content:attr(data-tip);
  position:absolute;
  right:calc(100% + 12px);
  top:50%;
  transform:translateY(-50%);
  background:#1a1a1a;
  color:#fff;
  font-family:var(--fd);
  font-size:.75rem;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  padding:6px 12px;
  border-left:3px solid var(--red);
  white-space:nowrap;
  opacity:0;
  pointer-events:none;
  transition:opacity .2s;
}
@media(hover:hover){
  .fab__item:hover::after{opacity:1}
}

/* Overlay sombre sur le reste de la page */
.fab-overlay {position:fixed;inset:0;background:rgba(0,0,0,0);z-index:8999;pointer-events:none;transition:background .3s}
.fab-overlay.active {background:rgba(0,0,0,.4);pointer-events:auto}

/* ================================================================
   FOOTER
   ================================================================ */
.footer{background:var(--gray-900);border-top:2px solid #1f2937;padding:3rem 0;color:var(--gray-400)}
.footer__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;margin-bottom:2.5rem}
@media(min-width:768px){.footer__grid{grid-template-columns:repeat(4,1fr)}}
.footer__brand{display:flex;align-items:center;gap:10px;margin-bottom:1rem}
.footer__brand img{width:36px;height:36px;border-radius:50%;background:#fff;padding:3px}
.footer__brand span{font-family:var(--fd);font-weight:900;font-size:1.1rem;letter-spacing:.05em;text-transform:uppercase;color:#fff}
.footer__tagline{font-size:.88rem;line-height:1.6;margin-bottom:1rem}
.footer__accent{display:flex;gap:8px;align-items:center;font-family:var(--fd);font-size:.62rem;font-weight:800;letter-spacing:.2em;text-transform:uppercase;color:var(--red)}
.footer__accent::before{content:'';display:block;width:18px;height:2px;background:var(--red)}
.footer__col-title{font-family:var(--fd);font-weight:800;font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;color:#fff;margin-bottom:1.25rem}
.footer__links{display:flex;flex-direction:column;gap:.6rem}
.footer__links a{font-family:var(--fd);font-weight:600;letter-spacing:.05em;font-size:.95rem;color:var(--gray-400);transition:color .2s}
.footer__links a:hover{color:#ef4444}
.footer__social{display:inline-flex;align-items:center;gap:10px;font-family:var(--fd);font-weight:700;font-size:.95rem;letter-spacing:.05em;color:var(--gray-400);transition:color .2s}
.footer__social i{font-size:1.2rem}
.footer__social:hover{color:#ef4444}
.footer__bottom{border-top:1px solid #1f2937;padding-top:1.5rem;text-align:center;font-size:.85rem}

/* ================================================================
   KEYFRAMES
   ================================================================ */
@keyframes slideU{to{transform:translateY(0);opacity:1}}
@keyframes fadeL{to{opacity:1;transform:translateX(0)}}
@keyframes fadeU{to{opacity:1;transform:translateY(0)}}
@keyframes logoIn{to{opacity:1;transform:scale(1) rotate(0deg)}}
@keyframes ripple{to{transform:scale(4);opacity:0}}
@keyframes fabPulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.7)}60%{box-shadow:0 0 0 16px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

.honeypot{display:none}


/* ── Variables membres ──────────────────────────────── */
:root {
  --gold: #facc15;
}

/* ── Body membres ───────────────────────────────────── */
body.membres {
  background: var(--gray-900);
  color: #d1d5db;
}

/* ── Page loader ────────────────────────────────────── */
#pageLoader {
  position: fixed; inset: 0; background: var(--gray-900);
  display: flex; align-items: center; justify-content: center;
  z-index: 9999; transition: opacity .35s;
}
#pageLoader.hidden { opacity: 0; pointer-events: none; }
.spinner {
  width: 40px; height: 40px;
  border: 3px solid var(--border-dark);
  border-top-color: var(--red);
  border-radius: 50%;
  animation: spin .7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Navbar membres ─────────────────────────────────── */
.nav-back {
  display: flex; align-items: center; gap: .5rem;
  color: #6b7280; font-size: .875rem; text-decoration: none;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase; transition: color .2s;
}
.nav-back:hover { color: #fff; }

.nav-msg-btn {
  position: relative; background: none; border: none;
  color: #9ca3af; cursor: pointer; padding: .35rem .5rem;
  border-radius: 8px; transition: color .2s, background .2s;
  display: none; align-items: center; gap: .4rem;
  font-family: 'Barlow Condensed', sans-serif;
  font-size: .85rem; font-weight: 700;
  letter-spacing: .06em; text-transform: uppercase;
}
.nav-msg-btn:hover { color: #fff; background: rgba(255,255,255,.06); }
.nav-msg-btn i { font-size: 1.05rem; }

.nav-msg-badge {
  position: absolute; top: -4px; right: -4px;
  background: var(--red); color: #fff;
  font-size: .6rem; font-weight: 900;
  min-width: 17px; height: 17px; border-radius: 100px;
  display: none; align-items: center; justify-content: center;
  border: 2px solid var(--ink); padding: 0 3px; line-height: 1;
}
.nav-msg-badge.show { display: flex; }

.nav-right { display: flex; align-items: center; gap: 1rem; }

.nav-burger {
  display: none; background: none; border: none;
  color: var(--red); font-size: 1.3rem; cursor: pointer;
  padding: .3rem; align-items: center; justify-content: center;
}

.nav-mobile-menu {
  display: none; flex-direction: column;
  background: var(--ink); border-top: 1px solid rgba(220,38,38,.25);
  padding: .5rem 0;
}
.nav-mobile-menu.open { display: flex; }

.nav-mobile-item {
  display: flex; align-items: center; gap: .75rem;
  padding: .9rem 1.5rem;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: 1rem; letter-spacing: .1em; text-transform: uppercase;
  color: #d1d5db; border: none; background: none; cursor: pointer;
  text-decoration: none; transition: color .2s, background .2s;
  border-bottom: 1px solid rgba(255,255,255,.04); position: relative;
}
.nav-mobile-item:last-child { border-bottom: none; }
.nav-mobile-item:hover { color: #fff; background: rgba(255,255,255,.04); }
.nav-mobile-item i { color: #4b5563; font-size: .95rem; width: 1.1rem; text-align: center; }
.nav-mobile-item:hover i { color: var(--red); }

.nav-mobile-badge {
  background: var(--red); color: #fff;
  font-size: .6rem; font-weight: 900;
  min-width: 17px; height: 17px; border-radius: 100px;
  display: none; align-items: center; justify-content: center;
  padding: 0 4px; margin-left: auto;
}
.nav-mobile-badge.show { display: flex; }

@media (max-width: 640px) {
  .nav-right { display: none !important; }
  .nav-burger { display: flex !important; }
}

/* ── Login ──────────────────────────────────────────── */
.login-wrap {
  min-height: 100vh; display: flex; align-items: center;
  justify-content: center; padding: 6rem 1rem 3rem;
  background:
    radial-gradient(ellipse at 70% 50%, rgba(37,99,235,.2) 0%, transparent 60%),
    radial-gradient(ellipse at 20% 80%, rgba(220,38,38,.12) 0%, transparent 50%),
    linear-gradient(135deg, #000 0%, #0d1b3e 55%, #0a1628 100%);
  position: relative; overflow: hidden;
}
.login-wrap::before {
  content: ''; position: absolute; right: -5%; top: -10%;
  width: 55%; height: 120%;
  background-image:
    repeating-linear-gradient(60deg, rgba(220,38,38,.04) 0, rgba(220,38,38,.04) 1px, transparent 1px, transparent 30px),
    repeating-linear-gradient(120deg, rgba(37,99,235,.04) 0, rgba(37,99,235,.04) 1px, transparent 1px, transparent 30px);
  pointer-events: none;
}
.login-card {
  width: 100%; max-width: 440px; position: relative; z-index: 1;
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-top: 4px solid var(--red); padding: 2.5rem;
  box-shadow: 0 32px 80px rgba(0,0,0,.6);
  animation: cardIn .45s cubic-bezier(.22,1,.36,1);
}
@keyframes cardIn {
  from { opacity: 0; transform: translateY(24px); }
  to   { opacity: 1; transform: translateY(0); }
}
.login-top { text-align: center; margin-bottom: 2rem; }
.login-logo {
  width: 72px; height: 72px; margin: 0 auto 1rem; display: block;
  border-radius: 50%; border: 2px solid var(--red);
  padding: 4px; background: var(--ink); object-fit: cover;
}
.login-title {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: 2rem; font-weight: 900; color: #fff; line-height: 1; margin-bottom: .3rem;
}
.login-sub { color: var(--gray-400); font-size: .85rem; }
.login-error {
  display: none; gap: .5rem; align-items: flex-start;
  background: rgba(220,38,38,.12); border: 1px solid rgba(220,38,38,.35);
  color: #fca5a5; font-size: .82rem; padding: .75rem 1rem; margin-bottom: 1.25rem;
}
.login-error.show { display: flex; }
.login-card .form-label {
  color: var(--gray-400); font-family: 'Barlow Condensed', sans-serif;
  font-weight: 700; font-size: .88rem; letter-spacing: .08em; text-transform: uppercase;
}
.login-card .form-input,
.login-card input.form-input {
  background: var(--surface-darker) !important;
  border: 2px solid var(--border-dark) !important;
  color: #fff !important;
}
.login-card .form-input::placeholder { color: #4b5563; }
.login-card .form-input:focus,
.login-card input.form-input:focus {
  border-color: var(--red) !important;
  box-shadow: 0 0 0 3px rgba(220,38,38,.15) !important;
  outline: none;
}
.login-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.login-help { text-align: center; margin-top: 1.5rem; font-size: .78rem; color: #4b5563; line-height: 1.7; }
.login-help a { color: var(--red); text-decoration: none; }
.btn--full { width: 100%; justify-content: center; }
.btn--loading { opacity: .7; cursor: not-allowed; pointer-events: none; }

/* ── Dashboard ──────────────────────────────────────── */
#dashboard { display: none; padding-bottom: 4rem; background: var(--gray-900); }
#dashboard.show { display: block; animation: fadeUp .4s ease both; }
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(16px); }
  to   { opacity: 1; transform: translateY(0); }
}
.dash-banner {
  background:
    radial-gradient(ellipse at 70% 50%, rgba(37,99,235,.25) 0%, transparent 60%),
    linear-gradient(135deg, #000 0%, #0d1b3e 55%, #0a1628 100%);
  border-bottom: 2px solid rgba(220,38,38,.35);
  padding: 2.25rem 0; margin-bottom: 2.5rem;
  position: relative; overflow: hidden;
}
.dash-banner::before {
  content: ''; position: absolute; right: -5%; top: -10%; width: 55%; height: 120%;
  background-image:
    repeating-linear-gradient(60deg, rgba(220,38,38,.04) 0, rgba(220,38,38,.04) 1px, transparent 1px, transparent 30px),
    repeating-linear-gradient(120deg, rgba(37,99,235,.04) 0, rgba(37,99,235,.04) 1px, transparent 1px, transparent 30px);
  pointer-events: none;
}
.dash-banner::after {
  content: 'DYNAMIS'; position: absolute; left: 50%; top: 50%;
  transform: translate(-50%,-50%);
  font-family: 'Barlow Condensed', sans-serif; font-weight: 900;
  font-size: 6rem; color: rgba(255,255,255,.12);
  letter-spacing: -.02em; pointer-events: none; white-space: nowrap;
}
.dash-banner__inner {
  display: flex; align-items: center; justify-content: space-between;
  gap: 1rem; flex-wrap: wrap; position: relative; z-index: 1;
}
.dash-greet__eyebrow {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: .72rem; letter-spacing: .2em; text-transform: uppercase;
  color: rgba(220,38,38,.85); margin-bottom: .25rem;
  display: flex; align-items: center; gap: 8px;
}
.dash-greet__eyebrow::before { content: ''; display: block; width: 20px; height: 2px; background: var(--red); }
.dash-greet__name {
  font-family: 'Barlow Condensed', sans-serif;
  font-size: clamp(1.8rem,4vw,2.8rem); font-weight: 900; color: #fff; line-height: 1;
}
.btn-logout {
  display: flex; align-items: center; gap: .5rem;
  background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.15);
  color: #d1d5db; padding: .55rem 1.2rem;
  font-family: 'Barlow Condensed', sans-serif; font-size: .95rem;
  font-weight: 700; letter-spacing: .08em; text-transform: uppercase;
  cursor: pointer; transition: background .2s, border-color .2s, color .2s; white-space: nowrap;
}
.btn-logout:hover { background: rgba(220,38,38,.15); border-color: rgba(220,38,38,.4); color: #fff; }

/* ── Profil ─────────────────────────────────────────── */
.profile-card {
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-top: 4px solid var(--red); padding: 1.5rem 1.75rem;
  display: flex; gap: 1.5rem; align-items: center; flex-wrap: wrap;
  margin-bottom: 2.5rem; box-shadow: 0 10px 40px rgba(0,0,0,.35);
}
.profile-avatar {
  width: 68px; height: 68px; border-radius: 50%;
  background: var(--surface-darker); border: 2.5px solid var(--red);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif; font-size: 1.7rem;
  font-weight: 900; color: var(--red); flex-shrink: 0;
  box-shadow: 0 6px 20px rgba(220,38,38,.3), 0 0 0 5px var(--surface-dark);
}
.profile-name {
  font-family: 'Barlow Condensed', sans-serif; font-size: 1.7rem;
  font-weight: 900; color: #fff; line-height: 1; margin-bottom: .25rem;
  letter-spacing: .02em; text-transform: uppercase;
}
.profile-id { color: #4b5563; font-size: .75rem; font-family: monospace; margin-bottom: .8rem; }
.profile-tags { display: flex; gap: .45rem; flex-wrap: wrap; }

/* ── Tags ceinture ──────────────────────────────────── */
.ptag {
  display: inline-flex; align-items: center; gap: .35rem;
  padding: .45rem 1rem; border-radius: 100px;
  font-size: .82rem; font-weight: 600; border: 1.5px solid;
  font-family: 'Barlow', sans-serif; white-space: nowrap;
  height: 32px; box-sizing: border-box;
}
.belt--blanche  { background: rgba(245,245,245,.08); color: #d4d4d4; border-color: #404040; }
.belt--jaune    { background: rgba(250,204,21,.12);  color: #fef08a; border-color: #ca8a04; }
.belt--verte    { background: rgba(34,197,94,.12);   color: #86efac; border-color: #16a34a; }
.belt--bleue    { background: rgba(59,130,246,.12);  color: #93c5fd; border-color: #2563eb; }
.belt--rouge    { background: rgba(220,38,38,.12);   color: #fca5a5; border-color: #dc2626; }
.belt--jaune-bv { background: linear-gradient(90deg,rgba(250,204,21,.18) 65%,rgba(34,197,94,.25) 65%);  color: #fef08a; border-color: #ca8a04; }
.belt--verte-bb { background: linear-gradient(90deg,rgba(34,197,94,.18) 65%,rgba(59,130,246,.25) 65%);  color: #86efac; border-color: #16a34a; }
.belt--bleue-br { background: linear-gradient(90deg,rgba(59,130,246,.18) 65%,rgba(220,38,38,.25) 65%);  color: #93c5fd; border-color: #2563eb; }
.belt--rouge-bn { background: linear-gradient(90deg,rgba(220,38,38,.18) 65%,rgba(30,30,30,.8) 65%);     color: #fca5a5; border-color: #dc2626; }
.belt--noire, .belt--1dan, .belt--2dan, .belt--3dan { background: #0f0f0f; color: var(--gold); border-color: #92400e; }
.belt--boosabum { background: linear-gradient(90deg,#0f0f0f 60%,rgba(37,99,235,.3) 60%);  color: var(--gold); border-color: #2563eb; }
.belt--sabum    { background: linear-gradient(90deg,#0f0f0f 60%,rgba(220,38,38,.3) 60%);  color: var(--gold); border-color: #dc2626; }
.belt--sahyun   { background: linear-gradient(90deg,#0f0f0f 55%,rgba(250,204,21,.2) 55%); color: #fcd34d; border-color: #ca8a04; }
.belt--sasung   { background: linear-gradient(135deg,#111,#1c1c1c); color: #fcd34d; border-color: var(--gold); }
.belt--instructeur { background: rgba(127,29,29,.3); color: #fca5a5; border-color: #dc2626; }
.ptag--neutral  { background: rgba(255,255,255,.04); color: #6b7280; border-color: var(--border-dark); }
.ptag--admin    { background: rgba(37,99,235,.15);   color: #93c5fd; border-color: #1d4ed8; }

/* ── Badge ceinture ─────────────────────────────────── */
.belt-badge {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 5px 14px 5px 12px; background: var(--surface-dark);
  border: 1px solid var(--border-dark); border-radius: 6px;
  position: relative; overflow: hidden; height: 32px; box-sizing: border-box;
}
.belt-badge::before { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 7px; border-radius: 0; }
.belt-badge-text  { font-family: 'Barlow Condensed', sans-serif; font-size: .9rem; font-weight: 800; letter-spacing: .04em; color: #e5e5e5; }
.belt-badge-kup   { font-size: .7rem; color: #6b7280; }
.bb-blanche::before    { background: #bbb; }
.bb-jaune::before      { background: #f5d800; }
.bb-verte::before      { background: #2e9e4f; }
.bb-bleue::before      { background: #1a5fbf; }
.bb-rouge::before      { background: #cc1f1f; }
.bb-noire::before      { background: #b8860b; }
.bb-jaune-bv::before   { background: linear-gradient(to bottom,#f5d800 50%,#2e9e4f 50%); }
.bb-verte-bb::before   { background: linear-gradient(to bottom,#2e9e4f 50%,#1a5fbf 50%); }
.bb-bleue-br::before   { background: linear-gradient(to bottom,#1a5fbf 50%,#cc1f1f 50%); }
.bb-rouge-bn::before   { background: linear-gradient(to bottom,#cc1f1f 50%,#111 50%); }

/* ── Citation du jour ───────────────────────────────── */
.quote-block {
  display: flex; align-items: flex-start; gap: 1rem;
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-left: 4px solid var(--red); padding: 1.25rem 1.5rem;
  margin-bottom: 2.5rem; position: relative; overflow: hidden;
}
.quote-block::after {
  content: '\201C'; position: absolute; right: 16px; bottom: -20px;
  font-size: 8rem; font-family: Georgia,serif;
  color: rgba(220,38,38,.06); line-height: 1; pointer-events: none;
}
.quote-ico  { color: var(--red); font-size: 1.1rem; flex-shrink: 0; margin-top: 2px; }
.quote-text { font-style: italic; color: #d1d5db; font-size: .95rem; line-height: 1.65; margin-bottom: .5rem; }
.quote-author {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 700;
  font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; color: #4b5563;
}

/* ── Blocs dashboard ────────────────────────────────── */
.dash-block { margin-bottom: 2.5rem; }
.dash-block__title {
  font-family: 'Barlow Condensed', sans-serif; font-size: 1.4rem;
  font-weight: 800; color: #fff; display: flex; align-items: center;
  gap: .6rem; margin-bottom: 1.1rem; padding-bottom: .65rem;
  border-bottom: 1px solid var(--border-dark);
}
.dash-block__title i { color: var(--red); }
.dash-empty {
  background: rgba(255,255,255,.02); border: 1px dashed var(--border-dark);
  padding: 2.5rem; text-align: center; color: #374151;
}
.dash-empty i { font-size: 2rem; display: block; margin-bottom: .75rem; color: #2a3040; }
.dash-empty p { font-size: .85rem; }

/* ── Stats cards ────────────────────────────────────── */
.stats-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(220px,1fr)); gap: 1rem; margin-bottom: 2.5rem; }
.stat-card {
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-left: 4px solid var(--red); padding: 1.25rem 1.4rem;
  display: flex; align-items: flex-start; gap: 1rem;
  transition: transform .2s, box-shadow .2s;
}
.stat-card:hover { transform: translateY(-3px); box-shadow: 0 10px 30px rgba(0,0,0,.3); }
.stat-card__ico {
  width: 42px; height: 42px; border-radius: 10px;
  background: rgba(220,38,38,.12); display: flex; align-items: center;
  justify-content: center; font-size: 1.1rem; color: var(--red); flex-shrink: 0;
}
.stat-card__ico--blue  { background: rgba(37,99,235,.12); color: #60a5fa; }
.stat-card__ico--green { background: rgba(22,163,74,.12);  color: #4ade80; }
.stat-card__ico--gold  { background: rgba(250,204,21,.12); color: var(--gold); }
.stat-card__body { min-width: 0; }
.stat-card__label { font-family: 'Barlow Condensed', sans-serif; font-size: .68rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #4b5563; margin-bottom: .3rem; }
.stat-card__value { font-family: 'Barlow Condensed', sans-serif; font-size: 1.15rem; font-weight: 800; color: #fff; line-height: 1.2; margin-bottom: .2rem; }
.stat-card__sub   { font-size: .75rem; color: #6b7280; }

/* ── Parcours ───────────────────────────────────────── */
.parcours-wrap { overflow-x: auto; padding-bottom: 8px; }
.parcours-wrap::-webkit-scrollbar { height: 3px; }
.parcours-wrap::-webkit-scrollbar-thumb { background: var(--border-dark); border-radius: 2px; }
.pg-bar-wrap { display: flex; align-items: center; gap: 10px; margin-bottom: 1.5rem; }
.pg-bar-bg   { flex: 1; height: 8px; background: var(--border-dark); border-radius: 4px; overflow: hidden; }
.pg-bar-fill { height: 100%; border-radius: 4px; background: linear-gradient(90deg,#16a34a,var(--red)); transition: width .7s cubic-bezier(.4,0,.2,1); }
.pg-label    { font-size: .75rem; color: #6b7280; white-space: nowrap; }
.parcours-steps   { display: flex; align-items: flex-start; gap: 0; min-width: max-content; padding: .5rem 0; }
.pstep            { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.pstep-connector  { width: 28px; height: 2px; margin-top: 21px; flex-shrink: 0; transition: background .3s; }
.pstep-circle     { width: 44px; height: 44px; border-radius: 50%; border: 2.5px solid; display: flex; align-items: center; justify-content: center; position: relative; transition: transform .2s, box-shadow .2s; }
.pstep-circle:hover { transform: scale(1.1); }
.pstep.current .pstep-circle { box-shadow: 0 0 0 5px rgba(220,38,38,.18); }
.pstep-inner  { width: 22px; height: 8px; border-radius: 2px; }
.pstep-check  { position: absolute; top: -3px; right: -3px; width: 16px; height: 16px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: .6rem; font-weight: 900; border: 2px solid var(--gray-900); }
.pstep-label  { font-size: .68rem; text-align: center; white-space: nowrap; max-width: 80px; line-height: 1.3; }
.pstep-kup    { font-size: .6rem; color: #4b5563; text-align: center; }
.pstep-badge  { font-size: .6rem; font-weight: 700; color: var(--red); background: rgba(220,38,38,.1); padding: 2px 6px; border-radius: 100px; border: 1px solid rgba(220,38,38,.2); white-space: nowrap; }

/* ── Documents ──────────────────────────────────────── */
.docs-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(280px,1fr)); gap: 1rem; }
.doc-card {
  display: flex; align-items: center; gap: 1rem;
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  padding: 1.1rem 1.25rem; text-decoration: none;
  transition: border-color .2s, transform .18s, box-shadow .2s;
}
.doc-card:hover { border-color: var(--red); transform: translateY(-2px); box-shadow: 0 8px 28px rgba(220,38,38,.15); }
.doc-ico         { width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; flex-shrink: 0; }
.doc-ico--pdf    { background: rgba(220,38,38,.12); color: var(--red); }
.doc-ico--video  { background: rgba(59,130,246,.12); color: #60a5fa; }
.doc-ico--img    { background: rgba(34,197,94,.12);  color: #4ade80; }
.doc-ico--other  { background: rgba(255,255,255,.04); color: #6b7280; }
.doc-info        { flex: 1; min-width: 0; }
.doc-title       { color: #e5e5e5; font-size: .875rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; margin-bottom: .2rem; }
.doc-meta        { color: #4b5563; font-size: .72rem; }
.doc-dl          { color: #374151; font-size: .85rem; transition: color .2s; }
.doc-card:hover .doc-dl { color: var(--red); }

/* ── Modal documents membre ─────────────────────────── */
.docs-modal-list { display: flex; flex-direction: column; gap: .6rem; max-height: 320px; overflow-y: auto; margin-top: 1rem; }
.docs-modal-list::-webkit-scrollbar { width: 3px; }
.docs-modal-list::-webkit-scrollbar-thumb { background: var(--border-dark); }
.doc-modal-item  { display: flex; align-items: center; gap: .85rem; background: var(--surface-darker); border: 1px solid var(--border-dark); padding: .75rem 1rem; }
.doc-modal-item:hover { border-color: var(--red); }
.doc-modal-ico   { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; font-size: 1rem; flex-shrink: 0; }
.doc-modal-info  { flex: 1; min-width: 0; }
.doc-modal-title { color: #e5e5e5; font-size: .85rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.doc-modal-date  { color: #4b5563; font-size: .7rem; margin-top: 2px; }
.doc-modal-dl    { color: #4b5563; font-size: .85rem; transition: color .2s; }
.doc-modal-item:hover .doc-modal-dl { color: var(--red); }
.docs-modal-empty { text-align: center; color: #374151; padding: 2rem; font-size: .85rem; }
.docs-modal-empty i { font-size: 1.8rem; display: block; margin-bottom: .5rem; color: #2a3040; }

/* ── Admin ──────────────────────────────────────────── */
.admin-banner {
  display: flex; align-items: center; gap: .9rem;
  background: rgba(37,99,235,.08); border: 1px solid rgba(59,130,246,.2);
  border-left: 4px solid #2563eb; padding: 1rem 1.25rem; margin-bottom: 1.5rem;
}
.admin-banner i { color: #60a5fa; font-size: 1rem; flex-shrink: 0; }
.admin-banner p { color: #93c5fd; font-size: .83rem; margin: 0; }
.table-wrap { background: rgba(255,255,255,.02); border: 1px solid var(--border-dark); border-top: 3px solid var(--red); overflow-x: auto; }
.mtable { width: 100%; border-collapse: collapse; font-size: .82rem; }
.mtable th { text-align: left; color: #4b5563; font-weight: 700; letter-spacing: .06em; font-size: .73rem; text-transform: uppercase; padding: .8rem 1.25rem; border-bottom: 1px solid var(--border-dark); white-space: nowrap; background: rgba(0,0,0,.2); }
.mtable td { padding: .75rem 1.25rem; color: #9ca3af; border-bottom: 1px solid rgba(255,255,255,.03); vertical-align: middle; }
.mtable tr:last-child td { border-bottom: none; }
.mtable tr:hover td { background: rgba(255,255,255,.015); }
.mtable code { color: #60a5fa; font-size: .78rem; }
.btn-add-doc {
  display: inline-flex; align-items: center; gap: .35rem;
  background: rgba(220,38,38,.12); border: 1px solid rgba(220,38,38,.3);
  color: #fca5a5; padding: .3rem .75rem;
  font-family: 'Barlow Condensed', sans-serif; font-size: .78rem;
  font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
  cursor: pointer; transition: background .2s, border-color .2s, color .2s; white-space: nowrap;
}
.btn-add-doc:hover { background: rgba(220,38,38,.25); border-color: var(--red); color: #fff; }

/* ── Panneau chat ───────────────────────────────────── */
.chat-panel {
  position: fixed; top: 72px; right: 0; z-index: 999;
  width: 360px; max-height: calc(100vh - 80px);
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-top: none; border-right: none;
  box-shadow: -8px 8px 40px rgba(0,0,0,.6);
  display: flex; flex-direction: column; overflow: hidden;
  transform: translateX(100%);
  transition: transform .3s cubic-bezier(.4,0,.2,1);
}
.chat-panel.open { transform: translateX(0); }
.chat-panel-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: .85rem 1.1rem; flex-shrink: 0;
  background: linear-gradient(135deg,#0d1b3e,#1a1f2e);
  border-bottom: 1px solid var(--border-dark);
}
.chat-panel-title {
  font-family: 'Barlow Condensed', sans-serif; font-weight: 800;
  font-size: 1.05rem; color: #fff; display: flex; align-items: center; gap: .5rem;
}
.chat-panel-title i { color: var(--red); }
.chat-panel-close {
  background: none; border: none; color: #6b7280; font-size: 1rem;
  cursor: pointer; width: 28px; height: 28px;
  display: flex; align-items: center; justify-content: center;
  border-radius: 6px; transition: background .2s, color .2s;
}
.chat-panel-close:hover { background: rgba(255,255,255,.08); color: #fff; }
.conv-panel-list { flex: 1; overflow-y: auto; }
.conv-panel-list::-webkit-scrollbar { width: 3px; }
.conv-panel-list::-webkit-scrollbar-thumb { background: var(--border-dark); }
.conv-item {
  display: flex; align-items: center; gap: .85rem;
  padding: .85rem 1.1rem; cursor: pointer;
  border-bottom: 1px solid rgba(255,255,255,.03);
  transition: background .15s; position: relative;
}
.conv-item:hover { background: rgba(255,255,255,.04); }
.conv-item:last-child { border-bottom: none; }
.conv-item-avatar {
  width: 40px; height: 40px; border-radius: 50%;
  background: var(--surface-darker); border: 2px solid var(--border-dark);
  display: flex; align-items: center; justify-content: center;
  font-family: 'Barlow Condensed', sans-serif; font-weight: 900;
  font-size: .9rem; color: #6b7280; flex-shrink: 0;
}
.conv-item.has-unread .conv-item-avatar { border-color: var(--red); color: var(--red); }
.conv-item-info  { flex: 1; min-width: 0; }
.conv-item-name  { color: #e5e5e5; font-size: .875rem; font-weight: 600; margin-bottom: .1rem; }
.conv-item-preview { color: #4b5563; font-size: .72rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.conv-item-badge {
  background: var(--red); color: #fff; font-size: .62rem; font-weight: 900;
  min-width: 20px; height: 20px; border-radius: 100px;
  display: flex; align-items: center; justify-content: center;
  padding: 0 5px; flex-shrink: 0;
}
.chat-conv-header {
  display: flex; align-items: center; gap: .6rem;
  padding: .6rem 1rem; border-bottom: 1px solid var(--border-dark);
  background: rgba(0,0,0,.2); flex-shrink: 0;
}
.btn-back-chat {
  background: none; border: none; color: #6b7280; cursor: pointer;
  padding: .25rem .4rem; border-radius: 6px;
  transition: background .2s, color .2s; font-size: .85rem;
}
.btn-back-chat:hover { background: rgba(255,255,255,.06); color: #fff; }
.chat-conv-name { font-family: 'Barlow Condensed', sans-serif; font-weight: 800; font-size: .95rem; color: #fff; }
.chat-panel-messages {
  flex: 1; overflow-y: auto; padding: .85rem;
  display: flex; flex-direction: column; gap: .6rem;
  scroll-behavior: smooth; min-height: 0;
}
.chat-panel-messages::-webkit-scrollbar { width: 3px; }
.chat-panel-messages::-webkit-scrollbar-thumb { background: var(--border-dark); }
.msg-wrap         { display: flex; flex-direction: column; gap: .15rem; }
.msg-wrap.from-me { align-items: flex-end; }
.msg-wrap.from-other { align-items: flex-start; }
.msg-sender { font-size: .62rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; font-family: 'Barlow Condensed', sans-serif; color: #4b5563; padding: 0 .2rem; }
.from-other .msg-sender { color: var(--red); }
.msg-bubble { max-width: 82%; padding: .55rem .9rem; font-size: .84rem; line-height: 1.45; word-break: break-word; }
.from-me    .msg-bubble { background: var(--red); color: #fff; border-radius: 16px 16px 4px 16px; }
.from-other .msg-bubble { background: var(--surface-darker); color: #e5e5e5; border: 1px solid var(--border-dark); border-radius: 16px 16px 16px 4px; }
.msg-time { font-size: .6rem; color: #374151; padding: 0 .2rem; }
.chat-empty-msg { text-align: center; color: #374151; padding: 2rem 1rem; font-size: .8rem; }
.chat-empty-msg i { font-size: 1.8rem; display: block; margin-bottom: .5rem; color: #2a3040; }
.chat-panel-input {
  display: flex; gap: .5rem; padding: .75rem 1rem;
  border-top: 1px solid var(--border-dark);
  background: rgba(0,0,0,.15); flex-shrink: 0;
}
.chat-panel-textarea {
  flex: 1; background: var(--surface-darker) !important;
  border: 1.5px solid var(--border-dark) !important; color: #fff !important;
  padding: .5rem .8rem; font-family: 'Barlow', sans-serif; font-size: .84rem;
  border-radius: 20px; resize: none; height: 36px; max-height: 100px;
  overflow-y: auto; transition: border-color .2s; outline: none; line-height: 1.4;
}
.chat-panel-textarea:focus { border-color: var(--red) !important; }
.chat-panel-textarea::placeholder { color: #4b5563; }
.btn-chat-send {
  background: var(--red); border: none; color: #fff;
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  font-size: .85rem; cursor: pointer; flex-shrink: 0;
  transition: background .2s, transform .15s;
}
.btn-chat-send:hover    { background: #b91c1c; transform: scale(1.08); }
.btn-chat-send:disabled { opacity: .5; cursor: not-allowed; transform: none; }


/* ── Modales ────────────────────────────────────────── */
.modal-overlay {
  display: none; position: fixed; inset: 0; background: rgba(0,0,0,.75);
  z-index: 9998; align-items: center; justify-content: center; padding: 1rem;
}
.modal-overlay.open { display: flex; }
.modal {
  background: var(--surface-dark); border: 1px solid var(--border-dark);
  border-top: 4px solid var(--red); width: 100%; max-width: 480px;
  padding: 2rem; position: relative;
  animation: cardIn .3s cubic-bezier(.22,1,.36,1);
  box-shadow: 0 32px 80px rgba(0,0,0,.7);
}
.modal__title { font-family: 'Barlow Condensed', sans-serif; font-weight: 900; font-size: 1.4rem; color: #fff; margin-bottom: .25rem; }
.modal__sub   { color: #4b5563; font-size: .8rem; margin-bottom: 1.5rem; }
.modal__sub span { color: var(--red); font-weight: 700; }
.modal__close { position: absolute; top: 1rem; right: 1rem; background: none; border: none; color: #6b7280; font-size: 1.2rem; cursor: pointer; transition: color .2s; }
.modal__close:hover { color: #fff; }
.modal .form-group  { margin-bottom: 1rem; }
.modal .form-label  { color: var(--gray-400); font-family: 'Barlow Condensed', sans-serif; font-weight: 700; font-size: .85rem; letter-spacing: .08em; text-transform: uppercase; display: block; margin-bottom: .4rem; }
.modal .form-input  { width: 100%; background: var(--surface-darker) !important; border: 2px solid var(--border-dark) !important; color: #fff !important; padding: .6rem 1rem; font-family: 'Barlow', sans-serif; font-size: .9rem; }
.modal .form-input:focus { border-color: var(--red) !important; outline: none; box-shadow: 0 0 0 3px rgba(220,38,38,.15) !important; }
.modal-actions { display: flex; gap: .75rem; margin-top: 1.5rem; justify-content: flex-end; }
.btn-cancel { background: rgba(255,255,255,.05); border: 1px solid var(--border-dark); color: #6b7280; padding: .55rem 1.2rem; font-family: 'Barlow Condensed', sans-serif; font-size: .9rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; transition: background .2s, color .2s; }
.btn-cancel:hover { background: rgba(255,255,255,.1); color: #fff; }
.modal-success { display: none; text-align: center; padding: 1rem 0; }
.modal-success i { font-size: 2.5rem; color: #4ade80; display: block; margin-bottom: .75rem; }
.modal-success p { color: #d1d5db; font-size: .95rem; }
.file-drop {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .35rem; padding: 1.5rem; border: 2px dashed var(--border-dark);
  background: var(--surface-darker); cursor: pointer;
  transition: border-color .2s, background .2s; text-align: center;
  color: #6b7280; font-size: .85rem;
}
.file-drop:hover,
.file-drop.dragover   { border-color: var(--red); background: rgba(220,38,38,.05); color: #fff; }
.file-drop i          { font-size: 2rem; margin-bottom: .25rem; color: #4b5563; transition: color .2s; }
.file-drop:hover i,
.file-drop.dragover i { color: var(--red); }
.file-drop.has-file   { border-color: #16a34a; background: rgba(22,163,74,.06); color: #4ade80; }
.file-drop.has-file i { color: #4ade80; }

/* ── Responsive membres ─────────────────────────────── */
@media (max-width: 640px) {
  .login-card       { padding: 2rem 1.25rem; }
  .login-row        { grid-template-columns: 1fr; }
  .profile-card     { flex-direction: column; text-align: center; }
  .profile-avatar   { margin: 0 auto; }
  .profile-tags     { justify-content: center; }
  .dash-banner__inner { flex-direction: column; align-items: flex-start; }
  .dash-banner::after { display: none; }
  .chat-panel       { width: 100%; border-left: none; }
}

@keyframes shake {
  0%,100% { transform: translateX(0); }
  20%      { transform: translateX(-8px); }
  40%      { transform: translateX(8px); }
  60%      { transform: translateX(-5px); }
  80%      { transform: translateX(5px); }
}
.form-error-banner {
  display: none;
  align-items: center;
  gap: .6rem;
  background: rgba(220,38,38,.12);
  border: 1px solid rgba(220,38,38,.35);
  color: #fca5a5;
  font-size: .85rem;
  padding: .85rem 1.1rem;
  margin-bottom: 1.5rem;
}
.form-error-banner.visible { display: flex; }
.form-label .req { color: var(--red); margin-left: 2px; }