/* Maskinegiganten Design 2026
 * Idé: formularen er maskinens typeskilt (børstet aluminium med nitter) – resten er roligt:
 * beton, asfalt og signalgul. Én skrift: Archivo (variabel bredde), bred i overskrifter.
 */

@font-face {
	font-family: "Archivo";
	src: url("../fonts/archivo-var.woff2") format("woff2-variations"), url("../fonts/archivo-var.woff2") format("woff2");
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
}

:root {
	--asfalt: #23272B;
	--asfalt-2: #343A40;
	--gul: #F3C200;
	--gul-dyb: #C99F00;
	--beton: #E7E8E4;
	--lys: #F5F5F2;
	--hvid: #FFFFFF;
	--streg: #C8CBC8;
	--mut: #565D64;
	--fejl: #B3261E;
	--alu-1: #F1F3F3;
	--alu-2: #D5D9DB;
	--alu-kant: #98A0A4;
	--r: 10px;
	--wrap: 1180px;
	--font: "Archivo", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
}

/* ---------- Basis ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 84px; }
body.mg-body {
	margin: 0;
	background: var(--lys);
	color: var(--asfalt);
	font-family: var(--font);
	font-size: 17px;
	line-height: 1.6;
	font-stretch: 100%;
	overflow-x: hidden;
	-webkit-font-smoothing: antialiased;
	padding-bottom: 72px; /* plads til mobil-bjælken */
}
@media (min-width: 900px) { body.mg-body { padding-bottom: 0; } }
.mg-body img, .mg-body svg { max-width: 100%; }
.mg-body img { height: auto; display: block; }
:where(.mg-body a) { color: inherit; }
.mg-body :focus-visible { outline: 3px solid var(--gul); outline-offset: 2px; border-radius: 4px; }
.mg-wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 16px; }
@media (min-width: 700px) { .mg-wrap { padding: 0 28px; } }
.mg-ic { flex: none; }
.mg-skip { position: absolute; left: -999px; top: 8px; background: var(--gul); padding: 8px 12px; z-index: 100; }
.mg-skip:focus { left: 8px; }
#callnowbutton, .call-now-button, .cnb-single { display: none !important; }

/* ---------- Typografi ---------- */
.mg-h1, .mg-h2, .mg-lead, .mg-plate__title, .mg-step__t, .mg-tile__name, .mg-footer__h, .mg-logo__word, .mg-btn, .mg-sec__sub {
	font-family: var(--font);
}
.mg-h1 {
	margin: 0 0 18px;
	font-size: clamp(2.15rem, 1.3rem + 4.2vw, 4.25rem);
	line-height: 1.02;
	font-weight: 800;
	font-stretch: 100%;
	letter-spacing: -0.015em;
	hyphens: manual;
	overflow-wrap: break-word;
	max-width: 15ch;
}
@media (min-width: 700px) { .mg-h1 { font-stretch: 112%; } }
.mg-lead {
	margin: 0 0 22px;
	font-size: clamp(1.1rem, 1rem + 0.5vw, 1.3rem);
	line-height: 1.45;
	font-weight: 500;
	color: var(--asfalt-2);
	max-width: 36em;
}
.mg-lead--rich p { margin: 0 0 12px; }
.mg-h2 {
	margin: 0 0 16px;
	font-size: clamp(1.6rem, 1.2rem + 1.6vw, 2.4rem);
	line-height: 1.1;
	font-weight: 800;
	font-stretch: 108%;
	letter-spacing: -0.01em;
	overflow-wrap: break-word;
	hyphens: manual;
}
.mg-sec__sub { margin: -6px 0 26px; font-size: 1.1rem; font-weight: 500; color: var(--mut); line-height: 1.4; }

/* Brødtekst */
.mg-rich { max-width: 66ch; }
.mg-rich > :first-child { margin-top: 0; }
.mg-rich p { margin: 0 0 16px; }
.mg-rich h3 { margin: 30px 0 10px; font-size: 1.25rem; line-height: 1.25; font-weight: 750; font-stretch: 104%; }
.mg-rich h4 { margin: 24px 0 8px; font-size: 1.08rem; }
.mg-rich ul, .mg-rich ol { margin: 0 0 18px; padding: 0; list-style: none; }
.mg-rich li { position: relative; padding: 6px 0 6px 30px; border-bottom: 1px solid var(--streg); }
.mg-rich li:last-child { border-bottom: 0; }
.mg-rich ul li::before {
	content: ""; position: absolute; left: 4px; top: 15px; width: 12px; height: 12px;
	background: var(--gul); border: 2px solid var(--asfalt); border-radius: 2px; transform: rotate(45deg);
}
.mg-rich ol { counter-reset: mg; }
.mg-rich ol li { counter-increment: mg; }
.mg-rich ol li::before { content: counter(mg); position: absolute; left: 0; top: 6px; font-weight: 800; }
.mg-rich a, .mg-plate__foot a, .mg-cta__body a {
	text-decoration: underline; text-decoration-color: var(--gul); text-decoration-thickness: 3px; text-underline-offset: 3px; font-weight: 600;
}
.mg-rich a:hover { text-decoration-color: var(--asfalt); }
.mg-rich strong { font-weight: 750; }

