/* ==========================================================================
   Schwemmerhof — homepage sections
   ========================================================================== */

.section { padding: 48px 24px; }
.section.tight { padding-top: 24px; }
.section.no-top { padding-top: 0; }

/* ---------- Hero ---------- */

.hero { padding: 0 24px 24px; }
.hero-media {
	position: relative;
	width: 100%;
	aspect-ratio: 1067 / 620;
	border-radius: var(--radius-card);
	overflow: hidden;
}
.hero-media img { width: 100%; height: 100%; object-fit: cover; }
.hero-media::after {
	content: '';
	position: absolute; inset: 0;
	background: linear-gradient(178deg, rgba(0,0,0,0) 32%, rgba(0,0,0,.4) 76%);
}
.hero-media .hero-text {
	position: absolute;
	left: 0; right: 0;
	bottom: 18%;
	display: flex; flex-direction: column; align-items: center; gap: 12px;
	padding: 0 24px;
	z-index: 2;
}
.hero-media .hero-text h1 {
	color: var(--text-primary-light);
	text-align: center;
	text-shadow: 0 4px 4px rgba(0,0,0,.25);
	max-width: 1152px;
}
.hero-media .btn { position: absolute; left: 50%; bottom: 40px; transform: translateX(-50%); z-index: 2; }

/* ---------- Intro famiglia ---------- */

.intro-famiglia { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 48px 120px; gap: 24px; }
.intro-famiglia p.body { color: var(--text-secondary-dark); }
.intro-famiglia .h2 { max-width: 780px; }

/* ---------- Perché sceglierci ---------- */

.warum { display: flex; flex-direction: column; align-items: center; gap: 40px; }
.warum > .h2 { text-align: center; }
.warum-grid {
	background: var(--bg-light);
	border-radius: var(--radius-card);
	padding: 16px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	width: 100%;
}
.warum-card { display: flex; flex-direction: column; gap: 16px; }
.warum-card:nth-child(3n+2) { margin-top: 40px; }
.warum-card .img-wrap { border-radius: var(--radius-card); overflow: hidden; aspect-ratio: 442 / 362; }
.warum-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.warum-card .h4 { text-align: center; }
.warum-outro { text-align: center; color: var(--text-secondary-dark); max-width: 780px; margin: 0 auto; white-space: pre-line; }

/* ---------- Zimmer teaser ---------- */

.zimmer-box {
	background: var(--bg-light);
	border-radius: var(--radius-card);
	padding: 48px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 48px;
}
.zimmer-box .intro { text-align: center; max-width: 918px; display: flex; flex-direction: column; gap: 8px; }
.zimmer-box .intro p { color: var(--text-secondary-dark); }
.zimmer-cards { display: flex; gap: 24px; width: 100%; }
.zimmer-card {
	position: relative;
	flex: 1 0 0;
	aspect-ratio: 672 / 816;
	border-radius: var(--radius-card);
	overflow: hidden;
	color: var(--text-primary-light);
	display: block;
}
.zimmer-card img { width: 100%; height: 100%; object-fit: cover; }
.zimmer-card::after { content: ''; position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,0), rgba(0,0,0,.25)); }
.zimmer-card .card-body { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px; display: flex; flex-direction: column; gap: 32px; z-index: 2; }
.zimmer-card .card-body .h3 { color: var(--text-primary-light); }
.zimmer-card .card-body p { color: var(--text-secondary-light); }

/* ---------- Giardino & cucina ---------- */

.giardino { background: var(--bg-dark); color: var(--text-secondary-light); padding: 48px 24px; }
.giardino-inner { max-width: 970px; margin: 0 auto; display: flex; flex-direction: column; gap: 40px; }
.giardino-top { display: flex; gap: 64px; align-items: flex-end; }
.giardino-top .text { flex: 1 0 0; display: flex; flex-direction: column; gap: 32px; }
.giardino-top .h2 { color: var(--text-primary-light); }
.giardino-top p { white-space: pre-line; }
.giardino-cert { display: flex; flex-direction: column; gap: 8px; width: 187px; flex-shrink: 0; }
.giardino-cert img { border-radius: var(--radius-card); width: 187px; height: 131px; object-fit: cover; }
.giardino-cert .caption { color: var(--text-secondary-light); }
.giardino-images { display: flex; gap: 24px; }
.giardino-images img { border-radius: var(--radius-card); object-fit: cover; height: 449px; }
.giardino-images img:first-child { width: 45%; }
.giardino-images img:last-child { flex: 1 0 0; width: auto; }

/* ---------- Wellness ---------- */

