/* Hero subline + CTA buttons for practice landing pages */

#pagetitle .page-title-holder .hero-subline {
	max-width: 640px;
	margin: 12px 0 24px;
	font-size: 1.05rem;
	line-height: 1.5;
	color: #ffffff;
}

#pagetitle .page-title-holder .hero-subline p {
	margin: 0 0 .6em;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
}
#pagetitle .page-title-holder .hero-subline p:last-child { margin-bottom: 0; }

#pagetitle .page-title-holder .hero-subline strong,
#pagetitle .page-title-holder .hero-subline b { font-weight: 700; }
#pagetitle .page-title-holder .hero-subline em,
#pagetitle .page-title-holder .hero-subline i { font-style: italic; }
#pagetitle .page-title-holder .hero-subline u { text-decoration: underline; }
#pagetitle .page-title-holder .hero-subline a {
	color: inherit;
	text-decoration: underline;
}

#pagetitle .page-title-holder .hero-subline ul,
#pagetitle .page-title-holder .hero-subline ol {
	margin: 0 0 .6em;
	padding-left: 0;
	list-style: none;
}
#pagetitle .page-title-holder .hero-subline ol { counter-reset: hero-li; }
#pagetitle .page-title-holder .hero-subline li {
	margin: 0 0 .35em;
	padding-left: 1.7em;
	position: relative;
	color: inherit;
}
#pagetitle .page-title-holder .hero-subline ul > li::before {
	content: "\2713"; /* ✓ */
	position: absolute;
	left: 0;
	top: 0;
	color: #910048;
	font-weight: 700;
	line-height: inherit;
}
#pagetitle .page-title-holder .hero-subline ol > li {
	counter-increment: hero-li;
}
#pagetitle .page-title-holder .hero-subline ol > li::before {
	content: counter(hero-li) ".";
	position: absolute;
	left: 0;
	top: 0;
	color: #910048;
	font-weight: 700;
}

#pagetitle .page-title-holder .hero-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin-top: 8px;
}

#pagetitle .page-title-holder .btn-hero {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 14px 28px;
	font-weight: 700;
	font-size: 1rem;
	line-height: 1.2;
	text-decoration: none;
	border-radius: 0 !important; /* eckig, schlägt theme .btn 7px */
	border: 2px solid transparent;
	transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .15s ease;
	cursor: pointer;
}

#pagetitle .page-title-holder .btn-hero:focus {
	outline: 3px solid rgba(255, 255, 255, 0.45);
	outline-offset: 2px;
}

#pagetitle .page-title-holder .btn-hero--phone {
	background-color: #910048;
	border-color: #910048;
	color: #ffffff;
}

#pagetitle .page-title-holder .btn-hero--phone:hover,
#pagetitle .page-title-holder .btn-hero--phone:focus {
	background-color: #6f0037;
	border-color: #6f0037;
	color: #ffffff;
}

#pagetitle .page-title-holder .btn-hero--cta {
	background-color: #002E5D;
	border-color: #002E5D;
	color: #ffffff;
}

#pagetitle .page-title-holder .btn-hero--cta:hover,
#pagetitle .page-title-holder .btn-hero--cta:focus {
	background-color: #001f3f;
	border-color: #001f3f;
	color: #ffffff;
}

#pagetitle .page-title-holder .btn-hero i {
	font-size: 1.05em;
}

@media (max-width: 600px) {
	#pagetitle .page-title-holder .hero-ctas {
		flex-direction: column;
		align-items: flex-start;
	}
}

/* Breadcrumbs on practice landing pages (scoped via .practice-breadcrumb in
   the page title, since the body has no single-practice class). Not bold on
   ALL viewports; smaller font only on mobile. */
#pagetitle .practice-breadcrumb .ct-breadcrumb,
#pagetitle .practice-breadcrumb .ct-breadcrumb li,
#pagetitle .practice-breadcrumb .ct-breadcrumb li a,
#pagetitle .practice-breadcrumb .ct-breadcrumb li span,
#pagetitle .practice-breadcrumb .ct-breadcrumb .breadcrumb-entry {
	font-weight: 400 !important;
}
@media (max-width: 767px) {
	#pagetitle .practice-breadcrumb .ct-breadcrumb,
	#pagetitle .practice-breadcrumb .ct-breadcrumb li,
	#pagetitle .practice-breadcrumb .ct-breadcrumb li a,
	#pagetitle .practice-breadcrumb .ct-breadcrumb li span,
	#pagetitle .practice-breadcrumb .ct-breadcrumb .breadcrumb-entry {
		font-size: 14px !important;
	}
}

/* Header CTA button: square corners (no rounding) */
#ct-header-elementor .ct-button-wrapper .btn,
#ct-header-elementor a.btn,
.ct-header-mobile .ct-button-wrapper .btn,
.ct-header-mobile a.btn {
	border-radius: 0 !important;
}

/* Hero fade-on-scroll deaktivieren (nur Leistungsseiten).
   Das Theme (assets/js/main.js, "Page Title Scroll Opacity") blendet beim
   Scrollen den gesamten .page-title-inner per Inline-opacity aus — inkl. unserer
   CTA-Buttons. Da opacity auf dem Eltern-Container sitzt, lassen sich die Buttons
   nicht einzeln sichtbar halten; wir müssen den Fade hier stoppen.
   !important schlägt das per JS gesetzte Inline-opacity (ohne !important).
   Scoping via :has(.hero-ctas) → andere Seiten behalten den Fade-Effekt. */
#pagetitle .page-title-inner:has(.hero-ctas) {
	opacity: 1 !important;
}