/* General */
body { margin:0; font-family: 'Poppins', sans-serif; background:#121212; color:#fff; }
a { text-decoration:none; color:#fff; }

/* Header */
header { display:flex; justify-content:space-between; align-items:center; padding:10px 50px; background:#1f1f1f; }
header .logo { font-size:24px; font-weight:bold; }
header nav ul { display:flex; list-style:none; }
header nav ul li { margin:0 15px; }
header nav ul li a { font-weight:500; }

/* Slider */
.slider { position:relative; height:400px; overflow:hidden; margin-bottom:50px; }
.slider-container { position:relative; height:100%; }
.slide { position:absolute; width:100%; height:100%; background-size:cover; background-position:center; display:none; align-items:flex-end; padding:20px; transition:opacity 1s ease; }
.slide-info { background:rgba(0,0,0,0.6); padding:20px; border-radius:10px; max-width:400px; }
.slide-info h2 { font-size:28px; margin-bottom:10px; }
.slide-info p { font-size:14px; margin-bottom:10px; }
.btn { display:inline-block; background:#e50914; color:#fff; padding:8px 15px; border-radius:5px; font-weight:bold; }

/* Slider Arrows */
.prev, .next { position:absolute; top:50%; transform:translateY(-50%); background:rgba(0,0,0,0.5); color:#fff; font-size:30px; padding:10px; cursor:pointer; border:none; border-radius:50%; }
.prev { left:20px; } .next { right:20px; }
.prev:hover, .next:hover { background:rgba(0,0,0,0.8); }

/* Movies Grid */
.movies-section { padding:0 50px 50px 50px; }
.movies-section h2 { font-size:24px; margin-bottom:20px; }
.movies-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:20px; }
.movie-card { background:#1f1f1f; border-radius:10px; overflow:hidden; transition:transform 0.3s; }
.movie-card:hover { transform:scale(1.05); }
.movie-card img { width:100%; height:270px; object-fit:cover; }
.movie-info { padding:10px; }
.movie-info h3 { font-size:16px; margin:5px 0; }
.movie-info p { font-size:12px; color:#aaa; margin-bottom:5px; }

/* Footer */
footer { padding:20px 50px; text-align:center; background:#1f1f1f; margin-top:50px; }
footer .social a { margin:0 10px; color:#fff; font-weight:bold; }

/* Responsive */
@media(max-width:768px){
    header { flex-direction:column; padding:10px 20px; }
    .movies-grid { grid-template-columns:repeat(auto-fill,minmax(140px,1fr)); }
    .slide-info { max-width:300px; }
}