*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:Arial, Helvetica, sans-serif;
}

body{
    background:#ffffff;
}

.container{
    width:100%;
    margin:0;
    background:#171717;
    color:#fff;
}

/*================ HEADER ================*/

header{
    height:28px;
    background:#0b0b0b;
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:0 12px;
}

.logo{
    color:#e50914;
    font-size:12px;
    font-weight:bold;
}

nav a{
    color:#ffffff;
    text-decoration:none;
    font-size:8px;
    margin-left:10px;
}

nav a:hover{
    color:#e50914;
}

/*================ BANNER ================*/

.banner{
    position:relative;
    height:300px;
    background:url("../images/movies/movie-banner.jpg") center center;
    background-size:cover;
    display:flex;
    align-items:flex-end;
    padding:14px;
    overflow:hidden;
}

.banner::before{
    content:"";
    position:absolute;
    inset:0;
    background:rgba(0,0,0,.28);
}

.banner h1{
    position:relative;
    font-size:16px;
    font-weight:bold;
    color:#fff;
    margin-bottom:6px;
}

/*================ SECTION ================*/

section{
    padding:12px;
}

section h3{
    font-size:13px;
    color:#fff;
    margin-bottom:10px;
}

/*================ DANH SÁCH PHIM ================*/

.movie-list{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
}

.movie-list img{
    width:120px;
height:180px;
    object-fit:cover;
    transition:.3s;
    cursor:pointer;
}

.movie-list img:hover{
    transform:scale(1.12);
    box-shadow:0 0 18px rgba(255,255,255,.85);
    z-index:10;
}