/* WebTrades – Tablet (768–1099, 6 Spalten) und Mobile (< 768, 4 Spalten).
   Mobile ist keine verkleinerte Desktop-Komposition: Offsets werden in lineare, lesbare Zustände übersetzt. */

@media (max-width: 1099px) {
	/* Hero */
	.wt-hero {
		min-height: max(680px, 84svh);
	}

	.wt-hero__grid {
		grid-template-rows: auto auto auto 1fr auto auto;
		padding-bottom: clamp(64px, 9vh, 96px);
	}

	.wt-hero__descriptor {
		grid-column: 3 / 7;
	}

	.wt-hero__title {
		grid-column: 1 / -1;
		margin-top: clamp(40px, 8vh, 96px);
	}

	.wt-hero__substatement {
		grid-column: 3 / 7;
	}

	.wt-hero__cta {
		grid-column: 1 / 5;
		grid-row: 5;
	}

	.wt-hero__register {
		grid-column: 1 / -1;
		grid-row: 6;
		margin-top: 28px;
		padding-bottom: 0;
	}

	.wt-hero__seam-h {
		display: none;
	}

	.wt-hero__seam-v,
	.wt-hero__node {
		grid-column: 1 / 2;
		margin-left: 3px;
	}

	/* Commerce Flow: lineare Zeitleiste */
	.wt-flow__seam .wt-seam {
		grid-column: 1 / 2;
		margin-left: 3px;
		height: 100%;
	}

	.wt-flow__head {
		grid-column: 1 / -1;
	}

	.wt-flow__steps {
		border-top: 0;
		margin-top: clamp(56px, 8vw, 88px);
	}

	.wt-flow__step {
		grid-template-columns: 7px minmax(0, 1fr);
		column-gap: clamp(20px, 3.4vw, 32px);
		padding-block: 0 38px;
		border-bottom: 0;
	}

	.wt-flow__step::before {
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 3px;
		width: 1px;
		background: var(--wt-seam);
	}

	.wt-flow__step:last-child::before {
		bottom: auto;
		height: 12px;
	}

	.wt-flow__step-marker {
		position: relative;
		z-index: 1;
		display: block;
		grid-column: 1;
		width: 7px;
		height: 7px;
		margin-top: 0.35em;
		background: var(--wt-paper);
	}

	.wt-flow__step-body {
		display: block;
		grid-column: 2;
	}

	.wt-flow__step-register {
		padding-top: 0;
	}

	.wt-flow__step-title {
		margin-top: 12px;
	}

	.wt-flow__step-text {
		max-width: 52ch;
		margin-top: 10px;
	}

	.wt-flow__closing {
		grid-column: 1 / -1;
	}

	/* Operate */
	.wt-operate__register {
		grid-column: 1 / -1;
		padding-top: 0;
	}

	.wt-operate__title {
		grid-column: 1 / -1;
		grid-row: 2;
		margin-top: 24px;
	}

	.wt-operate__lead {
		grid-column: 2 / 7;
		grid-row: 3;
	}

	.wt-operate__rail {
		display: none;
	}

	.wt-scene--2,
	.wt-scene--3,
	.wt-scene--4 {
		margin-top: clamp(96px, 14vw, 140px);
	}

	.wt-scene .wt-scene__media {
		grid-column: 1 / -1;
		grid-row: 1;
	}

	.wt-scene .wt-scene__copy {
		grid-row: 2;
		margin: 32px 0 0;
	}

	.wt-scene--1 .wt-scene__copy,
	.wt-scene--3 .wt-scene__copy {
		grid-column: 1 / 6;
	}

	.wt-scene--2 .wt-scene__copy,
	.wt-scene--4 .wt-scene__copy {
		grid-column: 2 / 7;
	}

	.wt-scene--2 .wt-scene__media {
		grid-column: 1 / -1;
	}

	/* Interlude */
	.wt-interlude__title {
		grid-column: 1 / -1;
	}

	.wt-interlude__text {
		grid-column: 1 / 6;
	}

	/* Systems */
	.wt-systems__head {
		align-items: start;
	}

	.wt-systems__register {
		grid-column: 1 / -1;
		grid-row: 1;
		justify-self: start;
		padding-bottom: 0;
	}

	.wt-systems__title {
		grid-column: 1 / -1;
		grid-row: 2;
		margin-top: 24px;
	}

	.wt-rows--systems .wt-row {
		min-height: 0;
		padding-block: 32px 36px;
	}

	.wt-rows--systems .wt-row__title {
		grid-column: 1 / 6;
		grid-row: 1;
	}

	.wt-rows--systems .wt-row__arrow {
		grid-column: 6 / 7;
		grid-row: 1;
	}

	.wt-rows--systems .wt-row__body {
		grid-column: 1 / 6;
		grid-row: 2;
		margin-top: 20px;
	}

	/* Create */
	.wt-create__media {
		grid-column: 1 / -1;
	}

	.wt-create__copy {
		grid-column: 1 / 6;
		grid-row: 2;
		margin-top: 48px;
		padding-left: 0;
	}

	/* Prozess-Rail: ohne stehende Bildspalte, Leiste dreispaltig, Stationen als Liste */
	.wt-rail {
		grid-row: 3;
	}

	.wt-rail__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
		row-gap: 36px;
		border-top: 0;
	}

	.wt-rail__list .wt-process__step {
		border-top: 1px solid var(--wt-fg);
	}

	.wt-rail__track,
	.wt-rail__media {
		display: none;
	}

	.wt-rail__stations {
		grid-column: 1 / -1;
		margin-top: clamp(48px, 6vh, 72px);
	}

	.wt-rail__station {
		min-height: 0;
		padding-block: clamp(20px, 2.6vh, 30px);
	}

	.wt-rail__station-text {
		max-width: 52ch;
	}

	/* Partners */
	.wt-partners__register {
		grid-column: 1 / -1;
		grid-row: 1;
		padding-top: 0;
	}

	.wt-partners__title {
		grid-column: 1 / -1;
		grid-row: 2;
		margin-top: 24px;
	}

	.wt-partners__lead {
		grid-column: 2 / 7;
		grid-row: 3;
		margin-top: 32px;
	}

	.wt-partners__media {
		grid-column: 1 / -1;
	}

	.wt-rows--partners .wt-row__index {
		grid-column: 1 / 2;
		grid-row: 1;
	}

	.wt-rows--partners .wt-row__title {
		grid-column: 2 / 6;
		grid-row: 1;
	}

	.wt-rows--partners .wt-row__arrow {
		grid-column: 6 / 7;
		grid-row: 1;
	}

	.wt-rows--partners .wt-row__text {
		grid-column: 2 / 6;
		grid-row: 2;
		margin-top: 14px;
	}

	/* Working Layer */
	.wt-working__head {
		grid-column: 1 / -1;
	}

	.wt-working__register {
		grid-column: 1 / -1;
		margin-top: 56px;
	}

	/* Contact */
	.wt-contact__intro {
		grid-column: 1 / -1;
	}

	.wt-contact__form {
		grid-column: 1 / -1;
		margin-top: 72px;
		padding-top: 0;
	}

	/* Footer */
	.wt-footer__claim {
		grid-column: 1 / -1;
	}

	.wt-footer__nav {
		grid-column: 1 / 3;
	}

	.wt-footer__contact {
		grid-column: 3 / 5;
	}

	.wt-footer__legal {
		grid-column: 5 / 7;
	}
}

