:root{
    --bg:#000;
    --panel:rgba(0,0,0,0.58);
    --line:rgba(255,255,255,0.42);
    --line-soft:rgba(255,255,255,0.16);
    --text:#fff;
    --muted:rgba(255,255,255,0.72);
    --dim:rgba(255,255,255,0.50);
}
*{margin:0;padding:0;box-sizing:border-box}
body{
    min-height:100vh;
    color:var(--text);
    font-family:'Rajdhani',Arial,sans-serif;
    overflow-x:hidden;
    background:#000 url('../img/stars.jpg') center center / cover fixed no-repeat;
}
body::before{
    content:"";
    position:fixed;
    inset:0;
    background:radial-gradient(circle at top,rgba(255,255,255,.08),transparent 38%),
               linear-gradient(180deg,rgba(0,0,0,.28),rgba(0,0,0,.86));
    pointer-events:none;
    z-index:-1;
}
body::after{
    content:"";
    position:fixed;
    inset:0;
    background:repeating-linear-gradient(0deg,rgba(255,255,255,.035) 0,rgba(255,255,255,.035) 1px,transparent 1px,transparent 5px);
    opacity:.18;
    pointer-events:none;
    mix-blend-mode:screen;
}
a{color:white;text-decoration:none}
.container{width:95%;max-width:1500px;margin:auto;padding:34px}
.header,.panel,.footer,.archive-card,.boot-screen{backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.header{
    border:1px solid var(--line);
    background:linear-gradient(135deg,rgba(0,0,0,.72),rgba(255,255,255,.055));
    padding:34px;
    position:relative;
    overflow:hidden;
    box-shadow:0 0 50px rgba(255,255,255,.08),inset 0 0 60px rgba(255,255,255,.025);
}
.header::after{
    content:"ARCHIVES RÉPUBLICAINES";
    position:absolute;
    right:-30px;
    top:12px;
    font-size:72px;
    opacity:.055;
    font-weight:700;
    letter-spacing:10px;
    color:#fff;
    font-family:'Orbitron',sans-serif;
}
.top-line{display:flex;justify-content:space-between;align-items:center;margin-bottom:28px;gap:22px}
.logo{display:flex;align-items:center;gap:18px}
.logo-circle{
    width:82px;height:82px;border:1px solid rgba(255,255,255,.65);border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 0 28px rgba(255,255,255,.16),inset 0 0 20px rgba(255,255,255,.08);
    background:rgba(255,255,255,.04);padding:9px;
}
.logo-circle img{width:100%;height:100%;object-fit:contain;filter:brightness(0) invert(1) drop-shadow(0 0 8px rgba(255,255,255,.45))}
h1,h2,h3{font-family:'Orbitron',sans-serif;text-transform:uppercase;letter-spacing:3px}
.title-block h1{font-size:32px}
.title-block p,.subtitle,p{color:var(--muted)}
.status{
    padding:10px 20px;border:1px solid rgba(255,255,255,.72);background:rgba(255,255,255,.055);
    color:#fff;font-weight:600;letter-spacing:2px;white-space:nowrap;
}
.mission-title h2{font-size:38px;margin-bottom:10px;text-shadow:0 0 18px rgba(255,255,255,.18)}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin-top:30px}
.archive-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:25px;margin-top:30px}
.panel,.archive-card{
    background:linear-gradient(180deg,rgba(0,0,0,.68),rgba(0,0,0,.48));
    border:1px solid var(--line-soft);
    padding:25px;
    position:relative;
    overflow:hidden;
    box-shadow:inset 0 0 42px rgba(255,255,255,.018);
}
.panel::before,.archive-card::before{content:"";position:absolute;top:0;left:0;width:100%;height:1px;background:linear-gradient(to right,#fff,transparent);opacity:.62}
.panel h3,.archive-card h3{font-size:18px;margin-bottom:18px}
.meta{display:grid;gap:10px;margin:18px 0}
.meta div{background:rgba(255,255,255,.045);padding:12px;border-left:3px solid rgba(255,255,255,.82)}
.label{font-size:12px;color:var(--dim);text-transform:uppercase;letter-spacing:2px}
.value{margin-top:4px;font-size:17px;font-weight:600;color:#fff}
.btn{
    display:inline-block;margin-top:10px;border:1px solid rgba(255,255,255,.35);
    padding:12px 18px;background:rgba(255,255,255,.045);letter-spacing:2px;font-weight:700;
}
.btn:hover{background:rgba(255,255,255,.12)}
.boot-screen{
    position:fixed;inset:0;z-index:20;background:rgba(0,0,0,.94);
    display:flex;align-items:center;justify-content:center;padding:30px;
}
.boot-box{width:min(850px,95vw);border:1px solid rgba(255,255,255,.35);padding:34px;background:rgba(255,255,255,.035)}
.boot-line{font-family:'Orbitron',sans-serif;letter-spacing:2px;margin:12px 0;color:rgba(255,255,255,.85)}
.progress{height:8px;border:1px solid rgba(255,255,255,.4);margin-top:24px}
.progress span{display:block;height:100%;width:0;background:white;box-shadow:0 0 14px white;animation:load 3.8s forwards}
@keyframes load{to{width:100%}}
.hidden{display:none}
.timeline{display:flex;flex-direction:column;gap:20px}
.event{position:relative;padding-left:30px;border-left:1px solid rgba(255,255,255,.24);padding-bottom:15px}
.event::before{content:"";position:absolute;left:-6px;top:0;width:11px;height:11px;background:#fff;border-radius:50%;box-shadow:0 0 12px rgba(255,255,255,.78)}
.event-time{font-weight:700;color:#fff}
.event-title{font-size:20px;margin:5px 0;color:#fff;font-weight:600}
.report-text{line-height:1.85;font-size:18px}
.report-text p{margin-bottom:18px;color:rgba(255,255,255,.84)}
.footer{margin-top:30px;padding:25px;border:1px solid rgba(255,255,255,.22);background:rgba(0,0,0,.55)}
@media(max-width:1000px){.grid{grid-template-columns:1fr}.top-line{flex-direction:column;align-items:flex-start}.mission-title h2{font-size:28px}}