:root{
  --bg:#070610; --bg2:#0d0b1c; --ink:#f3efff; --muted:#a79fc8;
  --gold:#f5c86b; --gold-2:#e7b450; --violet:#7c5cff; --cyan:#39d9d0;
  --card:#120f24; --line:rgba(255,255,255,.08);
  --r:20px; --maxw:1100px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:Inter,system-ui,sans-serif;line-height:1.55;overflow-x:hidden;
}
a{color:inherit}
em{font-style:italic;color:var(--gold)}
strong,b{color:#fff}

/* fonds animés */
.aurora{position:fixed;inset:-20% -10% auto -10%;height:120vh;z-index:-2;pointer-events:none;
  background:
    radial-gradient(45% 40% at 20% 15%,rgba(124,92,255,.35),transparent 60%),
    radial-gradient(40% 35% at 85% 10%,rgba(245,200,107,.22),transparent 60%),
    radial-gradient(50% 45% at 60% 55%,rgba(57,217,208,.14),transparent 60%),
    linear-gradient(180deg,var(--bg2),var(--bg));
  filter:saturate(1.1);animation:drift 22s ease-in-out infinite alternate}
@keyframes drift{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(0,-3%,0) scale(1.06)}}
.grain{position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.05;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* hero */
.hero{position:relative;max-width:var(--maxw);margin:0 auto;padding:min(14vw,110px) 22px 40px;}
.hero-inner{max-width:720px}
.eyebrow{display:inline-flex;align-items:center;gap:9px;font-size:12px;letter-spacing:.28em;
  color:var(--muted);text-transform:uppercase;margin-bottom:22px}
.eyebrow .dot{width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px 2px var(--gold)}
h1{font-family:Fraunces,serif;font-weight:600;line-height:.95;margin:0;
  font-size:clamp(52px,11vw,124px);letter-spacing:-.02em;
  background:linear-gradient(120deg,#fff 10%,var(--gold) 55%,var(--violet) 110%);
  -webkit-background-clip:text;background-clip:text;color:transparent;}
.lede{font-size:clamp(17px,2.4vw,22px);color:#d8d2f0;margin:22px 0 0;max-width:38ch}
.archimedes{margin:28px 0 0;padding:16px 20px;border-left:3px solid var(--gold);
  background:rgba(245,200,107,.06);border-radius:0 14px 14px 0;font-family:Fraunces,serif;
  font-size:19px;color:#efe7ff}
.archimedes cite{display:block;margin-top:8px;font-family:Inter;font-style:normal;font-size:14px;color:var(--muted)}
.meta-row{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 0}
.chip{font-size:13px;padding:8px 14px;border:1px solid var(--line);border-radius:999px;color:#cfc8ea;background:rgba(255,255,255,.03)}
.chip.ok{border-color:rgba(57,217,208,.4);color:var(--cyan)}
.cta{display:inline-block;margin-top:30px;font-weight:600;font-size:15px;color:#0a0714;
  background:linear-gradient(120deg,var(--gold),var(--gold-2));padding:13px 24px;border-radius:999px;
  text-decoration:none;box-shadow:0 10px 30px -8px rgba(245,200,107,.5);transition:transform .2s}
.cta:hover{transform:translateY(-2px)}
.lever{position:absolute;right:max(3vw,18px);top:7vw;width:min(34vw,360px);opacity:.9;
  filter:drop-shadow(0 12px 40px rgba(124,92,255,.35));display:none}
@media(min-width:1000px){.lever{display:block}}

/* grille des jours */
.grid{max-width:var(--maxw);margin:10px auto 0;padding:24px 22px;display:grid;gap:22px;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}
.day{position:relative;background:linear-gradient(180deg,var(--card),#0c0a18);
  border:1px solid var(--line);border-radius:var(--r);padding:0;overflow:hidden;
  display:flex;flex-direction:column;transition:transform .25s,border-color .25s}
.day:hover{transform:translateY(-4px);border-color:rgba(245,200,107,.35)}
.day-art{height:150px;position:relative;display:flex;align-items:flex-end;padding:16px;
  background:var(--art,linear-gradient(135deg,#241b4d,#0e0b22));overflow:hidden}
.day-art::after{content:"";position:absolute;inset:0;
  background:radial-gradient(120px 120px at 85% 20%,rgba(255,255,255,.18),transparent 70%)}
.day-num{font-family:Fraunces,serif;font-size:72px;font-weight:700;color:rgba(255,255,255,.14);
  position:absolute;top:-14px;right:10px;line-height:1}
.badge{position:relative;z-index:1;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:#0a0714;background:var(--gold);padding:5px 11px;border-radius:999px;font-weight:600}
.day-body{padding:18px 18px 20px;display:flex;flex-direction:column;gap:10px;flex:1}
.day-body h3{font-family:Fraunces,serif;font-weight:600;font-size:23px;margin:0}
.day-body p{margin:0;color:var(--muted);font-size:14.5px;flex:1}
.day-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:6px}
.play{display:inline-flex;align-items:center;gap:9px;border:0;cursor:pointer;font:inherit;font-weight:600;
  color:#0a0714;background:linear-gradient(120deg,var(--gold),var(--gold-2));padding:11px 18px;border-radius:12px;transition:filter .2s}
.play:hover{filter:brightness(1.08)}
.play .ic{width:0;height:0;border-left:11px solid #0a0714;border-top:7px solid transparent;border-bottom:7px solid transparent}
.state{font-size:12.5px;color:var(--muted)}
.state.done{color:var(--cyan)}
.bar{height:4px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden;margin-top:12px}
.bar > i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--gold),var(--violet))}

/* pillars */
.pillars{max-width:var(--maxw);margin:30px auto;padding:30px 22px}
.pillars h2{font-family:Fraunces,serif;font-weight:600;font-size:clamp(24px,4vw,34px);margin:0 0 22px}
.pillars ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));counter-reset:p}
.pillars li{counter-increment:p;background:rgba(255,255,255,.03);border:1px solid var(--line);
  border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:6px}
.pillars li::before{content:counter(p);font-family:Fraunces,serif;font-size:20px;color:var(--gold)}
.pillars li b{font-size:16px}
.pillars li span{color:var(--muted);font-size:13.5px}

/* footer */
footer{max-width:var(--maxw);margin:20px auto 60px;padding:34px 22px;border-top:1px solid var(--line);color:var(--muted)}
.f-brand{font-family:Fraunces,serif;color:var(--gold);font-size:20px;margin-bottom:10px}
footer p{margin:6px 0;max-width:62ch;font-size:14px}
.fine{font-size:12px;opacity:.7}

/* player */
.player{position:fixed;inset:0;z-index:50;background:rgba(5,4,12,.86);backdrop-filter:blur(10px);
  display:flex;align-items:center;justify-content:center;padding:20px;animation:fade .25s ease}
.player[hidden]{display:none}
@keyframes fade{from{opacity:0}to{opacity:1}}
.player-box{width:min(1000px,100%);background:#0b0918;border:1px solid var(--line);border-radius:18px;
  padding:16px;position:relative;box-shadow:0 30px 80px -20px #000}
.player-box h3{font-family:Fraunces,serif;font-weight:600;margin:4px 40px 12px 4px;font-size:20px}
.player-close{position:absolute;top:12px;right:12px;z-index:2;width:38px;height:38px;border-radius:50%;
  border:1px solid var(--line);background:#15122a;color:#fff;font-size:16px;cursor:pointer}
.player-close:hover{background:#221d40}
video{width:100%;max-height:72vh;border-radius:12px;background:#000;display:block}
