/**
 * Tory-SEO Landing-Pages — Design-Refresh (2026-07).
 *
 * Overlay auf frontend.css. Ändert nur Look, keine Inhalte. Übernimmt die
 * Design-Sprache der Partner-Landing/Detail-Seiten (Geist + Roboto,
 * teal-Palette, große Rounded-Cards, weiche Shadows, edle Empty-Feels).
 *
 * Aufbau:
 *   1. Design-Tokens (identisch zu partners.css)
 *   2. Body & Container Base
 *   3. Hero — Whitespace + Typografie + moderne CTA-Pills
 *   4. Trust-Bar — Chips statt Text-Zeile
 *   5. Sections — Spacing, große Headlines
 *   6. Cards — Rounded 18px + Hover-Lift + Tier-Akzente
 *   7. Icons — teal-Container statt Outline-only
 *   8. Product-Card-Slider — Cleanere Optik
 *   9. Trust-List / Feature-Boxes — Bento-Grid
 *  10. Reviews-Section — Wie Partner-Detail
 *  11. FAQ — Chip-Style
 *  12. CTA-Section — Gradient wie Partner-Detail
 *  13. Related-Pages — Bento-Karten
 *  14. Chat-Callout — Modernere Look
 *  15. Fine-Print + Fußnoten
 */

/* ── 1. Tokens ────────────────────────────────────────────────────────── */
.tory-seo-landing {
	--tsl-teal: #00737d;
	--tsl-teal-2: #00B9BC;
	--tsl-ink: #1a1a1a;
	--tsl-slate: #2e3a52;
	--tsl-line: #e5e7eb;
	--tsl-bg: #fafafa;
	--tsl-card-shadow: 0 4px 20px rgba(0,0,0,0.06), 0 1px 3px rgba(0,0,0,0.04);
	--tsl-card-shadow-hover: 0 12px 40px rgba(0,0,0,0.10), 0 3px 8px rgba(0,0,0,0.05);
	--tsl-font-display: "Geist", "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
	--tsl-font-body: "Roboto", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-family: var(--tsl-font-body);
	color: var(--tsl-ink);
	background: #fff;
}

/* ── 2. Container ─────────────────────────────────────────────────────── */
.tory-seo-container {
	max-width: 1200px;
	margin: 0 auto;
	padding: 0 24px;
}
@media (max-width: 640px) { .tory-seo-container { padding: 0 16px; } }

