/*
Theme Name:   Astra Child - La Pace degli Agrumi
Theme URI:    https://lapacedegliagrumi.it
Description:  Child theme per La Pace degli Agrumi - Casa vacanze al mare in Calabria. Layout editoriale ispirato a extendi.it con palette mare/agrumi.
Author:       La Pace degli Agrumi
Template:     astra
Version:      1.1.0
License:      GNU General Public License v2 or later
Text Domain:  astra-child
*/

/* ==========================================================================
   1. FONT + RESET
   ========================================================================== */
@import url('https://fonts.googleapis.com/css2?family=Barlow:wght@300;400;500;600;700;800;900&display=swap');

*, *::before, *::after { box-sizing: border-box; }

body, h1, h2, h3, h4, h5, h6, p, a, button, input, textarea, select, label, span, li {
	font-family: 'Barlow', sans-serif !important;
}

img { max-width: 100%; height: auto; display: block; }

/* ==========================================================================
   2. DESIGN TOKENS
   ========================================================================== */
:root {
	/* Palette mare/agrumi (mantenuta) */
	--c-primary:      #0077BE;
	--c-primary-dark: #005A92;
	--c-secondary:    #FF8C42;
	--c-secondary-dark: #E67324;
	--c-accent:       #7CB342;

	/* Toni neutri editoriali (extendi-like) */
	--c-ink:          #0f0f0f;
	--c-ink-soft:     #2a2a2a;
	--c-text:         #1a1a1a;
	--c-light:        #6b7280;
	--c-line:         #e5e7eb;
	--c-paper:        #fafafa;
	--c-bg:           #ffffff;
	--c-bg-alt:       #f5f5f3;

	/* Spaziatura */
	--space-1:  8px;
	--space-2:  16px;
	--space-3:  24px;
	--space-4:  32px;
	--space-5:  48px;
	--space-6:  64px;
	--space-7:  96px;
	--space-8:  128px;

	/* Raggi (XL come extendi) */
	--radius-sm: 8px;
	--radius:    14px;
	--radius-lg: 22px;
	--radius-xl: 32px;

	/* Ombre */
	--shadow-sm: 0 2px 8px rgba(0,0,0,.06);
	--shadow:    0 8px 28px rgba(0,0,0,.08);
	--shadow-lg: 0 20px 50px rgba(0,0,0,.12);

	/* Transizioni */
	--ease: cubic-bezier(.22,.61,.36,1);
	--t-fast: 200ms var(--ease);
	--t:      350ms var(--ease);
	--t-slow: 600ms var(--ease);

	/* Container */
	--maxw: 1280px;
	--maxw-narrow: 880px;
}

/* ==========================================================================
   3. LAYOUT BASE
   ========================================================================== */
.lpda-container { max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }
.lpda-container--narrow { max-width: var(--maxw-narrow); }

.lpda-section {
	padding: clamp(60px, 10vw, 120px) 24px;
}
.lpda-section--tight { padding: clamp(40px, 6vw, 80px) 24px; }
.lpda-section--ink   { background: var(--c-ink); color: #f5f5f3; }
.lpda-section--paper { background: var(--c-paper); }
.lpda-section--alt   { background: var(--c-bg-alt); }

/* ==========================================================================
   4. TIPOGRAFIA EDITORIALE
   ========================================================================== */
.lpda-eyebrow {
	display: inline-block;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-primary);
	margin-bottom: 20px;
}
.lpda-section--ink .lpda-eyebrow { color: var(--c-secondary); }

