/*
 * fx13_cta_band — Anruf-Band in Petrol. Spec §4.10, Entwurf Z. 248–258 / 441–450.
 * Groessen und Familien kommen aus css/project.css ueber die Utility-Klassen
 * .fx-topline / .fx-topline--ice / .fx-h2-band / .fx-lead / .fx-lead--hell / .fx-tel.
 * Der Seitenrand kommt ueber .fx-band, Container und Ausrichtung ueber die
 * Wrapper-Klassen auf .fx13_container.
 */

section.fx13_cta_band { position: relative; overflow: hidden; background: var(--fx-navy); }

/* Fensterkreuz: zwei sehr schwache Lichtlinien, rein dekorativ. */
section.fx13_cta_band .fx13_linien { position: absolute; inset: 0; pointer-events: none; }
section.fx13_cta_band .fx13_linie--v { position: absolute; left: 58%; inset-block: 0; width: 4px; background: var(--fx-glare-08); }
section.fx13_cta_band .fx13_linie--h { position: absolute; inset-inline: 0; top: 50%; height: 4px; background: var(--fx-glare-08); }

section.fx13_cta_band .fx13_container { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 48px; }
section.fx13_cta_band .fx13_topline { margin: 0 0 18px; }
section.fx13_cta_band .fx13_titel { color: var(--fx-white); }
section.fx13_cta_band .fx13_lead { margin: 16px 0 0; }

section.fx13_cta_band .fx13_tel { display: flex; align-items: center; gap: 16px; background: var(--fx-white); padding: 26px 40px; flex: none; text-decoration: none; transition: background-color .18s ease; }
section.fx13_cta_band .fx13_tel:hover, section.fx13_cta_band .fx13_tel:focus-visible { background: var(--fx-tint); }
section.fx13_cta_band .fx13_tel .fx-icon { width: 26px; height: 26px; stroke: var(--fx-azure); stroke-width: 2.3; }
section.fx13_cta_band .fx13_nummer { color: var(--fx-navy); }

/* Frueher als 767: der grosse Knopf kollidiert sonst mit dem 42px-Titel. */
@media (max-width: 991px) {
	section.fx13_cta_band .fx13_linie--v { left: 56%; width: 3px; }
	section.fx13_cta_band .fx13_linie--h { top: 52%; height: 3px; }
	section.fx13_cta_band .fx13_container { flex-direction: column; align-items: stretch; gap: 0; }
	section.fx13_cta_band .fx13_topline { margin: 0 0 14px; }
	section.fx13_cta_band .fx13_lead { margin: 14px 0 22px; }
	section.fx13_cta_band .fx13_tel { width: 100%; justify-content: center; gap: 14px; padding: 22px 24px; min-height: 44px; }
	section.fx13_cta_band .fx13_tel .fx-icon { width: 24px; height: 24px; }
}

@media (max-width: 359px) {
	section.fx13_cta_band .fx13_tel { flex-wrap: wrap; gap: 10px; padding: 20px 14px; }
}