/* ── 3. Hero — Whitespace + moderner Look ─────────────────────────────── */
.tory-seo-hero {
	/* Header ist fixed (65px) — Hero startet bewusst UNTER dem Header mit Abstand. */
	padding: 64px 40px 84px !important;
	margin-top: 24px !important;
	background: linear-gradient(160deg, #075e66 0%, #00737d 45%, #00a3aa 100%) !important;
	position: relative;
	overflow: hidden;
	border-radius: 24px;
}
/* Kompletter Body-Anchor: kein Header-Übermalen, wenn Theme mal Margin
   auf das site-main setzt. */
.tory-seo-landing { padding-top: 120px !important; margin-top: 0 !important; }
.tory-seo-hero::before {
	content: "";
	position: absolute; inset: 0;
	background:
		radial-gradient(circle at 12% 18%, rgba(255,255,255,0.12) 0%, transparent 42%),
		radial-gradient(circle at 88% 92%, rgba(0,40,44,0.22) 0%, transparent 50%);
	pointer-events: none;
	z-index: 0;
}
@media (max-width: 780px) { .tory-seo-hero { padding: 48px 20px 60px !important; } }

.tory-seo-hero-inner {
	position: relative; z-index: 1;
	display: grid !important;
	grid-template-columns: 1.15fr 1fr !important;
	gap: 60px !important;
	align-items: center;
	max-width: 1200px;
	margin: 0 auto;
	width: 100%;
}
@media (max-width: 900px) {
	.tory-seo-hero-inner { grid-template-columns: 1fr !important; gap: 40px !important; }
}

.tory-seo-hero-badge {
	display: inline-flex; align-items: center; gap: 8px;
	background: rgba(255,255,255,0.16) !important;
	color: #ffffff !important;
	padding: 8px 14px !important;
	border-radius: 999px !important;
	font-size: 11px !important; font-weight: 700 !important;
	letter-spacing: 1.4px !important; text-transform: uppercase !important;
	margin-bottom: 20px !important;
	border: 1px solid rgba(255,255,255,0.35) !important;
}
.tory-seo-hero h1,
.tory-seo-landing h1 {
	font-family: var(--tsl-font-display) !important;
	font-size: clamp(36px, 5vw, 60px) !important;
	font-weight: 700 !important;
	line-height: 1.08 !important;
	letter-spacing: -0.02em !important;
	color: #ffffff !important;
	-webkit-text-fill-color: #ffffff !important;
	background: none !important;
	-webkit-background-clip: unset !important;
	background-clip: unset !important;
	margin: 0 0 20px !important;
	text-shadow: 0 2px 24px rgba(0,40,44,0.18) !important;
}
.tory-seo-section h2,
.tory-seo-landing h2 {
	color: var(--tsl-ink) !important;
	-webkit-text-fill-color: var(--tsl-ink) !important;
	background: none !important;
}
.tory-seo-cloud-connect h2 {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
.tory-seo-cta h2 {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
.tory-seo-hero-sub {
	font-size: clamp(16px, 1.4vw, 18px) !important;
	line-height: 1.6 !important;
	color: rgba(255,255,255,0.92) !important;
	margin: 0 0 28px !important;
	max-width: 560px;
}

.tory-seo-hero-notice {
	display: inline-flex; align-items: center; gap: 10px;
	background: rgba(255,255,255,0.9) !important;
	border: 1px solid var(--tsl-line) !important;
	border-left: 4px solid var(--tsl-teal-2) !important;
	padding: 12px 16px !important;
	border-radius: 12px !important;
	color: var(--tsl-ink);
	font-size: 14px;
	margin-bottom: 22px;
}
.tory-seo-hero-notice .tory-seo-icon { color: var(--tsl-teal); }

/* Hero-Actions — Buttons wie Partner-Landing */
.tory-seo-hero-actions {
	display: flex; flex-wrap: wrap; gap: 12px;
	margin-top: 8px;
}
.tory-seo-btn,
.tory-seo-hero-actions a,
.tory-seo-cta-actions a {
	display: inline-flex !important; align-items: center !important; gap: 8px !important;
	padding: 14px 26px !important;
	border-radius: 999px !important;
	font-weight: 700 !important; font-size: 15px !important;
	text-decoration: none !important;
	transition: all 0.15s ease !important;
	border: 0 !important;
}
/* Primary default (auf hellen Sections): teal #00737d + weiß = 5,7:1 ✓ */
.tory-seo-btn-primary {
	background: var(--tsl-teal) !important;
	color: #fff !important;
}
.tory-seo-btn-primary:hover {
	background: #075e66 !important;
	transform: translateY(-1px);
	box-shadow: 0 8px 24px rgba(0,115,125,0.25);
}
/* Primary auf dunklem/tealfarbenem Untergrund (Hero + CTA): invertiert — weiß + teal-Text */
.tory-seo-hero-actions a.tory-seo-btn-primary,
.tory-seo-cta-actions a.tory-seo-btn-primary {
	background: #fff !important;
	color: var(--tsl-teal) !important;
	box-shadow: 0 6px 20px rgba(0,0,0,0.15);
}
.tory-seo-hero-actions a.tory-seo-btn-primary:hover,
.tory-seo-cta-actions a.tory-seo-btn-primary:hover {
	background: #f0fbfc !important;
	transform: translateY(-1px);
}
.tory-seo-btn-secondary,
.tory-seo-btn-outline {
	background: #fff !important;
	color: var(--tsl-ink) !important;
	border: 1.5px solid var(--tsl-line) !important;
}
.tory-seo-btn-secondary:hover,
.tory-seo-btn-outline:hover {
	border-color: var(--tsl-teal) !important;
	color: var(--tsl-teal) !important;
}
/* Secondary auf dunklem/tealfarbenem Untergrund (Hero + CTA): Glas-Outline + weißer Text */
.tory-seo-hero-actions a.tory-seo-btn-secondary,
.tory-seo-hero-actions a.tory-seo-btn-outline,
.tory-seo-cta-actions a.tory-seo-btn-secondary,
.tory-seo-cta-actions a.tory-seo-btn-outline {
	background: rgba(255,255,255,0.08) !important;
	color: #fff !important;
	border: 1.5px solid rgba(255,255,255,0.55) !important;
}
.tory-seo-hero-actions a.tory-seo-btn-secondary:hover,
.tory-seo-hero-actions a.tory-seo-btn-outline:hover,
.tory-seo-cta-actions a.tory-seo-btn-secondary:hover,
.tory-seo-cta-actions a.tory-seo-btn-outline:hover {
	background: rgba(255,255,255,0.18) !important;
	border-color: #fff !important;
}

/* Hero-Image — Rounded Card */
.tory-seo-hero-image {
	position: relative;
	border-radius: 24px !important;
	overflow: hidden;
	box-shadow: 0 20px 60px rgba(0,115,125,0.20) !important;
	background: #fff;
}
.tory-seo-hero-image img {
	width: 100%; height: 100%; display: block;
	object-fit: cover;
	border-radius: 0 !important;
}
.tory-seo-hero-image-placeholder {
	background: linear-gradient(135deg, var(--tsl-teal) 0%, var(--tsl-teal-2) 100%) !important;
	border-radius: 24px !important;
	aspect-ratio: 4/3;
	display: flex; align-items: center; justify-content: center;
}

/* ── 4. Trust-Bar ─────────────────────────────────────────────────────── */
.tory-seo-trust-bar {
	display: flex !important; flex-wrap: wrap; gap: 8px 12px !important;
	margin-top: 30px !important;
	padding: 0 !important;
	background: transparent !important;
	border: 0 !important;
}
.tory-seo-trust-item {
	display: inline-flex !important; align-items: center; gap: 6px !important;
	padding: 6px 14px !important;
	background: rgba(255,255,255,0.85) !important;
	border: 1px solid rgba(0,115,125,0.15) !important;
	border-radius: 999px !important;
	font-size: 13px !important;
	color: var(--tsl-ink) !important;
	font-weight: 500 !important;
}
.tory-seo-trust-item::before {
	content: "✓";
	color: var(--tsl-teal);
	font-weight: 700;
}

/* ── 5. Sections ──────────────────────────────────────────────────────── */
.tory-seo-section {
	padding: 80px 0 !important;
}
.tory-seo-section + .tory-seo-section {
	padding-top: 80px !important;
	margin-top: 0 !important;
	border-top: 0 !important;
}
.tory-seo-section h2,
.tory-seo-landing h2 {
	font-family: var(--tsl-font-display) !important;
	font-size: clamp(28px, 3vw, 40px) !important;
	font-weight: 700 !important;
	letter-spacing: -0.015em !important;
	line-height: 1.2 !important;
	color: var(--tsl-ink) !important;
	margin: 0 0 40px !important;
}

/* ── 6. Cards ─────────────────────────────────────────────────────────── */
.tory-seo-grid {
	display: grid !important;
	gap: 20px !important;
}
.tory-seo-grid-4 { grid-template-columns: repeat(4, 1fr) !important; }
.tory-seo-grid-3 { grid-template-columns: repeat(3, 1fr) !important; }
.tory-seo-grid-2 { grid-template-columns: repeat(2, 1fr) !important; }
@media (max-width: 1000px) {
	.tory-seo-grid-4, .tory-seo-grid-3 { grid-template-columns: repeat(2, 1fr) !important; }
}
@media (max-width: 620px) {
	.tory-seo-grid-4, .tory-seo-grid-3, .tory-seo-grid-2 { grid-template-columns: 1fr !important; }
}

.tory-seo-card {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	padding: 28px !important;
	box-shadow: var(--tsl-card-shadow) !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease !important;
	display: flex; flex-direction: column; gap: 14px;
	position: relative;
	overflow: hidden;
}
.tory-seo-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--tsl-card-shadow-hover) !important;
	border-color: var(--tsl-teal) !important;
}
.tory-seo-card h3 {
	font-family: var(--tsl-font-display) !important;
	font-size: 18px !important; font-weight: 600 !important;
	color: var(--tsl-ink) !important;
	margin: 0 !important; line-height: 1.35;
}
.tory-seo-card p {
	font-size: 14px !important;
	line-height: 1.6 !important;
	color: var(--tsl-slate) !important;
	margin: 0 !important;
}

/* ── 7. Card-Icons — teal Container ───────────────────────────────────── */
.tory-seo-card-icon {
	width: 48px !important; height: 48px !important;
	border-radius: 12px !important;
	background: linear-gradient(135deg, rgba(0,185,188,0.15) 0%, rgba(0,115,125,0.10) 100%) !important;
	color: var(--tsl-teal) !important;
	display: flex; align-items: center; justify-content: center;
	margin-bottom: 4px !important;
	border: 0 !important;
}
.tory-seo-card-icon svg {
	width: 24px; height: 24px;
}

/* ── 8. Product-Slider — Rounded + subtile Struktur ───────────────────── */
.tory-seo-products-slider {
	background: transparent !important;
}
.tory-seo-product-card {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	box-shadow: var(--tsl-card-shadow) !important;
	overflow: hidden;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.tory-seo-product-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--tsl-card-shadow-hover) !important;
	border-color: var(--tsl-teal) !important;
}
.tory-seo-product-card__badge,
.tory-seo-product-badge {
	background: var(--tsl-teal) !important;
	color: #fff !important;
	border-radius: 999px !important;
	padding: 4px 12px !important;
	font-size: 11px !important; font-weight: 700 !important;
	letter-spacing: 1px !important; text-transform: uppercase !important;
}

