/* Static fallback CSS — dark theme matching the React app */
*{margin:0;padding:0;box-sizing:border-box}
body{background:#0f111a;color:#f5f5f7;font-family:'Figtree','Inter',sans-serif;line-height:1.7;-webkit-font-smoothing:antialiased}
h1,h2,h3,h4{font-family:'Outfit',sans-serif;font-weight:700;line-height:1.2;letter-spacing:-0.02em}
h1{font-size:clamp(1.75rem,5vw,2.75rem);margin-bottom:1rem}
h2{font-size:clamp(1.4rem,4vw,2rem);margin-bottom:0.875rem;color:#c5a059}
h3{font-size:1.15rem;margin-bottom:0.5rem;color:#e8e4dd}
p{margin-bottom:1rem;font-size:1rem;color:#c8c8d0}
a{color:#8b5cf6;text-decoration:none;transition:color .2s}
a:hover{color:#c5a059}
.small{font-size:0.875rem;color:#888}
.eyebrow{font-size:0.8rem;text-transform:uppercase;letter-spacing:0.15em;color:#c5a059;font-weight:600;margin-bottom:0.75rem}

/* Nav */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;justify-content:space-between;padding:1rem 2rem;background:rgba(15,17,26,0.85);backdrop-filter:blur(12px);border-bottom:1px solid rgba(197,160,89,0.15)}
nav .logo{font-family:'Outfit',sans-serif;font-weight:800;font-size:1.1rem;letter-spacing:0.05em;color:#c5a059}
nav .links{display:flex;gap:1.25rem;flex-wrap:wrap}
nav .links a{font-size:0.875rem;color:#c8c8d0}
nav .links a:hover{color:#c5a059}
@media(max-width:768px){
  nav{flex-direction:column;gap:0.5rem;padding:0.75rem 1rem}
  nav .links{gap:0.75rem;justify-content:center}
  nav .links a{font-size:0.75rem}
}

/* Layout */
.container{max-width:72rem;margin:0 auto;padding:0 1.5rem}
.section{padding:4rem 1.5rem}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(16rem,1fr));gap:1.25rem;margin-top:1.5rem}
.card{background:#151826;border:1px solid rgba(197,160,89,0.15);border-radius:0.75rem;padding:1.5rem;margin-bottom:1rem}
.card h3{margin-bottom:0.5rem}
.card p{margin:0;font-size:0.95rem}

/* Buttons */
.btn-gold{display:inline-block;background:linear-gradient(135deg,#c5a059,#e8c07a);color:#0f111a;font-weight:700;padding:0.75rem 1.75rem;border-radius:9999px;font-size:0.95rem;border:none;cursor:pointer;transition:opacity .2s}
.btn-gold:hover{opacity:0.9;color:#0f111a}
.btn-outline{display:inline-block;background:transparent;color:#c5a059;font-weight:600;padding:0.7rem 1.75rem;border-radius:9999px;font-size:0.95rem;border:1px solid #c5a059;cursor:pointer;transition:background .2s}
.btn-outline:hover{background:rgba(197,160,89,0.1)}

/* Note */
.note{background:rgba(139,92,246,0.1);border:1px solid rgba(139,92,246,0.3);border-radius:0.75rem;padding:1rem}

/* Footer */
footer{border-top:1px solid rgba(197,160,89,0.15);padding:2rem;text-align:center;margin-top:2rem}
footer .f-links{display:flex;gap:1.5rem;justify-content:center;margin-bottom:0.75rem}
footer .f-links a{font-size:0.875rem;color:#888}
footer p{font-size:0.8rem;color:#666;margin:0}

/* Lists */
ul{margin:1rem 0;padding-left:1.5rem}
ul li{margin-bottom:0.5rem;color:#c8c8d0;font-size:0.95rem}

/* Timeline */
.timeline-item{display:flex;gap:1rem;align-items:flex-start;margin-bottom:1.25rem;padding-bottom:1.25rem;border-bottom:1px solid rgba(197,160,89,0.1)}
.timeline-year{font-family:'Outfit',sans-serif;font-weight:800;font-size:1.25rem;color:#c5a059;min-width:4rem}
.timeline-text{color:#c8c8d0;font-size:0.95rem}

/* Links */
.link{color:#8b5cf6;font-weight:500;text-decoration:none}
.link:hover{color:#c5a059}

/* Hide static content when JS is active */
html.js #static-content{display:none}