/* assets/css/style.css */
:root {
    --black: #050505;
    --bone: #f5f2eb;
    --gold: #a67b4b;
    --rust: #8b4b2a;
}
* { margin: 0; padding: 0; box-sizing: border-box; }
body { background: var(--black); color: var(--bone); font-family: 'Inter', sans-serif; font-weight: 300; overflow-x: hidden; scroll-behavior: smooth; }
h1, h2, h3, .hero-content h1, .philosophy h2, footer h2, .member h3 { font-family: 'Bebas Neue', sans-serif; letter-spacing: 0.03em; font-weight: 400; }
h2 { font-size: clamp(2.8rem, 8vw, 5rem); border-left: 6px solid var(--gold); padding-left: 1.2rem; margin-bottom: 2rem; }
section, footer { padding: 5rem 5%; max-width: 1400px; margin: 0 auto; }
/* Preloader */
#preloader { position: fixed; top:0; left:0; width:100%; height:100%; background: var(--black); z-index: 9999; display: flex; flex-direction: column; justify-content: center; align-items: center; transition: 0.8s; }
.year { font-size: clamp(2rem,6vw,4rem); color: var(--rust); animation: flicker 1.6s infinite alternate; font-family: 'Bebas Neue'; }
@keyframes flicker { 0% { opacity: 0.3; } 100% { opacity: 1; text-shadow: 0 0 8px var(--gold); } }
/* Hero */
.hero { position: relative; height: 100vh; display: flex; align-items: center; }
.hero video { position: absolute; width: 100%; height: 100%; object-fit: cover; filter: brightness(0.45) contrast(1.2); }
.hero-content { position: relative; z-index: 3; max-width: 1300px; margin: 0 auto; padding: 2rem; }
.hero-content h1 { font-size: clamp(4rem, 14vw, 10rem); line-height: 0.95; text-transform: uppercase; }
.hero-content a { border: 2px solid var(--bone); padding: 0.9rem 2.5rem; text-decoration: none; color: var(--bone); transition: 0.3s; display: inline-block; }
.hero-content a:hover { background: var(--gold); border-color: var(--gold); color: black; }
/* Crew */
.crew-grid { display: flex; gap: 3rem; margin-top: 3rem; flex-wrap: wrap; }
.member { background: #0d0d0d; padding: 2rem; border-left: 4px solid var(--gold); flex:1; transition: 0.3s; }
.member:hover { transform: translateY(-10px); background: #111; }
.member span { font-size: 3rem; color: var(--rust); }
/* Timeline */
.timeline { display: flex; flex-wrap: wrap; gap: 2rem; justify-content: space-between; }
.year-block { background: #0a0a0a; padding: 1.5rem; text-align: center; font-size: 2rem; border-bottom: 3px solid var(--gold); width: 220px; }
/* Archive */
.archive-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px,1fr)); gap: 1.5rem; margin-top: 2rem; }
.archive-grid div { background: #0c0b0a; padding: 2rem; text-align: center; font-weight: bold; text-transform: uppercase; border: 1px solid #2f261e; transition: 0.3s; font-family: 'Bebas Neue'; }
.archive-grid div:hover { background: var(--rust); color: black; }
/* Philosophy */
.philosophy { text-align: center; background: #070707; border-top: 1px solid var(--gold); border-bottom: 1px solid var(--gold); }
.philosophy h2 { border-left: none; background: linear-gradient(135deg, #f5f2eb, #a67b4b); background-clip: text; -webkit-background-clip: text; color: transparent; }
/* Join */
.join-movement { text-align: center; background: #0c0805; }
.join-input { display: flex; gap: 1rem; justify-content: center; flex-wrap: wrap; margin-top: 2rem; }
.join-input input { background: #111; border: 1px solid var(--gold); padding: 0.9rem; color: white; }
.join-input button { background: var(--rust); border: none; padding: 0 2rem; font-family: 'Bebas Neue'; font-size: 1.2rem; cursor: pointer; }
/* Footer */
footer { text-align: center; }
.footer-manifesto { border-top: 1px solid #302418; border-bottom: 1px solid #302418; max-width: 700px; margin: 2rem auto; padding: 1.5rem; font-style: italic; }