/* ==========================================================================
   Vila Galé Eco Resort de Angra — estilos da homepage
   ========================================================================== */

/* ---------- Carrossel de feriados (componente .carousel no global.css) ---------- */
.holiday-card {
  min-height: 340px; border-radius: var(--radius-lg);
  padding: 24px; display: flex; flex-direction: column; justify-content: flex-end; color: var(--white);
  box-shadow: var(--shadow);
  transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
}
.holiday-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.holiday-card .badge {
  position: absolute; top: 20px; left: 20px; padding: 6px 14px; border-radius: 999px;
  background: var(--accent); color: var(--white); font-size: 0.72rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase;
}
.holiday-card h3 { color: var(--white); font-size: 1.3rem; margin-bottom: 6px; }
.holiday-card p { font-size: var(--fs-p); color: rgba(255, 255, 255, 0.88); margin-bottom: 12px; }
.holiday-card a { color: var(--gold); font-weight: 600; font-size: 0.9rem; }

/* ---------- Avaliações / reconhecimentos ---------- */
.review-panel { display: grid; grid-template-columns: 0.9fr 2fr; gap: 24px; align-items: stretch; }
.review-panel__summary {
  background: var(--brand-900); color: rgba(255, 255, 255, 0.88);
  border-radius: var(--radius-lg); padding: 32px; display: flex; flex-direction: column; align-items: flex-start;
}
.review-panel__summary h3 { color: var(--white); font-size: 1.5rem; }
.review-panel__summary p { flex: 1; font-size: var(--fs-p); }
.stars { color: var(--gold); font-size: 1.6rem; letter-spacing: 4px; margin-bottom: 8px; }
.review-panel__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.highlight-card {
  background: var(--white); border-radius: var(--radius); padding: 26px; box-shadow: var(--shadow-sm);
  border-bottom: 4px solid var(--brand-400);
}
.highlight-card .icon-badge { margin-bottom: 14px; }
.highlight-card h3 { font-size: 1.05rem; color: var(--brand-700); }
.highlight-card p { color: var(--muted); font-size: var(--fs-p); margin: 0; }

/* ---------- Outros resorts ---------- */
.resort-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.resort-card {
  min-height: 360px; border-radius: var(--radius-lg); padding: 24px;
  display: flex; flex-direction: column; justify-content: flex-end; color: var(--white);
  box-shadow: var(--shadow); transition: transform 0.4s var(--ease), box-shadow 0.4s var(--ease);
  text-shadow: 0 1px 8px rgba(18, 52, 45, 0.45);
}
.resort-card::after { background: linear-gradient(180deg, rgba(18, 52, 45, 0) 15%, rgba(18, 52, 45, 0.7) 50%, rgba(18, 52, 45, 0.96) 100%); }
.resort-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.resort-card h3 { color: var(--white); font-size: 1.2rem; margin-bottom: 6px; }
.resort-card p { font-size: var(--fs-p); color: rgba(255, 255, 255, 0.88); margin-bottom: 12px; }
.resort-card a { color: var(--gold); font-weight: 600; font-size: 0.88rem; }

/* ---------- Responsivo ---------- */
@media (max-width: 1024px) {
  .review-panel { grid-template-columns: 1fr; }
  .resort-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 640px) {
  .resort-grid, .review-panel__list { grid-template-columns: 1fr; }
  .resort-card { min-height: 300px; }
}
