/* ============================================================
   SCHEDA PRODOTTO 2 — "Nordic editorial"
   Palette: carta calda, blu fiordo, accenti rosso brand / teal
   Tipografia: Fraunces (display) + Open Sans (testo, da sito)
   ============================================================ */

.sp2 {
	--sp2-ink: #1e2a38;          /* testo principale */
	--sp2-ink-soft: #55616e;     /* testo secondario */
	--sp2-navy: #12596D;         /* blu brand */
	--sp2-navy-deep: #1d2452;
	--sp2-red: #ea212e;          /* rosso brand */
	--sp2-teal: #0d7a5f;         /* disponibile */
	--sp2-amber: #e59a00;        /* poca disponibilita */
	--sp2-paper: #faf9f6;        /* fondo pagina */
	--sp2-ice: #edf2f5;          /* fondo sezioni fredde */
	--sp2-card: #ffffff;
	--sp2-line: #e4e0d6;
	--sp2-radius: 14px;
	--sp2-shadow: 0 10px 30px -12px rgba(30, 42, 56, .18);
	--sp2-display: 'Fraunces', 'Roboto Slab', Georgia, serif;

	background: var(--sp2-paper);
	color: var(--sp2-ink);
	font-size: 16px;
	line-height: 1.7;
	padding-bottom: 0;
}