/* ---------- Knapper ---------- */
.mg-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 9px;
	min-height: 48px; padding: 11px 18px; border-radius: 8px;
	font-size: 1rem; font-weight: 750; font-stretch: 104%; line-height: 1.15; text-decoration: none !important;
	border: 2px solid transparent; cursor: pointer; transition: background-color .15s, border-color .15s, transform .15s;
	white-space: nowrap;
}
.mg-btn--lg { min-height: 56px; padding: 14px 22px; font-size: 1.07rem; }
.mg-btn--yellow { background: var(--gul); color: var(--asfalt); box-shadow: inset 0 -3px 0 rgba(0,0,0,.14); }
.mg-btn--yellow:hover { background: #FFD21F; }
.mg-btn--line { background: transparent; color: var(--asfalt); border-color: var(--asfalt); }
.mg-btn--line:hover { background: var(--asfalt); color: var(--hvid); }
.mg-btn--dark { background: var(--asfalt); color: var(--hvid); }
.mg-btn--dark:hover { background: #000; }
.mg-btn--darkline { background: transparent; color: var(--asfalt); border-color: var(--asfalt); }
.mg-btn--darkline:hover { background: rgba(35,39,43,.08); }
.mg-btn:active { transform: translateY(1px); }

/* ---------- Topbar + header ---------- */
.mg-topbar { display: none; background: var(--asfalt); color: #D6D9DB; font-size: .86rem; }
@media (min-width: 900px) { .mg-topbar { display: block; } }
.mg-topbar__in { display: flex; gap: 26px; align-items: center; min-height: 36px; }
.mg-topbar__in span { display: inline-flex; align-items: center; gap: 7px; }
.mg-topbar .mg-ic { color: var(--gul); }
.mg-topbar__cvr { margin-left: auto; }

.mg-header { position: sticky; top: 0; z-index: 50; background: var(--hvid); border-bottom: 1px solid var(--streg); }
.mg-header__in { display: flex; align-items: center; gap: 14px; min-height: 66px; }
.mg-logo { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--asfalt); flex: none; }
.mg-logo .mg-mark { width: 38px; height: 38px; }
.mg-logo__word { font-weight: 850; font-stretch: 118%; font-size: 1.14rem; letter-spacing: .01em; text-transform: uppercase; line-height: 1; }
@media (max-width: 380px) { .mg-logo__word { font-size: .98rem; font-stretch: 105%; } }
.mg-header__call { display: none; margin-left: auto; min-height: 44px; padding: 8px 14px; }
@media (min-width: 560px) { .mg-header__call { display: inline-flex; } }
.mg-burger { margin-left: auto; }
@media (min-width: 560px) { .mg-burger { margin-left: 0; } }
.mg-nowrap { white-space: nowrap; }
.mg-burger {
	display: inline-flex; align-items: center; gap: 6px; background: none; border: 2px solid var(--asfalt); border-radius: 8px;
	min-height: 44px; padding: 0 10px; color: var(--asfalt); font: 700 .95rem var(--font); cursor: pointer;
}
.mg-burger__close { display: none; }
.mg-burger[aria-expanded="true"] .mg-burger__open { display: none; }
.mg-burger[aria-expanded="true"] .mg-burger__close { display: inline; }
.mg-burger__label { display: none; }
@media (min-width: 420px) { .mg-burger__label { display: inline; } }

.mg-nav { display: none; }
.mg-nav.is-open {
	display: block; position: absolute; left: 0; right: 0; top: 100%;
	background: var(--hvid); border-bottom: 1px solid var(--streg); box-shadow: 0 20px 30px -20px rgba(35,39,43,.4);
	padding: 8px 16px 18px; max-height: calc(100vh - 66px); overflow-y: auto;
}
.mg-menu, .mg-menu ul { list-style: none; margin: 0; padding: 0; }
.mg-menu a { display: block; padding: 12px 4px; text-decoration: none; font-weight: 650; border-bottom: 1px solid var(--beton); }
.mg-menu .sub-menu a { padding-left: 18px; font-weight: 500; }
.mg-menu .current-menu-item:not(.menu-item-type-custom) > a { color: var(--asfalt); box-shadow: inset 4px 0 0 var(--gul); padding-left: 12px; }
.mg-menu .sub-menu .current-menu-item > a { padding-left: 26px; }
.mg-nav__contact { display: grid; gap: 10px; margin-top: 14px; }

@media (min-width: 1080px) {
	.mg-burger { display: none; }
	.mg-nav, .mg-nav.is-open { display: block; position: static; box-shadow: none; border: 0; padding: 0; max-height: none; overflow: visible; margin-left: auto; }
	.mg-nav__contact { display: none; }
	.mg-header__call { margin-left: 8px; }
	.mg-menu { display: flex; gap: 2px; }
	.mg-menu > li { position: relative; }
	.mg-menu > li > a { border: 0; padding: 22px 12px; font-size: .97rem; }
	.mg-menu > li.menu-item-has-children > a::after { content: ""; display: inline-block; width: 6px; height: 6px; margin-left: 7px; border: solid currentColor; border-width: 0 2px 2px 0; transform: translateY(-3px) rotate(45deg); }
	.mg-menu > .current-menu-item:not(.menu-item-type-custom) > a, .mg-menu > .current-menu-ancestor > a { box-shadow: inset 0 -4px 0 var(--gul); padding-left: 12px; }
	.mg-menu .sub-menu {
		position: absolute; left: 0; top: 100%; min-width: 280px; background: var(--hvid); border: 1px solid var(--streg); border-top: 4px solid var(--gul);
		border-radius: 0 0 8px 8px; padding: 6px 0; box-shadow: 0 18px 30px -18px rgba(35,39,43,.45);
		opacity: 0; visibility: hidden; transform: translateY(4px); transition: opacity .15s, transform .15s, visibility .15s;
	}
	.mg-menu li:hover > .sub-menu, .mg-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
	.mg-menu .sub-menu a { padding: 10px 18px; border: 0; font-weight: 550; }
	.mg-menu .sub-menu a:hover { background: var(--lys); }
	.mg-menu .sub-menu .current-menu-item > a { box-shadow: inset 4px 0 0 var(--gul); padding-left: 18px; }
}

/* ---------- Hero ---------- */
.mg-hero { background: var(--beton); padding: 26px 0 34px; border-bottom: 1px solid var(--streg); }
@media (min-width: 900px) { .mg-hero { padding: 56px 0 64px; } }
.mg-hero__grid { display: grid; gap: 26px; align-items: start; }
@media (min-width: 1000px) { .mg-hero__grid { grid-template-columns: minmax(0, 1.05fr) minmax(400px, .95fr); gap: 56px; } }
.mg-hero__text { min-width: 0; }
@media (min-width: 1000px) { .mg-hero__text { padding-top: 22px; } }
.mg-facts { list-style: none; margin: 0 0 24px; padding: 0; display: grid; gap: 8px; }
.mg-facts li { display: flex; gap: 10px; align-items: center; font-weight: 600; }
.mg-facts .mg-ic { color: var(--asfalt); background: var(--gul); border-radius: 50%; padding: 3px; width: 24px; height: 24px; }
.mg-hero__actions { display: grid; gap: 10px; margin-bottom: 18px; }
@media (min-width: 480px) { .mg-hero__actions { display: flex; flex-wrap: wrap; } }
.mg-hero__who { display: flex; gap: 8px; align-items: flex-start; margin: 0; color: var(--mut); font-size: .92rem; max-width: 46ch; }
.mg-hero__who .mg-ic { margin-top: 3px; }
.mg-hero__art { display: none; }
@media (min-width: 1000px) {
	.mg-hero__art { display: block; margin-top: 40px; }
	.mg-prose--drawing .mg-prose__grid { grid-template-columns: minmax(0, 1fr); }
	.mg-prose--drawing .mg-prose__aside { display: none; }
}
}

/* Mobil: formularen kommer lige efter overskriften; knapperne efter formularen. */
@media (max-width: 999px) {
	.mg-hero__grid:not(.mg-hero__grid--solo) { display: flex; flex-direction: column; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-hero__text { display: contents; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-h1 { order: 1; margin-bottom: 10px; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-lead { order: 2; margin-bottom: 4px; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-facts { order: 4; margin: 6px 0 0; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-hero__form { order: 3; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-hero__actions { order: 5; margin: 4px 0 0; }
	.mg-hero__grid:not(.mg-hero__grid--solo) .mg-hero__who { order: 6; }
}

/* ---------- Typeskiltet (formularen) ---------- */
.mg-plate {
	position: relative;
	padding: 30px 18px 22px;
	border-radius: 12px;
	border: 1px solid var(--alu-kant);
	background:
		repeating-linear-gradient(90deg, rgba(255,255,255,.28) 0 1px, rgba(255,255,255,0) 1px 3px),
		linear-gradient(170deg, var(--alu-1) 0%, #E2E5E6 45%, var(--alu-2) 100%);
	box-shadow: inset 0 1px 0 #fff, inset 0 -2px 0 rgba(0,0,0,.07), 0 22px 40px -22px rgba(35,39,43,.55);
}
@media (min-width: 480px) { .mg-plate { padding: 34px 26px 26px; } }
.mg-plate::before, .mg-plate::after {
	content: ""; position: absolute; left: 0; right: 0; height: 18px; pointer-events: none;
	background:
		radial-gradient(circle at 15px 50%, #FBFCFC 0 1.6px, #A9B0B3 2.2px 4.6px, rgba(0,0,0,.18) 5px, transparent 5.8px),
		radial-gradient(circle at calc(100% - 15px) 50%, #FBFCFC 0 1.6px, #A9B0B3 2.2px 4.6px, rgba(0,0,0,.18) 5px, transparent 5.8px);
}
.mg-plate::before { top: 6px; }
.mg-plate::after { bottom: 6px; }
.mg-plate__head {
	display: flex; align-items: center; gap: 10px; margin: 0 0 18px; padding: 8px 12px;
	background: var(--asfalt); color: var(--hvid); border-radius: 6px;
	box-shadow: inset 0 0 0 1px rgba(255,255,255,.08);
}
.mg-plate__head .mg-mark { width: 26px; height: 26px; }
.mg-plate__brand { font-weight: 850; font-stretch: 118%; text-transform: uppercase; letter-spacing: .02em; font-size: .9rem; }
.mg-plate__tag { margin-left: auto; font-size: .8rem; color: #C3C8CB; white-space: nowrap; }
@media (max-width: 400px) { .mg-plate__tag { display: none; } }
.mg-plate__title { margin: 0 0 4px; font-size: clamp(1.4rem, 1.15rem + 1vw, 1.85rem); line-height: 1.12; font-weight: 800; font-stretch: 108%; }
.mg-plate__title + .mg-plate__form { margin-top: 16px; }
.mg-plate__sub { margin: 0 0 18px; font-size: 1rem; font-weight: 500; line-height: 1.4; color: var(--asfalt-2); }
.mg-plate__foot { display: flex; gap: 8px; align-items: flex-start; margin: 14px 0 0; font-size: .9rem; color: var(--asfalt-2); }
.mg-plate__foot .mg-ic { margin-top: 3px; }

/* WPForms inde i skiltet – egne regler, da WPForms' CSS ikke indlæses. */
.mg-plate .wpforms-container { margin: 0 !important; }
.mg-plate .wpforms-field-container { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.mg-plate .wpforms-field { grid-column: 1 / -1; padding: 0 !important; margin: 0 !important; min-width: 0; }
.mg-plate .wpforms-field.mg-half { grid-column: auto; }
@media (max-width: 340px) { .mg-plate .wpforms-field.mg-half { grid-column: 1 / -1; } }
.mg-plate .wpforms-field-label { display: block; margin: 0 0 5px; font-size: .9rem; font-weight: 650; line-height: 1.25; color: var(--asfalt); }
.mg-plate .wpforms-required-label { color: var(--fejl); font-weight: 700; }
.mg-plate .wpforms-field-sublabel, .mg-plate .wpforms-field-description { font-size: .82rem; color: var(--mut); margin-top: 4px; }
.mg-plate input[type="text"], .mg-plate input[type="email"], .mg-plate input[type="tel"], .mg-plate input[type="number"], .mg-plate select, .mg-plate textarea {
	display: block; width: 100% !important; max-width: none !important; min-height: 48px; margin: 0;
	padding: 10px 12px; border: 1px solid #858D92; border-radius: 6px; background: var(--hvid);
	font: 400 17px/1.3 var(--font); color: var(--asfalt);
	box-shadow: inset 0 2px 3px rgba(35,39,43,.10);
	-webkit-appearance: none; appearance: none;
}
.mg-plate textarea { min-height: 92px; height: 92px; resize: vertical; }
.mg-plate select {
	padding-right: 38px; cursor: pointer;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%2323272B' stroke-width='2.2'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 14px center;
}
.mg-plate input::placeholder, .mg-plate textarea::placeholder { color: #8A9196; }
.mg-plate input:focus, .mg-plate select:focus, .mg-plate textarea:focus { outline: 3px solid var(--gul); outline-offset: 0; border-color: var(--asfalt); }
.mg-plate input[type="number"]::-webkit-inner-spin-button, .mg-plate input[type="number"]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.mg-plate input[type="number"] { -moz-appearance: textfield; }
.mg-plate .wpforms-error, .mg-plate em.wpforms-error, .mg-plate label.wpforms-error { display: block; margin-top: 5px; color: var(--fejl); font-size: .86rem; font-style: normal; font-weight: 600; }
.mg-plate input.wpforms-error, .mg-plate select.wpforms-error, .mg-plate textarea.wpforms-error { border: 2px solid var(--fejl); color: var(--asfalt); }
.mg-plate .wpforms-submit-container { padding: 0 !important; margin-top: 16px !important; position: relative; }
.mg-plate button.wpforms-submit {
	display: flex; align-items: center; justify-content: center; width: 100%; min-height: 58px; padding: 14px 18px;
	border: 0; border-radius: 8px; background: var(--gul); color: var(--asfalt) !important;
	font: 800 1.12rem/1.1 var(--font); font-stretch: 110%; cursor: pointer;
	box-shadow: inset 0 -4px 0 rgba(0,0,0,.16), 0 2px 0 var(--gul-dyb);
	text-transform: none; letter-spacing: 0;
}
.mg-plate button.wpforms-submit:hover { background: #FFD21F; }
.mg-plate button.wpforms-submit:active { transform: translateY(1px); }
.mg-plate .wpforms-submit-spinner { position: absolute; right: 16px; top: 50%; margin-top: -13px; width: 26px; height: 26px; }
.mg-plate .wpforms-field-hp, .mg-plate .wpforms-hidden, .mg-plate .wpforms-error-noscript, .mg-plate noscript { display: none !important; }
.mg-plate .wpforms-screen-reader-element { position: absolute !important; clip: rect(0,0,0,0); width: 1px; height: 1px; overflow: hidden; }
.mg-plate .wpforms-confirmation-container-full, .mg-plate .wpforms-confirmation-container {
	background: var(--hvid); border: 2px solid var(--asfalt); border-left: 8px solid var(--gul); border-radius: 8px; padding: 16px 18px; font-weight: 600;
}
.mg-plate .wpforms-confirmation-container-full p:last-child { margin-bottom: 0; }

/* ---------- Sektioner ---------- */
.mg-sec { padding: 52px 0; }
@media (min-width: 900px) { .mg-sec { padding: 84px 0; } }
.mg-sec + .mg-sec { border-top: 1px solid var(--streg); }
.mg-prose--plain { padding-top: 34px; }

.mg-prose__grid { display: grid; gap: 30px; }
@media (min-width: 960px) {
	.mg-prose--aside .mg-prose__grid { grid-template-columns: minmax(0, 1.25fr) minmax(0, .9fr); gap: 64px; align-items: start; }
	.mg-prose--aside .mg-prose__aside { position: sticky; top: 100px; }
}
.mg-prose__text { min-width: 0; }
.mg-more { margin-top: 22px !important; }

.mg-drawing { margin: 0; background: var(--hvid); border: 1px solid var(--streg); border-radius: var(--r); padding: 26px 22px 18px; }
.mg-drawing .mg-art { display: block; width: 100%; height: auto; }
.mg-drawing__hint { margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--streg); font-size: .82rem; color: var(--mut); }
.mg-photo { margin: 0; border-radius: var(--r); overflow: hidden; border: 1px solid var(--streg); background: var(--beton); }
.mg-photo img { width: 100%; height: auto; }
.mg-photo--inline { margin: 20px 0; max-width: 560px; }

/* Kontaktkort (kontaktsiden) */
.mg-prose--card .mg-rich { background: var(--hvid); border: 1px solid var(--streg); border-left: 6px solid var(--gul); border-radius: var(--r); padding: 22px 24px; max-width: 560px; }

/* Det køber vi / Læs også */
.mg-buy { background: var(--lys); }
.mg-tiles { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
.mg-tiles--small { grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); }
@media (max-width: 520px) { .mg-tiles, .mg-tiles--small { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; } .mg-tile { padding: 12px 10px 14px; } .mg-tile__name { font-size: .95rem; } }
.mg-tile {
	display: flex; flex-direction: column; height: 100%; text-decoration: none; color: var(--asfalt);
	background: var(--hvid); border: 1px solid var(--streg); border-radius: var(--r); padding: 14px 14px 16px;
	transition: border-color .15s, box-shadow .15s;
}
.mg-tile:hover { border-color: var(--asfalt); box-shadow: inset 0 -4px 0 var(--gul); }
.mg-tile__art { display: flex; align-items: center; justify-content: center; aspect-ratio: 16 / 10; margin-bottom: 10px; }
.mg-tile__art .mg-art { width: 100%; height: auto; }
.mg-tile__ic { display: grid; place-items: center; width: 72px; height: 72px; border-radius: 50%; background: var(--gul); }
.mg-tile__name { font-weight: 750; font-stretch: 104%; line-height: 1.2; font-size: 1.02rem; overflow-wrap: break-word; hyphens: manual; }
.mg-tile__desc { margin-top: 4px; font-size: .88rem; color: var(--mut); line-height: 1.35; }
.mg-not { display: flex; gap: 8px; align-items: center; margin: 20px 0 0; color: var(--mut); font-weight: 600; }

/* Trin */
.mg-steps { background: var(--asfalt); color: var(--hvid); border-top: 0 !important; }
.mg-steps .mg-sec__sub { color: #C3C8CB; }
.mg-steps__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: trin; }
@media (min-width: 860px) { .mg-steps__list { grid-template-columns: repeat(3, 1fr); gap: 0; } }
.mg-step { counter-increment: trin; position: relative; padding: 22px 22px 22px 22px; border: 1px solid #4A5157; border-radius: var(--r); }
@media (min-width: 860px) {
	.mg-step { border-radius: 0; border-right-width: 0; padding: 26px 28px 28px; }
	.mg-step:first-child { border-radius: var(--r) 0 0 var(--r); }
	.mg-step:last-child { border-radius: 0 var(--r) var(--r) 0; border-right-width: 1px; }
}
.mg-step::before {
	content: counter(trin); position: absolute; top: 18px; right: 20px;
	font-size: 3.4rem; line-height: 1; font-weight: 900; font-stretch: 125%; color: var(--gul);
}
.mg-step__ic { display: inline-grid; place-items: center; width: 52px; height: 52px; border-radius: 50%; background: var(--gul); color: var(--asfalt); margin-bottom: 14px; }
.mg-step__t { margin: 0 0 8px; font-size: 1.3rem; font-weight: 800; font-stretch: 106%; padding-right: 56px; }
.mg-step p { margin: 0; color: #D9DDDF; }

/* CTA-bånd */
.mg-cta { position: relative; background: var(--gul); padding: 50px 0 46px; }
.mg-cta::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 10px;
	background: repeating-linear-gradient(-45deg, var(--asfalt) 0 12px, var(--gul) 12px 24px);
}
.mg-cta__in { display: grid; gap: 22px; align-items: center; }
@media (min-width: 900px) { .mg-cta__in { grid-template-columns: 1.2fr auto; gap: 40px; } }
.mg-cta .mg-h2 { margin-bottom: 8px; }
.mg-cta__body p { margin: 0; font-size: 1.08rem; max-width: 52ch; }
.mg-cta__actions { display: grid; gap: 10px; }
@media (min-width: 480px) { .mg-cta__actions { display: flex; flex-wrap: wrap; } }

/* ---------- Footer ---------- */
.mg-footer { background: var(--asfalt); color: #D6D9DB; padding: 54px 0 0; font-size: .95rem; }
.mg-footer a { color: var(--hvid); text-decoration: none; }
.mg-footer a:hover { text-decoration: underline; text-decoration-color: var(--gul); text-decoration-thickness: 2px; }
.mg-footer__grid { display: grid; gap: 34px; }
@media (min-width: 860px) { .mg-footer__grid { grid-template-columns: 1.3fr 1fr 1.1fr; gap: 48px; } }
.mg-logo--light { color: var(--hvid); margin-bottom: 14px; }
.mg-footer__brand p { margin: 0 0 10px; max-width: 40ch; }
.mg-footer__not { display: flex; gap: 8px; align-items: center; color: #AEB4B8; }
.mg-footer__h { margin: 0 0 12px; font-size: 1rem; font-weight: 800; font-stretch: 108%; color: var(--hvid); }
.mg-footer__links, .mg-footer__contact { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.mg-footer__contact li, .mg-footer__contact a { display: flex; gap: 10px; align-items: flex-start; }
.mg-footer__contact .mg-ic { color: var(--gul); margin-top: 4px; }
.mg-footer__more { display: flex; gap: 18px; margin: 16px 0 0; }
.mg-footer__more a { text-decoration: underline; text-decoration-color: var(--gul); }
.mg-footer__bottom { display: flex; flex-wrap: wrap; gap: 10px 20px; justify-content: space-between; align-items: center; margin-top: 44px; padding-top: 18px; padding-bottom: 22px; border-top: 1px solid #3D444A; font-size: .85rem; color: #AEB4B8; }
.mg-sign { display: inline-flex; align-items: center; gap: 7px; padding: 5px 12px; border: 1px solid #4A5157; border-radius: 999px; color: #D6D9DB !important; }
.mg-sign .mg-ic { color: var(--gul); }
@media (max-width: 600px) { .mg-footer__bottom { flex-direction: column; text-align: center; } }

/* ---------- Mobil-bjælke ---------- */
.mg-dock {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
	display: grid; grid-template-columns: 1.15fr 1fr 1fr; gap: 6px; padding: 8px 8px calc(8px + env(safe-area-inset-bottom));
	background: var(--asfalt); box-shadow: 0 -8px 20px -10px rgba(0,0,0,.4);
}
@media (min-width: 900px) { .mg-dock { display: none; } }
.mg-dock__btn {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 52px;
	border-radius: 8px; color: var(--hvid) !important; text-decoration: none; font: 700 .8rem/1.1 var(--font); border: 1px solid #4A5157;
}
.mg-dock__btn--call { background: var(--gul); color: var(--asfalt) !important; border-color: var(--gul); font-size: .9rem; }

/* ---------- Bevægelse ---------- */
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.mg-body *, .mg-body *::before, .mg-body *::after { transition: none !important; animation: none !important; }
}
.mg-plate.is-flash { animation: mg-flash 1s ease-out 1; }
@keyframes mg-flash { 0% { box-shadow: 0 0 0 0 rgba(243,194,0,.9), 0 22px 40px -22px rgba(35,39,43,.55); } 100% { box-shadow: 0 0 0 18px rgba(243,194,0,0), 0 22px 40px -22px rgba(35,39,43,.55); } }


/* =====================================================================
 * v1.1.0 – illustrationer, kort og diagram
 * ===================================================================== */
.mg-ill { display: block; width: 100%; height: auto; }
.mg-pic { margin: 0; border-radius: 12px; overflow: hidden; border: 1px solid var(--streg); background: var(--beton); box-shadow: 0 18px 36px -24px rgba(35,39,43,.5); }
.mg-pic .mg-ill { aspect-ratio: auto; }
.mg-hero__art .mg-pic { max-width: 560px; }

/* Fliser med illustration */
.mg-tile { padding: 0 0 16px; overflow: hidden; }
.mg-tile__art { aspect-ratio: 4 / 3; margin: 0 0 12px; display: block; overflow: hidden; background: var(--beton); border-bottom: 1px solid var(--streg); }
.mg-tile__art .mg-ill { width: 100%; height: 100%; object-fit: cover; transition: transform .35s ease; }
.mg-tile:hover .mg-tile__art .mg-ill { transform: scale(1.04); }
.mg-tile__name, .mg-tile__desc { padding: 0 14px; }
@media (max-width: 520px) { .mg-tile { padding: 0 0 12px; } .mg-tile__name, .mg-tile__desc { padding: 0 10px; } }

/* Trin med illustration */
.mg-step { overflow: hidden; }
.mg-step__pic { display: block; margin: -22px -22px 0; aspect-ratio: 4 / 3; overflow: hidden; border-bottom: 1px solid #4A5157; }
@media (min-width: 860px) { .mg-step__pic { margin: -26px -28px 0; } }
.mg-step__pic .mg-ill { width: 100%; height: 100%; object-fit: cover; }
.mg-step__ic { position: relative; margin-top: -26px; border: 4px solid var(--asfalt); }
.mg-step::before {
	top: 14px; right: 14px; z-index: 1; font-size: 2rem; line-height: 1; padding: 8px 12px 6px;
	background: var(--asfalt); border-radius: 8px;
}
.mg-step__t { padding-right: 0; }

/* Diagram: hvad sker der med maskinen */
.mg-flowsec { background: var(--lys); }
.mg-flow { display: grid; gap: 18px; }
.mg-flow__start {
	display: grid; gap: 4px; align-content: center; justify-items: start;
	background: var(--hvid); border: 2px solid var(--asfalt); border-radius: 12px; padding: 18px 20px 20px;
}
.mg-flow__art { display: block; width: 100%; max-width: 220px; margin-bottom: 6px; }
.mg-flow__art .mg-art { width: 100%; height: auto; }
.mg-flow__start strong { font-size: 1.25rem; font-weight: 800; font-stretch: 108%; }
.mg-flow__start span:last-child { color: var(--mut); }
.mg-flow__lines { display: none; }
.mg-flow__ends { list-style: none; margin: 0; padding: 0 0 0 26px; display: grid; gap: 12px; position: relative; }
.mg-flow__ends::before { content: ""; position: absolute; left: 8px; top: -18px; bottom: 34px; border-left: 3px dashed var(--gul-dyb); }
.mg-flow__ends li { position: relative; display: flex; gap: 14px; align-items: flex-start; background: var(--hvid); border: 1px solid var(--streg); border-radius: 12px; padding: 16px 18px; }
.mg-flow__ends li::before { content: ""; position: absolute; left: -18px; top: 34px; width: 18px; border-top: 3px dashed var(--gul-dyb); }
.mg-flow__ic { flex: none; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--gul); color: var(--asfalt); }
.mg-flow__ends strong { display: block; font-size: 1.12rem; font-weight: 800; font-stretch: 106%; margin-bottom: 2px; }
.mg-flow__ends span { color: var(--asfalt-2); }
@media (min-width: 900px) {
	.mg-flow { grid-template-columns: minmax(240px, 300px) 140px minmax(0, 1fr); gap: 0; align-items: stretch; }
	.mg-flow__lines { display: block; width: 100%; height: 100%; }
	.mg-flow__lines path { fill: none; stroke: var(--gul-dyb); stroke-width: 3; stroke-dasharray: 8 8; vector-effect: non-scaling-stroke; animation: mg-dash 1.4s linear infinite; }
	.mg-flow__ends { padding: 0; gap: 0; grid-template-rows: repeat(3, 1fr); row-gap: 14px; }
	.mg-flow__ends::before, .mg-flow__ends li::before { display: none; }
	.mg-flow__ends li { align-items: center; }
}
@keyframes mg-dash { to { stroke-dashoffset: -16; } }

/* Danmarkskort */
.mg-mapsec { background: var(--beton); }
.mg-mapsec__grid { display: grid; gap: 30px; align-items: center; }
@media (min-width: 900px) { .mg-mapsec__grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 60px; } }
.mg-mapsec__text p { max-width: 52ch; margin: 0 0 18px; }
.mg-mapsec__list { list-style: none; margin: 0 0 20px; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.mg-mapsec__list li { display: flex; gap: 8px; align-items: center; font-weight: 650; }
.mg-mapsec__list .mg-ic { color: var(--asfalt); background: var(--gul); border-radius: 50%; padding: 3px; width: 22px; height: 22px; }
.mg-mapsec__home { display: flex; gap: 8px; align-items: center; color: var(--mut); }
.mg-mapsec__map { max-width: 460px; justify-self: center; width: 100%; }
.mg-map { display: block; width: 100%; height: auto; overflow: visible; }
.mg-map__land { fill: #D3D7D2; stroke: #A9AFAD; stroke-width: 1; stroke-linejoin: round; }
.mg-mapsec .mg-map__land { fill: #F7F7F4; }
.mg-map__route { fill: none; stroke: var(--asfalt); stroke-width: 2.2; stroke-dasharray: 6 6; animation: mg-dash 1.2s linear infinite; }
.mg-map__dot { fill: var(--gul); stroke: var(--asfalt); stroke-width: 2.5; }
.mg-map__label rect { fill: var(--hvid); stroke: var(--asfalt); stroke-width: 1.5; }
.mg-map__label text { font: 700 12px var(--font); fill: var(--asfalt); text-anchor: middle; }
.mg-map__home circle { fill: var(--asfalt); }
.mg-map__home .mg-map__homecore { fill: var(--gul); }
.mg-map__home { transform-box: fill-box; transform-origin: center; }
.mg-map__cap { margin: 12px 0 0; color: var(--mut); font-size: .92rem; text-align: center; }
.mg-prose__map { max-width: 440px; }
@media (min-width: 960px) { .mg-prose--card .mg-prose__grid { grid-template-columns: minmax(0, 1fr) minmax(0, .9fr); gap: 64px; align-items: center; } }

/* v1.1.1: illustration i "Din maskine"-kortet */
.mg-flow__start { padding: 0; overflow: hidden; align-content: stretch; justify-items: stretch; grid-template-rows: auto auto; }
.mg-flow__pic { display: block; aspect-ratio: 4 / 3; overflow: hidden; border-bottom: 2px solid var(--asfalt); background: var(--beton); }
.mg-flow__pic .mg-ill { width: 100%; height: 100%; object-fit: cover; object-position: center 70%; }
.mg-flow__txt { display: grid; gap: 4px; padding: 16px 20px 20px; }
.mg-flow__txt strong { font-size: 1.25rem; font-weight: 800; font-stretch: 108%; }
.mg-flow__txt span { color: var(--mut); }
@media (min-width: 900px) {
	.mg-flow__start { grid-template-rows: 1fr auto; }
	.mg-flow__pic { aspect-ratio: auto; min-height: 260px; }
}
.mg-flow__start .mg-flow__txt { color: var(--asfalt); }
.mg-flow__start .mg-flow__txt span { color: var(--mut); }
.mg-flow__start .mg-flow__txt strong { color: var(--asfalt); }

/* ---------- Spørgsmål og svar + faktaboks (v1.3.0) ---------- */
.mg-faq { background: var(--hvid); }
.mg-faq__list { display: grid; gap: 0; max-width: 880px; border-top: 2px solid var(--asfalt); }
.mg-faq__item { padding: 20px 0 18px; border-bottom: 1px solid var(--streg); }
.mg-faq__q { margin: 0 0 6px; font-size: 1.15rem; line-height: 1.3; font-weight: 750; font-stretch: 104%; display: flex; gap: 12px; }
.mg-faq__q::before { content: ""; flex: none; width: 10px; height: 10px; margin-top: .45em; background: var(--gul); border-radius: 2px; }
.mg-faq__a { margin: 0; padding-left: 22px; max-width: 70ch; color: var(--asfalt-2); }
@media (min-width: 900px) { .mg-faq__list { grid-template-columns: 1fr 1fr; column-gap: 48px; max-width: none; border-top: 0; } .mg-faq__item { border-top: 2px solid var(--asfalt); border-bottom: 0; } }
.mg-factbox__dl { margin: 0; max-width: 880px; background: var(--hvid); border: 1px solid var(--streg); border-left: 6px solid var(--gul); border-radius: var(--r); }
.mg-factbox__row { display: grid; gap: 2px 24px; padding: 12px 20px; border-bottom: 1px solid var(--streg); }
.mg-factbox__row:last-child { border-bottom: 0; }
.mg-factbox__row dt { font-weight: 750; font-stretch: 104%; }
.mg-factbox__row dd { margin: 0; color: var(--asfalt-2); }
@media (min-width: 700px) { .mg-factbox__row { grid-template-columns: 190px 1fr; } }
.mg-not a, .mg-footer__not a { color: inherit; text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.mg-not a:hover, .mg-footer__not a:hover { text-decoration-color: var(--gul); }