/* Expectativas em um painel fotográfico, com seis boxes independentes. */
#temas .expectations-panel{
  position:relative;isolation:isolate;overflow:hidden;
  max-width:980px;margin-inline:auto;
  padding:30px;border:1px solid rgba(196,172,72,.28);border-radius:24px;
  background:var(--green-deep);box-shadow:0 24px 60px -40px rgba(16,21,18,.6);
}
#temas .expectations-panel::before,#temas .expectations-panel::after{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
}
#temas .expectations-panel::before{
  inset:0 0 0 auto;width:72%;height:320px;
  background:url("/assets/expectativas-hotel.webp") 66% bottom/cover no-repeat;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 38%),linear-gradient(0deg,transparent,#000 30%);
  mask-image:linear-gradient(90deg,transparent,#000 38%),linear-gradient(0deg,transparent,#000 30%);
  -webkit-mask-composite:source-in;mask-composite:intersect;
}
#temas .expectations-panel::after{
  background:linear-gradient(90deg,#032619 0%,rgba(3,38,25,.94) 40%,rgba(3,38,25,.50) 75%,rgba(3,38,25,.30)),
    linear-gradient(0deg,#032619 0%,rgba(3,38,25,.85) 48%,transparent 100%);
}
#temas .expectations-panel .section-head{max-width:64%;margin-bottom:24px;min-height:132px;justify-content:center}
#temas .expectations-panel .section-head p{max-width:48ch}
#temas .expectations-panel .themes{gap:12px}
#temas .expectations-panel .theme-card{
  background:rgba(3,38,25,.73);border:1px solid rgba(196,172,72,.28);border-radius:12px;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:none;
}
#temas .expectations-panel .theme-card h3{color:var(--ivory)}
#temas .expectations-panel .theme-card p{color:rgba(243,238,223,.84)}
@media(max-width:960px){
  #temas .expectations-panel{padding:24px}
  #temas .expectations-panel .section-head{max-width:70%}
}
@media(max-width:600px){
  #temas .expectations-panel{padding:20px 14px;border-radius:18px}
  #temas .expectations-panel::before{
    width:100%;height:280px;background-position:64% bottom;opacity:.75;
    -webkit-mask-image:linear-gradient(0deg,transparent,#000 45%);
    mask-image:linear-gradient(0deg,transparent,#000 45%);
  }
  #temas .expectations-panel::after{
    background:linear-gradient(90deg,rgba(3,38,25,.92),rgba(3,38,25,.4)),
      linear-gradient(0deg,#032619 48%,rgba(3,38,25,.74) 76%,rgba(3,38,25,.25));
  }
  #temas .expectations-panel .section-head{max-width:100%;min-height:148px;margin-bottom:20px}
  #temas .expectations-panel .themes{gap:10px}
  #temas .expectations-panel .theme-card{padding:14px 12px}
}