.sp2 ::selection { background: var(--sp2-navy); color: #fff; }

/* ============================== HERO ============================== */



.sp2-hero {
	position: relative;
	padding: 54px 0 44px;
	background:
		radial-gradient(900px 320px at 85% -10%, rgba(13, 122, 95, .10), transparent 60%),
		radial-gradient(700px 300px at 10% -20%, rgba(40, 50, 111, .12), transparent 60%),
		linear-gradient(180deg, #eef3f6 0%, var(--sp2-paper) 100%);
	border-bottom: 1px solid var(--sp2-line);
	overflow: hidden;
}

.sp2-hero:after { /* filo orizzonte decorativo */
	content: "";
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 3px;
	background: linear-gradient(90deg, var(--sp2-navy) 0 33%, var(--sp2-red) 33% 40%, transparent 40%);
	opacity: .85;
}

.sp2-hero-inner { max-width: 880px; }

.sp2-kicker {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
	margin-bottom: 14px;
	font-size: 12px;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--sp2-ink-soft);
}

.sp2-kicker-cat { font-weight: 700; color: var(--sp2-navy); }

.sp2-kicker-cod {
	padding: 3px 10px;
	border: 1px solid var(--sp2-line);
	border-radius: 999px;
	background: #fff;
	letter-spacing: .12em;
}

.sp2-flags { display: inline-flex; gap: 6px; align-items: center; }
.sp2-flags img {
	width: 26px; height: auto;
	border-radius: 3px;
	box-shadow: 0 1px 4px rgba(0,0,0,.25);
	transition: transform .2s ease;
}
.sp2-flags a:hover img { transform: translateY(-2px) scale(1.08); }

.sp2-title {
	font-family: var(--sp2-display);
	font-weight: 700;
	font-size: clamp(30px, 4.6vw, 52px);
	line-height: 1.08;
	letter-spacing: -.01em;
	color: var(--sp2-navy-deep);
	margin: 0 0 10px;
	text-transform: uppercase;
}

.sp2-subtitle {
	font-family: var(--sp2-display);
	font-style: italic;
	font-weight: 400;
	font-size: clamp(18px, 2.4vw, 24px);
	color: var(--sp2-ink-soft);
	margin: 0 0 22px;
	max-width: 46em;
}

.sp2-meta { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 26px; }

.sp2-chip {
	display: inline-flex;
	align-items: center;
	gap: 7px;
	padding: 7px 14px;
	border-radius: 999px;
	border: 1px solid var(--sp2-line);
	background: #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--sp2-ink);
}

.sp2-chip .fa { color: var(--sp2-navy); }

.sp2-chip-dark { background: var(--sp2-navy); border-color: var(--sp2-navy); color: #fff; }
.sp2-chip-dark .fa { color: #ffd76a; }

.sp2-chip-red { background: #fdeced; border-color: #f5b8bc; color: var(--sp2-red); }
.sp2-chip-red .fa { color: var(--sp2-red); }

.sp2-hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }

/* ============================== BOTTONI ============================== */

.sp2 .sp2-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 9px;
	padding: 12px 22px;
	border-radius: 999px;
	border: 1.5px solid transparent;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: .04em;
	text-decoration: none !important;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease, background .15s ease, color .15s ease;
	line-height: 1.2;
}

.sp2 .sp2-btn-primary {
	background: var(--sp2-navy);
	color: #fff !important;
	box-shadow: 0 8px 20px -8px rgba(40, 50, 111, .55);
}
.sp2 .sp2-btn-primary:hover,
.sp2 .sp2-btn-primary:focus {
	background: var(--sp2-navy-deep);
	transform: translateY(-2px);
	box-shadow: 0 12px 26px -10px rgba(40, 50, 111, .65);
}

.sp2 .sp2-btn-ghost {
	background: #fff;
	border-color: var(--sp2-line);
	color: var(--sp2-navy) !important;
}
.sp2 .sp2-btn-ghost:hover,
.sp2 .sp2-btn-ghost:focus {
	border-color: var(--sp2-navy);
	transform: translateY(-2px);
}

.sp2 .sp2-btn-block { display: flex; width: 100%; margin-top: 16px; }
.sp2 .sp2-btn-lg { padding: 15px 34px; font-size: 15px; }

/* ============================== LAYOUT ============================== */

.sp2-cols { margin-top: 34px; }

/* desktop: row flex cosi' la colonna sidebar si estende e lo sticky funziona.
   Colonne invertite da pc: sidebar (foto/quota) a sinistra, calendario+programma a destra */
@media (min-width: 768px) {
	.sp2-cols { display: flex; align-items: stretch; }
	.sp2-cols:before, .sp2-cols:after { display: none; } /* disattiva clearfix bootstrap */
	.sp2-colside { order: 1; }
	.sp2-colmain { order: 2; }
}
@media (min-width: 992px) {
	.sp2-colmain { padding-left: 30px; }
}

.sp2-section { margin-bottom: 46px; }

.sp2-h2 {
	font-family: var(--sp2-display);
	font-weight: 600;
	font-size: clamp(22px, 3vw, 30px);
	color: var(--sp2-navy-deep);
	margin: 0 0 18px;
	padding-bottom: 10px;
	position: relative;
}
.sp2-h2:after {
	content: "";
	position: absolute;
	left: 0; bottom: 0;
	width: 54px; height: 3px;
	background: var(--sp2-navy);
	border-radius: 2px;
}

/* ============================== CALENDARIO PARTENZE ============================== */

.sp2-calendar {
	background: var(--sp2-card);
	border: 1px solid var(--sp2-line);
	border-radius: var(--sp2-radius);
	padding: 22px 24px 18px;
	box-shadow: var(--sp2-shadow);
}
.sp2-calendar .sp2-h2 { font-size: 21px; margin-bottom: 14px; }

.sp2 #partenze {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	align-items: stretch;
}

.sp2 .boxmese {
	border: 1px solid var(--sp2-line);
	border-radius: 10px;
	padding: 8px 10px 10px;
	background: var(--sp2-paper);
	min-width: 108px;
}

.sp2 .boxmese .mese {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--sp2-navy);
	margin-bottom: 7px;
}

.sp2 .boxmese .giorni { display: flex; flex-wrap: wrap; gap: 5px; }

/* nota: css.min.css globale definisce #partenze .d (specificita' con id),
   serve #partenze nei selettori per vincere senza !important sparsi */
.sp2 #partenze .d,
.sp2 .legenda .d {
	position: relative;
	width: 30px; height: 30px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 13px;
	font-weight: 700;
	line-height: 1;
	margin: 0;
	background: #086F00;
	color: #fff;
}

.sp2 #partenze .d.scarso,
.sp2 .legenda .d.scarso {
	background: #FFAE00;
	color: #fff;
}

