:root {
	--theme-page-gutter: var(--wp--preset--spacing--50, 2rem);
	--theme-content-size: var(--wp--style--global--content-size, 720px);
	--theme-wide-size: var(--wp--style--global--wide-size, 1400px);
	--theme-ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
	--theme-duration: 300ms;
	--theme-duration-slow: 450ms;
	--theme-focus-color: var(--wp--preset--color--orange-500, #fc4c08);
	--theme-focus-width: 1px;
	--theme-focus-offset: 3px;
	/* Smal innehållskolumn centrerad i .theme-container (hero, formulär m.m.) */
	--theme-hero-content-max: 1152px;
	--theme-section-padding-block: clamp(2.5rem, 7vw, 6rem);
	--theme-underline-offset: -0.125em;
	--theme-underline-thickness: 0.0625em;
	--theme-underline-duration: 0.535s;
}

@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

body {
	font-family: var(--wp--preset--font-family--primary), system-ui, -apple-system, "Segoe UI", sans-serif;
}

strong,
b {
	font-weight: 700;
}

*,
*::before,
*::after {
	box-sizing: border-box;
}

:focus:not(:focus-visible) {
	outline: none;
}

:focus-visible {
	outline: var(--theme-focus-width) solid var(--theme-focus-color);
	outline-offset: var(--theme-focus-offset);
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible,
.wp-block-navigation-item__content:focus-visible,
.wp-block-navigation__responsive-container-open:focus-visible {
	outline-color: var(--theme-focus-color);
}

.theme-container {
	width: min(
		calc(100% - var(--theme-page-gutter) - var(--theme-page-gutter)),
		var(--theme-wide-size)
	);
	margin-inline: auto;
}

/*
 * Sidinnehåll (stycke, gruppblock m.m.): samma bredd som .theme-container.
 * ACF-block är alignfull och hanterar layout i render.php — exkluderas här.
 */
main .wp-block-post-content > :where(:not(.alignfull)) {
	width: min(
		calc(100% - var(--theme-page-gutter) - var(--theme-page-gutter)),
		var(--theme-wide-size)
	);
	max-width: 100%;
	margin-inline: auto;
}

/*
 * Grupp m.m. med has-global-padding får WP:s root-padding utöver gutter ovan → dubbel inskjutning på mobil.
 */
main .wp-block-post-content > :where(:not(.alignfull)).has-global-padding {
	padding-inline: 0;
}

.theme-content {
	width: min(
		calc(100% - var(--theme-page-gutter) - var(--theme-page-gutter)),
		var(--theme-content-size)
	);
	margin-inline: auto;
}

.theme-hero-content {
	width: 100%;
	max-width: 100%;
	margin-inline: 0;
}

/*
 * Vänsterförskjutning: lägg theme-container--inset på inner + theme-hero-content på innehåll.
 */
.theme-container--inset {
	container-type: inline-size;
}

@container (min-width: 782px) {
	.theme-container--inset > .theme-hero-content {
		max-width: var(--theme-hero-content-max);
		margin-left: max(0px, calc((100cqw - var(--theme-hero-content-max)) / 2));
	}
}

@media (max-width: 781px) {
	.theme-container--inset > .theme-hero-content {
		margin-left: 0;
		max-width: none;
	}
}

.theme-section {
	padding-block: var(--theme-section-padding-block);
	margin-top: 0 !important;
}

@media (max-width: 781px) {
	.theme-section [class$="__heading"] {
		overflow-wrap: break-word;
	}
}

.theme-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 3rem;
	padding: 0.75rem 1.5rem;
	border: 1px solid currentColor;
	border-radius: 0;
	font-family: inherit;
	font-size: var(--wp--preset--font-size--body, 1.125rem);
	font-weight: 300;
	line-height: 1;
	text-decoration: none;
	transition:
		color var(--theme-duration) var(--theme-ease),
		background-color var(--theme-duration) var(--theme-ease),
		border-color var(--theme-duration) var(--theme-ease),
		text-decoration-color var(--theme-duration) var(--theme-ease);
}

.theme-button:focus-visible {
	outline: var(--theme-focus-width) solid var(--theme-focus-color);
	outline-offset: var(--theme-focus-offset);
}

@media (prefers-reduced-motion: reduce) {
	.theme-button {
		transition: none;
	}
}

.theme-button--primary {
	border-color: var(--wp--preset--color--blue-900, #0c2033);
	background: var(--wp--preset--color--blue-900, #0c2033);
	color: var(--wp--preset--color--base, #eef5fb);
}

.theme-button--primary:hover,
.theme-button--primary:focus-visible {
	border-color: var(--wp--preset--color--blue-300, #4891d5);
	background: var(--wp--preset--color--blue-300, #4891d5);
	color: var(--wp--preset--color--base, #eef5fb);
}

.theme-button--secondary {
	background: transparent;
	border-color: var(--wp--preset--color--blue-700, #133453);
	color: var(--wp--preset--color--blue-700, #133453);
}

.theme-button--secondary:hover,
.theme-button--secondary:focus-visible {
	background: var(--wp--preset--color--base, #eef5fb);
	border-color: var(--wp--preset--color--blue-900, #0c2033);
	color: var(--wp--preset--color--blue-900, #0c2033);
}

.theme-button--tertiary {
	min-height: auto;
	padding: 0;
	border: 0;
	background: transparent;
	color: var(--wp--preset--color--blue-700, #133453);
	text-decoration-line: underline;
	text-decoration-color: var(--wp--preset--color--orange-500, #fc4c08);
	text-decoration-thickness: 2px;
	text-underline-offset: 0.18em;
}

.theme-button--tertiary:hover,
.theme-button--tertiary:focus-visible {
	color: var(--wp--preset--color--blue-900, #0c2033);
	text-decoration-color: var(--wp--preset--color--orange-400, #fd5f21);
}

.theme-animated-underline {
	position: relative;
	text-decoration: none;
}

.theme-animated-underline::before {
	content: "";
	position: absolute;
	bottom: var(--theme-underline-offset);
	left: 0;
	width: 100%;
	height: var(--theme-underline-thickness);
	background-color: currentColor;
	transition: transform var(--theme-underline-duration) var(--theme-ease);
	transform-origin: right;
	transform: scaleX(0) rotate(0.001deg);
	pointer-events: none;
}

@media (hover: hover) and (pointer: fine) {
	.theme-animated-underline:hover::before,
	.theme-animated-underline:focus-visible::before {
		transform-origin: left;
		transform: scaleX(1) rotate(0.001deg);
	}
}

.theme-subheading {
	margin: 0;
	font-size: var(--wp--preset--font-size--subheading, 1.5rem);
	font-weight: 200;
	line-height: 1.2;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

/* Block pattern: patterns/undersida-textsektion.php */
.undersida-textsektion {
	color: var(--wp--preset--color--blue-900, #0c2033);
}
@media (min-width: 782px) {
	.undersida-textsektion {
		padding-bottom: 12rem;
	}
}

.undersida-textsektion .theme-container--inset > .theme-hero-content {
	max-width: var(--theme-content-size, 720px);
	margin-inline: auto;
	margin-left: auto;
	text-align: left;
}

.undersida-textsektion .theme-hero-content .has-text-align-center {
	text-align: left;
}

.undersida-textsektion__heading {
	margin: 0 0 clamp(0.75rem, 1.25vw, 1.25rem);
	font-size: var(--wp--preset--font-size--heading-2, 2.75rem);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--wp--preset--color--blue-900, #0c2033);
}

.undersida-textsektion .theme-hero-content > .wp-block-heading + .wp-block-paragraph {
	margin-top: 0;
}

.undersida-textsektion__text,
.undersida-textsektion .theme-hero-content > .wp-block-paragraph {
	font-size: var(--wp--preset--font-size--body, 1.125rem);
	font-weight: 300;
	line-height: 1.5;
	color: var(--wp--preset--color--blue-700, #133453);
}

.undersida-textsektion .theme-hero-content > .wp-block-paragraph + .wp-block-paragraph {
	margin-top: 1em;
}

/* WordPress skip link (keyboard accessibility) */
.skip-link.screen-reader-text {
	position: absolute;
	top: auto;
	left: -9999px;
	width: 1px;
	height: 1px;
	margin: 0;
	padding: 0;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

.skip-link.screen-reader-text:focus,
.skip-link.screen-reader-text:focus-visible {
	position: fixed;
	top: calc(
		var(--theme-admin-bar-height, var(--wp-admin--admin-bar--height, 0px))
		+ (var(--theme-header-height, 4.5rem) / 2)
	);
	left: max(var(--theme-page-gutter), 1rem);
	z-index: 100000;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	height: auto;
	min-height: 0;
	margin: 0;
	padding: 0.5rem 1rem;
	transform: translateY(-50%);
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
	border: 1px solid var(--wp--preset--color--blue-900, #0c2033);
	border-radius: 0;
	background: var(--wp--preset--color--blue-900, #0c2033);
	color: var(--wp--preset--color--base, #eef5fb);
	box-shadow: 0 0.35rem 1.25rem color-mix(in srgb, var(--wp--preset--color--blue-900, #0c2033) 22%, transparent);
	font-family: inherit;
	font-size: var(--wp--preset--font-size--small-body, 0.875rem);
	font-weight: 300;
	line-height: 1;
	text-decoration: none;
}

.skip-link.screen-reader-text:focus-visible {
	outline: var(--theme-focus-width) solid var(--theme-focus-color);
	outline-offset: var(--theme-focus-offset);
}
