/* ==========================================================================
   Just Name IT, ny design: a rendered form in a page head (F-0090 AC1)
   --------------------------------------------------------------------------
   Support (the cylinder with the ball), Logotyper (today's motif as forms) and 404 (the
   still life), after the parent's sections.css. The server puts the picture
   where today's motif is, with today's classes (inc/info-pages.php), so the
   parent's rules still place it: in the right half from 48em, hidden on
   phones on Support (.motif--page), under the text elsewhere.
   The Director, 2026-10-26: "Fyll ut så att det ser bra ut. Gäller på alla
   platser." The form is larger than today's motif (12rem and 14rem): 20rem
   wide from 48em and 28rem from 64em, and at most 20rem under the text. The
   text keeps the rest of the width; the head is at least as tall as the form
   (the server puts the form's height over its width on the wide group as
   --ny-form-ratio).
   ========================================================================== */

.section-page-head > .alignwide > .ny-head-form:not(.motif--page) {
	display: block;
}

.section-page-head > .alignwide > .motif.ny-head-form {
	width: min(100%, 20rem);
}

.section-page-head .ny-head-form img {
	display: block;
	width: 100%;
	height: auto;
}

@media (min-width: 48em) {

	.section-page-head > .alignwide:has(> .ny-head-form) {
		--ny-form-width: 20rem;
		padding-inline-end: calc(var(--ny-form-width) + var(--space-60));
		min-height: calc(var(--ny-form-width) * var(--ny-form-ratio, 0.5));
	}

	.section-page-head > .alignwide > .motif.ny-head-form {
		width: var(--ny-form-width);
	}
}

@media (min-width: 64em) {

	.section-page-head > .alignwide:has(> .ny-head-form) {
		--ny-form-width: 28rem;
		padding-inline-end: calc(var(--ny-form-width) + var(--space-80));
	}
}