.sp2 #partenze .d.esaurito,
.sp2 .legenda .d.esaurito {
	background: #999;
	color: #eee;
	overflow: hidden;
}
.sp2 #partenze .d.esaurito:after,
.sp2 .legenda .d.esaurito:after {
	content: "";
	position: absolute;
	left: -2px; right: -2px; top: 50%;
	border-top: 2px solid var(--sp2-red);
	transform: rotate(-45deg);
}

.sp2 .legenda {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 7px;
	margin-top: 14px;
	font-size: 12.5px;
	color: var(--sp2-ink-soft);
}
.sp2 .legenda .d { width: 20px; height: 20px; }
.sp2 .legenda div:not(.d) { margin-right: 12px; }

/* ============================== PROGRAMMA ============================== */

.sp2 #programmatxt { font-size: 16.5px; line-height: 1.75; }
.sp2 #programmatxt > br { display: none; } /* spaziatura gestita da CSS, il br resta per la copia */

.sp2 .sp2-day {
	position: relative;
	background: var(--sp2-card);
	border: 1px solid var(--sp2-line);
	border-left: 4px solid var(--sp2-navy);
	border-radius: 12px;
	padding: 18px 6px;
	margin: 0 0 16px !important;
	box-shadow: 0 4px 14px -8px rgba(30, 42, 56, .14);
}

.sp2 .sp2-day-testo strong:first-child {
	display: block;
	font-family: var(--sp2-display);
	font-size: 18px;
	font-weight: 700;
	letter-spacing: .02em;
	color: var(--sp2-navy-deep);
	margin-bottom: 6px;
}

.sp2 .sp2-day-foto img {
	border-radius: 10px;
	box-shadow: 0 6px 16px -8px rgba(30, 42, 56, .35);
	width: 100%;
	transition: transform .25s ease;
	/* spazio riservato prima del caricamento lazy: evita salti di layout */
	aspect-ratio: 1 / 1;
	object-fit: cover;
}
@media (max-width: 767px) {
	.sp2 .sp2-day-foto img { aspect-ratio: 5 / 3; } /* timthumb 500x300 su mobile */
}
.sp2 .sp2-day-foto a:hover img { transform: scale(1.03); }

/* ============================== SIDEBAR ============================== */

.sp2-sticky { position: sticky; top: 96px; }

.sp2-media {
	border-radius: var(--sp2-radius);
	overflow: hidden;
	margin-bottom: 18px;
	box-shadow: var(--sp2-shadow);
	background: #fff;
}
.sp2-media img { width: 100%; display: block; }

.sp2-card {
	background: var(--sp2-card);
	border: 1px solid var(--sp2-line);
	border-radius: var(--sp2-radius);
	padding: 20px 22px;
	margin-bottom: 18px;
	box-shadow: 0 4px 14px -10px rgba(30, 42, 56, .18);
	font-size: 14.5px;
}

.sp2-card-title {
	font-family: var(--sp2-display);
	font-size: 17px;
	font-weight: 700;
	letter-spacing: .04em;
	text-transform: uppercase;
	margin: 0 0 12px;
	color: var(--sp2-navy-deep);
}

.sp2-card-note {
	display: block;
	font-family: inherit;
	font-size: 11.5px;
	font-weight: 400;
	letter-spacing: .03em;
	text-transform: none;
	color: var(--sp2-ink-soft);
	margin-top: 3px;
}

.sp2-card-body ul {
	color: inherit !important;
	padding-left: 0 !important;
	margin: 0 !important;
	list-style: none !important;
	font-size: 14px !important;
}
.sp2-card-body ul li {
	padding: 5px 0 5px 26px;
	position: relative;
	border-bottom: 1px dashed var(--sp2-line);
}
.sp2-card-body ul li:last-child { border-bottom: 0; }
.sp2-card-body ul li:before {
	content: "\2022";
	position: absolute;
	left: 8px;
	color: var(--sp2-navy);
	font-weight: 700;
}

/* incluso / non incluso: segni distintivi */
.sp2-list-si ul li:before { content: "\2713"; color: var(--sp2-teal); left: 2px; }
.sp2-list-no ul li:before { content: "\2715"; color: var(--sp2-red); left: 3px; font-size: 12px; }

