/* ==========================================================================
   Just Name IT, ny design: Erbjudande's head (F-0089 AC3)
   --------------------------------------------------------------------------
   Loaded on Erbjudande when the server put the four forms in a row
   (`erbjudande`) in its motif's place (inc/services.php). The wrapper keeps
   today's classes `motif motif--page`, so today's rules (sections.css) still
   place it in the right half, centred on the text, and hide it on phones
   (Director 2026-10-04: "dölj motivet på mobil för ... erbjudande").

   Only the size changes (Director 2026-10-26: "Fyll ut så att det ser bra
   ut", and "Fyra former på rad"): 22rem wide from 48em and 32rem from 64em
   (today's motif 12rem and 14rem); the text keeps the rest of the width. The
   row is far wider than high, so today's min-height (12rem, 14rem) already
   makes the head at least as tall as the row.

   Every selector names the section (check_design.py, page stylesheets).
   ========================================================================== */

.section-page-head--motif-erbjudande > .alignwide > .ny-art--erbjudande .ny-form,
.section-page-head--motif-erbjudande > .alignwide > .ny-art--erbjudande img {
	display: block;
	width: 100%;
	height: auto;
}

/* The row's width: 22rem from 48em, 32rem from 64em. */
.section-page-head--motif-erbjudande {
	--ny-row-width: 22rem;
}

@media (min-width: 64em) {

	.section-page-head--motif-erbjudande {
		--ny-row-width: 32rem;
	}
}

@media (min-width: 48em) {

	/* The row's width plus the gap to the text. */
	.section-page-head--motif-erbjudande > .alignwide:has(> .ny-art--erbjudande) {
		padding-inline-end: calc(var(--ny-row-width) + var(--space-60));
	}

	.section-page-head--motif-erbjudande > .alignwide > .motif.ny-art--erbjudande {
		width: var(--ny-row-width);
		pointer-events: none;
	}
}

@media (min-width: 64em) {

	.section-page-head--motif-erbjudande > .alignwide:has(> .ny-art--erbjudande) {
		padding-inline-end: calc(var(--ny-row-width) + var(--space-80));
	}
}