/*
FUG - Fernwärme Ulm Template
creation Date: 2026-10-23
Author: Sebastian Osinski
http://www.sebbi.net
https://ddm-friends.de
*/

.resp_only{
	display: none;
}
.reg_only{
	display: initial;
	display: inherit;
}

.section_bg.__reg{
	display: block;
}
.section_bg.__res{
	display: none;
}

@media (max-width: 1800px){
}

@media (max-width: 1500px){
}

@media (max-width: 1320px){
	.resp_only{
		display: initial;
		display: inherit;
	}
	.reg_only,
	.noRes{
		display: none;
	}
	.resp_center{
		text-align: center;
	}

	._resFull,
	.flexbox._resFull{
		width: 100%;
		margin-left: 0px;
		margin-right: 0px;
	}

	.resOrder_1{
		order: 1;
	}
	.resOrder_2{
		order: 2;
	}
	.resOrder_3{
		order: 3;
	}
}

@media (max-width: 1100px){
	/* Abstaende eine Stufe enger */
	:root{
		--pad-xl: 96px;
		--pad-l: 64px;
		--pad-m: 48px;
		--pad-s: 24px;
		--grid-gap: 24px;
	}

	.col_2{ grid-column: span 4; }
	.col_3{ grid-column: span 6; }

	.ddm_feature{
		gap: var(--space-7);
	}
	.ddm_split{
		gap: var(--space-7);
	}

	/* Kennzahlen mit Trennlinien: zwei Spalten, Linie nur zwischen den Spalten */
	.ddm_figures._divided{
		grid-template-columns: repeat(2, minmax(0, 1fr));
		row-gap: var(--space-7);
	}
	.ddm_figures._divided > .ddm_figure:nth-child(odd){
		padding-left: 0px;
		border-left: 0px;
	}

	/* Prozess-Schritte senkrecht */
	.ddm_steps{
		grid-auto-flow: row;
		gap: var(--space-5);
	}
	.ddm_steps > li{
		padding-top: 0px;
		padding-left: calc(48px + var(--space-5));
		min-height: 48px;
	}
	.ddm_steps > li:not(:last-child)::after{
		top: calc(48px + var(--space-2));
		bottom: calc(-1 * var(--space-5) + var(--space-2));
		left: 23px;
		right: auto;
		width: 2px;
		height: auto;
	}
	.ddm_steps > li > :first-child{
		padding-top: 10px;
	}
}

@media (max-width: 860px){
	:root{
		--gutter: 24px;
	}

	.section_bg.__reg{
		display: none;
	}
	.section_bg.__res{
		display: block;
	}

	.resp_center_800{
		text-align: center;
	}
	.resFull_800,
	.flexbox.resFull_800{
		width: 100%;
	}
	.res80_800,
	.flexbox.res80_800{
		width: 80%;
	}

	.resOrder800_1{
		order: 1;
	}
	.resOrder800_2{
		order: 2;
	}

	.ddm_embed{
		aspect-ratio: 4 / 3;
	}

	/* Raster: 4er und breitere Spalten ganze Breite, 3er bleiben halb */
	.col_4, .col_5, .col_6, .col_7, .col_8, .col_9{ grid-column: span 12; }
	/* News-Karten bleiben zweispaltig (sonst sehr hohe Musterflaechen) */
	.ddm_newslist > li{ grid-column: span 6; }
	.ddm_grid > .ddm_toc_col{
		display: none;
	}

	.ddm_feature{
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-5);
	}
	.ddm_feature._reverse .ddm_feature_media{
		order: 0;
	}

	/* Text neben Element: untereinander, Text zuerst */
	.ddm_split,
	.ddm_split._reverse{
		grid-template-columns: minmax(0, 1fr);
		gap: var(--space-6);
	}
	.ddm_split._reverse > .ddm_split_media{
		order: 0;
	}
	.ddm_split_media .ddm_imagecard_img > img{
		max-height: 480px;
	}

	/* Downloads einspaltig */
	.ddm_downloads._columns{
		grid-template-columns: minmax(0, 1fr);
	}
	.ddm_downloads._columns > li:nth-child(2){
		border-top: none;
	}
	/* Downloads-Gruppen: Kopf ueber der Liste, nicht klebend */
	.ddm_downloadgroups{
		gap: var(--space-7);
	}
	.ddm_downloadgroup{
		grid-template-columns: minmax(0, 1fr);
	}
	.ddm_downloadgroup_head{
		position: static;
		padding-bottom: var(--space-4);
	}

	.ddm_pagehead_media{
		aspect-ratio: 2 / 1;
	}
	.overlay_grad{
		background: linear-gradient(180deg, rgba(29, 33, 39, 0.68) 0%, rgba(29, 33, 39, 0.78) 100%);
	}
	.ddm_pagehead_card{
		margin-top: calc(-1 * var(--space-6));
		padding: var(--space-5);
	}

	/* Zeitleiste im Wechsel wird einspaltig */
	.ddm_timeline._alternate{
		padding-left: var(--space-7);
	}
	.ddm_timeline._alternate::before{
		left: 7px;
	}
	.ddm_timeline._alternate > li,
	.ddm_timeline._alternate > li:nth-child(even){
		width: auto;
		margin-left: 0px;
		padding-left: 0px;
		padding-right: 0px;
		text-align: left;
	}
	.ddm_timeline._alternate > li::before,
	.ddm_timeline._alternate > li:nth-child(even)::before{
		left: calc(-1 * var(--space-7));
		right: auto;
	}

	.ddm_plane::before{
		right: calc(-1 * var(--gutter));
	}
	.ddm_plane._left::before{
		left: calc(-1 * var(--gutter));
	}
}

