/* =========================================================================
   LADUTI Haarserum V9 (body.ldc-v9) – Feinschliff über V8. Alles Übrige: ldc-v8.css.
   1. Farben: UI-Flächen ohne Bild im neutralen Grau #f5f5f7 statt im warmen #f3f2ef.
      Sektionen, in denen ein Produktfoto nahtlos in die Fläche übergeht (Wirkstoffe, Abschluss), behalten ihren Ton:
      er ist der Hintergrund der Fotos.
   2. Proportion: Produktname am Desktop etwas kleiner (60 → 50 px), Preis unverändert.
   3. Unterer Informationsbereich: kurze Beschreibung + Angaben offen, darunter drei Akkordeons.
   ========================================================================= */
body.ldc-v9 {
	--l9-tile: #f5f5f7;
}

body.ldc-v9 .ldc8 .ldc-section.ldc-faq-sec,
body.ldc-v9 .ldc8 .ldc-section.is-panel.ldc-faq-sec {
	background: var(--l9-tile) !important;
}

@media (min-width: 768px) {
	body.ldc-v9 .ldc8-buy {
		background: var(--l9-tile);
	}
}

@media (min-width: 1000px) {
	body.ldc-v9 .ldc8-title {
		font-size: clamp(40px, 3.5vw, 50px);
	}
}

/* ---------- Informationsbereich ---------- */
body.ldc-v9 .ldc9-details .ldc5-details__head,
body.ldc-v9 .ldc9-about .ldc-h2 {
	margin: 0;
}

.ldc9-top {
	display: grid;
	gap: 22px;
	margin-bottom: 30px;
}

.ldc9-about .ldc-eyebrow {
	margin: 0 0 10px;
}

.ldc9-about__txt {
	margin: 14px 0 0;
	max-width: 34em;
	font-size: 16.5px;
	line-height: 1.5;
	color: var(--ldc-ink-2);
}

.ldc9-details .ldc9-facts {
	margin: 0;
	padding: 6px 20px;
	border-radius: 20px;
	background: var(--l9-tile);
	font-size: 15px;
	line-height: 1.4;
	color: var(--ldc-ink-2);
}

.ldc9-details .ldc9-facts > div {
	grid-template-columns: minmax(0, 1fr);
	gap: 2px;
	padding: 11px 0;
	border-top: 1px solid rgba(18, 18, 18, 0.07);
}

.ldc9-details .ldc9-facts > div:first-child {
	border-top: 0;
}

.ldc9-details .ldc9-facts dt {
	font-size: 12.5px;
	font-weight: 500;
}

.ldc9-details .ldc9-facts dd {
	font-weight: 500;
}

.ldc9-inci {
	margin: 0;
	font-size: 14px;
	line-height: 1.65;
	color: var(--ldc-ink-2);
}

@media (min-width: 768px) {
	.ldc9-top {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
		gap: 48px;
		align-items: start;
		margin-bottom: 44px;
	}

	.ldc9-details .ldc9-facts {
		padding: 10px 26px;
	}

	.ldc9-details .ldc9-facts > div {
		grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr);
		gap: 12px;
		padding: 12px 0;
	}

	.ldc9-details .ldc9-facts dt {
		font-size: inherit;
	}
}

@media (min-width: 1000px) {
	body.ldc-v9 .ldc9-details .ldc5-details__inner {
		max-width: 1040px;
	}
}