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

/* Sezione video */
.home-hero{
  min-height: 72vh;
  border-bottom-left-radius: 24px;
  border-bottom-right-radius: 24px;
  overflow: hidden;
  position: relative;
}
.home-hero .hero-media{
  width:100%; 
  height:72vh; 
  object-fit:cover; 
  display:block;
}
.hero-overlay{
  position:absolute; 
  inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.5) 40%, rgba(0,0,0,.35) 100%);
}
.hero-copy{
  position:absolute; 
  inset:0; 
  display:grid; 
  place-content:center;
  text-align:center; 
  color:#fff;
}
.eyebrow{
  font-weight:600; 
  letter-spacing:.3px; 
  opacity:.95;
}
.display-title{
  font-family: Geologica, Montserrat, system-ui, sans-serif;
  font-weight: 700;
  font-size: clamp(2rem, 4.5vw, 3.2rem);
  line-height:1.1;
}

.scroll-dot {
  display: block;
  margin: 17px auto 0; 
  width: 38px;
  height: 38px;
  border-radius: 999px;
  border: 2px solid #fff;
  position: relative;
  padding-top: 8%;
}


.scroll-dot::after{
  content:''; 
  position:absolute; 
  left:50%; 
  top:10px; 
  width:2px; 
  height:10px; 
  background:#fff; 
  transform:translateX(-50%);
  animation: pulse 1.4s infinite;
}
@keyframes pulse{
  0%{opacity:0; transform:translate(-50%,0)}
  50%{opacity:1; transform:translate(-50%,8px)}
  100%{opacity:0; transform:translate(-50%,14px)}
}




.arrow-wrapper2 {
  position: relative;
  top: 60px;   
  z-index: 2;
  display: flex;
  justify-content: center;
}

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

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



/* Hero section */
.tot-png{
  width:200px; 
  height:200px; 
  display:block;
  margin-left: 65%;
  margin-top: -5%;
  margin-bottom: -40px;
}

@media (max-width: 767.98px) {
  .tot-wrapper {
    text-align: left;
  }

  .tot-png {
    margin-left: 45%; 
    max-width: 80%; 
  }
}

.intro-block .intro-illus {
  max-width: 520px;
}

@media (max-width: 991.98px) {
  .intro-block .intro-illus {
    width: 78%;
    margin-left: auto;  
    display: block;
    margin-top: -30px;
  }
}

.intro-block{ 
  scroll-margin-top: 80px; 
}

.intro-title{
  font-family: Geologica, Montserrat, sans-serif;
  font-weight: 700;
  font-size: clamp(1.6rem, 2.6vw, 2.2rem);
}
.intro-title span{ 
  color: var(--brand); 
}
.intro-illus{ 
  max-width: 460px; opacity:.9 
}



/* Sezione film */

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

}
.section-title{
  font-family: Geologica, Montserrat, 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 
}



/* Blocco feedback */
.arrow-wrapper {
  position: relative;
  top: 60px;   
  margin-bottom: 1rem;
  z-index: 2;
  display: flex;
  justify-content: center; 
}

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

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



/* Form */

.feedback-block h3{
  font-family: Geologica, Montserrat, sans-serif;
  font-weight: 700;
  font-size: clamp(1.3rem, 2vw, 1.6rem);
}

@media (min-width: 992px){
  .feedback-block .dashed-box { 
    max-width: 520px; 
    padding-top: 40px; 
  }
}

@media (max-width: 767.98px) {
  .feedback-block {
    margin-bottom: 3rem;
  }
}

.feedback-block h3{
  font-family: Geologica, Montserrat, sans-serif;
  font-weight: 700;
  font-size: clamp(1.3rem, 2vw, 1.6rem);
  margin-bottom: .25rem;
}
.feedback-block h3 span{ color:#111 }


.form-control{ background-color:#c7eaff; }
.dashed-box{
  border:2px dashed rgba(0,154,237,.55);
  border-radius:16px;
  background:#fff;
}

.btn-brand{
  background-color: var(--brand);
  color:#fff;
  border: none;
  transition: box-shadow .2s ease, filter .2s ease;
}
.btn-brand:hover{ 
  filter:brightness(.95); 
  box-shadow:0 4px 12px rgba(0,0,0,.25); 
  color:#fff; 
}

.btn-brand:active, .btn-brand:focus{
  background-color:var(--brand) !important;
  color:#fff !important;
  box-shadow:0 2px 8px rgba(0,0,0,.3) !important;
  outline:none !important;
}

.feedback-block h3 span{ 
  color: var(--brand); 
}
.mascot{ 
  width:300px; 
  margin-top:18px; 
  opacity:.9; 
  margin:auto; 
}
.dashed-box{
  border:2px dashed rgba(0,154,237,.55);
  border-radius:16px;
  background:#fff;
}

@media (max-width: 992px){
  .intro-illus{ margin-inline:auto }
  .films-card{ padding:22px 16px }
}