/* DS Bad-Themen, 16.09.2026: Kachelleiste "Weitere Bad-Themen" ueber der Seiten-FAQ auf allen Bad-Seiten.
   Kanten wie FAQ und Bewertungs-Slider (40 bis 1400 px bei 1440, 20 bis 370 px bei 390). Typografie wie der
   USP-Block ds-wid: Kicker 12 px Versalien Mint, H2 Montserrat 600 34 px, Text Raleway.
   Unten kein Abstand, die FAQ bringt 96 px eigenen oberen Innenabstand mit. */
.ds-bt { background: #ffffff; clear: both; }
.ds-bt__box { max-width: 1440px; margin: 0 auto; padding: 96px 40px 0; box-sizing: border-box; }
.ds-bt .ds-bt__kick { margin: 0 0 8px; font: 600 12px/1.7 Raleway, sans-serif; letter-spacing: 1.7px; text-transform: uppercase; color: #2b7264; }
.ds-bt .ds-bt__h { margin: 0 0 32px; padding: 0; font: 600 34px/1.18 Montserrat, sans-serif; letter-spacing: -.4px; text-transform: none; color: #14201d; }
.ds-bt__raster { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px 24px; }
.ds-bt .ds-bt__karte { display: block; color: #14201d; text-decoration: none; box-shadow: none; border: 0; }
.ds-bt .ds-bt__bild { display: block; overflow: hidden; background: #e9eeec; aspect-ratio: 3 / 2; }
.ds-bt .ds-bt__bild img { display: block; width: 100%; height: 100%; max-width: 100%; object-fit: cover; margin: 0; border-radius: 0; transition: transform .5s ease; }
.ds-bt .ds-bt__karte:hover img, .ds-bt .ds-bt__karte:focus-visible img { transform: scale(1.03); }
.ds-bt .ds-bt__karte:focus-visible { outline: 3px solid #2b7264; outline-offset: 3px; }
.ds-bt .ds-bt__titel { display: block; margin: 14px 0 4px; font: 600 17px/1.35 Raleway, sans-serif; color: #14201d; }
.ds-bt .ds-bt__karte:hover .ds-bt__titel { color: #2b7264; }
.ds-bt .ds-bt__text { display: block; font: 400 15px/1.55 Raleway, sans-serif; color: #4b5552; }
@media screen and (max-width: 1000px) {
	.ds-bt__box { padding: 72px 20px 0; }
	.ds-bt__raster { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 20px; }
}
@media screen and (max-width: 700px) {
	.ds-bt__box { padding-top: 56px; }
	.ds-bt .ds-bt__h { font-size: 26px; margin-bottom: 22px; }
}
@media screen and (max-width: 480px) {
	.ds-bt__raster { grid-template-columns: 1fr; gap: 22px; }
}
@media (prefers-reduced-motion: reduce) {
	.ds-bt .ds-bt__bild img { transition: none; }
}