.films_banner {
    padding-top:  clamp(100px, 15vw, 270px);
    padding-bottom: clamp(30px, 10vw, 70px);
    background: url(../images/header_films.jpg) no-repeat center;
    background-size: cover;
}
.header_films:after {
    content: " ";
    display: block;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 0%, rgba(0, 0, 0, 1) 100%);
    height: 215px;
    max-height: 70%;
    z-index: 1;
}
.films_banner .container_max {
    z-index: 10;
}
.films_banner .container_max > div {
    max-width: 610px;
}
.films_banner h1 {
 font-size: clamp(24px, 3.5vw, 40px);
 line-height: clamp(30px, 4.5vw, 38px);
 margin-bottom: clamp(20px, 2vw, 48px);
}

.films_banner p {
    font-size: clamp(14px, 1vw, 16px);
    line-height: clamp(20px, 2vw, 23px);
    margin-bottom: 20px;
    max-width: 500px;
}
.films_banner p:last-child {
    margin-bottom: 0;
}
.film_box_holder {
   padding-bottom: clamp(20px, 4vw, 40px);    
}
.film_box {
   width: 49%;
   max-width: 685px;
   margin-bottom: clamp(20px, 4vw, 30px);
}
.film_box a {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    border: 1px solid #4C4C4C;
    border-radius: 10px;
    padding: 20px 20px 20px 20px;
    box-sizing: border-box;
    color: #ffffff;
    text-decoration: none;
}
.film_box a:hover {
    border-color: #949494;
}
.film_box a:hover h2::after {
  color: rgba(255, 255, 255, 1);  
}
.film_box img {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 40px;
}
.film_box h2 {
    position: relative;
    display: block;
    font-family: "Droid Serif";
    font-size: 26px;
    line-height: 23px;
    margin-bottom: 25px;
}
.film_box h2::after {
  content: "play_circle";
  font-family: "Material Symbols Outlined";
  font-variation-settings: 
    'FILL' 0, 
    'wght' 400, 
    'GRAD' 0, 
    'opsz' 24;   /* tweak weight/size */
  font-size: 24px;
  color: rgba(255, 255, 255, 0.5);
  position: absolute;
  right: 0px;
  top: 50%;
  transform: translateY(-50%);
}
.film_box p {
    font-size: 16px;
    line-height: 23px;
    max-width: 430px;
}

@media (max-width:685px){
   .film_box_holder {
      justify-content: center;
   }
   .film_box {
       width: 100%;
   }
}