/* QUOTA: la card chiave, scura e ben visibile */
.sp2-card-quota {
	background: linear-gradient(160deg, var(--sp2-navy) 0%, var(--sp2-navy-deep) 100%);
	border-color: var(--sp2-navy-deep);
	color: #fff;
	box-shadow: 0 16px 34px -14px rgba(29, 36, 82, .6);
}
.sp2-card-quota .sp2-card-title { color: #fff; }
.sp2-card-quota .sp2-card-note { color: rgba(255,255,255,.65); }
.sp2-card-quota .sp2-card-body,
.sp2-card-quota .sp2-card-body * { color: #fff !important; }
.sp2-card-quota .sp2-btn-primary {
	background: var(--sp2-red);
	box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .5);
}
.sp2-card-quota .sp2-btn-primary:hover { background: #c8121e; }

.sp2 #tabprez table { width: 100% !important; table-layout: fixed; border-collapse: collapse; }
.sp2 #tabprez table td {
	padding: 6px 4px !important;
	border-bottom: 1px solid rgba(255,255,255,.18) !important;
	font-size: 14px;
	vertical-align: top;
}
.sp2 #tabprez table tr:last-child td { border-bottom: 0 !important; }
.sp2 #tabprez table td:nth-child(1) { width: 40%; }
.sp2 #tabprez table td:nth-child(2) { width: 40%; }
.sp2 #tabprez table td:nth-child(3) { width: 20%; text-align: right; font-weight: 700; }

.sp2-card-evidenza { border-top: 4px solid var(--sp2-amber); }
.sp2-card-incluso { border-top: 4px solid var(--sp2-teal); }
.sp2-card-nonincluso { border-top: 4px solid var(--sp2-red); }

/* ============================== ESCURSIONI ============================== */

.sp2-escursioni {
	background: var(--sp2-ice);
	border-top: 1px solid var(--sp2-line);
	border-bottom: 1px solid var(--sp2-line);
	padding: 44px 0 30px;
	margin-top: 10px;
}

.sp2-esc-sub {
	font-family: var(--sp2-display);
	font-style: italic;
	color: var(--sp2-ink-soft);
	margin: -6px 0 22px;
	font-size: 17px;
}

.sp2 .sp2-esc-card {
	display: block;
	position: relative;
	border-radius: var(--sp2-radius);
	overflow: hidden;
	margin-bottom: 22px;
	box-shadow: var(--sp2-shadow);
	text-decoration: none !important;
	background: #12203a;
}

.sp2 .sp2-esc-img { display: block; }
.sp2 .sp2-esc-img img {
	width: 100%;
	display: block;
	transition: transform .35s ease, opacity .35s ease;
	opacity: .92;
	aspect-ratio: 9 / 7; /* foto-360-280 */
	object-fit: cover;
}
.sp2 .sp2-esc-card:hover .sp2-esc-img img { transform: scale(1.06); opacity: 1; }

.sp2 .sp2-esc-name {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 34px 16px 14px;
	background: linear-gradient(180deg, transparent 0%, rgba(10, 16, 32, .85) 70%);
	color: #fff;
	font-family: var(--sp2-display);
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
}

/* ============================== FORM PREVENTIVO ============================== */

.sp2-formwrap { padding: 50px 0 60px; }

.sp2-formcard {
	background: var(--sp2-card);
	border: 1px solid var(--sp2-line);
	border-radius: 18px;
	padding: 36px 38px 30px;
	box-shadow: var(--sp2-shadow);
	scroll-margin-top: 110px;

	margin: 0 auto;
}

.sp2-form-title:after { width: 54px; }

.sp2-form-sub {
	color: var(--sp2-ink-soft);
	margin: -6px 0 26px;
	font-size: 15.5px;
}
.sp2-form-sub em { font-family: var(--sp2-display); color: var(--sp2-navy); }

.sp2-formcard label {
	display: block;
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--sp2-ink-soft);
	margin-bottom: 6px;
}

