/* schluessel-abgebrochen — page layout only (tokens from theme.css; no colours, no new shadows/radii). */

/* Hero: the two answers of the situation card become side-by-side state tiles (icon above the label). */
.situation--tiles .situation__answers { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.situation--tiles .situation__answers li { flex-direction: column; gap: 6px; padding: 16px; }
.situation--tiles .situation__answers li > .i { width: 28px; height: 28px; margin-bottom: 4px; }

/* Phones/tablets: the call button sits straight under the H1 (the lead carries no link → focus order unchanged). */
@media (max-width: 61.99em) {
	.hero--emergency .hero__body > .hero__cta { order: 1; margin-top: var(--sp-5); }
	.hero--emergency .hero__body > .hero__title ~ :not(.hero__cta) { order: 2; }
}
@media (max-width: 25em) {
	.situation--tiles .situation__answers { gap: 8px; }
	.situation--tiles .situation__answers li { padding: 12px; }
}

/* Contrast: the call button closes the "door shut" side. */
.contrast__cta { margin-top: auto; padding-top: var(--sp-2); }

/* Contrast: the calm side ends on an inline call link at the same height as the button opposite. */
.contrast__side--a .contrast__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 0 10px; }

/* Never wall: five ban cards + the one "keep" card (info notice) close the 3×2 grid. */
#finger-weg .promises { align-items: stretch; }
.keep-card { align-content: start; }
.keep-card .notice__title { font-size: var(--fs-lg); }

/* Steps: the long texts read left-aligned; coin, title and text start at the card's left edge,
   the dashed connector runs from coin to coin. */
#was-der-fachbetrieb-macht .step { align-items: flex-start; text-align: left; }
@media (min-width: 56.25em) {
	#was-der-fachbetrieb-macht .step:not(:last-child)::after { left: 90px; width: calc(100% + var(--gap) - 78px); }
}

/* 112 / 110 notice: the two cases side by side, each with its own pill at the bottom. */
.notice__cols { display: grid; gap: var(--sp-5); margin-top: var(--sp-4); }
.notice__col { display: flex; flex-direction: column; gap: var(--sp-3); }
.notice__col > * { margin: 0; }
.notice__col .notice__nums { margin-top: auto; padding-top: var(--sp-2); }
@media (min-width: 48em) { .notice__cols { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: var(--sp-6); } }

/* Consultation: the notes under the facts keep the body size. */
.phone-block__note { font-size: var(--fs-base); }
.phone-block--list .phone-block__note { padding-top: var(--sp-3); }
#kostenlose-beratung .phone-block--list { justify-content: center; }
#kostenlose-beratung .phone-block--list .phone-block__facts li { font-size: var(--fs-md); }
