/* ----------------------------------------------------------------
	Custom CSS

	Add all your Custom Styled CSS here for New Styles or
	Overwriting Default Theme Styles for Better Handling Updates
-----------------------------------------------------------------*/


.button-booking {
	background-color: #003580;
	border-color: #003580;
	color: #ffffff;
}

.button-booking:hover {
	background-color: #0051a3;
	border-color: #0051a3;
	color: #ffffff;
}

/* Piccoli helper (non invasivi): usa la tua custom.css come base */
		.hero-cover {
			border-radius: 14px;
			overflow: hidden;
			background: #fff;
		}
		.hero-cover img { width: 100%; height: 380px; object-fit: cover; display: block; }
		@media (max-width: 991px) { .hero-cover img { height: 280px; } }

		.kpi {
			border: 1px solid rgba(0,0,0,.08);
			border-radius: 14px;
			padding: 16px 18px;
			background: #fff;
		}
		.kpi .t { font-weight: 700; }
		.kpi .s { color: rgba(0,0,0,.6); font-size: .95rem; margin-top: 2px; }

		.mini-card {
			border: 1px solid rgba(0,0,0,.08);
			border-radius: 14px;
			padding: 18px;
			background: #fff;
			height: 100%;
		}
		.mini-card h3 { margin-bottom: 8px; }
		.badge-soft {
			display: inline-flex;
			align-items: center;
			gap: 8px;
			padding: 8px 12px;
			border-radius: 999px;
			background: rgba(0,0,0,.04);
			font-size: .95rem;
		}
		.resort-card {
			background: #fff;
			border-radius: 14px;
			overflow: hidden;
			border: 1px solid rgba(0,0,0,.08);
			height: 100%;
		}
		.resort-card img { width: 100%; height: 210px; object-fit: cover; display: block; }
		.resort-card .body { padding: 18px; }
		.resort-meta {
			display: flex;
			flex-wrap: wrap;
			gap: 10px 14px;
			margin: 12px 0 0;
			color: rgba(0,0,0,.65);
			font-size: .95rem;
		}
		.resort-meta span { display: inline-flex; gap: 8px; align-items: center; }
		hr.soft { border: 0; border-top: 1px solid rgba(0,0,0,.08); margin: 18px 0; }

/* ===== FIX HERO: immagine e card stessa altezza (desktop) ===== */
.hero-grid { align-items: stretch; }

.hero-media {
  background: #fff;
  border-radius: 14px;
  overflow: hidden;
  height: 100%;
  border: 1px solid rgba(0,0,0,.08);
}

/* desktop: l'immagine riempie la colonna in altezza */
.hero-media img{
  width: 100%;
  height: 100%;
  min-height: 420px;   /* regola se vuoi più/meno altezza minima */
  object-fit: cover;
  display: block;
}

/* mobile: torna “normale” */
@media (max-width: 991px){
  .hero-media img{
    height: 280px;
    min-height: 280px;
  }
}