/* Leistungen — page layout only (tokens from theme.css; no colours, no new sizes). */

/* Hero: the "Unsicher?" sentence sits on its own line and hands over to the call button. */
.lst-hero__cta { row-gap: var(--sp-3); }
.lst-hero__ask { flex-basis: 100%; max-width: 56ch; }
/* Phones: slightly tighter rhythm so the call button sits completely inside a 390 × 664 first screen. */
@media (max-width: 37.49em) {
	.lst-hero .hero__lead { margin-top: var(--sp-4); }
	.lst-hero .hero__cta { margin-top: var(--sp-5); }
	.lst-hero__cta { row-gap: var(--sp-2); }
}

/* One continuous dark stage: the card row floats between the hero photo and the dark gallery. */
.lst-cardrow { background: linear-gradient(to bottom, transparent var(--overlap), var(--ink-900) var(--overlap)); }
/* Tablets: five cards never leave one orphan beside a hole — 2 + 2 + 1 (full) below 48em, 3 + 2 up to the 5-across row. */
@media (min-width: 37.5em) and (max-width: 47.99em) {
	.lst-cardrow .cardrow__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.lst-cardrow .cardrow__item:last-child { grid-column: 1 / -1; }
}
@media (min-width: 48em) and (max-width: 68.74em) {
	.lst-cardrow .cardrow__grid { grid-template-columns: repeat(6, minmax(0, 1fr)); }
	.lst-cardrow .cardrow__item { grid-column: span 2; }
	.lst-cardrow .cardrow__item:nth-child(n + 4) { grid-column: span 3; }
}
.lst-services { padding-top: calc(var(--section-y) * .55); }

/* Gallery: five large cards — the first one wide, then 2 × 2. Jump targets clear the sticky header. */
.lst-card { scroll-margin-top: calc(var(--admin-bar) + var(--header-h-s) + var(--sp-5)); }
@media (min-width: 40em) and (max-width: 56.24em) {
	.lst-gallery .pcard--wide .pcard__media { --ratio: 16 / 9; }
}
@media (min-width: 56.25em) {
	.lst-gallery .pcard--wide .pcard__media { min-height: 380px; }
}

/* Problem router: head sticks beside the list on desktop; the whole row is the click target. */
@media (min-width: 56.25em) {
	.lst-router__split { grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); align-items: start; }
	.lst-router__head { position: sticky; top: calc(var(--admin-bar) + var(--header-h-s) + var(--sp-6)); }
}
.lst-router__head .section-head { margin-bottom: 0; }
.lst-router__list > li { position: relative; }
.lst-router__list a::after { content: ""; position: absolute; inset: 0; }
.lst-router__list a .i { width: 18px; height: 18px; margin-left: var(--sp-2); vertical-align: -2px; }

/* Contrast: the call action sits at the foot of each side. */
.lst-contrast__cta { margin-top: auto; padding-top: var(--sp-2); }
/* Stacked (tablet/phone): the yellow „oder“ coin overlaps the seam — keep it clear of the akut side's yellow call button. */
@media (max-width: 56.24em) {
	.lst-contrast .contrast__side--b { padding-bottom: var(--sp-9); }
	.lst-contrast .contrast__side--a { padding-top: var(--sp-8); }
}

/* USP: statement on top, the four points 2 × 2 (readable line length), point titles in the item-title size. */
.lst-usp .usp__point h3 { font-size: var(--fs-md); }
@media (min-width: 48em) {
	.lst-usp .usp__points { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--sp-6); }
}
