:root{
--bg:#000;
--panel:#0b0b0b;
--text:#f2f2f2;
--muted:#bdbdbd;
--accent:#d8e8ff;
--max:1200px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
background:var(--bg);
color:var(--text);
font-family:'Libertinus Serif',sans-serif;
line-height:1.7;
overflow-x:hidden;
}
body:before{
content:"";
position:fixed;inset:0;pointer-events:none;
background:
radial-gradient(circle at 20% 30%,rgba(255,255,255,.05),transparent 25%),
radial-gradient(circle at 80% 70%,rgba(180,220,255,.04),transparent 30%);
}
p {
  font-size: 2.4rem;
}
.nav{
max-width:var(--max);
margin:auto;
padding:28px 40px;
display:flex;
justify-content:space-between;
align-items:center;
position:relative;z-index:5
}
.logo{color:#fff;text-decoration:none;font-family:'Cormorant Garamond',serif;font-size:2rem}
.nav ul{display:flex;gap:2rem;list-style:none}
.nav a{color:#ddd;text-decoration:none}
.hero{
min-height:100vh;
display:flex;
flex-direction:column;
justify-content:center;
background:#000;
}
.hero-content{
max-width:900px;
margin:auto;
padding:40px;
text-align:center;
}
.hero-content img{
width:min(520px,90%);
display:block;
margin:0 auto 2rem;
filter:drop-shadow(0 0 40px rgba(255,255,255,.12));
animation:fade 2s ease;
}
h1,h2,h3{font-family:'Cormorant Garamond',serif;font-weight:600}
h1{font-size:clamp(3rem,8vw,6rem);letter-spacing:.08em}
h2{font-size:clamp(2rem,4vw,3rem);margin-bottom:1.2rem}
h3{font-size:1.8rem}
.hero p{color:var(--muted);font-size:1.2rem}
.btn{
display:inline-block;
margin-top:2rem;
padding:14px 32px;
border:1px solid #777;
color:#fff;
text-decoration:none;
transition:.4s;
}
.btn:hover{background:#fff;color:#000}
.section{padding:110px 24px}
.container{max-width:900px;margin:auto}
.container p{margin-bottom:1.3rem;color:#d0d0d0}
.gallery{
max-width:1400px;
margin:auto;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
gap:2rem;
padding-inline:24px;
}
.video-card{
background:var(--panel);
border:1px solid rgba(255,255,255,.08);
padding:18px;
transition:.4s;
}
.video-card:hover{transform:translateY(-6px);border-color:rgba(255,255,255,.2)}
video{width:100%;display:block;background:#000}
.video-card p{font-size:1.8rem;text-align:center;margin-top:1rem}
.manifesto{
background:linear-gradient(#050505,#101010);
text-align:center;
}
footer{
padding:60px 24px;
border-top:1px solid rgba(255,255,255,.08);
text-align:center;
color:#9e9e9e
}
@keyframes fade{
from{opacity:0;transform:translateY(30px)}
to{opacity:1;transform:none}
}
@media (max-width:768px){
.nav{padding:20px}
.nav ul{gap:1rem;font-size:.9rem}
.section{padding:70px 20px}
}