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

/* 01 · Hero: markup order H1 → 110 line → call card → lead → checks on every width (police first, number on the
   first screen at 390×664 and 1440×900). The theme lifts the call card above the 110 line on phones — keep the
   110 line first. Desktop: wider text column (fewer lines → a less extreme portrait crop of the bleeding photo),
   crop centred on the damaged cylinder, knob and frame instead of plain door paint. */
#hero .hero__body > .hero__safety { margin-top: var(--sp-5); }
#hero .hero__body > .callcard { margin-top: var(--sp-4); }
#hero .hero__body > .hero__lead { margin-top: var(--sp-6); }
/* 110 line and call card share one edge */
#hero .hero__body > .hero__safety, #hero .hero__body > .callcard { align-self: stretch; max-width: 38.5rem; }
@media (max-width: 61.99em) {
	#hero .hero__body > .hero__safety { order: 1; }
}
@media (min-width: 56.25em) {
	#hero.hero--bleed .hero__inner { grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); }
	#hero.hero--bleed .hero__figure img { object-position: 74% 50%; }
}

/* 03 · Reihenfolge: two phases (you first, then us) */
.ebd-phases { display: grid; gap: var(--sp-4); }
.ebd-phases > * { margin: 0; }
.ebd-phase { font-size: var(--fs-sm); }
.ebd-steps + .ebd-phase { margin-top: var(--sp-6); }
@media (min-width: 56.25em) {
	.ebd-steps .step:nth-child(3n)::after { display: none; }
}
/* „Dann: wir“ — our three steps carry the yellow coin (the site’s phone/brand colour, same token pair as the
   coins on dark bands), so „you first, then us“ reads at a glance */
.ebd-steps--ours .step__n { background: var(--yellow); color: var(--ink); border-color: var(--yellow); }

/* 04 · Notverschluss: caveat notice inside the split body */
.ebd-note { margin-top: var(--sp-6); }

/* 05 · Schadensbilder: head text left, small example photo right */
.ebd-damage-head { display: grid; gap: var(--sp-6); margin-bottom: clamp(2rem, 1.4rem + 2.4vw, 3.5rem); }
.ebd-damage-head .section-head { margin-bottom: 0; }
.ebd-damage-head__media { max-width: 440px; }
@media (min-width: 56.25em) {
	.ebd-damage-head { grid-template-columns: minmax(0, 1.25fr) minmax(0, .75fr); align-items: center; column-gap: clamp(32px, 5vw, 80px); }
	.ebd-damage-head__media { justify-self: end; width: 100%; }
}
.ebd-damage-more { margin-top: var(--sp-7); color: var(--c-muted); }
/* phones: badge beside the title so the six damage cards stay compact */
@media (max-width: 37.49em) {
	.ebd-damage-cards .card { display: grid; grid-template-columns: auto minmax(0, 1fr); column-gap: var(--sp-4); align-items: center; }
	.ebd-damage-cards .card .badge { margin-bottom: 0; }
	.ebd-damage-cards .card > p { grid-column: 1 / -1; }
}

/* 06 · Belege: the fifth item spans both columns; the guide link as a quiet closing line */
@media (min-width: 48em) {
	.ebd-belege > li:last-child:nth-child(odd) { grid-column: 1 / -1; }
}
.ebd-belege-more { display: flex; align-items: flex-start; gap: var(--sp-3); margin-top: var(--sp-7); }
.ebd-belege-more .badge { flex: none; margin-top: -6px; }
@media (min-width: 48em) { .ebd-belege-more { align-items: center; } .ebd-belege-more .badge { margin-top: 0; } }

/* 08 · Kostenlose Beratung: text left, the one phone card right */
.ebd-consult { display: grid; gap: var(--sp-7); }
.ebd-consult__text > * { margin: 0; }
.ebd-consult__text > * + * { margin-top: var(--sp-4); }
.ebd-consult__text .section-head { margin-bottom: var(--sp-5); }
@media (min-width: 56.25em) {
	.ebd-consult { grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); align-items: center; column-gap: clamp(32px, 5vw, 80px); }
}
.ebd-consult .phone-block__facts li { align-items: flex-start; }
.ebd-consult .phone-block__facts li .i { flex: none; margin-top: 3px; }