/* Blokstil «Tegning»: stregtegningen på tegnepapir med beskæringsmærker, afskåret hjørne og et figurnummer, som tælles her og ikke skrives. Editoren lægger billedet i en ramme til at trække i bredden, så billedfeltet vælges som efterkommer og ikke som barn. */
body { counter-reset: pto-fig; }

.wp-block-media-text.is-style-pto-tegning {
	counter-increment: pto-fig;
	gap: var(--space-28);
}
.wp-block-media-text.is-style-pto-tegning > .wp-block-media-text__content {
	min-width: 0;
	padding: 0;
}
.wp-block-media-text.is-style-pto-tegning .wp-block-media-text__media {
	position: relative;
	aspect-ratio: 4 / 3;
	background:
		linear-gradient(var(--color-navy-08) 1px, transparent 1px) -1px -1px / 96px 96px,
		linear-gradient(90deg, var(--color-navy-08) 1px, transparent 1px) -1px -1px / 96px 96px,
		linear-gradient(var(--color-navy-06) 1px, transparent 1px) -1px -1px / 24px 24px,
		linear-gradient(90deg, var(--color-navy-06) 1px, transparent 1px) -1px -1px / 24px 24px,
		var(--color-surface-3);
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - var(--space-22)), calc(100% - var(--space-22)) 100%, 0 100%);
}
.wp-block-media-text.is-style-pto-tegning .wp-block-media-text__media img {
	box-sizing: border-box;
	width: 100%;
	height: 100%;
	padding: 5%;
	object-fit: contain;
	mix-blend-mode: multiply;
}
.wp-block-media-text.is-style-pto-tegning .wp-block-media-text__media::before {
	content: "FIG. " counter(pto-fig, decimal-leading-zero) / "";
	position: absolute;
	left: var(--space-16);
	bottom: var(--space-14);
	font-family: var(--font-mono);
	font-size: var(--text-11);
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.1em;
	color: var(--color-text-muted);
}
.wp-block-media-text.is-style-pto-tegning .wp-block-media-text__media::after {
	--pto-maerke: var(--rule-strong);
	content: "";
	position: absolute;
	inset: var(--space-10);
	pointer-events: none;
	background:
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) left top / 16px 1px no-repeat,
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) left top / 1px 16px no-repeat,
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) right top / 16px 1px no-repeat,
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) right top / 1px 16px no-repeat,
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) left bottom / 16px 1px no-repeat,
		linear-gradient(var(--pto-maerke), var(--pto-maerke)) left bottom / 1px 16px no-repeat;
}

/* Rækkens overskrift er skrevet med almindelig stavning og sat i versaler her, så skærmlæsere læser ordet rigtigt. */
.wp-block-media-text.is-style-pto-tegning .wp-block-heading {
	margin: 0 0 var(--space-24);
	font-size: var(--text-flyer);
	font-weight: 700;
	line-height: 1;
	letter-spacing: -0.005em;
	text-transform: uppercase;
	color: var(--color-primary);
}
.wp-block-media-text.is-style-pto-tegning .is-style-pto-oejenbryn {
	margin-bottom: var(--space-12);
}
.wp-block-media-text.is-style-pto-tegning > .wp-block-media-text__content > p:not(.is-style-pto-oejenbryn) {
	max-width: 36rem;
	margin: 0 0 var(--space-14);
	font-size: var(--text-17);
	line-height: 1.7;
	color: var(--color-foreground);
}
.wp-block-media-text.is-style-pto-tegning .wp-block-buttons {
	margin-top: var(--space-28);
}

.wp-block-media-text.is-style-pto-tegning + .wp-block-media-text.is-style-pto-tegning {
	margin-top: var(--space-64);
}

/* Kernen stabler ved 600 px; rækkerne stabler ved 768 px, som designet. */
@media (max-width: 767px) {
	.wp-block-media-text.is-stacked-on-mobile:is(.is-style-pto-tegning, .is-style-pto-moerk) {
		grid-template-columns: 100% !important;
	}
	.wp-block-media-text.is-stacked-on-mobile:is(.is-style-pto-tegning, .is-style-pto-moerk) > .wp-block-media-text__media {
		grid-column: 1;
		grid-row: 1;
	}
	.wp-block-media-text.is-stacked-on-mobile:is(.is-style-pto-tegning, .is-style-pto-moerk) > .wp-block-media-text__content {
		grid-column: 1;
		grid-row: 2;
	}
}
@media (min-width: 768px) {
	.wp-block-media-text.is-style-pto-tegning {
		gap: var(--space-48);
	}
}
@media (min-width: 1024px) {
	.wp-block-media-text.is-style-pto-tegning {
		gap: var(--space-80);
	}
	.wp-block-media-text.is-style-pto-tegning + .wp-block-media-text.is-style-pto-tegning {
		margin-top: var(--space-96);
	}
}

/* Blokstil «Mørk»: et fuldbredde-bånd på den mørke flade. Billedet fylder sin halvdel fra kanten og tones ind i fladen; uden billede står tegnegitteret i figuren. Teksten står i den anden halvdel. */
.wp-block-media-text.is-style-pto-moerk {
	background: var(--color-primary-deep);
	color: var(--color-surface);
	align-items: stretch;
}
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content {
	align-self: center;
	display: grid;
	gap: var(--space-12);
	padding: var(--space-40) var(--space-20);
}
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content > * { margin: 0; }
.wp-block-media-text.is-style-pto-moerk .is-style-pto-oejenbryn { color: var(--color-accent-warm); }
.wp-block-media-text.is-style-pto-moerk .wp-block-heading {
	color: var(--color-surface);
	font-size: var(--text-display);
	font-weight: 600;
	line-height: 1.15;
}
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content > p:not(.is-style-pto-oejenbryn) {
	max-width: 60ch;
	font-size: var(--text-16);
	line-height: 1.5;
	color: var(--color-on-dark-85);
}
.wp-block-media-text.is-style-pto-moerk .wp-block-buttons { margin-top: var(--space-8); }
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__media {
	position: relative;
	align-self: stretch;
	min-height: 12rem;
}
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__media img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__media:not(:has(img, video)) {
	background:
		linear-gradient(var(--color-accent-08) 1px, transparent 1px) 0 0 / 60px 60px,
		linear-gradient(90deg, var(--color-accent-08) 1px, transparent 1px) 0 0 / 60px 60px,
		linear-gradient(135deg, var(--color-primary), var(--color-primary-deep));
}
@media (min-width: 768px) {
	.wp-block-media-text.is-style-pto-moerk {
		min-height: 30rem;
	}
	.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content {
		gap: 0;
		padding: var(--space-64) var(--space-32);
	}
	.wp-block-media-text.is-style-pto-moerk .wp-block-heading { font-size: var(--text-36); }
	.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content > * + .wp-block-heading { margin-top: var(--space-16); }
	.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content > * + p:not(.is-style-pto-oejenbryn) { margin-top: var(--space-20); }
	.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__content > * + .wp-block-buttons { margin-top: var(--space-32); }
	.wp-block-media-text.is-style-pto-moerk > .wp-block-media-text__media::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(90deg, transparent 60%, var(--color-primary-deep) 100%);
	}
	.wp-block-media-text.is-style-pto-moerk.has-media-on-the-right > .wp-block-media-text__media::after {
		background: linear-gradient(270deg, transparent 60%, var(--color-primary-deep) 100%);
	}
}
