:root{
  --brand:#009AED;
  --cream:#FFFAF3;
  --white:#ffffff;
  --ink:#111;
  --radius:24px;
}

.films-wrap{ 
  padding: 28px 0 76px; 
  background: var(--cream); 
}

.films-card{
  background: var(--white);
  border-radius: var(--radius);
  padding: 60px 22px;
}

.section-title{
  font-family: Geologica, Montserrat, system-ui, sans-serif;
  font-weight: 700;
  font-size: clamp(1.4rem, 2.2vw, 1.8rem);
}


.film-card{
  display: block;
  background: #f7f7f8;
  border-radius: 20px;
  margin-bottom: 30px;
  overflow: hidden;
  text-decoration: none;
  color: var(--ink);
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  transition: box-shadow .3s ease, transform .3s ease;
  
}
.film-card:hover{
  box-shadow: 2px 2px 30px -1px #009AED;
  transform: translateY(-4px);
}
.film-card img{ 
  width:100%; 
  aspect-ratio:3/4; 
  object-fit:cover; 
}
.film-meta{ 
  padding:12px 14px; 
  display:flex; 
  align-items:center; 
  justify-content:space-between; 
  gap:10px; 
}
.film-title{ 
  font-size:1rem; 
  margin:0; 
  font-weight:700; 
}
.btn-brand{ 
  background: var(--brand); 
  color:#fff; 
  border:0; 
}
.btn-brand:hover{ 
  filter:brightness(.95); 
  color:#fff; 
}

@media (max-width: 992px){
  .films-card{ padding: 22px 16px; }
}

.cosini {
  max-width: 400px;  
  height: auto;
  position: relative;
  top: 30px;
  bottom: -20px;
}


.arrow-wrapper3 {
  position: relative;
  top: -20px;   
  margin-bottom: 1rem;
  z-index: 2;
  display: flex;
  justify-content: center; 
}

.arrow-wrapper3 .arrow-decor3 {
  max-width: 300px;
  width: 100%;
  height: auto;
  transform: rotate(140deg); 
}

@media (max-width: 767.98px) {
  .arrow-wrapper3 {
    justify-content: center;
    margin-bottom: 1.5rem;
  }
}