/* =========================
   HERO
========================= */

.residencial-hero{
  position:relative;

  height:100vh;

  overflow:hidden;

  display:flex;
  justify-content:center;
  align-items:center;
}

.residencial-hero video{
  position:absolute;

  width:100%;
  height:100%;

  object-fit:cover;
}

.hero-overlay{
  position:absolute;
  inset:0;

  background:rgba(0,0,0,0.35);
}

.hero-content{
  position:relative;
  z-index:2;

  text-align:center;

  color:white;

  max-width:850px;

  padding:20px;
}

.hero-logo{
  width:220px;

  margin-bottom:40px;
}

.hero-content h1{
  font-family:"poster-cut-neue", sans-serif;

  font-size:5rem;

  line-height:0.9;

  margin-bottom:30px;
}

.hero-content p{
  font-family:"poster-cut-neue", sans-serif;

  font-size:1.4rem;

  line-height:1.2;

  margin-bottom:40px;
}


/* =========================
   SECTIONS
========================= */

.residencial-section{
  padding:110px 20px;
}

.light-section{
  background:#fff8ef;
}

.container-small{
  max-width:850px;
  margin:0 auto;
}

.container-large{
  max-width:1200px;
  margin:0 auto;
}

.section-title{
  position:relative;

  display:inline-block;

  font-family:"poster-cut-neue", sans-serif;

  font-size:3rem;

  line-height:0.9;

  margin-bottom:50px;

  z-index:2;
}

.section-title::after{
  content:"";

  position:absolute;

  left:-3%;
  bottom:0.08em;

  width:106%;
  height:0.24em;

  background:rgba(255,191,73,0.7);

  z-index:-1;
}

.container-small p{
  font-size:1.05rem;

  line-height:1.8;

  margin-bottom:25px;
}


/* =========================
   WEEK PROGRAM
========================= */

.week-grid{
  display:grid;

  grid-template-columns:
  repeat(auto-fit,minmax(260px,1fr));

  gap:30px;
}

.day-card{
  padding:35px;

  background:#fff8ef;

  border-radius:20px;
}

.day-name{
  font-family:"poster-cut-neue", sans-serif;

  color:#f0a22e;

  font-size:1.2rem;

  display:block;

  margin-bottom:18px;
}

.day-card h3{
  font-size:1.3rem;

  margin-bottom:15px;
}

.day-card p{
  line-height:1.6;
}

.nota-programa{
  margin-top:40px;

  font-family:"poster-cut-neue", sans-serif;

  opacity:0.75;
}


/* =========================
   FAQ
========================= */

.faq-item{

  border-bottom:1px solid rgba(0,0,0,0.08);

  padding:22px 0;
}

.faq-item summary{

  list-style:none;

  cursor:pointer;

  position:relative;

  padding-right:40px;

  font-family:"poster-cut-neue", sans-serif;

  font-size:1.4rem;

  line-height:1.1;
}

.faq-item summary::-webkit-details-marker{
  display:none;
}

.faq-item summary::after{

  content:"+";

  position:absolute;

  right:0;
  top:0;

  font-size:1.5rem;

  transition:0.2s ease;
}

.faq-item[open] summary::after{
  transform:rotate(45deg);
}

.faq-item p{

  margin-top:18px;

  line-height:1.7;
}
/* =========================
   FINAL CTA
========================= */

.final-cta{

  position:relative;

  min-height:70vh;

  overflow:hidden;

  display:flex;
  justify-content:center;
  align-items:center;

  text-align:center;

  color:white;
}

.final-cta-image{

  position:absolute;

  width:100%;
  height:100%;

  object-fit:cover;
}

.final-cta-overlay{

  position:absolute;
  inset:0;

  background:rgba(0,0,0,0.35);
}

.final-cta-content{

  position:relative;
  z-index:2;
}

.final-cta h2{

  font-family:"poster-cut-neue", sans-serif;

  font-size:3rem;

  line-height:0.95;

  margin-bottom:40px;

  color:white;
}


/* =========================
   FOOTER SOCIAL
========================= */

.footer-social{

  margin-top:0px;

  display:flex;
  justify-content:center;
  align-items:center;

  gap:18px;
}

.footer-social img{

  width:50px;
  height:50px;

  opacity:0.8;

  transition:0.2s ease;
}

.footer-social img:hover{
  opacity:1;
  transform:scale(1.08);
}


/* =========================
   CTA FIX
========================= */

.cta{
  text-decoration:none;
}


/* =========================
   MOBILE MENU
========================= */

@media(max-width:768px){

  #menu{
    position:absolute;

    top:80px;
    right:20px;

    background:rgba(255,255,255,0.96);

    padding:20px;

    border-radius:16px;

    display:none;

    flex-direction:column;

    gap:14px;
  }

  #menu.active{
    display:flex;
  }

}


/* =========================
   MOBILE
========================= */

@media(max-width:768px){

  .hero-logo{
    width:150px;
  }

  .hero-content h1{
    font-size:3.2rem;
  }

  .hero-content p{
    font-size:1.1rem;
  }

  .residencial-section{
    padding:80px 20px;
  }

 .section-title{

  font-size:2.2rem;

  line-height:1.05;

  display:inline;

  background:
  linear-gradient(
    transparent 72%,
    rgba(255,191,73,0.7) 72%
  );

  box-decoration-break:clone;
  -webkit-box-decoration-break:clone;
}

.section-title::after{
  display:none;
}
  
  .day-card{
    padding:25px;
  }

  .faq-item h3{
    font-size:1.2rem;
  }

  .final-cta{
  min-height:55vh;
  }
  .final-cta h2{
    font-size:2.3rem;
  }
#menu{

  position:absolute;

  top:60px;
  right:0px;

  background:#0ca9c2;

  padding:18px 22px;

  border-radius:0px;

  display:none;

  flex-direction:column;

  gap:12px;

  z-index:999;
}

#menu.active{
  display:flex;
}

#menu a{
  color:white;
  text-decoration:none;
}
}