@media (max-width: 767px) {
	/* Hero */
	.wt-hero {
		min-height: max(620px, 90svh);
	}

	.wt-hero__descriptor {
		grid-column: 1 / -1;
		font-size: 0.98rem;
	}

	.wt-hero__title {
		margin-top: clamp(32px, 7vh, 64px);
	}

	.wt-hero__line--offset {
		padding-left: 0;
	}

	.wt-hero__substatement {
		grid-column: 1 / -1;
		margin-top: 24px;
		font-size: clamp(1.45rem, 6.6vw, 1.9rem);
	}

	.wt-hero__cta {
		grid-column: 1 / -1;
	}

	.wt-hero__register {
		gap: 8px 18px;
		margin-top: 24px;
	}

	/* Operate */
	.wt-operate__lead {
		grid-column: 1 / -1;
	}

	.wt-scene .wt-scene__copy,
	.wt-scene--2 .wt-scene__copy,
	.wt-scene--4 .wt-scene__copy {
		grid-column: 1 / -1;
	}

	/* Interlude */
	.wt-interlude {
		min-height: 0;
	}

	.wt-interlude__title {
		font-size: clamp(2.7rem, 12.4vw, 4rem);
	}

	.wt-interlude__text {
		grid-column: 1 / -1;
	}

	/* Systems */
	.wt-rows--systems .wt-row__title {
		grid-column: 1 / 4;
		font-size: clamp(2.3rem, 11.4vw, 3.4rem);
	}

	.wt-rows--systems .wt-row__arrow {
		grid-column: 4 / 5;
	}

	.wt-rows--systems .wt-row__body {
		grid-column: 1 / -1;
	}

	/* Create */
	.wt-create__copy {
		grid-column: 1 / -1;
	}

	.wt-rail__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Partners */
	.wt-partners__lead {
		grid-column: 1 / -1;
	}

	.wt-rows--partners .wt-row__index {
		display: none;
	}

	.wt-rows--partners .wt-row__title {
		grid-column: 1 / 4;
		font-size: clamp(1.7rem, 7.6vw, 2.4rem);
	}

	.wt-rows--partners .wt-row__arrow {
		grid-column: 4 / 5;
	}

	.wt-rows--partners .wt-row__text {
		grid-column: 1 / -1;
	}

	/* Working Layer */
	.wt-layers__legend {
		display: none;
	}

	.wt-layers {
		border-top: 1px solid var(--wt-line);
	}

	.wt-layers__row {
		grid-template-columns: 1fr;
		row-gap: 6px;
		padding-block: 18px;
	}

	/* Formular */
	.wt-field--half {
		grid-column: 1 / -1;
	}

	.wt-form__submit {
		width: 100%;
	}

	/* Footer */
	.wt-footer__nav {
		grid-column: 1 / 3;
	}

	.wt-footer__contact {
		grid-column: 3 / 5;
	}

	.wt-footer__legal {
		grid-column: 1 / -1;
	}

	.wt-footer__meta {
		flex-direction: column;
	}

	.wt-menu__legal {
		margin-left: 0;
	}
}