.wellness { display: flex; flex-direction: column; gap: 48px; }
.wellness-media { position: relative; width: 100%; aspect-ratio: 1440/810; border-radius: var(--radius-card); overflow: hidden; }
.wellness-media img { width: 100%; height: 100%; object-fit: cover; }
.wellness-media .arrow-btn {
	position: absolute; right: 6%; top: 50%; transform: translateY(-50%);
	width: 100px; height: 100px; border-radius: 999px;
	border: 2px solid var(--text-secondary-light);
	display: flex; align-items: center; justify-content: center;
}
.wellness-media .arrow-btn img { width: 40px; height: auto; filter: brightness(0) invert(1); }
.wellness-body { padding-left: 15%; display: flex; gap: 96px; }
.wellness-body .h2 { white-space: nowrap; }
.wellness-body .text { flex: 1 0 0; display: flex; flex-direction: column; gap: 32px; padding-top: 28px; }
.wellness-body .text p { color: var(--text-secondary-dark); white-space: pre-line; }

/* ---------- Estate / Inverno (stagioni) ---------- */

.stagione { padding: 24px; }
.stagione-box {
	background: var(--bg-light);
	border-radius: var(--radius-card);
	padding: 48px 24px;
	display: flex;
	gap: 48px;
	align-items: center;
}
.stagione-box.reverse { flex-direction: row-reverse; }
.stagione-box .text { width: 520px; flex-shrink: 0; display: flex; flex-direction: column; gap: 24px; }
.stagione-box .text p { color: var(--text-secondary-dark); white-space: pre-line; }
.stagione-box .img-wrap { flex: 1 0 0; border-radius: var(--radius-card); overflow: hidden; height: 514px; }
.stagione-box .img-wrap img { width: 100%; height: 100%; object-fit: cover; }

/* ---------- Offerte ---------- */

.offerte-head { display: flex; gap: 40px; align-items: flex-end; justify-content: space-between; margin-bottom: 40px; }
.offerte-head .text p { color: var(--text-secondary-dark); }
.offerte-head .arrows { display: flex; gap: 8px; flex-shrink: 0; }
.offerte-head .arrows button { width: 54px; height: 54px; border-radius: 999px; border: none; background: transparent; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.offerte-head .arrows img { width: 24px; }
.offerte-head .arrows .prev img { transform: rotate(180deg); }
.offerta-card { background: var(--bg-light); border-radius: var(--radius-card); padding: 24px; display: flex; gap: 24px; }
.offerta-card .img-wrap { width: 60%; border-radius: var(--radius-card); overflow: hidden; aspect-ratio: 770/514; }
.offerta-card .img-wrap img { width: 100%; height: 100%; object-fit: cover; }
.offerta-card .box { flex: 1 0 0; display: flex; flex-direction: column; justify-content: center; gap: 32px; padding: 16px 12px; }
.offerta-card .box .body p.dates { font-size: var(--fs-body-l); color: var(--text-secondary-dark); margin-bottom: 8px; }
.offerta-card .box .body p { color: var(--text-secondary-dark); }

/* ---------- Prefooter (richiesta) ---------- */

.prefooter { padding: 24px 48px 48px; }
.prefooter-inner { border-top: 1px solid var(--bg-light); padding-top: 48px; display: flex; flex-direction: column; align-items: center; gap: 48px; }
.prefooter-inner > .h2 { text-align: center; }
.prefooter-notes { display: flex; justify-content: space-between; width: 100%; gap: 24px; flex-wrap: wrap; font-size: var(--fs-body); }

@media (max-width: 960px) {
	.intro-famiglia { padding: 40px 24px; }
	.warum-grid { grid-template-columns: 1fr; }
	.warum-card:nth-child(3n+2) { margin-top: 0; }
	.zimmer-cards { flex-direction: column; }
	.zimmer-card { aspect-ratio: auto; height: 420px; }
	.giardino-top { flex-direction: column; }
	.giardino-cert { width: 100%; }
	.giardino-cert img { width: 100%; }
	.giardino-images { flex-direction: column; }
	.giardino-images img { width: 100% !important; height: 300px; }
	.wellness-body { flex-direction: column; padding-left: 0; gap: 24px; }
	.wellness-media .arrow-btn { width: 64px; height: 64px; }
	.stagione-box, .stagione-box.reverse { flex-direction: column; }
	.stagione-box .text { width: 100%; }
	.offerte-head { flex-direction: column; align-items: flex-start; gap: 16px; }
	.offerta-card { flex-direction: column; }
	.offerta-card .img-wrap { width: 100%; }
}