:root{
--bg:#0b0b0b;
--card:#151515;
--text:#ffffff;
--muted:#999999;
--primary:#28a745;
}

body{
background:var(--bg);
color:var(--text);
font-family:Arial,sans-serif;
}

a{
text-decoration:none;
color:white;
}

.navbar{
background:#111;
}

.logo{
font-size:30px;
font-weight:700;
color:var(--primary);
}

.hero{
padding:70px 20px;
text-align:center;
}

.hero h1{
font-size:48px;
font-weight:700;
}

.hero p{
color:var(--muted);
}

.movie-card{
background:var(--card);
border-radius:10px;
overflow:hidden;
transition:.3s;
height:100%;
}

.movie-card:hover{
transform:translateY(-5px);
}

.movie-card img{
width:100%;
height:320px;
object-fit:cover;
}

.movie-title{
padding:10px;
font-size:15px;
font-weight:600;
}

.sidebar-card{
background:var(--card);
padding:15px;
border-radius:10px;
margin-bottom:20px;
}

.related-card{
background:var(--card);
border-radius:10px;
overflow:hidden;
}

.related-card img{
width:100%;
height:250px;
object-fit:cover;
}

.pagination .page-link{
background:#222;
border:none;
color:white;
}

.pagination .active .page-link{
background:var(--primary);
}

footer{
border-top:1px solid #222;
margin-top:40px;
padding:20px;
text-align:center;
}