/*
 * Kontakt page header below 981px (tablet + phone). Desktop is untouched.
 *
 * Gives the Divi modules of the page's first section the phone layout of the Angebote pages
 * (retm_category_hero, see its style.css for the sizes): centered title on top, image on the
 * bottom edge of the section, three circles behind it centered on that edge, no logo.
 *
 * Scoped by the page's body class and section index: if a section is added above the header
 * in the builder, .et_pb_section_0 and the row / column numbers here need to follow.
 *
 * !important is needed against Divi's module CSS and the inline transform / opacity that its
 * scroll effects set on the columns and shapes. The columns' scroll effects are switched off.
 */

@media only screen and (max-width: 980px) {

	.page-id-1023 .et-l--post .et_pb_section_0 {
		--retm-kh-size-1: min(100vw, 46rem);
		--retm-kh-size-2: min(93vw, 43rem);
		--retm-kh-size-3: min(86vw, 40rem);
		position: relative;
		overflow: hidden;
		overflow: clip;
	}

	.page-id-1023 .et-l--post .et_pb_row_0 {
		padding: 0 !important;
	}

	.page-id-1023 .et-l--post .et_pb_row_0 > .et_pb_column {
		margin: 0 !important;
		transform: none !important;
		opacity: 1 !important;
	}

	/* Text */
	.page-id-1023 .et-l--post .et_pb_column_0 {
		padding: 1.5rem 1rem 1rem !important;
	}

	.page-id-1023 .et-l--post .et_pb_column_0 .dsm_block_reveal_text {
		margin: 0 !important;
		text-align: center;
	}

	.page-id-1023 .et-l--post .et_pb_column_0 .dsm_block_reveal_text_wrapper {
		display: inline-block;
		width: auto;
		vertical-align: top;
	}

	.page-id-1023 .et-l--post .et_pb_column_0 .dsm_block_reveal_text_header {
		padding: 0;
		font-weight: 700;
		line-height: 1.15;
		text-align: center !important;
	}

	.page-id-1023 .et-l--post .et_pb_column_0 .dsm_block_reveal_text_0 {
		margin-bottom: 0.4rem !important;
	}

	.page-id-1023 .et-l--post .dsm_block_reveal_text_0 .dsm_block_reveal_text_header {
		font-size: clamp(1.5rem, 1rem + 2.2vw, 2.5rem) !important;
	}

	.page-id-1023 .et-l--post .dsm_block_reveal_text_1 .dsm_block_reveal_text_header {
		font-size: clamp(1.15rem, 0.9rem + 1.2vw, 1.85rem) !important;
	}

	/* Image */
	.page-id-1023 .et-l--post .et_pb_column_1 {
		padding: 0 1rem !important;
	}

	.page-id-1023 .et-l--post .et_pb_image_0 {
		width: 100% !important;
		max-width: 28rem;
		margin: 0 auto !important;
		padding: 0 !important;
	}

	.page-id-1023 .et-l--post .et_pb_image_0 .et_pb_image_wrap {
		display: block;
	}

	/* 2:3 image: 85% of the Angebote pages' size (125% of the column width high, at most 70vh) */
	.page-id-1023 .et-l--post .et_pb_image_0 img {
		display: block;
		width: min(100%, calc(min(125vw - 2.5rem, 70vh) * 2 / 3 * 0.85));
		margin: 0 auto;
	}

	/* The logo column stays desktop-only */
	.page-id-1023 .et-l--post .et_pb_column_2 {
		display: none !important;
	}

	/* Circles: centered on the section's bottom edge, moving down from there and back up */
	.page-id-1023 .et-l--post .et_pb_row_1,
	.page-id-1023 .et-l--post .et_pb_row_2,
	.page-id-1023 .et-l--post .et_pb_row_3 {
		position: absolute !important;
		top: auto !important;
		right: 0 !important;
		bottom: 0 !important;
		left: 0 !important;
		width: var(--retm-kh-size) !important;
		max-width: 100% !important;
		margin: 0 auto !important;
		transform: translateY(50%) !important;
	}

	.page-id-1023 .et-l--post .et_pb_row_1 { --retm-kh-size: var(--retm-kh-size-1); --retm-kh-delay: 0.2s; }
	.page-id-1023 .et-l--post .et_pb_row_2 { --retm-kh-size: var(--retm-kh-size-2); --retm-kh-delay: 0.1s; }
	.page-id-1023 .et-l--post .et_pb_row_3 { --retm-kh-size: var(--retm-kh-size-3); --retm-kh-delay: 0s; }

	.page-id-1023 .et-l--post .et_pb_row_1 .dsm_shapes,
	.page-id-1023 .et-l--post .et_pb_row_2 .dsm_shapes,
	.page-id-1023 .et-l--post .et_pb_row_3 .dsm_shapes {
		display: block;
		max-width: 100%;
		padding: 0 !important;
		transform: none !important;
		animation: none !important;
	}

	.page-id-1023 .et-l--post .et_pb_row_1 .dsm_shapes_wrapper,
	.page-id-1023 .et-l--post .et_pb_row_2 .dsm_shapes_wrapper,
	.page-id-1023 .et-l--post .et_pb_row_3 .dsm_shapes_wrapper {
		width: 100% !important;
		max-width: 100%;
		height: auto !important;
		aspect-ratio: 1;
		animation: retm-kh-bob 5s ease-in-out var(--retm-kh-delay) infinite;
	}

	/* Icon + text list (retm-usp-row, see angebote-mobile.css): the row's padding is enough */
	.page-id-1023 .et-l--post .et_pb_section_1 {
		padding-top: 0 !important;
		padding-bottom: 0 !important;
	}

	/* One-line entries get the height of two lines, so the upright line is the same on all three */
	.page-id-1023 .retm-usp-row.et_pb_row .et_pb_module.et_pb_text {
		display: flex;
		align-items: center;
		min-height: calc(3 * var(--retm-usp-fs));
	}

	/* Standort: text at 90% width, map edge to edge with square corners and no scroll effect */
	.page-id-1023 .et-l--post .et_pb_section_2 {
		padding-top: 2.5rem !important;
		padding-bottom: 0 !important;
	}

	.page-id-1023 .et-l--post .et_pb_row_5 {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
	}

	.page-id-1023 .et-l--post .et_pb_column_9 {
		float: none !important;
		width: 90% !important;
		margin: 0 auto 2rem !important;
		padding: 0 !important;
		text-align: center;
	}

	.page-id-1023 .et-l--post .et_pb_column_9 .dsm_block_reveal_text {
		text-align: center;
	}

	.page-id-1023 .et-l--post .et_pb_column_9 .dsm_block_reveal_text_wrapper {
		display: inline-block;
		width: auto;
		vertical-align: top;
	}

	.page-id-1023 .et-l--post .et_pb_column_9 .dsm_block_reveal_text_header {
		text-align: center !important;
	}

	/* Same size as the text beside the form */
	.page-id-1023 .et-l--post .et_pb_column_9 .et_pb_text {
		padding: 0 !important;
		font-size: 1.2rem;
		text-align: center;
	}

	.page-id-1023 .et-l--post .et_pb_column_10 {
		width: 100% !important;
		margin: 0 !important;
		transform: none !important;
		opacity: 1 !important;
	}

	.page-id-1023 .et-l--post .dsm_embed_google_map_0 {
		border-radius: 0 !important;
	}

	.page-id-1023 .et-l--post .dsm_embed_google_map_0 iframe {
		display: block;
		width: 100%;
		height: min(100vw, 40rem);
	}

	/* Form section: centered text and button, the field labels stay above their fields */
	.page-id-1023 .et-l--post .et_pb_section_3 .et_pb_text,
	.page-id-1023 .et-l--post .et_pb_section_3 .et_pb_text h2,
	.page-id-1023 .et-l--post .et_pb_section_3 .retm-ff__privacy {
		text-align: center;
	}

	.page-id-1023 .et-l--post .et_pb_section_3 .retm-turnstile {
		display: flex;
		justify-content: center;
	}

	.page-id-1023 .et-l--post .et_pb_section_3 .retm-ff p:has(.wpcf7-submit) {
		position: relative;
		justify-content: center;
	}

	/* Out of the flow, or the hidden spinner's width pushes the button off center */
	.page-id-1023 .et-l--post .et_pb_section_3 .retm-ff .wpcf7-spinner {
		position: absolute;
		top: 50%;
		right: 0;
		margin: 0;
		transform: translateY(-50%);
	}
}

@media only screen and (max-width: 980px) and (prefers-reduced-motion: reduce) {

	.page-id-1023 .et-l--post .et_pb_row_1 .dsm_shapes_wrapper,
	.page-id-1023 .et-l--post .et_pb_row_2 .dsm_shapes_wrapper,
	.page-id-1023 .et-l--post .et_pb_row_3 .dsm_shapes_wrapper {
		animation: none;
	}
}

@keyframes retm-kh-bob {
	0%,
	10% {
		transform: none;
	}
	50%,
	60% {
		transform: translateY(5rem);
	}
	100% {
		transform: none;
	}
}