/* Unterhalb der Desktop-Grenze: Nahtquadrat und Tippflächen (Desktop ≥ 1100 bleibt unverändert) */
@media (max-width: 1099px) {
	/* Das Nahtquadrat sitzt mittig auf der Unterkante des Seitenkopfs: vertikal nicht abschneiden
	   (horizontal bleibt clip) und über den folgenden Abschnitt legen */
	.wt-page-hero {
		overflow-y: visible;
	}

	.wt-page-hero__seam {
		z-index: 1;
	}

	/* Unsichtbar größere Tippflächen: Innenabstand an Inline-Links verschiebt kein Layout */
	.wt-breadcrumb__list a {
		padding-block: 9px;
	}

	.wt-footer__link {
		padding-block: 7px;
		background-origin: content-box;
		background-clip: content-box;
	}
}

/* Mobile: Überschriften mit langen Wörtern (wt_fit_attr) werden nur so weit verkleinert,
   dass das längste Wort in die Spalte passt – kein Umbruch mitten im Wort. */
@media (max-width: 767px) {
	[data-wt-fit] {
		--wt-fit-cap: calc((100vw - 2 * var(--wt-gutter)) / var(--wt-fit));
	}

	.wt-display[data-wt-fit] {
		font-size: min(var(--wt-display), var(--wt-fit-cap));
	}

	.wt-h2[data-wt-fit] {
		font-size: min(var(--wt-h2), var(--wt-fit-cap));
	}

	.wt-h3[data-wt-fit] {
		font-size: min(var(--wt-h3), var(--wt-fit-cap));
	}

	.wt-ps--closing .wt-ps__title[data-wt-fit] {
		font-size: min(var(--wt-h2-compact), var(--wt-fit-cap));
	}

	.wt-page-hero .wt-page-hero__title[data-wt-fit] {
		font-size: min(clamp(2.3rem, 10.6vw, 3.6rem), var(--wt-fit-cap));
	}

	.wt-page-hero--display .wt-page-hero__title[data-wt-fit] {
		font-size: min(clamp(1.4rem, 6vw, 1.9rem), var(--wt-fit-cap));
	}

	.wt-legal__title[data-wt-fit] {
		font-size: min(clamp(1.9rem, 8vw, 3rem), var(--wt-fit-cap));
	}
}

/* Formular-Abschnitt „solo“ (z. B. /restposten/): Die Desktop-Spalten 5–12 bzw. 1–4 überschreiben wegen
   höherer Spezifität die mobile Regel. Darum hier ausdrücklich über die volle Breite – sonst ragt das
   Formular bei 320 px aus dem Raster (Dokument 348 statt 320 px). */
@media (max-width: 1099px) {
	.wt-ps--form-solo .wt-ps__aside,
	.wt-ps--form-solo .wt-ps__main {
		grid-column: 1 / -1;
	}
}

/* Sehr schmale Geräte (unter 360 px): Footer-Spalten untereinander, sonst bricht die Mailadresse im Wort */
@media (max-width: 359px) {
	.wt-footer__nav,
	.wt-footer__contact,
	.wt-footer__legal {
		grid-column: 1 / -1;
	}

	.wt-footer__contact,
	.wt-footer__legal {
		margin-top: 28px;
	}
}