/* ── 9. Advantages / Components — grüne Icon-Cards ────────────────────── */
.tory-seo-advantages .tory-seo-card,
.tory-seo-components .tory-seo-card {
	text-align: left;
}

/* ── 10. Reviews ──────────────────────────────────────────────────────── */
.tory-seo-reviews {
	background: #fff !important;
}
.tory-seo-rating-widget {
	display: inline-flex !important;
	align-items: center; gap: 12px;
	background: #fff;
	padding: 16px 24px !important;
	border-radius: 18px !important;
	border: 1px solid var(--tsl-line) !important;
	box-shadow: var(--tsl-card-shadow);
	margin-bottom: 40px !important;
}
.tory-seo-stars { font-size: 22px !important; letter-spacing: 2px; color: #f59e0b; }
.tory-seo-rating-text { font-size: 14px !important; color: var(--tsl-slate); }
.tory-seo-rating-text strong { color: var(--tsl-ink); font-size: 16px; font-weight: 700; }
.tory-seo-review {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	padding: 24px !important;
	box-shadow: var(--tsl-card-shadow);
}

/* ── 11. FAQ — Übernahme aus Partner-Landing (.tsp-faq-Style) ─────────── */
.tory-seo-faq {
	background: #fff !important;
}
.tory-seo-faq-list {
	max-width: 900px !important;
	margin: 0 auto !important;
	display: block !important;
}
.tory-seo-faq-item {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 16px !important;
	padding: 16px 24px !important;
	margin-bottom: 14px !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease !important;
	box-shadow: none !important;
	list-style: none !important;
}
.tory-seo-faq-item:hover,
.tory-seo-faq-item.active,
.tory-seo-faq-item[open],
.tory-seo-faq-item.is-open {
	border-color: rgba(0,185,188,0.30) !important;
	box-shadow: var(--tsl-card-shadow) !important;
}
.tory-seo-faq-question {
	padding: 0 40px 0 0 !important;
	font-family: var(--tsl-font-display) !important;
	font-weight: 600 !important;
	font-size: 17px !important;
	color: var(--tsl-ink) !important;
	cursor: pointer;
	background: none !important;
	border: 0 !important;
	position: relative !important;
	line-height: 1.4 !important;
	list-style: none !important;
	display: block !important;
	width: 100% !important;
	text-align: left !important;
}
.tory-seo-faq-question::-webkit-details-marker,
.tory-seo-faq-question::marker { display: none !important; content: none !important; }
.tory-seo-faq-question::after {
	content: "+" !important;
	position: absolute !important;
	right: 0 !important; top: -2px !important;
	font-size: 28px !important; font-weight: 300 !important;
	color: var(--tsl-teal) !important;
	transition: transform 0.2s ease, color 0.2s ease !important;
	line-height: 1 !important;
}
.tory-seo-faq-item.active .tory-seo-faq-question::after,
.tory-seo-faq-item[open] .tory-seo-faq-question::after,
.tory-seo-faq-item.is-open .tory-seo-faq-question::after {
	content: "−" !important;
	color: var(--tsl-teal-2) !important;
}
.tory-seo-faq-item.active .tory-seo-faq-question,
.tory-seo-faq-item[open] .tory-seo-faq-question,
.tory-seo-faq-item.is-open .tory-seo-faq-question {
	margin-bottom: 16px !important;
}
.tory-seo-faq-answer {
	padding: 0 !important;
	color: var(--tsl-slate) !important;
	font-size: 16px !important;
	line-height: 1.75 !important;
	border: 0 !important;
	background: none !important;
}
.tory-seo-faq-answer p {
	margin: 0 !important;
	color: var(--tsl-slate) !important;
	font-size: 16px !important;
	line-height: 1.75 !important;
}

/* ── 12. Cloud-Connect / Featured-Section ─────────────────────────────── */
.tory-seo-cloud-connect {
	background: linear-gradient(135deg, var(--tsl-teal) 0%, #075e66 100%) !important;
	border-radius: 24px !important;
	color: #fff;
	padding: 60px !important;
	margin: 0 !important;
}
.tory-seo-cloud-connect h2 {
	color: #fff !important;
	margin-bottom: 20px !important;
}
.tory-seo-cloud-connect,
.tory-seo-cloud-connect p,
.tory-seo-cloud-connect .tory-seo-cloud-connect-inner p,
.tory-seo-cloud-connect .tory-seo-section-sub {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
}
.tory-seo-cloud-connect p { color: rgba(255,255,255,0.92) !important; }
.tory-seo-cloud-connect .tory-seo-card {
	background: rgba(255,255,255,0.1) !important;
	border: 1px solid rgba(255,255,255,0.2) !important;
	color: #fff;
	backdrop-filter: blur(6px);
}
.tory-seo-cloud-connect .tory-seo-card h3 { color: #fff !important; }
.tory-seo-cloud-connect .tory-seo-card p { color: rgba(255,255,255,0.85) !important; }
.tory-seo-cloud-connect .tory-seo-card-icon {
	background: rgba(255,255,255,0.15) !important;
	color: #fff !important;
}

/* ── 13. CTA-Section ──────────────────────────────────────────────────── */
.tory-seo-cta {
	background: linear-gradient(135deg, var(--tsl-ink) 0%, #203556 100%) !important;
	color: #fff;
	padding: 80px 0 !important;
}
.tory-seo-cta h2 { color: #fff !important; margin-bottom: 16px !important; }
.tory-seo-cta-inner {
	max-width: 720px; margin: 0 auto; text-align: center;
}
.tory-seo-cta-inner p {
	color: rgba(255,255,255,0.88) !important;
	-webkit-text-fill-color: rgba(255,255,255,0.88) !important;
	font-size: 17px; line-height: 1.6;
	margin: 0 auto 32px;
}
/* CTA-Absatz (und evtl. weiterer Text) bleibt auf dunklem Grund hell —
   die generische p-Slate-Regel hat sonst via :not() höhere Spezifität. */
.tory-seo-cta p,
.tory-seo-cta .tory-seo-cta-divider {
	color: rgba(255,255,255,0.88) !important;
	-webkit-text-fill-color: rgba(255,255,255,0.88) !important;
}
.tory-seo-cta-actions {
	display: flex; flex-wrap: wrap; gap: 12px;
	justify-content: center;
}

/* ── 14. Related Pages — Bento-Karten ─────────────────────────────────── */
.tory-seo-related {
	background: #fff !important;
}
.tory-seo-related-card {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	padding: 24px !important;
	transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
	text-decoration: none !important;
	display: block;
}
.tory-seo-related-card:hover {
	transform: translateY(-3px);
	box-shadow: var(--tsl-card-shadow-hover);
	border-color: var(--tsl-teal) !important;
}
.tory-seo-related-card__label,
.tory-seo-related-card__cat {
	color: var(--tsl-teal) !important;
	font-size: 11px !important;
	font-weight: 700 !important;
	letter-spacing: 1.2px !important;
	text-transform: uppercase !important;
	margin-bottom: 8px;
	display: block;
}
.tory-seo-related-card__title,
.tory-seo-related-card h3 {
	font-family: var(--tsl-font-display) !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	color: var(--tsl-ink) !important;
	margin: 0 !important;
	line-height: 1.35;
}

/* ── 15. Manufacturer / Third-Party Chips ─────────────────────────────── */
.tory-seo-manufacturer-list {
	display: flex !important; flex-wrap: wrap; gap: 8px !important;
	margin-top: 20px;
}
.tory-seo-manufacturer-item,
.tory-seo-manufacturer-chip {
	display: inline-flex;
	padding: 8px 16px !important;
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 999px !important;
	font-size: 13px !important;
	color: var(--tsl-ink) !important;
	font-weight: 500 !important;
	transition: all 0.15s ease;
}
.tory-seo-manufacturer-item:hover {
	border-color: var(--tsl-teal) !important;
	color: var(--tsl-teal) !important;
}

/* ── 16. Substances / Fact-Chips ──────────────────────────────────────── */
.tory-seo-substance-chip,
.tory-seo-substance-item,
.tory-seo-chip {
	display: inline-flex;
	padding: 8px 14px !important;
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 12px !important;
	font-size: 13px !important;
	color: var(--tsl-ink) !important;
	font-weight: 500 !important;
	gap: 6px;
	text-decoration: none !important;
}
.tory-seo-substance-chip:hover,
.tory-seo-substance-item:hover,
.tory-seo-chip:hover { text-decoration: none !important; }
/* Substanzen sind teilweise <a>-Tags → Underline unterdrücken */
.tory-seo-substances a,
.tory-seo-substances-list a,
.tory-seo-substance-list a { text-decoration: none !important; }
.tory-seo-substances a:hover,
.tory-seo-substances-list a:hover,
.tory-seo-substance-list a:hover { text-decoration: none !important; }

/* ── 17. Section-Kicker (falls vorhanden) ─────────────────────────────── */
.tory-seo-section-kicker,
.tory-seo-kicker {
	display: inline-block;
	background: rgba(0,185,188,0.12) !important;
	color: var(--tsl-teal) !important;
	padding: 6px 14px !important;
	border-radius: 999px !important;
	font-size: 11px !important; font-weight: 700 !important;
	letter-spacing: 1.4px !important; text-transform: uppercase !important;
	margin-bottom: 20px !important;
}

/* ── 18. About-Section (langer Fließtext am Ende) ─────────────────────── */
.tory-seo-section p,
.tory-seo-landing p:not(.tory-seo-hero-sub) {
	font-size: 15px;
	line-height: 1.7;
	color: var(--tsl-slate);
}
.tory-seo-section .tory-seo-prose a,
.tory-seo-about .tory-seo-prose a {
	color: var(--tsl-teal);
	text-decoration: underline;
	text-underline-offset: 3px;
}
/* Karten-Links (Related Pages, Substanzen, Hersteller) niemals unterstreichen */
.tory-seo-related-page-card,
.tory-seo-related-link,
.tory-seo-related-page-title,
.tory-seo-related-title,
.tory-seo-substance-chip,
.tory-seo-substance-item,
.tory-seo-manufacturer-item,
.tory-seo-manufacturer-chip {
	text-decoration: none !important;
}
.tory-seo-related-page-card:hover .tory-seo-related-page-title,
.tory-seo-related-link:hover .tory-seo-related-title {
	color: var(--tsl-teal) !important;
}

/* ── 19. Body-Class Reset — keine Doppel-Padding, wenn Theme was setzt ── */
body.tory-seo-landing-page .site-main,
body.tory-seo-campaign-page .site-main {
	padding: 0 !important;
	margin: 0 !important;
}
body.tory-seo-landing-page .content-area,
body.tory-seo-campaign-page .content-area {
	padding: 0 !important; margin: 0 !important;
}

/* ── 20. Chat-Callout („Chatten Sie mit Tory") — Card-Optik + Rand ────── */
.tory-seo-section.tory-seo-tory-chat {
	padding: 80px 40px !important;
	margin-top: 24px !important;
	border-radius: 24px !important;
	background: linear-gradient(160deg, #203556 0%, #075e66 60%, #00737d 100%) !important;
}
@media (max-width: 640px) {
	.tory-seo-section.tory-seo-tory-chat { padding: 56px 20px !important; }
}
/* „Chatten Sie mit Tory" — keine weiße Karte auf grau. Einheitlich teal,
   Inhalt liegt direkt auf dem Farbverlauf (passt zur Tory-Chatbot-Marke). */
.tory-seo-tory-chat .tory-seo-container > *,
.tory-seo-tory-chat-inner,
.tory-seo-tory-chat-card {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
}
.tory-seo-tory-chat h2,
.tory-seo-tory-chat h3 {
	color: #fff !important;
	-webkit-text-fill-color: #fff !important;
	margin-bottom: 16px !important;
}
.tory-seo-tory-chat p,
.tory-seo-tory-chat .tory-seo-section-sub {
	color: rgba(255,255,255,0.9) !important;
}
@media (max-width: 640px) {
	.tory-seo-tory-chat .tory-seo-container > *,
	.tory-seo-tory-chat-inner,
	.tory-seo-tory-chat-card { padding: 0 !important; }
}

/* ── 21. Über Fresenius Umwelttechnik — Card-Optik ────────────────────── */
.tory-seo-about,
.tory-seo-section.tory-seo-about {
	padding: 80px 0 !important;
	background: #fff !important;
}
/* „Über Fresenius" bewusst KEINE eigene Box — reiner Fließtext auf weißer Seite. */
.tory-seo-about .tory-seo-container > *:not(h2),
.tory-seo-about-inner,
.tory-seo-about-card,
.tory-seo-about .tory-seo-prose {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
	color: #203556 !important;
}
.tory-seo-about h2 {
	margin-bottom: 24px !important;
}
@media (max-width: 640px) {
	.tory-seo-about .tory-seo-container > *:not(h2),
	.tory-seo-about-inner,
	.tory-seo-about-card,
	.tory-seo-about .tory-seo-prose { padding: 0 !important; }
}

/* ── 22. Nachbesserungen: Kontrast + Box-Hygiene ──────────────────────── */
/* Process-Diagram: „komischer" grauer Block (#f7f8fa) → saubere weiße Card.
   Behält Border + großzügigen Innenabstand, nur die Farbe wird neutralisiert. */
.tory-seo-process-diagram {
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	padding: 28px !important;
}

/* Carousel-/Produkt-Karten: garantierter Innenabstand, damit Text nie am
   Kartenrand klebt („Boxen links/rechts ohne Abstand"). */
.tory-seo-carousel-card,
.tory-seo-carousel .tory-seo-card,
.tory-seo-products-slider .tory-seo-product-card,
.tory-seo-products-slider .tory-seo-card {
	padding: 22px !important;
}

/* Kontrast aufgehoben (<4,5 → ≥6): muted Blue-Gray #6b7a99 (4,3:1) → #535e6e. */
.tory-seo-breadcrumb,
.tory-seo-breadcrumb a,
.tory-seo-breadcrumb li,
.tory-seo-testimonial-company {
	color: #535e6e !important;
}
.tory-seo-breadcrumb a:hover { color: var(--tsl-teal) !important; }

/* Hero-Notice bleibt bewusst helle Card mit dunklem Text — max. Kontrast
   auf dem neuen teal-Farbverlauf. */
.tory-seo-hero-notice { color: var(--tsl-ink) !important; }

/* ── 23. About-Bento (2. Spalte) + Reviews-Zweispalter ────────────────── */
/* About: Fließtext links, Bento-Card rechts (Logo, Made in Germany, Social, Kontakt). */
.tory-seo-about-grid {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 56px;
	align-items: start;
	max-width: 1200px;
	margin: 0 auto;
}
.tory-seo-about-bento {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding: 28px;
	background: #fff !important;
	border: 1px solid var(--tsl-line) !important;
	border-radius: 18px !important;
	box-shadow: var(--tsl-card-shadow) !important;
}
.tory-seo-about-logo-link { display: block; line-height: 0; }
.tory-seo-about-logo { width: 180px; max-width: 100%; height: auto; }
.tory-seo-about-made {
	display: inline-flex; align-items: center; gap: 10px;
	font-size: 12px; font-weight: 700; letter-spacing: 1.2px;
	color: var(--tsl-ink);
}
.tory-seo-about-made svg { width: 22px; height: 16px; border-radius: 3px; display: block; }
.tory-seo-about-social { display: flex; gap: 10px; flex-wrap: wrap; }
.tory-seo-about-social-link {
	display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px;
	border-radius: 10px;
	background: rgba(0,115,125,0.08);
	color: var(--tsl-teal);
	transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}
.tory-seo-about-social-link:hover { background: var(--tsl-teal); color: #fff; transform: translateY(-2px); }
.tory-seo-about-social-link svg { width: 18px; height: 18px; }
.tory-seo-about-contact { justify-content: center !important; margin-top: 4px; }
/* Kontaktdaten (Telefon + E-Mail) im Bento */
.tory-seo-about-contact-data {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 12px;
}
.tory-seo-about-contact-data a {
	display: inline-flex; align-items: center; gap: 10px;
	color: var(--tsl-ink); font-size: 14px; font-weight: 500;
	text-decoration: none; line-height: 1.3;
}
.tory-seo-about-contact-data a:hover { color: var(--tsl-teal); }
.tory-seo-about-contact-data .tory-seo-icon { width: 18px; height: 18px; color: var(--tsl-teal); flex-shrink: 0; }

/* Keyword-Intro: Body-Text links, Bento rechts (gleiche Spalten wie About). */
.tory-seo-intro-grid {
	display: grid;
	grid-template-columns: 1fr 320px;
	gap: 56px;
	align-items: start;
	max-width: 1200px;
	margin: 0 auto;
}

/* Reviews: zweite Bewertung in zweiter Spalte daneben. */
.tory-seo-testimonial-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 24px;
}

/* Mobile: Bento-Spalte und zweite Bewertung ausblenden (wie gewünscht). */
@media (max-width: 900px) {
	.tory-seo-about-grid { grid-template-columns: 1fr; gap: 32px; }
	.tory-seo-intro-grid { grid-template-columns: 1fr; }
	.tory-seo-about-bento { display: none !important; }
	.tory-seo-testimonial-grid { grid-template-columns: 1fr; }
	.tory-seo-testimonial--extra { display: none !important; }
}