/**
 * singulary-suchprofil/suchprofil — Käufer-Funnel. Seite (funnel) und Dialog tragen die Beratungs-Schale
 * der Bewertung (features/bewertung/dialog.css, wizard.css): dieselbe Optik, dieselben Wizard-Karten.
 * Hier steht nur, was das Suchprofil selbst hat: Sektion, optionaler Kopf, das Startseiten-Cover.
 */

.fyh-suchprofil--funnel {
	margin: 0;
	padding-block: var(--wp--preset--spacing--50, clamp( 2rem, 4vw, 3rem ));
	scroll-margin-top: 5rem;
}

/* Sektions-Kopf ausserhalb der Box — Site-Kopf-System. */
.fyh-suchprofil__objhead { margin-bottom: 1.6rem; }
.fyh-suchprofil__objhead .fyh-objhead__text { max-width: 84ch; text-wrap: pretty; }

/* Editoriales Homepage-Cover: eine ruhige Stadt-Fläche als Einstieg in den
   fokussierten Suchprofil-Dialog. Das Formular bleibt als katalogisierte
   Gutenberg-Komponente vollständig erhalten. */
.fyh-suchprofil--cover {
	position: relative;
	display: flex;
	min-height: clamp( 32rem, 42vw, 39rem );
	margin: 0;
	padding: 0;
	overflow: hidden;
	border-radius: var(--wp--custom--radius--md, 16px);
	background: var(--wp--preset--color--navy);
	color: var(--wp--preset--color--on-dark);
	isolation: isolate;
}

/* Only the hero runs edge to edge; in-page photo bands sit on the content edge. */
.wp-site-blocks .entry-content > .fyh-suchprofil--cover.alignfull {
	/* The content area already carries the page gutter: no extra margin, just the shell width. */
	width: auto;
	max-width: calc( var(--wp--custom--layout--shell-max, 1512px) - 2 * var(--wp--custom--layout--edge, clamp( 1.5rem, 5vw, 6rem )) );
	margin-inline: auto;
}

