/*
 * Synapsenbrenner - Modul reiseplaner-daten, Baustein geheimtipps (P15, 21.09.2026).
 * Der hervorgehobene Kasten mit den Geheimtipps, am Sehnsuchtsort und am Highlight.
 * Praefix sb-geheimtipp- nach FRONTEND-REGELN.md Abschnitt 2.
 * Token immer mit Ersatzwert, weil sie im Child-Theme liegen und dieses CSS im Plugin.
 * Rueckbau: Baustein-Option loeschen, dann laedt diese Datei nicht mehr.
 */

.sb-geheimtipp-band {
	--sb-gt-linie: var(--sb-petrol-700, #004445);
}

.sb-geheimtipp-kasten {
	position: relative;
	background: var(--sb-grau-50, #faf9f6);
	border: 1px solid var(--sb-grau-200, #e5e7eb);
	border-left: 6px solid var(--sb-gt-linie);
	border-radius: var(--borderRadiusCard, 12px);
	padding: 28px 32px 24px;
}

.sb-geheimtipp-kicker {
	margin: 0 0 6px;
	font-family: var(--sb-schrift-text, "Source Sans 3", sans-serif);
	font-size: 14px;
	line-height: 1.3;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--sb-text-2, #4b5563);
}

/* Die Groesse kommt vom Theme (h2), hier nur der Abstand. */
.sb-geheimtipp-titel {
	margin: 0 0 18px;
}

.sb-geheimtipp-liste {
	margin: 0;
	padding: 0;
	list-style: none;
}

.sb-geheimtipp-punkt {
	position: relative;
	margin: 0 0 18px;
	padding-left: 30px;
}

.sb-geheimtipp-punkt:last-child {
	margin-bottom: 0;
}

/* Der Haken als Aufzaehlungszeichen, damit es nach Rat aussieht und nicht nach Liste. */
.sb-geheimtipp-punkt::before {
	content: "";
	position: absolute;
	top: 6px;
	left: 0;
	width: 16px;
	height: 9px;
	border-left: 3px solid var(--sb-gt-linie);
	border-bottom: 3px solid var(--sb-gt-linie);
	transform: rotate(-45deg);
}

.sb-geheimtipp-kurz {
	display: block;
	font-family: var(--sb-schrift-titel, Montserrat, sans-serif);
	font-weight: 700;
	line-height: 1.35;
	color: var(--sb-petrol-900, #021c1e);
}

.sb-geheimtipp-text {
	display: block;
	margin-top: 4px;
	color: var(--sb-text, inherit);
}

@media (max-width: 767px) {
	.sb-geheimtipp-kasten {
		padding: 22px 20px 20px;
		border-left-width: 5px;
	}

	.sb-geheimtipp-punkt {
		padding-left: 26px;
	}
}