.lpda-display {
	font-size: clamp(40px, 8vw, 120px);
	line-height: 0.95;
	font-weight: 700 !important;
	letter-spacing: -0.02em;
	margin: 0 0 24px;
	color: var(--c-ink);
}
.lpda-section--ink .lpda-display { color: #fff; }

.lpda-headline {
	font-size: clamp(32px, 5vw, 64px);
	line-height: 1.05;
	font-weight: 700 !important;
	letter-spacing: -0.015em;
	margin: 0 0 24px;
	color: var(--c-ink);
}
.lpda-section--ink .lpda-headline { color: #fff; }

.lpda-subhead {
	font-size: clamp(20px, 2.4vw, 28px);
	line-height: 1.4;
	font-weight: 400;
	color: var(--c-light);
	max-width: 700px;
	margin: 0 0 32px;
}
.lpda-section--ink .lpda-subhead { color: rgba(255,255,255,.75); }

.lpda-lead {
	font-size: clamp(17px, 1.5vw, 19px);
	line-height: 1.7;
	color: var(--c-text);
	margin: 0 0 24px;
}

.lpda-heading-row {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 32px;
	margin-bottom: 56px;
	flex-wrap: wrap;
}
.lpda-heading-row > div { flex: 1 1 320px; }

/* ==========================================================================
   5. BOTTONI
   ========================================================================== */
.lpda-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	border-radius: 999px;
	font-family: 'Barlow', sans-serif !important;
	font-weight: 600;
	font-size: 15px;
	text-decoration: none !important;
	cursor: pointer;
	border: 2px solid transparent;
	transition: var(--t);
	white-space: nowrap;
	line-height: 1;
}
.lpda-btn .lpda-btn__arrow {
	display: inline-block;
	transition: transform var(--t);
}
.lpda-btn:hover .lpda-btn__arrow { transform: translateX(4px); }

.lpda-btn--primary {
	background: var(--c-primary);
	color: #fff !important;
	border-color: var(--c-primary);
}
.lpda-btn--primary:hover {
	background: var(--c-primary-dark);
	border-color: var(--c-primary-dark);
}

.lpda-btn--secondary {
	background: var(--c-secondary);
	color: #fff !important;
	border-color: var(--c-secondary);
}
.lpda-btn--secondary:hover {
	background: var(--c-secondary-dark);
	border-color: var(--c-secondary-dark);
}

.lpda-btn--dark {
	background: var(--c-ink);
	color: #fff !important;
	border-color: var(--c-ink);
}
.lpda-btn--dark:hover { background: #000; }

.lpda-btn--ghost {
	background: transparent;
	color: #fff !important;
	border-color: rgba(255,255,255,0.7);
}
.lpda-btn--ghost:hover { background: rgba(255,255,255,0.12); border-color: #fff; }

.lpda-btn--outline {
	background: transparent;
	color: var(--c-ink) !important;
	border-color: var(--c-ink);
}
.lpda-btn--outline:hover { background: var(--c-ink); color: #fff !important; }

.lpda-btn--whatsapp { background: #25D366; color: #fff !important; border-color: #25D366; }
.lpda-btn--whatsapp:hover { background: #1ebe5a; border-color: #1ebe5a; }

.lpda-btn--lg { padding: 18px 36px; font-size: 17px; }
.lpda-btn--xl { padding: 22px 44px; font-size: 19px; }

/* ==========================================================================
   6. REVEAL ANIMATIONS
   ========================================================================== */
.lpda-reveal {
	opacity: 0;
	transform: translateY(24px);
	transition: opacity 800ms var(--ease), transform 800ms var(--ease);
	will-change: opacity, transform;
}
.lpda-reveal--scale { transform: scale(0.96); }
.lpda-reveal--left  { transform: translateX(-32px); }
.lpda-reveal--right { transform: translateX(32px); }
.lpda-reveal.is-visible {
	opacity: 1;
	transform: none;
}

/* Stagger su gruppi (delay impostato via CSS variable inline) */
.lpda-reveal[style*="--d"] { transition-delay: var(--d); }

/* Rispetta prefers-reduced-motion */
@media (prefers-reduced-motion: reduce) {
	.lpda-reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
	* { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* ==========================================================================
   7. HERO HOME (video oversize)
   ========================================================================== */
.lpda-hero {
	position: relative;
	min-height: 100vh;
	overflow: hidden;
	background: var(--c-ink);
	display: flex;
	align-items: flex-end;
	padding: 0;
}
.lpda-hero__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 1;
}
.lpda-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(0,0,0,.25) 0%, rgba(0,0,0,.15) 40%, rgba(0,0,0,.75) 100%);
	z-index: 2;
}
.lpda-hero__content {
	position: relative;
	z-index: 3;
	width: 100%;
	max-width: var(--maxw);
	margin: 0 auto;
	padding: 0 24px 80px;
	color: #fff;
}
.lpda-hero__eyebrow {
	display: inline-block;
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--c-secondary);
	margin-bottom: 24px;
	padding: 8px 16px;
	background: rgba(0,0,0,.35);
	border: 1px solid rgba(255,255,255,.2);
	border-radius: 999px;
	backdrop-filter: blur(8px);
}
.lpda-hero__title {
	color: #fff !important;
	font-size: clamp(44px, 9vw, 140px);
	line-height: 0.92;
	font-weight: 700 !important;
	letter-spacing: -0.025em;
	margin: 0 0 24px;
	max-width: 1000px;
}
.lpda-hero__title em { font-style: normal; color: var(--c-secondary); }
.lpda-hero__sub {
	color: rgba(255,255,255,.9) !important;
	font-size: clamp(17px, 2vw, 22px);
	font-weight: 400;
	max-width: 560px;
	line-height: 1.5;
	margin: 0 0 36px;
}
.lpda-hero__cta { display: flex; gap: 14px; flex-wrap: wrap; }
.lpda-hero__scroll {
	position: absolute;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	color: #fff;
	font-size: 12px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	z-index: 3;
	opacity: 0.7;
	animation: lpda-bounce 2s infinite;
}
@keyframes lpda-bounce {
	0%, 100% { transform: translate(-50%, 0); }
	50%      { transform: translate(-50%, -8px); }
}

/* ==========================================================================
   8. PAGE HERO (servizi / contatti / prenota)
   ========================================================================== */
.lpda-page-hero {
	padding: clamp(120px, 18vw, 200px) 24px clamp(60px, 8vw, 100px);
	background: var(--c-paper);
}
.lpda-page-hero__inner { max-width: var(--maxw); margin: 0 auto; }
.lpda-page-hero .lpda-eyebrow { color: var(--c-secondary); }
.lpda-page-hero h1 {
	font-size: clamp(40px, 7vw, 96px);
	line-height: 0.95;
	font-weight: 700 !important;
	letter-spacing: -0.02em;
	margin: 0 0 24px;
	color: var(--c-ink) !important;
	max-width: 900px;
}
.lpda-page-hero p {
	font-size: clamp(17px, 2vw, 22px);
	color: var(--c-light) !important;
	max-width: 640px;
	line-height: 1.5;
	margin: 0;
}

/* ==========================================================================
   9. STRUTTURE — CARDS XL (home)
   ========================================================================== */
.lpda-structures__grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	gap: 24px;
}
.lpda-structure-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: 460px;
	border-radius: var(--radius-xl);
	overflow: hidden;
	text-decoration: none !important;
	color: #fff !important;
	background: var(--c-ink);
	box-shadow: var(--shadow);
	transition: transform var(--t), box-shadow var(--t);
}
.lpda-structure-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-lg); }
.lpda-structure-card__img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
	z-index: 1;
}
.lpda-structure-card:hover .lpda-structure-card__img { transform: scale(1.05); }
.lpda-structure-card::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0,0,0,0) 30%, rgba(0,0,0,.85) 100%);
	z-index: 2;
}
.lpda-structure-card__inner {
	position: relative;
	z-index: 3;
	padding: 32px;
}
.lpda-structure-card__tag {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--c-secondary);
	margin-bottom: 12px;
}
.lpda-structure-card__title {
	color: #fff !important;
	font-size: clamp(22px, 2.4vw, 30px);
	font-weight: 700 !important;
	line-height: 1.15;
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
.lpda-structure-card__meta {
	font-size: 14px;
	color: rgba(255,255,255,.8);
	margin-bottom: 16px;
}
.lpda-structure-card__cta {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-weight: 600;
	color: #fff;
	font-size: 15px;
}
.lpda-structure-card__cta::after {
	content: "→";
	transition: transform var(--t);
}
.lpda-structure-card:hover .lpda-structure-card__cta::after { transform: translateX(4px); }

/* Layout 12-col: 2 grandi sopra (6/6), 2 più larghe sotto */
.lpda-structure-card--lg { grid-column: span 6; min-height: 520px; }
.lpda-structure-card--md { grid-column: span 6; min-height: 460px; }

/* ==========================================================================
   10. STRIP SERVIZI ORIZZONTALE
   ========================================================================== */
.lpda-services-strip__grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.lpda-service-tile {
	display: block;
	position: relative;
	border-radius: var(--radius-lg);
	overflow: hidden;
	aspect-ratio: 3/4;
	text-decoration: none !important;
	background: var(--c-ink);
	transition: transform var(--t);
}
.lpda-service-tile:hover { transform: translateY(-4px); }
.lpda-service-tile img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
}
.lpda-service-tile:hover img { transform: scale(1.08); }
.lpda-service-tile__label {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 24px;
	background: linear-gradient(to top, rgba(0,0,0,.85), transparent);
	color: #fff !important;
	font-weight: 600;
	font-size: 18px;
	z-index: 2;
}
.lpda-service-tile__label small {
	display: block;
	font-size: 11px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-secondary);
	font-weight: 700;
	margin-bottom: 4px;
}