@media (max-width: 600px){
	/* Netzplan: Fenster im Seitenverhaeltnis des Plans statt Hoehe nach Bildschirm */
	.ddm_netzplan._ready .ddm_netzplan_view{
		height: auto;
		aspect-ratio: 3 / 4;
	}

	/* Fliesstext eine Stufe kleiner; Headlines skalieren ueber clamp() */
	:root{
		--gutter: 20px;
		--fs-text: 17px;
		--pad-xl: 64px;
		--pad-l: 48px;
		--pad-m: 32px;
		--pad-s: 16px;
		--grid-gap: 16px;
	}

	/* Seitenkopf: Bildband volle Breite, etwas hoeher; Hero nicht hoeher als
	   sein Inhalt */
	.ddm_pagehead > .main-container.wide{
		max-width: 100%;
		padding-top: 0px;
	}
	.ddm_pagehead_media{
		aspect-ratio: 16 / 9;
	}
	.ddm_hero{
		min-height: 0px;
	}

	.col_2{ grid-column: span 6; }
	.col_3{ grid-column: span 12; }

	/* Schaltflaechen-Gruppen untereinander in voller Breite */
	.ddm_buttons{
		flex-direction: column;
		align-items: stretch;
	}

	/* Schnellzugriff kompakt 2x2: Symbol ueber dem Text, ohne Pfeil; der Hero
	   bekommt unten Platz fuer die hineinragenden Kacheln */
	.ddm_hero:has(+ .ddm_quicklinks){
		padding-bottom: calc(var(--pad-l) + var(--slant-h) + var(--space-7));
	}
	.ddm_quicklinks .ddm_grid > li{
		grid-column: span 6;
	}
	.ddm_quicklink.ddm_quicklink{
		flex-direction: column;
		align-items: flex-start;
		gap: var(--space-3);
		min-height: 0px;
		padding: var(--space-4);
		hyphens: auto;
		-webkit-hyphens: auto;
	}
	.ddm_quicklink .i_arrow-right{
		display: none;
	}

	/* Ansprechpartner: Bild neben dem Text */
	.ddm_person{
		display: grid;
		grid-template-columns: 72px minmax(0, 1fr);
		column-gap: var(--space-4);
	}
	.ddm_person_img{
		grid-row: span 3;
		align-self: start;
		width: 72px;
		height: 72px;
	}
	.ddm_person > :not(.ddm_person_img){
		grid-column: 2;
	}

	.ddm_notice{
		padding: var(--space-3) var(--space-4);
	}

	.ddm_newslist > li{ grid-column: span 12; }
	.ddm_newsfilter_label{
		flex-basis: 100%;
	}
	.ddm_news_modal_head,
	.ddm_news_modal_body,
	.ddm_news_modal_foot{
		padding-left: var(--space-5);
		padding-right: var(--space-5);
	}
}

@media (max-width: 500px){
}