.sp2-formcard .form-control {
	height: 46px;
	border-radius: 10px;
	border: 1.5px solid var(--sp2-line);
	box-shadow: none;
	font-size: 15px;
	color: var(--sp2-ink);
	background: var(--sp2-paper);
	transition: border-color .15s ease, background .15s ease;
}
.sp2-formcard textarea.form-control { height: auto; min-height: 112px; resize: vertical; }
.sp2-formcard .form-control:focus {
	border-color: var(--sp2-navy);
	background: #fff;
	box-shadow: 0 0 0 3px rgba(40, 50, 111, .12);
	outline: 0;
}

.sp2-formcard .form-group { margin-bottom: 20px; }

.sp2-privacy {
	background: var(--sp2-paper);
	border: 1px dashed var(--sp2-line);
	border-radius: 10px;
	padding: 14px 16px;
	font-size: 12.5px;
	color: var(--sp2-ink-soft);
}
.sp2-privacy-label {
	font-size: 13.5px !important;
	text-transform: none !important;
	letter-spacing: 0 !important;
	color: var(--sp2-ink) !important;
	font-weight: 700 !important;
	cursor: pointer;
}
.sp2-privacy input[type="radio"] { margin-right: 6px; }
.sp2-privacy a { color: var(--sp2-navy); text-decoration: underline; }

.sp2-form-send { text-align: right; }
.sp2-form-send .sp2-btn-lg { margin-top: 14px; }

/* honeypot antispam: fuori schermo, non display:none */
.sp2 #send2 {
	position: absolute !important;
	left: -9999px !important;
	width: 1px; height: 1px;
	opacity: 0;
}

/* ============================== ANIMAZIONI ============================== */

.sp2-reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
.sp2-reveal.is-vis { opacity: 1; transform: none; }

.sp2-hero-inner > * { animation: sp2fade .7s ease backwards; }
.sp2-hero-inner > *:nth-child(2) { animation-delay: .08s; }
.sp2-hero-inner > *:nth-child(3) { animation-delay: .16s; }
.sp2-hero-inner > *:nth-child(4) { animation-delay: .24s; }
.sp2-hero-inner > *:nth-child(5) { animation-delay: .32s; }

@keyframes sp2fade {
	from { opacity: 0; transform: translateY(14px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.sp2-hero-inner > * { animation: none; }
	.sp2-reveal { opacity: 1; transform: none; transition: none; }
	.sp2 .sp2-btn, .sp2-flags img, .sp2 .sp2-esc-img img { transition: none; }
}

/* ============================== RESPONSIVE ============================== */

@media (max-width: 991px) {
	.sp2-sticky { position: static; }
}

@media (max-width: 767px) {
	.sp2-hero { padding: 34px 0 30px; }
	.sp2-hero-actions .sp2-btn { flex: 1 1 auto; }

	/* su mobile: prima foto+quota (sidebar), poi calendario+programma */
	.sp2-cols { display: flex; flex-direction: column; }
	.sp2-colside { order: 1; }
	.sp2-colmain { order: 2; }

	.sp2-formcard { padding: 26px 20px; }
	.sp2-form-send { text-align: left; }
	.sp2-form-send .g-recaptcha { float: none !important; }

	.sp2 .sp2-day { padding: 14px 2px; }
	.sp2 .sp2-day-foto { margin-bottom: 12px; }
}

/* ============================== STAMPA ============================== */

@media print {
	.sp2 { background: #fff; }
	.sp2-hero { background: none; border: 0; padding: 10px 0; }
	.sp2-hero:after { display: none; }
	.sp2-hero-actions, .sp2-escursioni, .sp2-formwrap, .noprint, .no-print { display: none !important; }
	.sp2-sticky { position: static; }
	.sp2-colmain, .sp2-colside { width: 100%; }
	.sp2 .sp2-day { box-shadow: none; page-break-inside: avoid; }
	.sp2-card { box-shadow: none; }
	.sp2-card-quota { background: #fff; color: #000; border: 1px solid #999; }
	.sp2-card-quota .sp2-card-title,
	.sp2-card-quota .sp2-card-body,
	.sp2-card-quota .sp2-card-body * { color: #000 !important; }
}