/* ==========================================================================
   11. GALLERIA MASONRY
   ========================================================================== */
.lpda-masonry {
	column-count: 3;
	column-gap: 20px;
}
.lpda-masonry__item {
	break-inside: avoid;
	margin: 0 0 20px;
	border-radius: var(--radius-lg);
	overflow: hidden;
	cursor: zoom-in;
	display: block;
}
.lpda-masonry__item img {
	width: 100%;
	height: auto;
	transition: transform 700ms var(--ease), filter var(--t);
}
.lpda-masonry__item:hover img { transform: scale(1.04); filter: brightness(.95); }

/* Marquee galleria (scroll continuo destra → sinistra, stile extendi) */
.lpda-marquee {
	overflow: hidden;
	width: 100%;
	-webkit-mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
	mask-image: linear-gradient(to right, transparent, #000 6%, #000 94%, transparent);
}
.lpda-marquee__track {
	display: flex;
	gap: 20px;
	width: max-content;
	animation: lpda-marquee 60s linear infinite;
}
.lpda-marquee:hover .lpda-marquee__track { animation-play-state: paused; }
.lpda-marquee__item {
	flex: 0 0 auto;
	width: clamp(240px, 28vw, 400px);
	aspect-ratio: 4 / 3;
	border-radius: var(--radius-lg);
	overflow: hidden;
	cursor: zoom-in;
}
.lpda-marquee__item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 700ms var(--ease);
}
.lpda-marquee__item:hover img { transform: scale(1.05); }
@keyframes lpda-marquee {
	from { transform: translateX(0); }
	to   { transform: translateX(calc(-50% - 10px)); }
}
@media (prefers-reduced-motion: reduce) {
	.lpda-marquee__track { animation: none; }
}

