:root{
  --bg:#0b0b0b; --fg:#f2f2f2; --line:rgba(255,255,255,.08);
  --card:#111214; --card2:#0f1011;
  --radius:14px; --radius-sm:10px;
}
*{box-sizing:border-box;margin:0;padding:0}
body{
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Helvetica,Arial,sans-serif;
  background:var(--bg);color:var(--fg);line-height:1.55;
}
a{color:var(--fg);text-decoration:none}

header{position:sticky;top:0;z-index:20;
  backdrop-filter:blur(10px) saturate(140%);
  background:rgba(11,11,11,.8);border-bottom:1px solid var(--line)}
.nav{max-width:1200px;margin:0 auto;padding:0 4vw;height:64px;
  display:flex;align-items:center;justify-content:space-between}
.brand{font-weight:800;letter-spacing:.1em}
.nav a{margin-left:1.2rem;opacity:.8}
.nav a:hover{opacity:1}

.hero{padding:14vh 4vw 10vh;text-align:center;border-bottom:1px solid var(--line)}
.title{font-size:clamp(38px,8vw,120px);font-weight:900;
  background:linear-gradient(120deg,#fff,#c9c9c9,#9a9a9a);
  -webkit-background-clip:text;color:transparent}
.subtitle{opacity:.7;letter-spacing:.14em;text-transform:uppercase}

section{padding:8vh 4vw;border-bottom:1px solid var(--line)}
h2{font-size:1.6rem;margin-bottom:1rem}

.grid{display:grid;gap:1.2rem;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}

.card{background:linear-gradient(180deg,var(--card),var(--card2));
  border-radius:var(--radius);overflow:hidden;
  border:1px solid var(--line);
  transition:transform .2s ease,box-shadow .2s ease}
.cover{width:100%;aspect-ratio:1/1;object-fit:cover;
  transition:transform .25s ease, box-shadow .25s ease}
.card:hover .cover{transform:scale(1.05);box-shadow:0 20px 40px rgba(0,0,0,.4)}
.pad{padding:1rem}
.meta{opacity:.7;font-size:.9rem;margin:.4rem 0 .8rem}
.btn{display:inline-block;padding:.5rem .8rem;
  border-radius:var(--radius-sm);
  background:rgba(255,255,255,.08);
  border:1px solid var(--line);margin-top:.3rem}
.btn:hover{border-color:rgba(255,255,255,.3)}

.reveal{opacity:0;transform:translateY(40px);
  transition:all .8s ease}
.reveal.visible{opacity:1;transform:translateY(0)}

footer{padding:6vh 0;text-align:center;opacity:.7}