.fyh-suchprofil__cover-image,
.fyh-suchprofil__cover-scrim {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.fyh-suchprofil__cover-image {
	z-index: -2;
	object-fit: cover;
	object-position: center 54%;
}

/* Cover with the site's area map (coverMap): the map fills the right half,
   every object is a pin. Pure decoration, the copy keeps the left half. */
.fyh-suchprofil__cover-map {
	position: absolute;
	z-index: -2;
	inset: 0 0 0 auto;
	display: flex;
	width: min( 56%, 40rem );
	padding: clamp( 1.5rem, 3vw, 2.5rem ) clamp( 1.5rem, 4vw, 4rem );
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	pointer-events: none;
}

.fyh-suchprofil__cover-svg {
	width: auto;
	max-width: 100%;
	height: 100%;
}

.fyh-suchprofil__cover-svg .sgui-lagen__area {
	fill: rgb( 255 255 255 / .03 );
	stroke: rgb( 255 255 255 / .24 );
	stroke-width: 1px;
}


.fyh-suchprofil__cover-svg .sgui-lagen__point {
	fill: var(--wp--preset--color--on-dark, #fff);
	stroke: var(--wp--preset--color--navy, #0f2a43);
}

.fyh-suchprofil__cover-svg .sgui-lagen__point.is-sold {
	fill: rgb( 255 255 255 / .45 );
}

.fyh-suchprofil__cover-scrim {
	z-index: -1;
	/* Copy sits left: a directional scrim keeps it on a calm ground and the motif free. */
	background: var(--wp--custom--ui--scrim-copy, var(--wp--custom--ui--scrim));
}

.fyh-suchprofil__cover-inner {
	display: flex;
	width: 100%;
	max-width: var(--wp--custom--layout--shell-max, 1512px);
	min-height: 0;
	margin-inline: auto;
	padding: clamp( 3rem, 6vw, 5.5rem ) clamp( 1.5rem, 4.5vw, 4.5rem );
	flex: 1 1 auto;
	flex-direction: column;
	justify-content: center;
	box-sizing: border-box;
}

.fyh-suchprofil__cover-copy {
	max-width: 42rem;
}

.fyh-suchprofil__cover-eyebrow {
	--sgui-rubric-color: var(--wp--preset--color--on-dark-soft);
}

.fyh-suchprofil__cover-title {
	margin: 0;
	max-width: 15ch;
	font-size: var(--wp--custom--type--section-size, clamp(1.875rem, 3vw, 2.5rem));
	font-weight: var(--wp--custom--type--section-weight, 650);
	letter-spacing: var(--wp--custom--type--section-tracking, -.025em);
	line-height: var(--wp--custom--type--section-leading, 1.15);
	color: #fff;
	text-wrap: balance;
}

.fyh-suchprofil__cover-title span {
	color: rgba( 255, 255, 255, .72 );
}

.fyh-suchprofil__cover-text {
	margin: 1.35rem 0 0;
	max-width: 48ch;
	font-size: clamp( .98rem, 1.35vw, 1.08rem );
	line-height: 1.65;
	color: rgba( 255, 255, 255, .86 );
	text-wrap: pretty;
}

.fyh-suchprofil__cover-actions {
	margin-top: 1.65rem;
}

.fyh-suchprofil__cover-actions .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	gap: .6rem;
	cursor: pointer;
	font-family: inherit;
}

/* Short label + arrow: the action says where it goes, not what it is. */
.fyh-suchprofil__cta-arrow {
	width: 1.1em;
	height: 1.1em;
	flex-shrink: 0;
	transition: transform .2s ease;
}

.wp-block-button__link:hover .fyh-suchprofil__cta-arrow {
	transform: translateX( 3px );
}

@media ( prefers-reduced-motion: reduce ) {
	.fyh-suchprofil__cta-arrow {
		transition: none;
	}
}

.fyh-suchprofil__cover-location {
	position: absolute;
	right: var(--wp--custom--layout--gutter, var(--wp--style--root--padding-right, 1.5rem));
	bottom: clamp( 2rem, 4vw, 3.25rem );
	margin: 0;
	font-size: .6875rem;
	font-weight: 650;
	letter-spacing: .15em;
	text-transform: uppercase;
	color: rgba( 255, 255, 255, .72 );
}

@media ( max-width: 720px ) {
	/* Phones keep a full cover proportion; the content is one centred group with
	   equal space above and below, the location label flows under the action. */
	.fyh-suchprofil--cover {
		min-height: 32rem;
	}

	.fyh-suchprofil__cover-image {
		object-position: 66% center;
	}

	/* Phones: the map sits behind the copy, quieter. */
	.fyh-suchprofil__cover-map {
		width: 100%;
		opacity: .5;
	}

	.fyh-suchprofil__cover-scrim {
		background: var(--wp--custom--ui--scrim-copy-stack, var(--wp--custom--ui--scrim));
	}

	.fyh-suchprofil__cover-inner {
		justify-content: center;
		padding-block: 3rem;
	}

	.fyh-suchprofil__cover-title {
		max-width: 13ch;
		font-size: var(--wp--custom--type--section-size, clamp(1.875rem, 3vw, 2.5rem));
	}

	.fyh-suchprofil__cover-location {
		position: static;
		margin-top: 2rem;
	}
}

/* Der Dialog des Covers ist die Beratungs-Schale (dialog.fyh-bwd). Der globale FSE-Flow gibt
   direkten Geschwistern 24px Blockabstand; der modale Top-Layer wird exakt zentriert. */
.wp-site-blocks > .fyh-suchprofil-dialog,
.wp-site-blocks .entry-content > .fyh-suchprofil-dialog {
	margin: auto;
	max-width: none;
}

/* The wizard fills the shell's main column like the valuation panel: "Weiter" sits at the bottom;
   in the dialog the progress starts below the close button, where the valuation shows its tabs. */
.fyh-bwd .fyh-suchprofil__form { display: flex; min-height: 0; flex: 1 1 auto; }
.fyh-bwd--dialog .fyh-suchprofil__form { margin-top: 2.5rem; }