/* ==========================================================================
   12. MAPPA + COME RAGGIUNGERCI
   ========================================================================== */
.lpda-locate {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 0;
	background: var(--c-bg-alt);
	border-radius: var(--radius-xl);
	overflow: hidden;
}
.lpda-locate__map { min-height: 460px; line-height: 0; }
.lpda-locate__map iframe { width: 100%; height: 100%; min-height: 460px; border: 0; display: block; }
.lpda-locate__info {
	padding: clamp(32px, 5vw, 56px);
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 24px;
}
.lpda-locate__info h3 {
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 700 !important;
	color: var(--c-ink) !important;
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
.lpda-locate__list { list-style: none; padding: 0; margin: 0; }
.lpda-locate__list li {
	padding: 18px 0;
	border-top: 1px solid var(--c-line);
	display: flex;
	gap: 16px;
	align-items: flex-start;
}
.lpda-locate__list li:first-child { border-top: none; padding-top: 0; }
.lpda-locate__icon {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--c-primary);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	font-weight: 700;
	font-size: 14px;
}
.lpda-locate__txt strong { display: block; color: var(--c-ink); font-weight: 600; margin-bottom: 4px; font-size: 16px; }
.lpda-locate__txt span { display: block; color: var(--c-light); font-size: 14px; line-height: 1.5; }

/* ==========================================================================
   13. CTA BAND OVERSIZE (finale home / pagine)
   ========================================================================== */
