/* ============================================================
   REPÈRE PODCAST — style.css v5
   UI/UX inspiré de Paradox.io — Dark premium, rouge-orange
   ============================================================ */

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

:root {
  --noir:        #0A0A0B;
  --noir-2:      #111114;
  --noir-3:      #18181C;
  --noir-card:   #1C1C21;
  --rouge:       #1557C0;
  --rouge-vif:   #2563EB;
  --orange:      #3B82F6;
  --gradient:    linear-gradient(135deg, #0A2E6E 0%, #1557C0 100%);
  --blanc:       #FFFFFF;
  --gris-1:      #F5F5F5;
  --gris-2:      #A0A0A8;
  --gris-3:      #4A4A52;
  --gris-4:      #2A2A30;
  --border:      rgba(255,255,255,0.06);
  --border-2:    rgba(255,255,255,0.12);
  --accent-glow: rgba(21,87,192,0.35);
  --bg-page:     #0A0A0B;
  --bg-section:  #111114;
  --card-bg:     #1C1C21;
  --text-main:   #F0F0F5;
  --text-sub:    #8A8A95;
  --bleu:        #1557C0;
  --bleu-vif:    #2563EB;
  --bleu-ciel:   rgba(21,87,192,0.08);
  --noir-txt:    #0A0A0B;
  --gris-txt:    #A0A0A8;
  --whatsapp:    #25D366;
  --accent:      #1557C0;
}

body.light {
  --bg-page:   #FAFAFA;
  --bg-section:#F0F0F5;
  --card-bg:   #FFFFFF;
  --text-main: #0A0A0B;
  --text-sub:  #5A5A65;
  --border:    rgba(0,0,0,0.07);
  --border-2:  rgba(0,0,0,0.12);
  --noir-card: #FFFFFF;
  --gris-4:    #EEEEEF;
  --bleu-ciel: rgba(21,87,192,0.06);
}

html { scroll-behavior:smooth; }
body {
  font-family:'Inter', 'DM Sans', sans-serif;
  background:var(--bg-page);
  color:var(--text-main);
  overflow-x:clip;
  cursor:none;
  transition:background 0.35s, color 0.35s;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:none;
}
html, body { width:100%; max-width:100%; }
input,textarea,select,button,a { cursor:none; }

/* ===== CUSTOM CURSOR ===== */
.cursor-dot {
  width:7px; height:7px; background:var(--rouge-vif); border-radius:50%;
  position:fixed; pointer-events:none; z-index:99999;
  transform:translate(-50%,-50%);
  transition:width 0.15s, height 0.15s;
}
.cursor-ring {
  width:32px; height:32px; border:1.5px solid rgba(253, 254, 254, 0.4);
  border-radius:50%; position:fixed; pointer-events:none; z-index:99998;
  transform:translate(-50%,-50%);
  transition:width 0.25s, height 0.25s;
}
body.cursor-hover .cursor-dot { width:12px; height:12px; }
body.cursor-hover .cursor-ring { width:48px; height:48px; border-color:rgba(21,87,192,0.2); }

/* ===== PAGE LOADER ===== */
#pageLoader {
  position:fixed; inset:0; z-index:99997; background:var(--noir);
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:18px;
  transition:opacity 0.5s, visibility 0.5s;
}
#pageLoader.hidden { opacity:0; visibility:hidden; pointer-events:none; }
.loader-logo {
  font-family:'Syne', 'Instrument Serif', serif; font-size:2.6rem; color:#fff; font-weight:800;
  letter-spacing:-0.03em; animation:lPulse 1.2s ease-in-out infinite;
  background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.loader-sub { font-size:0.68rem; color:var(--gris-2); letter-spacing:0.22em; text-transform:uppercase; }
.loader-bar { width:120px; height:2px; background:rgba(255,255,255,0.1); border-radius:2px; overflow:hidden; }
.loader-fill { height:100%; background:var(--gradient); border-radius:2px; animation:lSlide 1.3s ease-in-out forwards; }
@keyframes lPulse { 0%,100%{opacity:1} 50%{opacity:0.5} }
@keyframes lSlide { 0%{width:0} 100%{width:100%} }

/* ===== NAVBAR ===== */
nav {
  position:fixed; top:0; left:0; right:0; z-index:1000;
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:0 40px; height:68px;
  background:rgba(10,10,11,0.88); backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
  transition:box-shadow 0.3s, background 0.35s;
}
body.light nav { background:rgba(250,250,250,0.92); }
nav.scrolled { box-shadow:0 4px 32px rgba(0,0,0,0.5); }

.nav-logo {
  font-family:'Syne','Instrument Serif',serif; font-size:1.3rem; font-weight:800;
  text-decoration:none; flex-shrink:0;
  background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent;
  letter-spacing:-0.02em;
}
.nav-logo sup {
  font-family:'Inter',sans-serif; font-size:0.42rem; font-weight:600;
  color:var(--gris-2); letter-spacing:0.14em; text-transform:uppercase;
  vertical-align:super; margin-left:3px; -webkit-text-fill-color:var(--gris-2);
}

.nav-links { list-style:none; display:none; align-items:center; gap:2px; flex:1; justify-content:center; }
@media(min-width:860px){ .nav-links { display:flex; } }
.nav-links a {
  text-decoration:none; font-size:0.83rem; font-weight:500;
  color:var(--gris-2); padding:6px 16px; border-radius:8px;
  transition:color 0.2s, background 0.2s;
}
.nav-links a:hover { color:var(--text-main); background:rgba(255,255,255,0.05); }
.nav-links a.active { color:#fff; background:rgba(255,255,255,0.07); }
body.light .nav-links a { color:var(--text-sub); }
body.light .nav-links a:hover, body.light .nav-links a.active { color:var(--noir); background:rgba(0,0,0,0.05); }

.nav-right { display:flex; align-items:center; gap:8px; flex-shrink:0; }

.dark-toggle {
  width:36px; height:36px; border-radius:8px;
  border:1px solid var(--border-2); background:transparent;
  display:flex; align-items:center; justify-content:center;
  color:var(--gris-2); transition:all 0.2s;
}
.dark-toggle:hover { background:var(--gris-4); color:var(--text-main); }

.nav-cta { display:none; }
@media(min-width:860px){
  .nav-cta {
    display:inline-flex; align-items:center; gap:6px;
    padding:9px 20px; background:var(--gradient);
    border-radius:8px; font-size:0.8rem; font-weight:600; color:#fff;
    text-decoration:none; transition:opacity 0.2s, transform 0.2s;
    box-shadow:0 4px 16px var(--accent-glow);
  }
  .nav-cta:hover { opacity:0.88; transform:translateY(-1px); }
}
.nav-cta-don {
  background:transparent !important; box-shadow:none !important;
  border:1px solid rgba(21,87,192,0.4) !important;
  color:var(--rouge-vif) !important;
}
.nav-cta-don:hover { background:rgba(21,87,192,0.08) !important; border-color:var(--rouge-vif) !important; }

/* ===== HAMBURGER ===== */
.hamburger {
  width:40px; height:40px; border:1px solid var(--border-2);
  border-radius:10px; background:transparent; cursor:pointer;
  display:flex !important; align-items:center; justify-content:center;
  transition:background 0.2s, border-color 0.2s; position:relative; z-index:1101;
  flex-shrink:0;
}
.hamburger:hover { background:rgba(21,87,192,0.08); border-color:rgba(21,87,192,0.3); }
.hamburger svg { transition:all 0.3s ease; }
.hamburger.open { background:rgba(255,255,255,0.08); border-color:rgba(255,255,255,0.2); }

/* ===== iOS-STYLE MENU OVERLAY ===== */
.mobile-menu {
  position:fixed; inset:0; z-index:1100;
  display:flex; flex-direction:column;
  /* Glassmorphism iOS */
  background:rgba(10,14,24,0.78);
  backdrop-filter:blur(40px) saturate(180%);
  -webkit-backdrop-filter:blur(40px) saturate(180%);
  /* Animation : scale + fade */
  opacity:0; pointer-events:none;
  transform:scale(1.03);
  transition:opacity 0.3s cubic-bezier(.4,0,.2,1), transform 0.3s cubic-bezier(.4,0,.2,1);
  padding:0;
  overflow:hidden;
}
.mobile-menu.open {
  opacity:1; pointer-events:all; transform:scale(1);
}

/* Fermer en cliquant dehors */
.menu-backdrop {
  position:absolute; inset:0; z-index:0;
}

/* Contenu centré */
.menu-inner {
  position:relative; z-index:1;
  display:flex; flex-direction:column;
  height:100%;
  padding:0 28px 36px;
}

/* Header menu */
.menu-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:18px 0 24px;
  border-bottom:1px solid rgba(255,255,255,0.06);
}
.menu-brand {
  font-family:'Syne',sans-serif; font-weight:800; font-size:1.1rem;
  color:#fff; letter-spacing:-0.02em; text-decoration:none;
}
.menu-brand sup { font-size:0.5rem; opacity:0.5; letter-spacing:0.1em; vertical-align:super; }
.menu-close {
  width:36px; height:36px; border-radius:50%;
  background:rgba(255,255,255,0.08); border:none; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.7); transition:all 0.2s;
}
.menu-close:hover { background:rgba(255,255,255,0.16); color:#fff; }

/* Navigation links iOS */
.mobile-links {
  list-style:none; flex:1; display:flex; flex-direction:column;
  justify-content:center; gap:2px; padding:24px 0;
}
.mobile-links li {
  opacity:0; transform:translateY(14px);
  transition:opacity 0.32s ease, transform 0.32s ease;
}
.mobile-menu.open .mobile-links li:nth-child(1){ transition-delay:0.05s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(2){ transition-delay:0.09s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(3){ transition-delay:0.13s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(4){ transition-delay:0.17s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(5){ transition-delay:0.21s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(6){ transition-delay:0.25s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(7){ transition-delay:0.29s; opacity:1; transform:none; }
.mobile-menu.open .mobile-links li:nth-child(8){ transition-delay:0.33s; opacity:1; transform:none; }

/* ===== MOBILE FIXES (site-wide) ===== */
img, picture, video, iframe { max-width:100%; height:auto; display:block; object-fit:cover; }
svg { max-width:100%; height:auto; }

.modal, .menu-inner, .mobile-menu { max-width:95vw; box-sizing:border-box; }
.modal { margin:0 auto; }

* { max-width:100%; }

@media(max-width:640px){
  .page-inner, .container, .tabs-wrap, .cta-banner, .section, .portfolio-intro,
  .hero, .page-hero, .promo-card, .section-card, .card-body {
    padding-left:1rem !important;
    padding-right:1rem !important;
  }
  nav { padding:0 12px; height:62px; }
  .nav-logo { font-size:1.08rem; }
  .mobile-menu, .mobile-menu .menu-inner { min-height:100svh; }
  .mobile-links { gap:4px; padding:18px 0 8px; }
  .mobile-links a { padding:12px 14px; font-size:0.96rem; }
  .mobile-footer { padding-bottom:calc(env(safe-area-inset-bottom) + 12px); }
  .events-grid, .portfolio-grid, .shop-grid, .partners-grid, .ep-grid,
  .prog-grid, .formats-grid, .grid-2, .grid-3 {
    grid-template-columns:1fr !important;
  }
  .project-thumb, .card-thumb, .featured-visual, .thumb, .hero-visual,
  .prog-thumb, .doc-thumb {
    height:auto !important;
  }
  .hero h1, .page-hero h1, .section-title, .mission blockquote {
    font-size:clamp(1.7rem, 7vw, 2.4rem) !important;
    line-height:1.15 !important;
  }
  .hero-sub, .page-hero p, .section-sub, .card-body p, .project-desc {
    font-size:0.95rem !important;
    line-height:1.65 !important;
  }
  .prog-school-card, .doc-card, .ep-card, .portfolio-card, .card {
    min-width:0;
    overflow:hidden;
  }
  .prog-school-footer, .doc-footer, .btn-row, .cta-row {
    flex-direction:column;
    align-items:stretch;
  }
  .prog-enroll, .doc-dl, .featured-doc-btn, .btn, .cta-btn {
    width:100%;
    justify-content:center;
    text-align:center;
  }
}

.mono, code, pre, .project-desc, .card-body p, .text-wrap, .long-text {
  word-break:break-word;
  overflow-wrap:anywhere;
}

[style*="max-width:"]{max-width:100%!important}

.mobile-menu.open .mobile-links li:nth-child(9){ transition-delay:0.37s; opacity:1; transform:none; }

.mobile-links a {
  display:flex; align-items:center; justify-content:space-between;
  padding:14px 18px; border-radius:14px;
  text-decoration:none; font-family:'Syne',sans-serif; font-weight:700;
  font-size:1.05rem; color:rgba(255,255,255,0.8);
  transition:background 0.18s, color 0.18s, transform 0.18s;
  background:transparent;
}
.mobile-links a:hover, .mobile-links a.active {
  background:rgba(255,255,255,0.07); color:#fff; transform:translateX(4px);
}
.mobile-links a .ml-arrow {
  width:26px; height:26px; border-radius:8px;
  background:rgba(255,255,255,0.06); display:flex; align-items:center;
  justify-content:center; color:rgba(255,255,255,0.3); flex-shrink:0;
  transition:background 0.18s, color 0.18s;
}
.mobile-links a:hover .ml-arrow, .mobile-links a.active .ml-arrow {
  background:rgba(21,87,192,0.3); color:rgba(255,255,255,0.8);
}

/* Footer menu */
.mobile-footer {
  opacity:0; transform:translateY(10px);
  transition:opacity 0.35s ease 0.35s, transform 0.35s ease 0.35s;
  border-top:1px solid rgba(255,255,255,0.06); padding-top:20px;
}
.mobile-menu.open .mobile-footer { opacity:1; transform:none; }
.mobile-footer p { font-size:0.6rem; color:rgba(255,255,255,0.3); letter-spacing:0.14em; text-transform:uppercase; margin-bottom:12px; }
.mobile-socials-row {
  display:flex; gap:8px; flex-wrap:wrap;
}
.mobile-socials-row a {
  width:38px; height:38px; border-radius:10px;
  background:rgba(255,255,255,0.05); border:1px solid rgba(255,255,255,0.07);
  display:flex; align-items:center; justify-content:center;
  color:rgba(255,255,255,0.5); text-decoration:none;
  transition:background 0.2s, color 0.2s, border-color 0.2s;
}
.mobile-socials-row a:hover { background:var(--rouge); color:#fff; border-color:var(--rouge); }

/* ===== BANNIÈRE ÉPISODE ===== */
.new-ep-banner {
  background:var(--gradient);
  padding:9px 24px; text-align:center;
  display:flex; align-items:center; justify-content:center; gap:12px; flex-wrap:wrap;
}
.new-ep-banner p { font-size:0.8rem; color:rgba(255,255,255,0.9); }
.new-ep-banner strong { color:#fff; }
.new-ep-banner a {
  font-size:0.76rem; font-weight:700; color:#fff;
  background:rgba(255,255,255,0.2); padding:4px 14px;
  border-radius:6px; text-decoration:none; transition:background 0.2s;
}
.new-ep-banner a:hover { background:rgba(255,255,255,0.32); }
.blink-dot { width:7px; height:7px; background:#4ade80; border-radius:50%; flex-shrink:0; animation:blink 1.5s infinite; }
@keyframes blink { 0%,100%{opacity:1} 50%{opacity:0.2} }

/* ===== LAYOUT ===== */
.page-content { margin-top:68px; }
section { padding:96px 24px; background:var(--bg-page); }
section.alt { background:var(--bg-section); }
.container { max-width:1120px; margin:0 auto; }

.section-label {
  font-size:0.65rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--rouge-vif); margin-bottom:10px;
  display:flex; align-items:center; gap:8px;
}
.section-label::before { content:''; width:24px; height:1.5px; background:var(--rouge-vif); }
.section-title {
  font-family:'Syne','Instrument Serif',serif; font-size:clamp(1.8rem,3.8vw,3rem);
  font-weight:800; line-height:1.1; color:var(--text-main);
  letter-spacing:-0.03em; max-width:640px; margin-bottom:16px;
}
.section-title em { background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-style:normal; }
.section-sub { font-size:0.95rem; color:var(--text-sub); max-width:500px; line-height:1.7; }

/* ===== PAGE HERO INTERNE ===== */
.page-hero {
  background:var(--noir-2); padding:88px 24px 72px; text-align:center;
  border-bottom:1px solid var(--border); position:relative; overflow:hidden;
}
.page-hero::after {
  content:''; position:absolute; inset:0; pointer-events:none;
  background:radial-gradient(ellipse 60% 70% at 50% -10%, rgba(21,87,192,0.12) 0%, transparent 65%);
}
.page-hero .label {
  font-size:0.65rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--rouge-vif); margin-bottom:14px;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.page-hero .label::before { content:''; width:20px; height:1.5px; background:var(--rouge-vif); }
.page-hero h1 { font-family:'Syne','Instrument Serif',serif; font-size:clamp(2.2rem,5.5vw,4rem); color:#fff; font-weight:800; line-height:1.08; letter-spacing:-0.03em; max-width:680px; margin:0 auto 18px; }
.page-hero h1 em { background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-style:normal; }
.page-hero p { font-size:0.97rem; color:var(--gris-2); max-width:480px; margin:0 auto; line-height:1.7; }

/* ===== CARDS ===== */
.card {
  background:var(--card-bg); border-radius:16px; padding:32px 28px;
  border:1px solid var(--border); transition:transform 0.25s, box-shadow 0.25s, border-color 0.25s;
  text-decoration:none; display:block; color:inherit;
}
.card:hover { transform:translateY(-5px); box-shadow:0 20px 48px rgba(0,0,0,0.4); border-color:var(--border-2); }
.card.blue, .card.red { background:var(--gradient); border-color:transparent; box-shadow:0 8px 32px var(--accent-glow); }
.card-icon {
  width:48px; height:48px; border-radius:12px;
  background:rgba(21,87,192,0.1);
  display:flex; align-items:center; justify-content:center;
  margin-bottom:18px; color:var(--rouge-vif);
}
.card.blue .card-icon, .card.red .card-icon { background:rgba(255,255,255,0.15); color:#fff; }
.card-label { font-size:0.62rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:var(--rouge-vif); margin-bottom:8px; }
.card.blue .card-label, .card.red .card-label { color:rgba(255,255,255,0.5); }
.card h3 { font-family:'Syne','Instrument Serif',serif; font-size:1.2rem; font-weight:700; color:var(--text-main); margin-bottom:10px; line-height:1.2; }
.card.blue h3, .card.red h3 { color:#fff; }
.card p { font-size:0.85rem; color:var(--text-sub); line-height:1.65; }
.card.blue p, .card.red p { color:rgba(255,255,255,0.65); }
.card-link { display:inline-flex; align-items:center; gap:6px; margin-top:20px; font-size:0.82rem; font-weight:600; color:var(--rouge-vif); }
.card.blue .card-link, .card.red .card-link { color:rgba(255,255,255,0.85); }
.card-link::after { content:'→'; }

/* ===== COMPTEURS ===== */
.counter-grid {
  display:grid; gap:1px; margin-top:52px;
  grid-template-columns:repeat(2,1fr);
  background:var(--border);
  border:1px solid var(--border); border-radius:16px; overflow:hidden;
}
@media(min-width:640px){ .counter-grid { grid-template-columns:repeat(4,1fr); } }
.counter-box { text-align:center; padding:40px 20px; background:var(--card-bg); transition:background 0.2s; }
.counter-box:hover { background:var(--noir-3); }
.counter-num {
  font-family:'Syne','Instrument Serif',serif; font-size:2.8rem; font-weight:800;
  line-height:1; display:block;
  background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent;
}
.counter-label { font-size:0.8rem; color:var(--text-sub); margin-top:8px; line-height:1.4; }

@media(max-width:640px) {
  .counter-grid {
    grid-template-columns:1fr;
  }
  .counter-box {
    padding:28px 18px;
  }
  .counter-num {
    font-size:2.2rem;
  }
}

/* ===== MINI PLAYER ===== */
.audio-section { background:var(--noir-2); padding:64px 24px; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.audio-label {
  font-size:0.65rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase;
  color:var(--rouge-vif); margin-bottom:8px; text-align:center;
  display:flex; align-items:center; justify-content:center; gap:8px;
}
.audio-label::before { content:''; width:20px; height:1.5px; background:var(--rouge-vif); }
.audio-title { font-family:'Syne','Instrument Serif',serif; font-size:clamp(1.4rem,3vw,2rem); color:#fff; text-align:center; margin-bottom:32px; font-weight:800; letter-spacing:-0.02em; }

.player-card {
  max-width:720px; margin:0 auto;
  background:var(--noir-card); border:1px solid var(--border-2);
  border-radius:20px; padding:28px 32px;
}
.player-top { display:flex; align-items:center; gap:20px; margin-bottom:22px; flex-wrap:wrap; }
.player-thumb {
  width:66px; height:66px; border-radius:12px; flex-shrink:0;
  background:var(--gradient); display:flex; align-items:center; justify-content:center; color:#fff;
}
.player-info { flex:1; min-width:0; }
.player-ep-label { font-size:0.62rem; font-weight:600; letter-spacing:0.14em; text-transform:uppercase; color:var(--gris-3); margin-bottom:4px; }
.player-ep-title { font-family:'Syne','Instrument Serif',serif; font-size:1.05rem; color:#fff; font-weight:700; line-height:1.2; }
.player-meta { font-size:0.73rem; color:var(--gris-3); margin-top:5px; }

.progress-wrap { margin-bottom:14px; }
.progress-bar { width:100%; height:3px; background:rgba(255,255,255,0.1); border-radius:3px; cursor:pointer; position:relative; }
.progress-fill { height:100%; background:var(--gradient); border-radius:3px; width:35%; position:relative; transition:width 0.3s; }
.progress-fill::after { content:''; position:absolute; right:-6px; top:50%; transform:translateY(-50%); width:12px; height:12px; background:#fff; border-radius:50%; box-shadow:0 0 0 3px rgba(21,87,192,0.3); }
.progress-times { display:flex; justify-content:space-between; margin-top:6px; }
.progress-times span { font-size:0.68rem; color:var(--gris-3); }

.player-controls { display:flex; align-items:center; justify-content:center; gap:12px; }
.ctrl-btn { background:transparent; border:none; color:var(--gris-2); padding:8px; border-radius:8px; display:flex; align-items:center; justify-content:center; transition:all 0.2s; }
.ctrl-btn:hover { color:#fff; background:rgba(255,255,255,0.06); }
.play-btn {
  width:50px; height:50px; background:var(--gradient); border-radius:50%; border:none;
  display:flex; align-items:center; justify-content:center; color:#fff;
  box-shadow:0 4px 20px var(--accent-glow); transition:transform 0.2s, box-shadow 0.2s;
}
.play-btn:hover { transform:scale(1.08); box-shadow:0 8px 28px var(--accent-glow); }

.player-footer { display:flex; align-items:center; justify-content:space-between; margin-top:20px; padding-top:16px; border-top:1px solid var(--border); flex-wrap:wrap; gap:10px; }
.spotify-btn { display:inline-flex; align-items:center; gap:7px; padding:8px 18px; background:#1DB954; border-radius:8px; font-size:0.76rem; font-weight:700; color:#fff; text-decoration:none; transition:opacity 0.2s; }
.spotify-btn:hover { opacity:0.85; }

/* ===== WHATSAPP FLOAT ===== */
.wa-float {
  position:fixed; bottom:28px; right:28px; z-index:9000;
  width:52px; height:52px; background:#25D366; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  text-decoration:none; color:#fff;
  box-shadow:0 4px 20px rgba(37,211,102,0.4);
  transition:transform 0.2s, box-shadow 0.2s;
}
.wa-float:hover { transform:scale(1.1) translateY(-2px); box-shadow:0 8px 28px rgba(37,211,102,0.5); }
.wa-float svg { width:26px; height:26px; }
.wa-tooltip { position:absolute; right:64px; top:50%; transform:translateY(-50%); background:var(--noir-card); color:#fff; font-size:0.72rem; font-weight:600; padding:6px 12px; border-radius:8px; white-space:nowrap; opacity:0; pointer-events:none; transition:opacity 0.2s; border:1px solid var(--border-2); }
.wa-float:hover .wa-tooltip { opacity:1; }

/* ===== BUTTONS ===== */
.btn-outline { padding:10px 22px; border:1.5px solid var(--border-2); border-radius:8px; font-size:0.82rem; font-weight:600; color:var(--text-main); text-decoration:none; transition:all 0.2s; display:inline-flex; align-items:center; gap:8px; background:transparent; }
.btn-outline:hover { border-color:var(--rouge); color:var(--rouge); background:rgba(21,87,192,0.05); }
.btn-primary { padding:10px 24px; background:var(--gradient); border-radius:8px; font-size:0.82rem; font-weight:600; color:#fff; text-decoration:none; transition:opacity 0.2s, transform 0.2s; display:inline-flex; align-items:center; gap:8px; box-shadow:0 4px 16px var(--accent-glow); }
.btn-primary:hover { opacity:0.88; transform:translateY(-1px); }

/* ===== TAG ===== */
.tag { display:inline-flex; align-items:center; gap:6px; padding:4px 12px; background:rgba(21,87,192,0.1); border:1px solid rgba(21,87,192,0.2); border-radius:6px; font-size:0.68rem; font-weight:600; color:var(--rouge-vif); letter-spacing:0.06em; text-transform:uppercase; }
body.light .tag { background:rgba(21,87,192,0.06); }

/* ===== FILTERS / TABS ===== */
.filters { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:36px; }
.filter-btn {
  padding:8px 18px; border-radius:8px; font-size:0.8rem; font-weight:600;
  border:1.5px solid var(--border); background:transparent; color:var(--text-sub);
  transition:all 0.2s; display:flex; align-items:center; gap:7px;
}
.filter-btn svg { width:14px; height:14px; flex-shrink:0; }
.filter-btn:hover { border-color:var(--border-2); color:var(--text-main); background:rgba(255,255,255,0.04); }
.filter-btn.active { background:var(--gradient); color:#fff; border-color:transparent; box-shadow:0 4px 12px var(--accent-glow); }
body.light .filter-btn { border-color:rgba(0,0,0,0.12); color:var(--text-sub); }
body.light .filter-btn:hover { background:rgba(0,0,0,0.04); color:var(--text-main); }

/* ===== PROGRAMME ===== */
.prog-grid { display:grid; gap:18px; margin-top:52px; grid-template-columns:1fr; }
@media(min-width:600px){ .prog-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:900px){ .prog-grid { grid-template-columns:repeat(3,1fr); } }

.prog-featured {
  background:var(--gradient); border-radius:16px; padding:36px 30px;
  text-decoration:none; display:block;
  transition:transform 0.25s, box-shadow 0.25s;
  position:relative; overflow:hidden;
  box-shadow:0 8px 32px var(--accent-glow);
}
@media(min-width:900px){ .prog-featured { grid-column:span 2; } }
.prog-featured::before { content:''; position:absolute; top:-80px; right:-80px; width:220px; height:220px; border-radius:50%; background:rgba(255,255,255,0.06); }
.prog-featured:hover { transform:translateY(-5px); box-shadow:0 24px 52px rgba(21,87,192,0.4); }
.prog-featured .fl { font-size:0.62rem; font-weight:600; letter-spacing:0.16em; text-transform:uppercase; color:rgba(255,255,255,0.5); margin-bottom:14px; display:flex; align-items:center; gap:6px; }
.prog-featured .fi { width:52px; height:52px; border-radius:12px; background:rgba(255,255,255,0.15); display:flex; align-items:center; justify-content:center; color:#fff; margin-bottom:16px; }
.prog-featured h3 { font-family:'Syne','Instrument Serif',serif; font-size:1.7rem; font-weight:800; color:#fff; margin-bottom:10px; line-height:1.1; letter-spacing:-0.02em; }
.prog-featured p { font-size:0.87rem; color:rgba(255,255,255,0.65); line-height:1.65; }
.prog-featured .fl2 { display:inline-flex; align-items:center; gap:6px; margin-top:22px; font-size:0.84rem; font-weight:700; color:rgba(255,255,255,0.9); }
.prog-featured .fl2::after { content:'→'; }

/* ===== EP CARDS ===== */
.ep-grid { display:grid; gap:18px; grid-template-columns:1fr; }
@media(min-width:640px){ .ep-grid { grid-template-columns:repeat(2,1fr); } }
@media(min-width:960px){ .ep-grid { grid-template-columns:repeat(3,1fr); } }

.ep-card { background:var(--card-bg); border-radius:16px; border:1px solid var(--border); overflow:hidden; transition:transform 0.25s, box-shadow 0.25s, border-color 0.25s; display:flex; flex-direction:column; }
.ep-card:hover { transform:translateY(-4px); box-shadow:0 20px 48px rgba(0,0,0,0.4); border-color:var(--border-2); }
.ep-card.featured { border-color:var(--rouge); }
.ep-card.featured:hover { box-shadow:0 20px 48px rgba(21,87,192,0.2); }

.ep-thumb { height:130px; display:flex; align-items:center; justify-content:center; position:relative; color:#fff; }
.ep-thumb.t-blue   { background:linear-gradient(135deg,#080e20,#1557C0); }
.ep-thumb.t-green  { background:linear-gradient(135deg,#081a0e,#10b981); }
.ep-thumb.t-purple { background:linear-gradient(135deg,#12082a,#8b5cf6); }
.ep-thumb.t-orange { background:linear-gradient(135deg,#1a0a02,#f59e0b); }
.ep-thumb.t-pink   { background:var(--gradient); }
.ep-thumb.t-teal   { background:linear-gradient(135deg,#051414,#2dd4bf); }
.ep-thumb.t-red    { background:var(--gradient); }

.ep-num { position:absolute; top:10px; left:12px; font-size:0.6rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; background:rgba(0,0,0,0.4); color:#fff; padding:3px 10px; border-radius:6px; backdrop-filter:blur(8px); }
.ep-new { position:absolute; top:10px; right:12px; font-size:0.6rem; font-weight:700; background:#4ade80; color:#065f46; padding:3px 9px; border-radius:6px; }

.ep-body { padding:20px 22px; display:flex; flex-direction:column; flex:1; }
.ep-cat { margin-bottom:8px; }
.ep-title { font-family:'Syne','Instrument Serif',serif; font-size:1rem; line-height:1.3; color:var(--text-main); font-weight:700; margin-bottom:8px; }
.ep-card.featured .ep-title { color:#fff; }
.ep-date { font-size:0.7rem; color:var(--text-sub); margin-bottom:10px; }
.ep-card.featured .ep-date { color:rgba(255,255,255,0.45); }

.ep-pop { margin-bottom:14px; }
.ep-pop-label { font-size:0.63rem; color:var(--text-sub); margin-bottom:4px; }
.ep-card.featured .ep-pop-label { color:rgba(255,255,255,0.4); }
.pop-bar { height:2px; background:var(--gris-4); border-radius:2px; overflow:hidden; }
.ep-card.featured .pop-bar { background:rgba(255,255,255,0.15); }
.pop-fill { height:100%; background:var(--gradient); border-radius:2px; }
.ep-card.featured .pop-fill { background:#fff; }

.ep-footer { display:flex; align-items:center; justify-content:space-between; margin-top:auto; }
.ep-duration { font-size:0.7rem; color:var(--text-sub); }
.ep-card.featured .ep-duration { color:rgba(255,255,255,0.45); }
.ep-listen { display:inline-flex; align-items:center; gap:6px; padding:7px 16px; background:var(--gradient); color:#fff; border-radius:8px; font-size:0.74rem; font-weight:700; text-decoration:none; transition:opacity 0.2s; box-shadow:0 2px 8px var(--accent-glow); }
.ep-listen:hover { opacity:0.88; }
.ep-card.featured .ep-listen { background:rgba(255,255,255,0.18); box-shadow:none; }
.ep-card.featured .ep-listen:hover { background:rgba(255,255,255,0.28); }

.platforms-row { display:flex; gap:10px; flex-wrap:wrap; justify-content:center; margin-top:56px; }
.plat-btn { display:inline-flex; align-items:center; gap:8px; padding:11px 20px; border-radius:10px; text-decoration:none; font-size:0.82rem; font-weight:600; transition:transform 0.2s, box-shadow 0.2s; border:1.5px solid var(--border); color:var(--text-main); background:var(--card-bg); }
.plat-btn:hover { transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,0.3); }
.plat-btn.spotify { background:#1DB954; color:#fff; border-color:#1DB954; }
.plat-btn.facebook { background:#1877F2; color:#fff; border-color:#1877F2; }

/* ===== MISSION ===== */
.mission {
  background:var(--noir-2); padding:96px 24px; text-align:center;
  border-top:1px solid var(--border); border-bottom:1px solid var(--border);
  position:relative; overflow:hidden;
}
.mission::before { content:''; position:absolute; inset:0; pointer-events:none; background:radial-gradient(ellipse 50% 80% at 50% 50%, rgba(21,87,192,0.07) 0%, transparent 70%); }
.mission .ml { font-size:0.65rem; font-weight:600; letter-spacing:0.2em; text-transform:uppercase; color:var(--rouge-vif); margin-bottom:16px; display:flex; align-items:center; justify-content:center; gap:8px; }
.mission .ml::before { content:''; width:20px; height:1.5px; background:var(--rouge-vif); }
.mission blockquote { font-family:'Syne','Instrument Serif',serif; font-size:clamp(1.5rem,3.8vw,2.6rem); color:#fff; max-width:800px; margin:0 auto; line-height:1.35; font-weight:800; letter-spacing:-0.02em; }
.mission blockquote em { background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-style:normal; }
body.light .mission blockquote { color:var(--text-main); }

/* ===== NEWSLETTER ===== */
.nl-section { background:var(--noir); padding:96px 24px; text-align:center; border-top:1px solid var(--border); }
body.light .nl-section { background:#111116; }
.nl-section h2 { font-family:'Syne','Instrument Serif',serif; font-size:clamp(1.6rem,3.8vw,2.6rem); color:#fff; font-weight:800; max-width:520px; margin:0 auto 12px; letter-spacing:-0.02em; }
.nl-section p { font-size:0.9rem; color:var(--gris-3); max-width:380px; margin:0 auto 32px; line-height:1.65; }
.nl-form { display:flex; gap:8px; justify-content:center; flex-wrap:wrap; }
.nl-form input { padding:13px 20px; border-radius:8px; border:1px solid var(--border-2); background:var(--noir-card); color:#fff; font-family:'Inter',sans-serif; font-size:0.86rem; width:270px; outline:none; transition:border-color 0.2s; }
.nl-form input::placeholder { color:var(--gris-3); }
.nl-form input:focus { border-color:var(--rouge); }
.nl-form button { padding:13px 26px; background:var(--gradient); color:#fff; border:none; border-radius:8px; font-family:'Inter',sans-serif; font-size:0.86rem; font-weight:600; transition:opacity 0.2s, transform 0.2s; box-shadow:0 4px 16px var(--accent-glow); }
.nl-form button:hover { opacity:0.88; transform:translateY(-1px); }

/* ===== FOOTER ===== */
footer { background:var(--noir-2); border-top:1px solid var(--border); padding:64px 24px 32px; }
body.light footer { background:#0A0A0F; }
.footer-grid { max-width:1120px; margin:0 auto; display:grid; gap:48px; grid-template-columns:1fr; }
@media(min-width:640px){ .footer-grid { grid-template-columns:2fr 1fr 1fr 1fr; } }
.footer-logo { font-family:'Syne','Instrument Serif',serif; font-size:1.3rem; font-weight:800; text-decoration:none; letter-spacing:-0.02em; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
.footer-brand p { font-size:0.82rem; color:var(--gris-3); line-height:1.65; margin-top:12px; max-width:220px; }
.footer-col h4 { font-size:0.62rem; font-weight:600; letter-spacing:0.18em; text-transform:uppercase; color:var(--gris-3); margin-bottom:16px; }
.footer-col a { display:flex; align-items:center; gap:8px; font-size:0.84rem; color:rgba(255,255,255,0.38); text-decoration:none; margin-bottom:12px; transition:color 0.2s; }
.footer-col a:hover { color:#fff; }
.footer-col a svg { opacity:0.5; flex-shrink:0; }
.footer-col a:hover svg { opacity:1; }
.footer-socials { display:flex; gap:8px; margin-top:20px; flex-wrap:wrap; }
.footer-socials a { width:36px; height:36px; border-radius:8px; background:rgba(255,255,255,0.04); border:1px solid var(--border); display:flex; align-items:center; justify-content:center; color:var(--gris-3); text-decoration:none; transition:background 0.2s, color 0.2s, border-color 0.2s; }
.footer-socials a:hover { background:var(--rouge); color:#fff; border-color:var(--rouge); }

.footer-legal { display:flex; align-items:center; flex-wrap:wrap; gap:10px; justify-content:center; padding:20px 24px; border-top:1px solid var(--border); font-size:0.71rem; color:rgba(255,255,255,0.22); max-width:1120px; margin:32px auto 0; }
.footer-legal a { color:rgba(255,255,255,0.3); transition:color 0.2s; }
.footer-legal a:hover { color:rgba(255,255,255,0.6); }
.footer-legal span { color:rgba(255,255,255,0.12); }
.footer-bottom { max-width:1120px; margin:0 auto; padding-top:20px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px; }
.footer-bottom p, .footer-bottom a { font-size:0.73rem; color:rgba(255,255,255,0.2); text-decoration:none; }
.footer-bottom a:hover { color:rgba(255,255,255,0.5); }

/* ===== REVEAL ANIMATIONS ===== */
.reveal { opacity:0; transform:translateY(24px); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-left { opacity:0; transform:translateX(-28px); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal-left.visible { opacity:1; transform:translateX(0); }
.reveal-right { opacity:0; transform:translateX(28px); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal-right.visible { opacity:1; transform:translateX(0); }
.reveal-scale { opacity:0; transform:scale(0.94); transition:opacity 0.6s ease, transform 0.6s ease; }
.reveal-scale.visible { opacity:1; transform:scale(1); }
.delay-1{transition-delay:0.1s} .delay-2{transition-delay:0.2s}
.delay-3{transition-delay:0.3s} .delay-4{transition-delay:0.4s}

/* ===== DON PAGE ===== */
.don-hero-wrap { display:grid; gap:48px; align-items:center; grid-template-columns:1fr; max-width:900px; margin:0 auto; }
@media(min-width:860px){ .don-hero-wrap { grid-template-columns:1fr 1fr; } }
.don-amounts { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:22px 0; }
.don-amount-btn { padding:14px 8px; border-radius:12px; border:1.5px solid var(--border); background:var(--card-bg); cursor:pointer; text-align:center; transition:all 0.2s; font-family:'Inter',sans-serif; }
.don-amount-btn:hover, .don-amount-btn.selected { border-color:var(--rouge-vif); background:rgba(21,87,192,0.08); }
.don-amount-btn .amt { font-family:'Syne','Instrument Serif',serif; font-size:1.3rem; font-weight:800; background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; display:block; }
.don-amount-btn .lbl { font-size:0.66rem; color:var(--text-sub); margin-top:2px; }
.don-method { border:1.5px solid var(--border); border-radius:14px; padding:20px; background:var(--card-bg); cursor:pointer; transition:all 0.2s; display:flex; align-items:center; gap:14px; margin-bottom:10px; }
.don-method:hover, .don-method.selected { border-color:var(--rouge-vif); background:rgba(21,87,192,0.06); }
.don-method-icon { width:44px; height:44px; border-radius:10px; flex-shrink:0; display:flex; align-items:center; justify-content:center; }
.don-method-icon.pp { background:#003087; color:#fff; }
.don-method-icon.mp { background:#e31e25; color:#fff; }
.don-method h4 { font-size:0.9rem; font-weight:600; color:var(--text-main); margin-bottom:2px; }
.don-method p { font-size:0.78rem; color:var(--text-sub); }
.don-method .chk { margin-left:auto; width:22px; height:22px; border-radius:50%; border:2px solid var(--border-2); flex-shrink:0; display:flex; align-items:center; justify-content:center; font-size:0.7rem; transition:all 0.2s; }
.don-method.selected .chk { background:var(--rouge); border-color:var(--rouge); color:#fff; }
.don-action-box { display:none; margin-top:8px; padding:18px 22px; background:var(--bg-section); border-radius:12px; border:1px solid var(--border); }
.don-action-box.visible { display:block; }
.don-action-box .code-copy { display:flex; align-items:center; gap:10px; background:var(--card-bg); border:1px solid var(--border); border-radius:8px; padding:10px 14px; margin:10px 0; }
.don-action-box .code-copy span { font-family:monospace; font-size:0.94rem; font-weight:700; color:var(--text-main); flex:1; }
.copy-btn { padding:5px 12px; background:var(--gradient); color:#fff; border:none; border-radius:6px; font-size:0.7rem; font-weight:600; cursor:pointer; transition:opacity 0.2s; }
.copy-btn:hover { opacity:0.85; }
.don-impact-grid { display:grid; gap:16px; grid-template-columns:1fr; margin-top:48px; }
@media(min-width:640px){ .don-impact-grid { grid-template-columns:repeat(3,1fr); } }
.don-impact-card { background:var(--card-bg); border-radius:16px; padding:24px; border:1px solid var(--border); text-align:center; }
.don-impact-card .icon-wrap { width:52px; height:52px; border-radius:50%; margin:0 auto 14px; display:flex; align-items:center; justify-content:center; }
.don-impact-card h4 { font-size:0.9rem; font-weight:600; color:var(--text-main); margin-bottom:6px; }
.don-impact-card p { font-size:0.8rem; color:var(--text-sub); line-height:1.6; }
.don-merci { background:var(--gradient); border-radius:24px; padding:56px 36px; text-align:center; position:relative; overflow:hidden; box-shadow:0 16px 48px var(--accent-glow); }
.don-merci::before { content:''; position:absolute; top:-80px; right:-80px; width:260px; height:260px; border-radius:50%; background:rgba(255,255,255,0.06); }
.don-merci h2 { font-family:'Syne','Instrument Serif',serif; font-size:clamp(1.5rem,3vw,2.2rem); color:#fff; font-weight:800; margin-bottom:10px; }
.don-merci p { font-size:0.88rem; color:rgba(255,255,255,0.6); max-width:420px; margin:0 auto 28px; line-height:1.7; }
.don-merci-btns { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; }
.don-merci-btns a { padding:12px 26px; border-radius:8px; font-size:0.85rem; font-weight:600; text-decoration:none; transition:all 0.2s; }
.don-merci-btns .bw { background:#fff; color:var(--rouge); }
.don-merci-btns .bw:hover { opacity:0.9; transform:translateY(-2px); }
.don-merci-btns .bt { border:1.5px solid rgba(255,255,255,0.25); color:#fff; }
.don-merci-btns .bt:hover { background:rgba(255,255,255,0.1); }

@media(max-width:860px){
  .don-page-hero { padding: 80px 18px 60px; }
  .don-stats-row { gap: 20px; }
  .don-card { padding: 26px; }
}

@media(max-width:640px){
  .don-page-hero { padding: 64px 16px 48px; }
  .don-stats-row { border-top: none; padding-top: 0; gap: 16px; }
  .don-card { padding: 22px; }
  .don-amounts { grid-template-columns: repeat(2,1fr); }
  .don-amt { padding: 18px 12px; }
  .don-amt .v { font-size: 1.3rem; }
  .don-method { flex-direction: column; align-items: stretch; gap: 14px; }
  .don-method-icon { width: 48px; height: 48px; }
  .meth { padding: 20px 16px; }
  .meth-panel { padding: 18px; }
  .mpesa-info { padding: 18px; }
  .pay-btn { padding: 14px 16px; }
  .don-impact-card { padding: 20px; }
  .don-merci { padding: 40px 24px; }
  .don-merci-btns { flex-direction: column; }
}

@media(max-width:480px){
  .don-amounts { grid-template-columns: 1fr; }
  .don-amt { width: 100%; }
  .don-hero-icon { width: 80px; height: 80px; }
  .don-page-hero h1 { font-size: clamp(1.7rem, 8vw, 2.2rem); }
  .don-page-hero p { font-size: 0.9rem; }
}

/* ===== HERO PAGE ACCUEIL ===== */
.hero { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:100px 24px 80px; text-align:center; position:relative; overflow:hidden; background:var(--bg-page); }
.hero-bg { position:absolute; inset:0; pointer-events:none; background: radial-gradient(ellipse 70% 55% at 50% -5%, rgba(21,87,192,0.1) 0%, transparent 65%), radial-gradient(ellipse 40% 40% at 85% 80%, rgba(255,107,53,0.06) 0%, transparent 60%); }
.hero-circles { position:absolute; inset:0; pointer-events:none; overflow:hidden; }
.hero-circle { position:absolute; border-radius:50%; border:1px solid rgba(21,87,192,0.08); }
.hero-circle:nth-child(1){ width:500px;height:500px;top:-100px;right:-150px; }
.hero-circle:nth-child(2){ width:300px;height:300px;bottom:80px;left:-80px; }
.hero-circle:nth-child(3){ width:200px;height:200px;top:40%;right:8%; }

.hero-tag { display:inline-flex; align-items:center; gap:8px; padding:6px 16px; background:rgba(21,87,192,0.08); border:1px solid rgba(21,87,192,0.2); border-radius:8px; font-size:0.68rem; font-weight:600; color:var(--rouge-vif); letter-spacing:0.1em; text-transform:uppercase; margin-bottom:28px; animation:fadeDown 0.8s ease 0.3s both; }

.hero h1 { font-family:'Syne','Instrument Serif',serif; font-size:clamp(2.6rem,7vw,5.5rem); font-weight:800; line-height:1.06; color:var(--text-main); max-width:860px; margin-bottom:22px; letter-spacing:-0.04em; animation:fadeUp 0.9s ease 0.5s both; }
.hero h1 em { background:var(--gradient); -webkit-background-clip:text; -webkit-text-fill-color:transparent; font-style:normal; }

.hero-sub { font-size:1.05rem; color:var(--text-sub); max-width:520px; line-height:1.7; margin-bottom:40px; animation:fadeUp 0.9s ease 0.7s both; }

.hero-ctas { display:flex; gap:12px; flex-wrap:wrap; justify-content:center; animation:fadeUp 0.9s ease 0.9s both; }
.cta-main { padding:15px 34px; background:var(--gradient); color:#fff; border-radius:10px; font-size:0.92rem; font-weight:700; text-decoration:none; transition:opacity 0.2s, transform 0.2s; box-shadow:0 6px 24px var(--accent-glow); display:inline-flex; align-items:center; gap:8px; }
.cta-main:hover { opacity:0.88; transform:translateY(-2px); }
.cta-sec { padding:15px 34px; border:1.5px solid var(--border-2); color:var(--text-main); border-radius:10px; font-size:0.92rem; font-weight:600; text-decoration:none; transition:all 0.2s; display:inline-flex; align-items:center; gap:8px; }
.cta-sec:hover { border-color:var(--rouge); color:var(--rouge); background:rgba(21,87,192,0.05); }

.hero-proof { display:flex; align-items:center; gap:16px; margin-top:52px; animation:fadeUp 0.9s ease 1.1s both; }
.avatars { display:flex; }
.avatars span { width:38px; height:38px; border-radius:50%; border:2.5px solid var(--bg-page); background:rgba(21,87,192,0.2); display:flex; align-items:center; justify-content:center; font-size:0.7rem; font-weight:700; color:var(--rouge-vif); margin-left:-10px; }
.avatars span:first-child { margin-left:0; }
.proof-txt { font-size:0.82rem; color:var(--text-sub); line-height:1.4; }
.proof-txt strong { color:var(--text-main); display:block; }

.scroll-hint { position:absolute; bottom:32px; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:6px; animation:fadeUp 1s ease 1.5s both; }
.scroll-hint span { font-size:0.63rem; color:var(--text-sub); letter-spacing:0.12em; text-transform:uppercase; }
.scroll-arrow { width:22px; height:22px; border-right:2px solid var(--gris-3); border-bottom:2px solid var(--gris-3); transform:rotate(45deg); animation:scrollBounce 1.5s infinite; }
@keyframes scrollBounce { 0%,100%{transform:rotate(45deg) translateY(0)} 50%{transform:rotate(45deg) translateY(5px)} }

.media-bar { padding:32px 24px; background:var(--bg-section); text-align:center; border-top:1px solid var(--border); border-bottom:1px solid var(--border); }
.media-bar p { font-size:0.63rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--gris-3); margin-bottom:20px; }
.media-logos { display:flex; flex-wrap:wrap; gap:14px 32px; align-items:center; justify-content:center; }
.media-logos span { font-size:0.78rem; font-weight:700; letter-spacing:0.06em; color:rgba(255,255,255,0.15); text-transform:uppercase; }
body.light .media-logos span { color:rgba(0,0,0,0.12); }

@keyframes fadeUp { from{opacity:0;transform:translateY(24px)} to{opacity:1;transform:translateY(0)} }
@keyframes fadeDown { from{opacity:0;transform:translateY(-16px)} to{opacity:1;transform:translateY(0)} }