.lpda-cta-band {
	padding: clamp(80px, 12vw, 160px) 24px;
	background: var(--c-ink);
	color: #fff;
	text-align: center;
}
.lpda-cta-band__inner { max-width: 900px; margin: 0 auto; }
.lpda-cta-band h2 {
	color: #fff !important;
	font-size: clamp(36px, 6vw, 80px);
	line-height: 1;
	font-weight: 700 !important;
	letter-spacing: -0.02em;
	margin: 0 0 24px;
}
.lpda-cta-band p {
	color: rgba(255,255,255,.7) !important;
	font-size: clamp(17px, 2vw, 21px);
	margin: 0 0 40px;
}
.lpda-cta-band__buttons { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

/* ==========================================================================
   14. SERVIZI DETTAGLIO — sezioni alternate
   ========================================================================== */
.lpda-svc {
	padding: clamp(60px, 10vw, 120px) 24px;
}
.lpda-svc--alt { background: var(--c-paper); }
.lpda-svc__inner {
	display: grid;
	grid-template-columns: 1.1fr 1fr;
	gap: clamp(40px, 6vw, 80px);
	align-items: center;
	max-width: var(--maxw);
	margin: 0 auto;
}
.lpda-svc--reverse .lpda-svc__inner > :first-child { order: 2; }
.lpda-svc__main {
	width: 100%;
	border-radius: var(--radius-xl);
	overflow: hidden;
	box-shadow: var(--shadow);
	aspect-ratio: 4/3;
	object-fit: cover;
}
.lpda-svc__thumbs {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 10px;
	margin-top: 12px;
}
.lpda-svc__thumbs img {
	width: 100%;
	height: 90px;
	object-fit: cover;
	border-radius: var(--radius-sm);
	cursor: pointer;
	transition: var(--t-fast);
}
.lpda-svc__thumbs img:hover { opacity: .85; transform: scale(1.03); }

.lpda-svc__text .lpda-eyebrow { color: var(--c-primary); }
.lpda-svc__text h2 {
	font-size: clamp(28px, 4vw, 48px);
	line-height: 1.05;
	color: var(--c-ink) !important;
	margin: 0 0 20px;
	font-weight: 700 !important;
	letter-spacing: -0.015em;
}
.lpda-svc__features {
	list-style: none;
	padding: 0;
	margin: 24px 0 32px;
	display: grid;
	gap: 12px;
}
.lpda-svc__features li {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	font-size: 16px;
	color: var(--c-text);
}
.lpda-svc__features li::before {
	content: "✓";
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 24px;
	height: 24px;
	background: var(--c-accent);
	color: #fff;
	border-radius: 50%;
	font-weight: 700;
	font-size: 12px;
}

/* Services Add-on tiles compatte */
.lpda-svc-addon-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.lpda-svc-addon {
	background: #fff;
	padding: 28px;
	border-radius: var(--radius-lg);
	border: 1px solid var(--c-line);
	transition: var(--t);
}
.lpda-svc-addon:hover { transform: translateY(-4px); box-shadow: var(--shadow); border-color: transparent; }
.lpda-svc-addon__icon {
	width: 48px;
	height: 48px;
	border-radius: 12px;
	background: var(--c-primary);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 16px;
	font-weight: 700;
}
.lpda-svc-addon h4 { font-size: 18px; font-weight: 700; color: var(--c-ink); margin: 0 0 8px; }
.lpda-svc-addon p { font-size: 14px; color: var(--c-light); line-height: 1.5; margin: 0; }

/* ==========================================================================
   15. PRENOTA — cards tariffe + form
   ========================================================================== */
.lpda-rates-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 20px;
}
.lpda-rate-card {
	background: #fff;
	padding: 32px;
	border-radius: var(--radius-lg);
	border: 1px solid var(--c-line);
	display: flex;
	flex-direction: column;
	transition: var(--t);
}
.lpda-rate-card:hover { border-color: var(--c-primary); transform: translateY(-4px); box-shadow: var(--shadow); }
.lpda-rate-card__tag {
	display: inline-block;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--c-secondary);
	margin-bottom: 12px;
}
.lpda-rate-card__title {
	font-size: 22px;
	font-weight: 700;
	color: var(--c-ink);
	margin: 0 0 8px;
	letter-spacing: -0.01em;
}
.lpda-rate-card__meta { font-size: 14px; color: var(--c-light); margin-bottom: 24px; }
.lpda-rate-card__prices {
	border-top: 1px solid var(--c-line);
	padding-top: 20px;
	margin-bottom: 24px;
	display: grid;
	gap: 10px;
}
.lpda-rate-card__row {
	display: flex;
	justify-content: space-between;
	align-items: baseline;
	font-size: 14px;
	color: var(--c-text);
}
.lpda-rate-card__row strong { color: var(--c-primary); font-size: 16px; font-weight: 700; }
.lpda-rate-card__cta { margin-top: auto; }

.lpda-booking-wrap {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	background: #fff;
	border-radius: var(--radius-xl);
	overflow: hidden;
	box-shadow: var(--shadow);
}
.lpda-booking-wrap__intro {
	padding: clamp(32px, 5vw, 56px);
	background: var(--c-ink);
	color: #fff;
	display: flex;
	flex-direction: column;
	justify-content: center;
}
.lpda-booking-wrap__intro h2 { color: #fff !important; font-size: clamp(28px, 4vw, 44px); margin: 0 0 16px; line-height: 1.05; font-weight: 700 !important; }
.lpda-booking-wrap__intro p { color: rgba(255,255,255,.75); font-size: 17px; line-height: 1.6; margin: 0 0 24px; }
.lpda-booking-wrap__form { padding: clamp(32px, 5vw, 56px); }

/* Steps "Come funziona" */
.lpda-steps {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
	counter-reset: step;
}
.lpda-step { counter-increment: step; }
.lpda-step__num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 56px;
	height: 56px;
	background: var(--c-ink);
	color: #fff;
	border-radius: 50%;
	font-size: 22px;
	font-weight: 700;
	margin-bottom: 20px;
}
.lpda-step__num::before { content: counter(step); }
.lpda-step h3 { font-size: 22px; font-weight: 700; color: var(--c-ink); margin: 0 0 8px; }
.lpda-step p { font-size: 16px; color: var(--c-light); line-height: 1.6; margin: 0; }

/* ==========================================================================
   16. CONTATTI — form + info cards
   ========================================================================== */
.lpda-contact-grid {
	display: grid;
	grid-template-columns: 1.3fr 1fr;
	gap: 56px;
	align-items: start;
}
.lpda-contact-form-card {
	background: var(--c-paper);
	padding: clamp(28px, 4vw, 48px);
	border-radius: var(--radius-xl);
}
.lpda-contact-info-stack { display: grid; gap: 16px; }
.lpda-contact-info-card {
	background: var(--c-ink);
	color: #fff;
	padding: 28px;
	border-radius: var(--radius-lg);
	display: flex;
	gap: 18px;
	align-items: flex-start;
	text-decoration: none;
	transition: var(--t);
}
.lpda-contact-info-card:hover { transform: translateY(-4px); background: var(--c-primary); }
.lpda-contact-info-card__icon {
	width: 44px;
	height: 44px;
	border-radius: 50%;
	background: rgba(255,255,255,.12);
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	color: #fff;
	font-size: 18px;
	font-weight: 700;
}
.lpda-contact-info-card__txt { flex: 1; min-width: 0; }
.lpda-contact-info-card__txt strong { display: block; color: #fff; font-size: 13px; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; margin-bottom: 4px; opacity: .8; }
.lpda-contact-info-card__txt span { display: block; color: #fff; font-size: 18px; font-weight: 600; word-break: break-word; }

/* Accordion (Come raggiungerci / FAQ) */
.lpda-acc { display: grid; gap: 12px; }
.lpda-acc__item {
	background: #fff;
	border: 1px solid var(--c-line);
	border-radius: var(--radius);
	overflow: hidden;
}
.lpda-acc__head {
	width: 100%;
	background: none;
	border: none;
	text-align: left;
	padding: 20px 24px;
	font-family: 'Barlow', sans-serif !important;
	font-size: 18px;
	font-weight: 600;
	color: var(--c-ink);
	cursor: pointer;
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}
.lpda-acc__head::after {
	content: "+";
	font-size: 28px;
	font-weight: 300;
	color: var(--c-primary);
	transition: transform var(--t);
	line-height: 1;
}
.lpda-acc__item.is-open .lpda-acc__head::after { transform: rotate(45deg); }
.lpda-acc__body {
	max-height: 0;
	overflow: hidden;
	transition: max-height var(--t);
}
.lpda-acc__body-inner { padding: 0 24px 24px; color: var(--c-text); line-height: 1.7; font-size: 16px; }
.lpda-acc__item.is-open .lpda-acc__body { max-height: 600px; }

/* ==========================================================================
   17. FORM CONDIVISO
   ========================================================================== */
.lpda-form__row { margin-bottom: 20px; }
.lpda-form__grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
.lpda-form__row label,
.lpda-form__grid label {
	display: block;
	font-weight: 600;
	margin-bottom: 8px;
	color: var(--c-ink);
	font-size: 14px;
	letter-spacing: 0.02em;
}
.lpda-form__row input,
.lpda-form__row textarea,
.lpda-form__row select,
.lpda-form__grid input,
.lpda-form__grid textarea,
.lpda-form__grid select {
	width: 100%;
	padding: 14px 16px;
	border: 2px solid var(--c-line);
	border-radius: var(--radius);
	font-family: 'Barlow', sans-serif !important;
	font-size: 16px;
	color: var(--c-ink);
	background: #fff;
	transition: var(--t-fast);
	min-height: 50px;
}
.lpda-form__row textarea { min-height: 120px; resize: vertical; }
.lpda-form__row input:focus,
.lpda-form__row textarea:focus,
.lpda-form__row select:focus,
.lpda-form__grid input:focus,
.lpda-form__grid textarea:focus,
.lpda-form__grid select:focus {
	border-color: var(--c-primary);
	outline: none;
	box-shadow: 0 0 0 3px rgba(0,119,190,.12);
}
.lpda-form__check { display: flex; align-items: flex-start; gap: 12px; font-size: 14px; color: var(--c-light); cursor: pointer; }
.lpda-form__check input { width: auto; margin-top: 4px; flex-shrink: 0; min-height: 0; padding: 0; }
.lpda-form__msg {
	margin-top: 18px;
	padding: 14px 18px;
	border-radius: var(--radius);
	font-weight: 500;
	font-size: 15px;
	display: none;
}
.lpda-form__msg.success { background: #d1fae5; color: #065f46; display: block; }
.lpda-form__msg.error   { background: #fee2e2; color: #991b1b; display: block; }

/* ==========================================================================
   18. HEADER / NAV (override Astra Builder)
   ========================================================================== */
.site-header { transition: background var(--t), box-shadow var(--t); }

/* Header trasparente sopra hero (solo home con classe lpda-home) */
body.lpda-home .ast-theme-transparent-header .site-header,
body.lpda-home #masthead { background: transparent !important; }
body.lpda-home #masthead.lpda-header-scrolled,
body.lpda-home.lpda-scrolled #masthead {
	background: #fff !important;
	box-shadow: var(--shadow-sm);
}

/* Menu link spaziato grande */
.main-header-menu > .menu-item > a {
	font-weight: 600 !important;
	font-size: 16px !important;
	padding: 12px 18px !important;
	letter-spacing: 0.01em;
	position: relative;
	transition: color var(--t);
}
.main-header-menu > .menu-item > a::after {
	content: "";
	position: absolute;
	left: 18px; right: 18px;
	bottom: 6px;
	height: 2px;
	background: var(--c-primary);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform var(--t);
}
.main-header-menu > .menu-item:hover > a::after,
.main-header-menu > .menu-item.current-menu-item > a::after {
	transform: scaleX(1);
}

/* CTA "Prenota" nel menu (assegnare class .lpda-menu-cta a una voce custom link) */
.menu-item.lpda-menu-cta > a {
	background: var(--c-secondary) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 12px 24px !important;
	margin-left: 12px;
}
.menu-item.lpda-menu-cta > a::after { display: none !important; }
.menu-item.lpda-menu-cta > a:hover { background: var(--c-secondary-dark) !important; }

/* ==========================================================================
   19. FOOTER OVERRIDE (Astra Footer Builder)
   ========================================================================== */
.site-footer { background: var(--c-ink) !important; color: rgba(255,255,255,.75); }
.site-footer h2, .site-footer h3, .site-footer h4, .site-footer .widget-title { color: #fff !important; font-weight: 700 !important; }
.site-footer a { color: rgba(255,255,255,.75) !important; transition: color var(--t-fast); }
.site-footer a:hover { color: var(--c-secondary) !important; }
.site-footer .ast-builder-grid-row { gap: 32px; }
.ast-footer-copyright {
	border-top: 1px solid rgba(255,255,255,.1);
	padding-top: 24px;
	margin-top: 32px;
	font-size: 13px;
	color: rgba(255,255,255,.5);
}

/* Block "footer big claim" — usabile come Custom HTML widget in footer-1 */
.lpda-footer-claim {
	font-size: clamp(36px, 6vw, 72px);
	line-height: 1;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: #fff;
	margin: 0 0 32px;
}
.lpda-footer-claim em { font-style: normal; color: var(--c-secondary); }

/* ==========================================================================
   20. LIGHTBOX
   ========================================================================== */
.lpda-lightbox {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.92);
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	cursor: zoom-out;
	opacity: 0;
	transition: opacity var(--t);
}
.lpda-lightbox.is-open { opacity: 1; }
.lpda-lightbox img {
	max-width: 92vw;
	max-height: 92vh;
	object-fit: contain;
	border-radius: var(--radius);
	box-shadow: 0 20px 80px rgba(0,0,0,.6);
}
.lpda-lightbox__close {
	position: absolute;
	top: 24px;
	right: 24px;
	width: 48px;
	height: 48px;
	background: #fff;
	border: none;
	border-radius: 50%;
	font-size: 24px;
	cursor: pointer;
	line-height: 1;
}

/* ==========================================================================
   21. ASTRA OVERRIDES (rimuove banner pagina default)
   ========================================================================== */
.ast-page-header-section,
.entry-header.ast-no-thumbnail,
.entry-header { display: none !important; }

/* FIX layout: Astra mette il content in un container flex → forzo block full-width
   così le sezioni del template si impilano verticalmente invece di affiancarsi. */
.site-content .ast-container {
	display: block !important;
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
}
.site-content #primary,
.site-content .content-area {
	display: block !important;
	max-width: none !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	float: none !important;
}
.site-content #primary > article,
.site-content .ast-article-single {
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
}
.entry-content { margin: 0 !important; padding: 0 !important; }
.no-results .page-header { display: block !important; }

/* Sticky header offset per anchor scroll */
html { scroll-padding-top: 100px; }

/* ==========================================================================
   22. WHATSAPP FLOAT
   ========================================================================== */
.lpda-wa-float {
	position: fixed;
	bottom: 24px;
	right: 24px;
	z-index: 9000;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	background: #25D366;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: var(--shadow-lg);
	transition: transform var(--t);
	text-decoration: none !important;
}
.lpda-wa-float:hover { transform: scale(1.08); }
.lpda-wa-float svg { width: 32px; height: 32px; fill: currentColor; }

/* ==========================================================================
   23. ACCESSIBILITY
   ========================================================================== */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
	outline: 3px solid var(--c-primary);
	outline-offset: 2px;
}

/* ==========================================================================
   24. RESPONSIVE
   ========================================================================== */
@media (max-width: 1100px) {
	.lpda-structure-card--lg,
	.lpda-structure-card--md { grid-column: span 6; }
	.lpda-services-strip__grid { grid-template-columns: repeat(2, 1fr); }
	.lpda-svc-addon-grid { grid-template-columns: repeat(2, 1fr); }
	.lpda-rates-grid { grid-template-columns: repeat(2, 1fr); }
	.lpda-masonry { column-count: 2; }
}
@media (max-width: 900px) {
	.lpda-svc__inner,
	.lpda-locate,
	.lpda-booking-wrap,
	.lpda-contact-grid { grid-template-columns: 1fr; gap: 32px; }
	.lpda-svc--reverse .lpda-svc__inner > :first-child { order: 0; }
	.lpda-locate { border-radius: var(--radius-xl); }
	.lpda-locate__map { min-height: 320px; }
	.lpda-locate__map iframe { min-height: 320px; }
	.lpda-booking-wrap { box-shadow: none; }
	.lpda-booking-wrap__intro { border-radius: var(--radius-xl) var(--radius-xl) 0 0; }
	.lpda-steps { grid-template-columns: 1fr; gap: 24px; }
	.lpda-form__grid { grid-template-columns: 1fr; }
	.lpda-structure-card--lg { min-height: 380px; }
	.lpda-heading-row { margin-bottom: 32px; }
}
@media (max-width: 640px) {
	.lpda-hero { min-height: 100svh; }
	.lpda-hero__content { padding-bottom: 56px; }
	.lpda-hero__cta { flex-direction: column; align-items: stretch; }
	.lpda-hero__cta .lpda-btn { justify-content: center; }
	.lpda-hero__scroll { display: none; }
	.lpda-structures__grid,
	.lpda-services-strip__grid,
	.lpda-svc-addon-grid,
	.lpda-rates-grid { grid-template-columns: 1fr; gap: 16px; }
	.lpda-structure-card--lg,
	.lpda-structure-card--md { grid-column: span 12; min-height: 360px; }
	.lpda-masonry { column-count: 1; }
	.lpda-cta-band__buttons { flex-direction: column; align-items: stretch; }
	.lpda-cta-band__buttons .lpda-btn { justify-content: center; }
}

/* ==========================================================================
   25. MODALITÀ ANTEPRIMA CLIENTE (banner + watermark)
   Per disattivare: in functions.php cambia LPDA_PREVIEW_MODE in false.
   ========================================================================== */
.lpda-preview-banner {
position: fixed;
top: 0; left: 0; right: 0;
z-index: 100000;
display: flex;
justify-content: center;
align-items: center;
gap: 12px;
padding: 10px 20px;
background: linear-gradient(90deg, #FF8C42, #E67324);
color: #fff;
font-size: 13px;
font-weight: 600;
letter-spacing: 0.5px;
text-transform: uppercase;
box-shadow: 0 4px 16px rgba(0,0,0,0.25);
font-family: 'Barlow', sans-serif;
}
.lpda-preview-banner__dot {
width: 10px; height: 10px;
background: #fff;
border-radius: 50%;
animation: lpda-pulse 1.5s ease-in-out infinite;
}
.lpda-preview-banner__sep { opacity: 0.6; }
.lpda-preview-banner span:last-child { text-transform: none; font-weight: 400; font-size: 12px; opacity: 0.95; }
@keyframes lpda-pulse {
0%, 100% { opacity: 1; transform: scale(1); }
50% { opacity: 0.4; transform: scale(0.85); }
}

/* Spazio per non coprire il contenuto sotto il banner */
body { padding-top: 38px !important; }
.main-header-bar-wrap, .ast-sticky-header,
.lpda-header, header[class*="site-header"] { top: 38px !important; }

/* Watermark diagonale, non interattivo */
.lpda-preview-watermark {
position: fixed;
inset: 0;
z-index: 99999;
pointer-events: none;
overflow: hidden;
display: flex;
flex-direction: column;
justify-content: space-around;
transform: rotate(-22deg) scale(1.4);
transform-origin: center;
opacity: 0.06;
user-select: none;
}
.lpda-preview-watermark span {
display: block;
white-space: nowrap;
font-family: 'Barlow', sans-serif;
font-size: 48px;
font-weight: 900;
color: #000;
letter-spacing: 2px;
text-transform: uppercase;
}

@media (max-width: 768px) {
.lpda-preview-banner { font-size: 11px; padding: 8px 12px; gap: 8px; }
.lpda-preview-banner span:last-child { display: none; }
.lpda-preview-banner__sep { display: none; }
body { padding-top: 34px !important; }
.main-header-bar-wrap, .ast-sticky-header,
.lpda-header, header[class*="site-header"] { top: 34px !important; }
.lpda-preview-watermark span { font-size: 28px; }
}

/* Stampa: nascondi sia banner che watermark */
@media print {
.lpda-preview-banner, .lpda-preview-watermark { display: none !important; }
}