/* Stonebro · runde 2: Monolit (»Sten på plads«)
   Siden er bygget af plader: fuldbredde-flader med hårde kanter, mørk sten mod lys sten og store skalaspring.
   Én familie (Archivo) med bredde og vægt. Ingen accentfarve, ingen messing; farven kommer fra stenen og filmen.
   Billeder og plader har hårde kanter; kun knapperne er ovale. Tekst animeres ikke ind, plader lægges på plads. */

/* ---------------------------------------------------------------- Tokens */
:root {
  --ink: #0d0e0f;
  --ink-2: #1b1d1f;
  --slate: #34373a;
  --concrete: #8f8b84;
  --stone: #e6e2db;
  --stone-deep: #d9d4cc;
  --chalk: #f4f2ed;
  --white: #fff;
  --mute-l: rgba(13, 14, 15, 0.66);
  --mute-d: rgba(244, 242, 237, 0.68);
  --rule-l: rgba(13, 14, 15, 0.2);
  --rule-d: rgba(244, 242, 237, 0.2);
  --error: #9b2c22;
  --tex: url(../img/p-charcoal-soapstone-1-1280.webp);

  --font: "Archivo", "Archivo fallback", "Helvetica Neue", Arial, sans-serif;

  --t-cap: clamp(0.8125rem, 0.79rem + 0.12vw, 0.9375rem);
  --t-body: clamp(1.0625rem, 1.03rem + 0.16vw, 1.1875rem);
  --t-lead: clamp(1.1875rem, 1.06rem + 0.55vw, 1.5rem);
  --t-h3: clamp(1.5rem, 1.25rem + 1.05vw, 2.25rem);
  --t-h2: clamp(2.125rem, 1.5rem + 2.7vw, 4.25rem);
  --t-xl: clamp(2.75rem, 1.6rem + 5.2vw, 7rem);
  --t-mega: clamp(3.5rem, 1.6rem + 9.4vw, 12.5rem);

  --s1: 4px; --s2: 8px; --s3: 12px; --s4: 16px; --s5: 24px; --s6: 40px; --s7: 64px; --s8: 104px;
  --plate: clamp(5rem, 3rem + 7vw, 10.5rem);
  --g: max(16px, env(safe-area-inset-left));
  --maxw: 1680px;
  --header-h: 64px;
  --gutter: clamp(16px, 1.8vw, 32px);

  --heavy: cubic-bezier(0.7, 0, 0.16, 1);
  --settle: cubic-bezier(0.2, 0.7, 0.1, 1);
  color-scheme: light;
}
@media (min-width: 375px) { :root { --g: max(20px, env(safe-area-inset-left)); } }
@media (min-width: 768px) { :root { --g: clamp(28px, 3.4vw, 56px); --header-h: 76px; } }

/* ---------------------------------------------------------------- Grund */
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html {
  background: var(--ink);
  color: var(--ink);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--header-h) + 16px);
  scroll-padding-bottom: 96px;
  overflow-x: clip;
  -webkit-tap-highlight-color: transparent;
}
body {
  margin: 0;
  background: var(--stone);
  font-family: var(--font);
  font-size: var(--t-body);
  font-weight: 430;
  line-height: 1.55;
  font-kerning: normal;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: clip;
}
::selection { background: var(--ink); color: var(--chalk); }
[data-ground="ink"] ::selection { background: var(--chalk); color: var(--ink); }
img, video, svg { display: block; max-width: 100%; }
img { height: auto; }
picture { display: block; background: var(--c, transparent); }
h1, h2, h3, h4 { margin: 0; font-weight: 800; font-stretch: 104%; line-height: 1.02; letter-spacing: -0.03em; text-wrap: balance; }
p, ul, ol, dl, dd, figure, blockquote, address { margin: 0; }
p { max-width: 64ch; text-wrap: pretty; }
address { font-style: normal; }
button, input, select, textarea { font: inherit; color: inherit; }
button { touch-action: manipulation; }
main { display: block; outline: none; }
b, strong { font-weight: 700; }

.h-mega { font-size: var(--t-mega); font-weight: 850; font-stretch: 108%; letter-spacing: -0.052em; line-height: 0.86; }
.h-xl, .h1 { font-size: var(--t-xl); font-weight: 850; font-stretch: 107%; letter-spacing: -0.048em; line-height: 0.9; }
.h2 { font-size: var(--t-h2); font-weight: 800; font-stretch: 105%; letter-spacing: -0.04em; line-height: 0.96; }
.h3 { font-size: var(--t-h3); font-weight: 750; font-stretch: 102%; letter-spacing: -0.025em; line-height: 1.08; }
.lead { font-size: var(--t-lead); line-height: 1.42; font-weight: 450; letter-spacing: -0.008em; }
.cap { font-size: var(--t-cap); line-height: 1.45; font-weight: 500; color: var(--mute-l); }
.num { font-variant-numeric: tabular-nums lining-nums; }
.sr { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }

/* Grunde: hver plade siger, hvad den står på (den flydende pille læser det) */
[data-ground="ink"] { background: var(--ink); color: var(--chalk); }
[data-ground="ink"] .cap, [data-ground="ink"] .muted { color: var(--mute-d); }
[data-ground="gravel"] { background: var(--stone); color: var(--ink); }
[data-ground="gravel-deep"] { background: var(--stone-deep); color: var(--ink); }
[data-ground="paper"] { background: var(--chalk); color: var(--ink); }

/* ---------------------------------------------------------------- Links og fokus */
a { color: inherit; text-decoration-line: underline; text-decoration-thickness: 1px; text-underline-offset: 0.26em; text-decoration-color: var(--rule-l);
    transition: text-decoration-color 0.2s var(--settle); }
a:hover { text-decoration-color: currentColor; }
[data-ground="ink"] a { text-decoration-color: var(--rule-d); }
[data-ground="ink"] a:hover { text-decoration-color: currentColor; }
:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.pill:focus-visible, .film-ui__toggle:focus-visible, .filter:focus-visible, .choice:focus-within { outline: 2px solid var(--chalk); outline-offset: 2px; box-shadow: 0 0 0 5px var(--ink); }
.skip { position: fixed; left: var(--g); top: 12px; z-index: 200; transform: translateY(-160%); background: var(--chalk); color: var(--ink); padding: 12px 22px; border-radius: 999px; text-decoration: none; font-weight: 650; }
.skip:focus-visible { transform: none; }

/* ---------------------------------------------------------------- Ramme og gitter */
.frame { width: 100%; max-width: calc(var(--maxw) + 2 * var(--g)); margin-inline: auto; padding-inline: var(--g); }
.grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--gutter); }
@media (min-width: 640px) { .grid { grid-template-columns: repeat(8, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .grid { grid-template-columns: repeat(12, minmax(0, 1fr)); } }

/* ---------------------------------------------------------------- Knapper og pile */
.pill { display: inline-flex; align-items: center; justify-content: center; gap: 0.7em; min-height: 48px; padding: 0 26px; border: 0; border-radius: 999px;
        background: var(--ink); color: var(--chalk); font-family: var(--font); font-weight: 650; font-size: 1rem; line-height: 1; letter-spacing: -0.005em;
        text-decoration: none; cursor: pointer; white-space: nowrap;
        transition: background-color 0.3s var(--settle), color 0.3s var(--settle), transform 0.2s var(--settle); }
.pill:hover { background: var(--slate); }
.pill:active { transform: translateY(1px); }
.pill--light, [data-ground="ink"] .pill { background: var(--chalk); color: var(--ink); }
.pill--light:hover, [data-ground="ink"] .pill:hover { background: var(--white); }
.pill--big { min-height: 60px; padding: 0 32px; font-size: 1.0625rem; }
.pill--big::after { content: ""; width: 22px; height: 1.5px; background: currentColor; transition: width 0.45s var(--heavy); }
.pill--big:hover::after { width: 34px; }
.pill[aria-current="page"] { box-shadow: inset 0 0 0 2px currentColor; }
.actions { display: flex; flex-wrap: wrap; align-items: center; column-gap: var(--s6); row-gap: var(--s5); }
.textlink { font-weight: 650; }
.arrowlink { display: inline-flex; align-items: center; gap: 14px; font-weight: 650; text-decoration: none; padding: 8px 0; border-bottom: 1.5px solid currentColor; }
.arrowlink::after { content: ""; width: 26px; height: 1.5px; background: currentColor; transition: width 0.45s var(--heavy); }
.arrowlink:hover::after { width: 44px; }
.text-btn { min-height: 48px; padding: 0; background: none; border: 0; color: inherit; font-weight: 650; cursor: pointer; }
.icon-btn { display: inline-grid; place-items: center; width: 48px; height: 48px; padding: 0; background: none; border: 0; color: inherit; cursor: pointer; }
.icon-btn svg { width: 22px; height: 22px; }

/* ---------------------------------------------------------------- Header: altid kridt på sten */
.site-header { position: fixed; inset: 0 0 auto 0; z-index: 50; height: var(--header-h); color: var(--chalk); background: var(--ink);
               border-bottom: 1px solid var(--rule-d); transition: background-color 0.5s var(--settle), border-color 0.5s var(--settle); }
html.no-js .site-header { position: absolute; }
.is-home .site-header:not(.is-solid) { background: transparent; border-bottom-color: transparent; }
.site-header__in { height: 100%; max-width: calc(var(--maxw) + 2 * var(--g)); margin-inline: auto; padding-inline: var(--g);
                   display: flex; align-items: center; gap: clamp(20px, 2.4vw, 40px); }
.brand { display: inline-flex; align-items: center; min-height: 44px; color: inherit; text-decoration: none; margin-inline-end: auto; }
.brand__mark { height: 21px; width: auto; }
@media (min-width: 768px) { .brand__mark { height: 26px; } }
.wordmark-text { font-weight: 300; font-stretch: 112%; letter-spacing: 0.02em; font-size: 1.4rem; }
.nav { display: none; }
.nav ul { display: flex; align-items: center; gap: clamp(18px, 2vw, 32px); list-style: none; margin: 0; padding: 0; }
.nav a { position: relative; display: inline-block; padding-block: 14px; font-size: 0.9375rem; font-weight: 550; line-height: 1; text-decoration: none; }
.nav a::after { content: ""; position: absolute; left: 0; right: 100%; bottom: 7px; height: 1.5px; background: currentColor; transition: right 0.45s var(--heavy); }
.nav a:hover::after, .nav a[aria-current="page"]::after { right: 0; }
.lang { display: none; list-style: none; margin: 0; padding: 0; gap: 4px; }
.lang a { display: inline-block; padding: 12px 6px; font-size: 0.8125rem; font-weight: 650; letter-spacing: 0.02em; color: var(--mute-d); text-decoration: none; }
.lang a[aria-current] { color: var(--chalk); }
.lang a:hover { color: var(--chalk); }
.is-home .site-header:not(.is-solid) .lang a { color: var(--chalk); }
.is-home .site-header:not(.is-solid) .lang a[aria-current] { text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 0.4em; }
.site-header__cta { display: none; min-height: 44px; padding: 0 20px; font-size: 0.9375rem; }
.menu-btn { min-height: 48px; min-width: 48px; padding: 0 2px; background: none; border: 0; font-weight: 650; font-size: 1rem; cursor: pointer; color: inherit; }
@media (min-width: 1120px) {
  .nav, .lang { display: flex; }
  .site-header__cta { display: inline-flex; }
  .menu-btn { display: none; }
}
@media (max-width: 1119px) {
  html.no-js .site-header, html.menu-fallback .site-header { height: auto; position: absolute; }
  html.no-js .site-header__in, html.menu-fallback .site-header__in { flex-wrap: wrap; padding-block: 8px; row-gap: 0; }
  html.no-js .nav, html.menu-fallback .nav { display: block; width: 100%; }
  html.no-js .nav ul, html.menu-fallback .nav ul { flex-wrap: wrap; column-gap: 20px; row-gap: 0; }
  html.no-js .menu-btn, html.menu-fallback .menu-btn { display: none; }
}

/* Mobilmenuen: en mørk plade over hele skærmen (native <dialog>: fokus, Esc og inert baggrund) */
.sheet { position: fixed; inset: 0; width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
         display: none; flex-direction: column; overscroll-behavior: contain; background: var(--ink); color: var(--chalk); }
.sheet[open] { display: flex; animation: fade 0.24s var(--settle); }
.sheet::backdrop { background: var(--ink); }
.sheet__top { flex: none; height: var(--header-h); display: flex; align-items: center; justify-content: space-between; padding-inline: var(--g); border-bottom: 1px solid var(--rule-d); }
.sheet__close { min-height: 48px; min-width: 48px; background: none; border: 0; color: inherit; font-weight: 650; font-size: 1rem; cursor: pointer; text-align: right; }
.sheet__nav { flex: 1; overflow-y: auto; padding: clamp(20px, 5vh, 56px) var(--g) var(--s6); }
.sheet__nav ul { list-style: none; margin: 0; padding: 0; }
.sheet__nav li { border-top: 1px solid var(--rule-d); }
.sheet__nav li:last-child { border-bottom: 1px solid var(--rule-d); }
.sheet__nav a { display: block; padding: 10px 0 8px; font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; font-size: clamp(2.25rem, 9.6vw, 3.5rem); line-height: 1.02; text-decoration: none; color: var(--chalk); }
.sheet__nav a[aria-current="page"] { color: var(--mute-d); }
.sheet[open] .sheet__nav li { animation: lay 0.5s var(--heavy) both; }
.sheet[open] .sheet__nav li:nth-child(2) { animation-delay: 40ms; }
.sheet[open] .sheet__nav li:nth-child(3) { animation-delay: 80ms; }
.sheet[open] .sheet__nav li:nth-child(4) { animation-delay: 120ms; }
.sheet[open] .sheet__nav li:nth-child(5) { animation-delay: 160ms; }
.sheet[open] .sheet__nav li:nth-child(6) { animation-delay: 200ms; }
.sheet__foot { flex: none; display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5) var(--s6); padding: var(--s5) var(--g) calc(var(--s6) + env(safe-area-inset-bottom)); }
.sheet__mail { color: var(--mute-d); }
.lang--sheet, .lang--foot { display: flex; }
@keyframes fade { from { opacity: 0; } }
@keyframes lay { from { opacity: 0; transform: translateY(-14px); } }

/* ---------------------------------------------------------------- Loader: kun navnet og en tynd bar */
.loader { display: none; }
html.arrive .loader { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; background: var(--ink); color: var(--chalk);
                      pointer-events: none; animation: loader-out 0.3s var(--heavy) 0.9s forwards; }
.loader__in { display: grid; justify-items: stretch; gap: 24px; width: clamp(168px, 22vw, 320px); }
.loader__mark { width: 100%; height: auto; }
.loader__bar { display: block; height: 1px; background: var(--chalk); transform: scaleX(0); transform-origin: left; animation: loader-bar 0.9s var(--heavy) forwards; }
@keyframes loader-bar { to { transform: scaleX(1); } }
@keyframes loader-out { to { opacity: 0; visibility: hidden; } }

/* ---------------------------------------------------------------- Plader lægges på plads; billeder eksponeres */
html.js-ready .rise { opacity: 0; transform: translateY(-30px); transition: transform 1.15s var(--heavy), opacity 0.8s var(--settle); }
html.js-ready .rise.is-in { opacity: 1; transform: none; }
.expose { position: relative; }
.expose::after { content: ""; position: absolute; inset: 0; background: var(--ink); opacity: 0; pointer-events: none; transition: opacity 1.1s var(--settle); }
html.js-ready .expose:not(.is-exposed)::after { opacity: 0.45; }
.fig { margin: 0; }
.fig img { width: 100%; height: 100%; object-fit: cover; }
.fig figcaption, .caption { margin-top: var(--s3); font-size: var(--t-cap); line-height: 1.45; font-weight: 500; color: var(--mute-l); max-width: 46ch; }
[data-ground="ink"] .fig figcaption, [data-ground="ink"] .caption { color: var(--mute-d); }
.fig--end figcaption { margin-inline-start: auto; text-align: right; }
.ratio-32 { aspect-ratio: 3 / 2; }
.ratio-45 { aspect-ratio: 4 / 5; }
.ratio-34 { aspect-ratio: 3 / 4; }
.ratio-wide { aspect-ratio: 21 / 10; }
.fig .frame-img { overflow: hidden; }
.fig .frame-img picture, .fig .frame-img img { width: 100%; height: 100%; }

/* ================================================================ FORSIDEN */

/* 1 · Heroen: filmen i fuld skærm, titlen lægges ned på en stenplade */
.hero { position: relative; isolation: isolate; height: 100svh; min-height: 620px; display: flex; flex-direction: column; justify-content: flex-end; overflow: hidden;
        --hero-fs: min(16.4vw, calc((100vw - 2 * var(--g)) / var(--fit-d, 4.7)), 290px); }
.hero__media { position: absolute; inset: 0; z-index: -2; background: var(--ink); }
.hero__poster, .hero__poster img, .hero__video { position: absolute; inset: 0; width: 100%; height: 100%; }
.hero__poster img, .hero__video { object-fit: cover; object-position: 50% 38%; }
.hero__video { opacity: 0; transition: opacity 0.9s var(--settle); }
.hero.is-playing .hero__video { opacity: 1; }
.hero__shade { position: absolute; inset: 0; z-index: -1; pointer-events: none;
               background: linear-gradient(180deg, rgba(13, 14, 15, 0.74) 0, rgba(13, 14, 15, 0.4) 16%, rgba(13, 14, 15, 0) 34%),
                           linear-gradient(0deg, rgba(13, 14, 15, 0.92) 0, rgba(13, 14, 15, 0.62) 40%, rgba(13, 14, 15, 0.28) 66%, rgba(13, 14, 15, 0) 84%); }
.hero__head { position: relative; z-index: 2; padding-inline: var(--g); max-width: calc(var(--maxw) + 2 * var(--g)); width: 100%; margin-inline: auto; }
.hero__title { font-size: var(--hero-fs); font-weight: 850; font-stretch: 108%; letter-spacing: -0.055em; line-height: 0.8;
               margin: 0 0 -0.135em -0.05em; color: var(--chalk); text-wrap: initial; }
.hero__title .hero__w { display: inline-block; }
.hero__title .hero__w:first-child { display: block; }
.film-ui { position: absolute; z-index: 3; top: calc(var(--header-h) + 18px); right: var(--g); display: flex; flex-direction: column; align-items: flex-end; gap: 10px; color: var(--chalk); }
.film-ui__cap { display: flex; align-items: center; gap: 14px; margin: 0; padding: 7px 14px; border-radius: 999px; background: rgba(13, 14, 15, 0.5); font-size: 0.875rem; font-weight: 600; }
.film-ui__prog { display: block; width: 120px; height: 2px; background: rgba(244, 242, 237, 0.3); position: relative; overflow: hidden; }
.film-ui__prog b { position: absolute; inset: 0; background: var(--chalk); transform-origin: 0 50%; transform: scaleX(0); }
.film-ui__toggle { min-height: 40px; padding: 0 14px; border: 1px solid rgba(244, 242, 237, 0.4); border-radius: 999px; background: rgba(13, 14, 15, 0.36);
                   color: var(--chalk); font-size: 0.8125rem; font-weight: 650; cursor: pointer; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.film-ui__toggle:hover { border-color: var(--chalk); }
html.no-js .film-ui__cap { display: none; }
.hero__plate { position: relative; z-index: 1; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: center; gap: clamp(24px, 3.4vw, 56px);
               padding: calc(var(--hero-fs) * 0.2 + 26px) var(--g) clamp(28px, 3vw, 44px);
               background: linear-gradient(rgba(13, 14, 15, 0.6), rgba(13, 14, 15, 0.76)), var(--ink) var(--tex) 50% 42% / cover; }
.hero__lede { max-width: 34ch; font-size: clamp(1.0625rem, 0.95rem + 0.45vw, 1.3125rem); line-height: 1.42; font-weight: 450; color: var(--chalk); }
.hero__price { display: grid; gap: 4px; text-decoration: none; padding-inline-start: clamp(20px, 2.4vw, 40px); border-inline-start: 1px solid rgba(244, 242, 237, 0.32); }
.hero__price b { font-size: clamp(1.625rem, 1.2rem + 1.2vw, 2.375rem); font-weight: 850; font-stretch: 110%; letter-spacing: -0.035em; line-height: 1; }
.hero__price span { font-size: 0.9375rem; color: var(--mute-d); font-weight: 550; }
.hero__price:hover span { color: var(--chalk); }
html.js-ready .hero__plate { animation: plate-up 1.15s var(--heavy) 0.1s both; }
html.js-ready .hero__title .hero__w { animation: lay-down 1.05s var(--heavy) both; }
html.js-ready .hero__title .hero__w:first-child { animation-delay: 0.45s; }
html.js-ready .hero__title .hero__w + .hero__w { animation-delay: 0.6s; }
html.js-ready .film-ui { animation: fade 1s var(--settle) 1.1s both; }
html.arrive.js-ready .hero__plate { animation-delay: 0.95s; }
html.arrive.js-ready .hero__title .hero__w:first-child { animation-delay: 1.2s; }
html.arrive.js-ready .hero__title .hero__w + .hero__w { animation-delay: 1.32s; }
html.arrive.js-ready .film-ui { animation-delay: 1.7s; }
@keyframes plate-up { from { transform: translateY(101%); } }
@keyframes lay-down { from { transform: translateY(-0.32em); } }

/* 2 · Prisen: sidens største tal */
.deal { padding-block: var(--plate); overflow: hidden; }
.deal__title { display: grid; margin: 0; font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; text-wrap: initial; }
.deal__pre { font-size: clamp(2rem, 1.2rem + 3vw, 4rem); line-height: 1; margin: 0 0 0.1em 0.04em; }
.deal__num { font-size: min(38vw, calc((100vw - 2 * var(--g)) / var(--fit, 2.7)), 640px); font-weight: 900; font-stretch: 104%; letter-spacing: -0.07em; line-height: 0.78;
             margin-left: -0.065em; white-space: nowrap; }
.deal__num > span { display: inline-block; padding: 0.04em 0.06em 0.06em 0; color: var(--ink); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
  .deal__num > span { background: var(--ink) var(--tex) 30% 50% / 120% auto; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
}
.deal__post { justify-self: end; text-align: right; font-size: clamp(2.5rem, 1.2rem + 5.4vw, 6.75rem); line-height: 0.92; margin-top: 0.25em; }
.deal__body { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(32px, 6vw, 120px); margin-top: clamp(56px, 7vw, 112px);
              padding-top: clamp(28px, 3vw, 44px); border-top: 2px solid var(--ink); }
.deal__body:has(.calc--big) { grid-template-columns: minmax(0, 1fr); gap: clamp(28px, 3vw, 48px); }
.deal__body:has(.calc--big) .deal__why { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--gutter); align-items: end; }
.deal__brands { color: var(--mute-l); font-size: var(--t-body) !important; font-weight: 500 !important; letter-spacing: 0 !important; line-height: 1.5 !important; max-width: 34ch !important; }
.deal__why p { font-size: clamp(1.3125rem, 1rem + 1.1vw, 1.875rem); line-height: 1.3; font-weight: 500; letter-spacing: -0.012em; max-width: 24ch; }
.deal__why .deal__more { margin-top: var(--s5); font-size: var(--t-body); font-weight: 600; }
.deal__why .deal__brands { margin-top: var(--s4); }
.calc--big .calc__row { grid-template-columns: 140px minmax(0, 1fr); }
.calc--big .calc__track { height: clamp(88px, 8vw, 128px); }
.calc--big .calc__bar { padding: 0 24px; }
.calc--big .calc__bar b { font-size: clamp(1.75rem, 1.2rem + 1.6vw, 3rem); }
.calc--big .calc__gap i { font-size: clamp(0.875rem, 0.7rem + 0.5vw, 1.25rem); padding: 6px 12px; }
.calc--big .calc__cap { padding-inline-start: 158px; }

.calc { margin: 0; display: grid; gap: 10px; }
.calc__rows { display: grid; gap: 12px; }
.calc__row { display: grid; grid-template-columns: 112px minmax(0, 1fr); align-items: center; gap: 18px; color: inherit; text-decoration: none; }
.calc__label { font-weight: 700; font-size: 0.9375rem; }
.calc__track { position: relative; height: 60px; display: flex; }
.calc__bar { position: relative; height: 100%; width: calc(var(--v) * 1%); display: flex; align-items: center; justify-content: flex-end; padding: 0 16px;
             background: var(--concrete); color: var(--ink); transition: width 1.5s var(--heavy) 0.25s; }
.calc__bar b { font-size: 1.375rem; font-weight: 850; font-stretch: 108%; letter-spacing: -0.03em; }
.calc__bar--us { background: var(--ink) var(--tex) 50% 50% / cover; color: var(--chalk); }
.calc__gap { width: calc(var(--v) * 1%); position: relative; display: flex; align-items: center; justify-content: center;
             border: 1.5px solid var(--ink); border-left: 0; transition: opacity 0.6s var(--settle) 1.4s;
             background: repeating-linear-gradient(-45deg, rgba(13, 14, 15, 0.75) 0 1.5px, transparent 1.5px 9px); }
.calc__gap i { font-style: normal; font-weight: 800; font-size: 0.875rem; background: var(--stone); padding: 4px 8px; white-space: nowrap; }
.axis { display: grid; grid-template-columns: 112px minmax(0, 1fr); gap: 18px; }
.axis__ticks { display: flex; justify-content: space-between; border-top: 1px solid var(--ink); padding-top: 8px; font-size: 0.75rem; font-weight: 600; color: var(--mute-l); }
.axis__ticks span { position: relative; width: 0; display: flex; justify-content: center; }
.axis__ticks span::before { content: ""; position: absolute; top: -8px; width: 1px; height: 6px; background: var(--ink); }
.calc__cap { padding-inline-start: 130px; font-size: 0.875rem; line-height: 1.5; color: var(--mute-l); max-width: 60ch; }
.calc__cap span { display: block; margin-top: 4px; }
html.js-ready .calc:not(.is-in) .calc__bar { width: 0; }
html.js-ready .calc:not(.is-in) .calc__gap { opacity: 0; }
.calc--ranges .calc__row { grid-template-columns: 112px minmax(0, 1fr) 8.5em; }
.calc--ranges .axis { grid-template-columns: 112px minmax(0, 1fr) 8.5em; }
.calc--ranges .calc__track { height: 48px; background: repeating-linear-gradient(90deg, transparent 0 calc(100% / 7 - 1px), var(--rule-l) calc(100% / 7 - 1px) calc(100% / 7)); }
.ranges__bar { position: absolute; top: 0; bottom: 0; left: calc(var(--a) * 1%); width: calc((var(--b) - var(--a)) * 1%); background: var(--ink) var(--tex) 50% 50% / cover;
               transition: width 1.4s var(--heavy) 0.25s; }
html.js-ready .calc--ranges:not(.is-in) .ranges__bar { width: 0; }
.ranges__val { font-weight: 700; font-size: 0.9375rem; white-space: nowrap; }
.ranges__row:hover .calc__label { text-decoration: underline; text-underline-offset: 0.26em; }

/* 3 · Processen som kædemål */
.proc { padding-block: var(--plate); }
.proc__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--s5) var(--s6); }
.steps-row { list-style: none; margin: clamp(48px, 6vw, 96px) 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--gutter); }
.step { display: flex; flex-direction: column; gap: 12px; border-top: 2px solid var(--ink); padding-top: 16px; }
.step__n { order: -1; font-size: clamp(3.5rem, 2rem + 4vw, 6.5rem); font-weight: 200; font-stretch: 125%; letter-spacing: -0.04em; line-height: 0.8; }
.step__media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--stone); margin: 8px 0 6px; }
.step__media picture, .step__media img, .step__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.step__media video { opacity: 0; transition: opacity 0.6s var(--settle); }
.step__media.is-playing video { opacity: 1; }
.step__media--drawing { background: var(--white); border: 1px solid var(--rule-l); }
.step__media--drawing img { object-position: 0 40%; transform: scale(1.4); transform-origin: 0 42%; mix-blend-mode: multiply; }
.step__h { font-size: clamp(1.375rem, 1.1rem + 0.9vw, 2rem); font-weight: 800; font-stretch: 105%; letter-spacing: -0.035em; line-height: 1.02; }
.step__body { color: var(--mute-l); font-size: 1rem; max-width: 30ch; }
.dims { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: 30px; margin-top: clamp(40px, 4vw, 64px); }
.dim { position: relative; display: grid; gap: 4px; align-content: start; padding-top: 24px; max-width: none; }
.dim__line { position: absolute; left: 0; right: 0; top: 9px; height: 1px; background: currentColor; }
.dim__line::before, .dim__line::after { content: ""; position: absolute; top: -8px; width: 1px; height: 17px; background: currentColor; }
.dim__line::before { left: 0; }
.dim__line::after { right: 0; }
.dim b { font-size: clamp(1.75rem, 1.1rem + 2.2vw, 3.25rem); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; }
.dim__sub { color: var(--mute-l); font-size: 0.9375rem; font-weight: 500; }
.dim__steps { font-size: 0.8125rem; font-weight: 700; color: var(--mute-l); }
@media (min-width: 1101px) { .dim b { white-space: nowrap; } .dim__steps { display: none; } }

/* 4 · Hele pladen og materialerne */
.slabs { padding-block: var(--plate); }
.slabs__head { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 4fr); gap: var(--s6); align-items: end; }
.slabs__intro { font-size: var(--t-lead); color: var(--mute-d); max-width: 26ch; }
.stage { --dim: 40px; margin: clamp(48px, 6vw, 96px) 0 0; display: grid; grid-template-columns: var(--dim) minmax(0, 1fr); grid-template-rows: var(--dim) auto auto; }
.stage__frame { grid-column: 2; grid-row: 2; position: relative; overflow: hidden; aspect-ratio: var(--sw) / var(--sh); background: var(--c, var(--ink-2)); transition: aspect-ratio 0.9s var(--heavy); }
.stage__frame picture { position: absolute; inset: 0; background: transparent; }
.stage__frame img { width: 100%; height: 100%; object-fit: cover; transition: opacity 0.5s var(--settle), transform 1.2s var(--heavy); }
.stage.is-swapping .stage__frame img { opacity: 0; transform: scale(1.03); }
.stage__dim { position: relative; display: flex; align-items: center; justify-content: center; color: var(--mute-d); font-size: 0.8125rem; font-weight: 600; font-variant-numeric: tabular-nums; }
.stage__dim::before { content: ""; position: absolute; background: var(--mute-d); }
.stage__dim span { position: relative; background: var(--ink); padding: 0 12px; white-space: nowrap; }
.stage__dim--x { grid-column: 2; grid-row: 1; border-inline: 1px solid var(--mute-d); margin-bottom: 12px; }
.stage__dim--x::before { left: 0; right: 0; top: 50%; height: 1px; }
.stage__dim--y { grid-column: 1; grid-row: 2; border-block: 1px solid var(--mute-d); margin-right: 12px; }
.stage__dim--y::before { top: 0; bottom: 0; left: 50%; width: 1px; }
.stage__dim--y span { transform: rotate(-90deg); }
.stage__dim i { font-style: normal; }
.stage__dim--x .d-h, .stage__dim--y .d-w { display: none; }
.stage__cap { grid-column: 2; grid-row: 3; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; padding-top: 20px; }
.stage__cap b { font-size: clamp(1.625rem, 1.1rem + 1.6vw, 2.625rem); font-weight: 850; font-stretch: 108%; letter-spacing: -0.035em; line-height: 1; }
.stage__cap span { color: var(--mute-d); font-size: 0.9375rem; font-weight: 550; }
.pick { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; margin: 32px 0 0 40px; }
.pick__btn { display: grid; grid-template-columns: 52px minmax(0, 1fr); align-items: center; gap: 12px; min-height: 68px; text-align: left; padding: 8px 10px 8px 8px;
             font-size: 0.875rem; font-weight: 600; line-height: 1.2; background: var(--ink-2); border: 0; border-top: 2px solid transparent; color: var(--mute-d); cursor: pointer;
             transition: background-color 0.3s, color 0.3s, border-color 0.3s; }
.pick__btn picture, .pick__btn img { width: 52px; height: 52px; }
.pick__btn img { object-fit: cover; }
.pick__btn:hover { color: var(--chalk); background: #24272a; }
.pick__btn[aria-checked="true"] { color: var(--chalk); border-top-color: var(--chalk); background: #26292c; }
.mats { list-style: none; margin: clamp(72px, 9vw, 140px) 0 0; padding: 0; border-bottom: 1px solid var(--rule-d); }
.mat { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 4fr) minmax(0, 3fr); grid-template-areas: "name line img" "name meta img";
       column-gap: var(--gutter); align-items: center; min-height: clamp(104px, 9vw, 152px); padding: 14px 0; border-top: 1px solid var(--rule-d); color: inherit; text-decoration: none; }
.mat__name { grid-area: name; font-size: clamp(2.5rem, 1.4rem + 4vw, 5.5rem); font-weight: 850; font-stretch: 108%; letter-spacing: -0.048em; line-height: 0.95; }
.mat__line { grid-area: line; align-self: end; font-size: clamp(1.0625rem, 0.95rem + 0.4vw, 1.3125rem); font-weight: 500; }
.mat__meta { grid-area: meta; align-self: start; color: var(--mute-d); font-size: 0.9375rem; }
.mat__img { grid-area: img; align-self: stretch; position: relative; overflow: hidden; background: var(--ink-2); min-height: 76px; }
.mat__img picture { position: absolute; inset: 0; background: transparent; }
.mat__img picture, .mat__img img { width: 100%; height: 100%; }
.mat__img img { object-fit: cover; transform: scale(1.02); transition: transform 1.4s var(--heavy); }
.mat:hover .mat__img img { transform: scale(1.09); }
.mat:hover .mat__name { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 0.12em; }
.mat__img--drawn, .mat-item__img--drawn { background: repeating-linear-gradient(-45deg, var(--rule-d) 0 1.5px, transparent 1.5px 10px); border: 1.5px solid var(--rule-d); }
.mat-item__img--drawn { border-color: var(--rule-l); background-color: transparent; background-image: repeating-linear-gradient(-45deg, var(--rule-l) 0 1.5px, transparent 1.5px 12px); }
.mat__img--drawn { background-color: transparent; }
.slabs__all { margin-top: var(--s6); }

/* 5 · Monteret */
.work { padding-block: clamp(32px, 4vw, 64px) 0; }
.work__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: var(--s5); margin-bottom: clamp(40px, 5vw, 80px); }
.work__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-rows: auto 34vw 28vw; gap: 6px; }
.work__grid figure { position: relative; margin: 0; overflow: hidden; background: var(--ink-2); }
.work__grid picture { position: absolute; inset: 0; }
.work__grid img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.6s var(--heavy); }
.work__grid figure:hover img { transform: scale(1.025); }
.work__grid figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px var(--g) 16px 18px; font-size: 0.875rem; font-weight: 600; color: var(--chalk);
                         background: linear-gradient(0deg, rgba(13, 14, 15, 0.72), rgba(13, 14, 15, 0)); }
.work__w--0 { grid-column: 1 / -1; aspect-ratio: 21 / 9; }
.work__w--0 img { object-position: 50% 62%; }
.work__w--1 { grid-column: 1 / span 7; }
.work__w--2 { grid-column: 8 / -1; grid-row: 2 / span 2; }
.work__w--3 { grid-column: 1 / span 4; }
.work__w--4 { grid-column: 5 / span 3; }

/* 6 · Kunderne */
.voices { padding-block: var(--plate); }
.voices__in { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(40px, 6vw, 112px); }
.voice { margin: 0; display: flex; flex-direction: column; justify-content: space-between; gap: var(--s6); border-top: 2px solid var(--ink); padding-top: 30px; }
.voice blockquote { margin: 0; quotes: "»" "«"; }
.voice blockquote p { font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2.375rem); font-weight: 600; font-stretch: 102%; letter-spacing: -0.028em; line-height: 1.16; max-width: 30ch; }
.voice blockquote p::before { content: open-quote; margin-left: -0.42em; }
.voice blockquote p::after { content: close-quote; }
.voice figcaption { font-weight: 700; font-size: 1rem; }

/* 2b · Tillid (runde 3, kun dansk): »Ja, vi er fra Estland.« Spørgsmålene i køberens egne ord, svar man selv kan tjekke.
   Mørk sten med lys fra oven; registreringsnummeret står i modvægten (vægt 200, bredde 125 %) ligesom »2002«. */
.trust { position: relative; isolation: isolate; overflow: hidden; padding-block: var(--plate); }
.trust__air { position: absolute; inset: 0; z-index: -1; pointer-events: none;
              background: radial-gradient(80% 60% at 88% 0%, rgba(244, 242, 237, 0.1), transparent 62%),
                          linear-gradient(rgba(13, 14, 15, 0.8), rgba(13, 14, 15, 0.95) 70%), var(--ink) var(--tex) 50% 30% / cover; }
.trust__head { display: grid; grid-template-columns: minmax(0, 8fr) minmax(0, 4fr); gap: var(--s5) var(--gutter); align-items: end; }
.trust__head .h2 { max-width: 15ch; }
.trust__lead { font-size: var(--t-lead); line-height: 1.38; color: var(--mute-d); max-width: 20ch; padding-bottom: 0.45em; }
.qa { list-style: none; margin: clamp(40px, 5vw, 88px) 0 0; padding: 0; }
.qa__row { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s5) var(--gutter); padding-block: clamp(28px, 3.4vw, 56px); border-top: 1px solid var(--rule-d); }
.qa__row:last-child { border-bottom: 1px solid var(--rule-d); }
.qa__q { font-size: var(--t-h3); font-weight: 750; font-stretch: 102%; letter-spacing: -0.025em; line-height: 1.08; max-width: 14ch; }
.qa__a { display: grid; gap: var(--s5); align-content: start; }
.qa__a > p { color: var(--mute-d); max-width: 46ch; }
.qa__big { font-size: clamp(1.375rem, 1rem + 1.2vw, 2.125rem); font-weight: 600; letter-spacing: -0.024em; line-height: 1.2; color: var(--chalk) !important; max-width: 24ch !important; }
.qa__reg { display: grid; justify-items: start; gap: 14px; text-decoration: none; }
.qa__num { font-size: clamp(3rem, 1.2rem + 5.4vw, 7.25rem); font-weight: 200; font-stretch: 125%; letter-spacing: -0.035em; line-height: 0.84; margin-left: -0.06em; white-space: nowrap; }
.qa__go { display: inline-flex; align-items: center; gap: 14px; font-weight: 650; padding: 8px 0; border-bottom: 1.5px solid currentColor; }
.qa__go::after { content: ""; width: 26px; height: 1.5px; background: currentColor; transition: width 0.45s var(--heavy); }
.qa__reg:hover .qa__go::after { width: 44px; }
.qa__voices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(24px, 3vw, 56px); }
.trust .voice { gap: var(--s5); padding-top: 22px; border-top: 1px solid var(--chalk); }
.trust .voice blockquote p { font-size: clamp(1.1875rem, 0.95rem + 0.75vw, 1.625rem); font-weight: 550; line-height: 1.3; }
.trust .voice figcaption { color: var(--mute-d); font-size: 0.9375rem; font-weight: 650; }
.deal__calc { margin-top: var(--s6); max-width: none; }
.calc--big + .deal__calc { padding-inline-start: 158px; }
.calc--ranges + .deal__calc { padding-inline-start: 130px; }
.qa__a .arrowlink { color: var(--chalk); }
@media (max-width: 767px) { .calc--big + .deal__calc, .calc--ranges + .deal__calc { padding-inline-start: 0; } }
@media (max-width: 1023px) {
  .trust__head, .qa__row { grid-template-columns: minmax(0, 1fr); }
  .qa__voices { grid-template-columns: minmax(0, 1fr); }
}

/* 7 · Siden 2002, over varevognen */
.origin { color: var(--chalk); padding-bottom: var(--plate); }
.origin__film { position: relative; isolation: isolate; min-height: 92svh; display: flex; align-items: flex-end; overflow: hidden; }
.origin__media { position: absolute; inset: 0; z-index: -2; margin: 0; background: var(--ink-2); }
.origin__media picture, .origin__media img, .origin__media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.origin__media video { opacity: 0; transition: opacity 0.6s var(--settle); }
.origin__media.is-playing video { opacity: 1; }
.origin__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(13, 14, 15, 0.94) 0, rgba(13, 14, 15, 0.55) 42%, rgba(13, 14, 15, 0.1) 80%); }
.origin__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 30ch); align-items: end; gap: var(--s6); padding-bottom: clamp(48px, 6vw, 96px); }
.origin__title { font-size: min(20vw, 340px); font-weight: 200; font-stretch: 125%; letter-spacing: -0.06em; line-height: 0.78; margin-left: -0.05em; white-space: nowrap; }
.crew { padding-top: clamp(56px, 6vw, 104px); }
.crew__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.crew__w { margin: 0; }
.crew__w picture { aspect-ratio: 16 / 10; overflow: hidden; }
.crew__w img { width: 100%; height: 100%; object-fit: cover; }
.crew__w figcaption { margin-top: var(--s3); font-size: var(--t-cap); font-weight: 500; color: var(--mute-d); }
.crew__promise { margin-top: clamp(56px, 7vw, 120px); max-width: 24ch; font-size: clamp(1.875rem, 1.2rem + 2.6vw, 3.75rem); font-weight: 500; font-stretch: 100%; letter-spacing: -0.03em; line-height: 1.08; text-wrap: balance; }
.origin__title span { display: block; font-size: 0.2em; font-weight: 850; font-stretch: 108%; letter-spacing: -0.04em; margin: 0 0 0.25em 0.3em; }
.origin__text { font-size: clamp(1.0625rem, 0.95rem + 0.4vw, 1.375rem); line-height: 1.5; padding-bottom: 0.4em; }

/* 8 · Invitationen, på deres egen tegning */
.invite { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(96px, 12vw, 200px) clamp(64px, 7vw, 112px); }
.invite__drawing { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.invite__drawing picture { width: 100%; height: 100%; background: transparent; }
.invite__drawing img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 40%; filter: invert(1); mix-blend-mode: screen; opacity: 0.14; }
.invite__in .h-mega { max-width: 12ch; }
.invite__body { margin-top: var(--s5); font-size: var(--t-lead); color: var(--mute-d); }
.invite__act { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5) var(--s6); margin-top: clamp(36px, 4vw, 64px); max-width: none; }
.invite__mail { font-size: clamp(1.25rem, 1rem + 0.8vw, 1.75rem); font-weight: 700; letter-spacing: -0.02em; text-decoration: none; border-bottom: 1.5px solid var(--rule-d); padding-bottom: 4px; }
.invite__mail:hover { border-bottom-color: var(--chalk); }
.invite__clock { margin-top: var(--s6); padding-top: var(--s4); border-top: 1px solid var(--rule-d); max-width: 46ch; }
.invite--short .invite__line { max-width: 14ch; }

/* Haapsalu-tid */
.clock { display: flex; align-items: baseline; gap: 10px; min-height: 1.6em; font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); }
.clock__dot { flex: none; width: 7px; height: 7px; border-radius: 50%; border: 1px solid currentColor; transform: translateY(-1px); }
.clock.is-open .clock__dot { background: currentColor; }
[data-ground="ink"] .clock { color: var(--mute-d); }

/* ================================================================ UNDERSIDER */

/* Sidehoveder: en mørk plade med stor titel */
.page-head { padding-top: calc(var(--header-h) + clamp(56px, 8vw, 136px)); padding-bottom: clamp(48px, 6vw, 104px); }
.page-head .grid { row-gap: var(--s5); align-items: end; }
.page-head__h { grid-column: 1 / -1; max-width: 14ch; }
.page-head__h.h2 { font-size: var(--t-xl); font-weight: 850; font-stretch: 107%; letter-spacing: -0.048em; line-height: 0.92; }
.page-head__lead { grid-column: 1 / -1; color: var(--mute-d); }
.page-head__lead .lead { color: var(--chalk); }
.page-head__lead .lead + p { margin-top: var(--s5); }
.page-head--band { padding-bottom: 0; }
.page-band { margin: clamp(40px, 5vw, 80px) 0 0; aspect-ratio: 21 / 9; max-height: 74svh; width: 100%; overflow: hidden; background: var(--ink-2); }
.page-band picture, .page-band img { width: 100%; height: 100%; }
.page-band img { object-fit: cover; }
.slab-wrap .page-band--granite { margin: 0; }
@media (min-width: 1024px) {
  .page-head__h { grid-column: 1 / 9; }
  .page-head__lead { grid-column: 9 / 13; padding-bottom: 0.4em; }
}
.invite--short { padding-block: clamp(72px, 9vw, 160px); }

/* ---------------------------------------------------------------- Materialer */
.mat-head { padding-top: calc(var(--header-h) + clamp(56px, 8vw, 136px)); padding-bottom: clamp(48px, 6vw, 104px); }
.mat-head .grid { row-gap: var(--s6); }
.mat-head__main { grid-column: 1 / -1; }
.mat-head__main .h2 { font-size: var(--t-xl); font-weight: 850; font-stretch: 107%; letter-spacing: -0.048em; line-height: 0.92; max-width: 12ch; }
.mat-head__main .lead { margin-top: var(--s5); }
.mat-head__main p:not(.lead) { margin-top: var(--s5); color: var(--mute-d); }
.mat-head__main .mat-ref { color: var(--chalk); }
.mat-head__facts { grid-column: 1 / -1; }
@media (min-width: 640px) { .mat-head__main { grid-column: 1 / 6; } .mat-head__facts { grid-column: 6 / 9; padding-top: var(--s7); } }
@media (min-width: 1024px) { .mat-head__main { grid-column: 1 / 8; } .mat-head__facts { grid-column: 9 / 13; padding-top: var(--s8); } }
.facts { display: grid; grid-template-columns: max-content 1fr; align-content: start; align-self: start; margin: 0; }
.facts dt, .facts dd { padding-block: var(--s3); border-top: 1px solid var(--rule-d); }
.facts dt { padding-inline-end: var(--s5); font-size: var(--t-cap); font-weight: 500; color: var(--mute-d); line-height: 1.9; }
.facts dd { margin: 0; font-weight: 600; }
.facts dt:last-of-type, .facts dd:last-of-type { border-bottom: 1px solid var(--rule-d); }
.mat-head .price { margin-top: var(--s6); font-size: var(--t-h3); font-weight: 800; font-stretch: 106%; letter-spacing: -0.03em; line-height: 1.1; color: var(--chalk) !important; max-width: 24ch; }
.mat-head .price small { display: block; margin-top: var(--s3); font-size: var(--t-body); font-weight: 430; letter-spacing: 0; line-height: 1.55; color: var(--mute-d); max-width: 46ch; }
.mat-ref { margin-top: var(--s5); }
.mat-body { padding-block: var(--plate) 0; }
.mat-body__in { grid-column: 1 / -1; padding-top: var(--s5); border-top: 2px solid var(--ink); }
.mat-body__text { font-size: var(--t-lead); line-height: 1.45; font-weight: 450; max-width: 52ch; }
.mat-body .mat-ref { color: var(--mute-l); }
@media (min-width: 1024px) { .mat-body__in { grid-column: 1 / 10; } }

/* Pladen i fuld skala (materialesiderne og dialogen) */
.slab { margin: 0; padding-block: var(--s6) var(--plate); --slab-h: 52svh; }
@media (min-width: 1024px) { .slab { --slab-h: 70svh; } }
.slab__view { position: relative; }
.slab[data-full="0"] .slab__centre, .slab:not(.is-scrollable) .slab__centre { display: none; }
.slab__ruler[hidden] { display: none; }
.check[hidden] { display: none; }
html:not(.js-ready) .filters, html:not(.js-form) [data-next], html:not(.js-form) .form__summary { display: none; }
.granite-shots { row-gap: var(--s6); }
.granite-shots .fig { grid-column: 1 / -1; }
@media (min-width: 640px) { .granite-shots .fig:first-child { grid-column: 1 / 6; } .granite-shots .fig:last-child { grid-column: 5 / 9; margin-top: var(--s8); } }
@media (min-width: 1024px) { .granite-shots .fig:first-child { grid-column: 1 / 8; } .granite-shots .fig:last-child { grid-column: 9 / 13; margin-top: var(--s8); } }
.slab__scroller { position: relative; overflow-x: auto; overflow-y: hidden; overscroll-behavior-x: contain; scrollbar-width: none; touch-action: pan-x pan-y pinch-zoom;
                  padding-inline: var(--g); scroll-padding-inline: var(--g); }
.slab.is-scrollable .slab__scroller { cursor: grab; }
.slab__scroller::-webkit-scrollbar { display: none; }
.slab__scroller.is-dragging { cursor: grabbing; user-select: none; }
.slab__scroller:focus-visible { outline-offset: -2px; }
.slab__sheet { position: relative; height: calc(var(--slab-h) + 34px); width: calc(var(--slab-h) * var(--slab-ar)); }
.slab__img { position: relative; height: var(--slab-h); width: 100%; overflow: hidden; background: var(--c, var(--ink-2)); }
.slab__img picture, .slab__img img { width: 100%; height: 100%; }
.slab__img img { object-fit: cover; -webkit-user-drag: none; user-select: none; pointer-events: none; }
.slab__lamp { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity 0.6s var(--settle);
              background: radial-gradient(80% 70% at 18% 10%, transparent 30%, rgba(13, 14, 15, 0.32) 100%), oklch(0.86 0.06 70 / 0.40); mix-blend-mode: multiply; }
.slab.is-lamp .slab__lamp { opacity: 1; }
.slab__band { position: absolute; left: 0; right: 0; top: 14%; height: calc(60 / var(--slab-h-cm, 144) * 100%); border-block: 1px dashed rgba(244, 242, 237, 0.85);
              background: rgba(244, 242, 237, 0.08); pointer-events: none; }
.slab__band[hidden] { display: none; }
.slab__ruler { position: absolute; left: 0; right: 0; bottom: 0; height: 34px; color: var(--mute-d); }
.slab__ruler svg { width: 100%; height: 100%; overflow: visible; }
.slab__ruler text { font-family: var(--font); font-size: 11px; font-weight: 600; fill: var(--mute-d); font-variant-numeric: tabular-nums; }
.slab__ruler line { stroke: var(--mute-d); stroke-width: 1; }
.slab__centre { position: absolute; left: 50%; bottom: 0; width: 2px; height: 14px; background: var(--chalk); transform: translateX(-1px); pointer-events: none; }
.slab__meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--s4) var(--s6); margin-top: var(--s5); }
.slab__name { font-size: var(--t-h3); font-weight: 850; font-stretch: 108%; letter-spacing: -0.035em; line-height: 1.05; }
.slab__sub { font-size: var(--t-cap); font-weight: 500; color: var(--mute-d); margin-top: var(--s2); }
.slab__read { font-size: var(--t-cap); font-weight: 600; color: var(--mute-d); min-width: 13ch; }
.slab__tools { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5) var(--s6); margin-top: var(--s5); }
.slab__tools .cap { flex-basis: 100%; margin-top: calc(-1 * var(--s3)); color: var(--mute-d); }
@media (min-width: 1024px) { .slab__tools .cap { flex-basis: auto; margin-top: 0; } }
.seg { display: inline-flex; gap: var(--s5); margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.seg legend { float: left; margin-inline-end: var(--s5); padding: 0; font-size: var(--t-cap); color: var(--mute-d); line-height: 44px; }
.seg label { position: relative; display: inline-flex; align-items: center; min-height: 44px; cursor: pointer; font-weight: 600; }
.seg input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.seg label span { padding-block: 6px; border-bottom: 2px solid transparent; transition: border-color 0.2s var(--settle); }
.seg input:checked + span { border-bottom-color: currentColor; }
.seg input:focus-visible + span { outline: 2px solid currentColor; outline-offset: 4px; }
.check { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; cursor: pointer; font-weight: 600; }
.check input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); }
.slab .pill { background: var(--chalk); color: var(--ink); }
.slab .pill:hover { background: var(--white); }
.slab .check input, [data-ground="ink"] .check input { accent-color: var(--chalk); }

/* Farvebiblioteket */
.library { padding-block: var(--plate); }
.library__head { display: grid; gap: var(--s5); }
.library__head .h2 { max-width: 16ch; }
.library__head p { color: var(--mute-l); }
@media (min-width: 1024px) { .library__head { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; }
  .library__head .h2 { grid-column: 1 / 8; } .library__head p { grid-column: 9 / 13; } }
.filters { display: grid; gap: var(--s3); margin-top: var(--s6); padding-top: var(--s5); border-top: 2px solid var(--ink); }
.filters__row { display: flex; align-items: center; gap: var(--s2); overflow-x: auto; scrollbar-width: none; white-space: nowrap; padding: 6px; margin: -6px; }
.filters__row::-webkit-scrollbar { display: none; }
.filters__label { flex: none; min-width: 6.5em; font-size: var(--t-cap); font-weight: 600; color: var(--mute-l); }
.filter { flex: none; min-height: 40px; padding: 0 16px; background: transparent; border: 1px solid var(--rule-l); border-radius: 999px; cursor: pointer; font-weight: 550; font-size: 0.9375rem;
          transition: background-color 0.2s, color 0.2s, border-color 0.2s; }
.filter:hover { border-color: var(--ink); }
.filter[aria-pressed="true"] { background: var(--ink); color: var(--chalk); border-color: var(--ink); }
.filters__count { font-size: var(--t-cap); font-weight: 600; color: var(--mute-l); min-height: 1.5em; margin-top: var(--s2); }
.offcuts { list-style: none; margin: var(--s6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) 6px; }
@media (min-width: 640px) { .offcuts { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .offcuts { grid-template-columns: repeat(6, minmax(0, 1fr)); } }
.offcuts li[hidden] { display: none; }
.offcuts > li { content-visibility: auto; contain-intrinsic-size: auto 320px; }
.offcut { display: block; width: 100%; padding: 0; background: none; border: 0; text-align: left; cursor: pointer; }
.offcut__img { display: block; aspect-ratio: 3 / 4; overflow: hidden; background: var(--c, var(--stone-deep)); }
.offcut__img picture, .offcut__img img { width: 100%; height: 100%; }
.offcut__img img { object-fit: cover; transition: transform 1.2s var(--heavy); }
.offcut:hover .offcut__img img { transform: scale(1.05); }
.offcut__name { display: block; margin-top: var(--s3); font-weight: 700; line-height: 1.3; }
.offcut__brand { display: block; font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); }
.offcut:focus-visible { outline-offset: 4px; }
.names { list-style: none; margin: var(--s6) 0 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s4) var(--gutter); }
@media (min-width: 640px) { .names { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .names { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.names li { padding-block: var(--s3); border-top: 1px solid var(--rule-l); font-weight: 600; }
.names .swatch { display: block; aspect-ratio: 6 / 1; margin-bottom: var(--s3); overflow: hidden; background: var(--stone-deep); }
.names .swatch img { width: 100%; height: 100%; object-fit: cover; }

/* Pladedialogen */
.slab-dialog { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--ink); color: var(--chalk); overscroll-behavior: contain; }
.slab-dialog[open] { display: flex; flex-direction: column; animation: dialog-in 0.32s var(--settle); }
.slab-dialog::backdrop { background: rgba(13, 14, 15, 0.7); }
.slab-dialog__top { flex: none; display: flex; justify-content: flex-end; align-items: center; height: var(--header-h); padding-inline: var(--g); }
.slab-dialog__close { min-height: 44px; padding: 0 18px; border: 1px solid var(--rule-d); border-radius: 999px; background: none; color: inherit; font-weight: 650; font-size: 0.9375rem; cursor: pointer; }
.slab-dialog__close:hover { border-color: var(--chalk); }
.slab-dialog__body { flex: 1; overflow-y: auto; }
.slab-dialog .slab { padding-top: 0; }
@media (min-width: 1024px) { .slab-dialog { inset: 3vh 3vw; width: auto; height: auto; } }
@keyframes dialog-in { from { opacity: 0; transform: scale(0.985); } }

/* Materialeoversigten */
.mat-list { list-style: none; margin: 0; padding: var(--plate) 0; display: grid; gap: clamp(56px, 7vw, 120px); }
.mat-item a { display: grid; gap: var(--s5); text-decoration: none; color: inherit; }
.mat-item__img { overflow: hidden; aspect-ratio: 16 / 9; background: var(--ink-2); }
.mat-item__img picture, .mat-item__img img { width: 100%; height: 100%; }
.mat-item__img img { object-fit: cover; transition: transform 1.6s var(--heavy); }
.mat-item__img--board { display: grid; grid-template-rows: repeat(4, minmax(0, 1fr)); gap: 4px; background: var(--stone); }
.mat-item__img--board picture { width: 100%; height: 100%; overflow: hidden; }
.mat-item a:hover .mat-item__img img { transform: scale(1.03); }
.mat-item__name { font-size: var(--t-h2); font-weight: 850; font-stretch: 106%; letter-spacing: -0.042em; line-height: 0.96; overflow-wrap: break-word; hyphens: manual; }
.mat-item__text { max-width: 44ch; margin-top: var(--s4); font-size: var(--t-lead); line-height: 1.42; }
.mat-item__meta { font-size: var(--t-cap); font-weight: 600; color: var(--mute-l); margin-top: var(--s3); }
.mat-item__go { display: inline-flex; margin-top: var(--s3); font-weight: 650; border-bottom: 1.5px solid currentColor; padding-bottom: 4px; }
@media (min-width: 1024px) {
  .mat-item a { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; }
  .mat-item__img { grid-column: 1 / 8; aspect-ratio: 3 / 2; }
  .mat-item__body { grid-column: 9 / 13; padding-bottom: var(--s5); }
  .mat-item:nth-child(even) .mat-item__img { grid-column: 6 / 13; grid-row: 1; }
  .mat-item:nth-child(even) .mat-item__body { grid-column: 1 / 5; grid-row: 1; }
}
.claim { padding-block: var(--plate); }
.claim__in { grid-column: 1 / -1; }
.claim p:first-child { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.04em; line-height: 0.98; max-width: 18ch; }
.claim .cap { margin-top: var(--s4); }

/* ---------------------------------------------------------------- Vaske */
.series { padding-block: var(--plate); }
.series__list { list-style: none; margin: 0; padding: 0; display: grid; }
.series__item { display: grid; gap: var(--s5); padding-block: var(--s6); border-top: 2px solid var(--ink); }
.series__imgs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; }
.series__imgs .sink { aspect-ratio: 1; background: var(--chalk); display: grid; place-items: center; padding: 8%; }
.series__imgs picture { background: transparent; width: 100%; height: 100%; }
.series__imgs img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.series__name { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; }
.series__text p { margin-top: var(--s4); }
.series__models { margin-top: var(--s3); font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); max-width: 52ch; }
@media (min-width: 1024px) {
  .series__item { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: start; }
  .series__text { grid-column: 1 / 6; }
  .series__imgs { grid-column: 7 / 13; }
}

/* ---------------------------------------------------------------- Projekter */
.chapters { padding-bottom: var(--plate); }
.chapter { padding-block: var(--plate) 0; }
.chapter__head { display: grid; gap: var(--s4); margin-bottom: var(--s6); padding-top: var(--s5); border-top: 2px solid var(--ink); }
.chapter__head .h3 { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; }
.chapter__head p { color: var(--mute-l); }
@media (min-width: 1024px) { .chapter__head { grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); align-items: end; }
  .chapter__head .h3 { grid-column: 1 / 8; } .chapter__head p { grid-column: 9 / 13; } }
.shots { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s6) 6px; }
.shot { grid-column: 1 / -1; margin: 0; }
.shot button { display: block; width: 100%; padding: 0; background: none; border: 0; cursor: zoom-in; }
.shot__img { overflow: hidden; aspect-ratio: var(--ar, 3 / 2); background: var(--stone-deep); }
.shot__img picture, .shot__img img { width: 100%; height: 100%; }
.shot__img img { object-fit: cover; transition: transform 1.6s var(--heavy); }
.shot button:hover .shot__img img { transform: scale(1.025); }
@media (min-width: 640px) {
  .shots { grid-template-columns: repeat(8, minmax(0, 1fr)); }
  .shot:nth-child(4n+2) { grid-column: 1 / 6; }
  .shot:nth-child(4n+3) { grid-column: 6 / 9; }
  .shot:nth-child(4n+4) { grid-column: 1 / 4; }
  .shot:nth-child(4n+1) { grid-column: 4 / 9; }
}
@media (min-width: 1024px) {
  .shots { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .shot:nth-child(4n+2) { grid-column: 1 / 8; }
  .shot:nth-child(4n+3) { grid-column: 8 / 13; }
  .shot:nth-child(4n+4) { grid-column: 1 / 6; }
  .shot:nth-child(4n+1) { grid-column: 6 / 13; }
}
.shot--wide { grid-column: 1 / -1 !important; margin-inline: calc(-1 * var(--g)) !important; }
.shot--wide figcaption { margin-inline-start: var(--g) !important; }
.lightbox { width: 100%; height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--ink); color: var(--chalk); overscroll-behavior: contain; }
.lightbox[open] { display: grid; grid-template-rows: var(--header-h) 1fr auto; animation: dialog-in 0.32s var(--settle); }
.lightbox::backdrop { background: var(--ink); }
.lightbox__top { display: flex; justify-content: space-between; align-items: center; padding-inline: var(--g); color: var(--mute-d); font-size: var(--t-cap); }
.lightbox__stage { position: relative; min-height: 0; display: grid; place-items: center; padding-inline: var(--g); }
.lightbox__stage img { max-width: 100%; max-height: 100%; width: auto; height: auto; object-fit: contain; }
.lightbox__bar { display: flex; justify-content: space-between; align-items: center; gap: var(--s5); padding: var(--s4) var(--g) calc(var(--s5) + env(safe-area-inset-bottom)); }
.lightbox__cap { color: var(--mute-d); font-size: var(--t-cap); }
.lightbox__nav { display: flex; gap: var(--s2); }

/* ---------------------------------------------------------------- Sådan arbejder vi */
.steps { padding-bottom: var(--plate); }
.steps__list { list-style: none; margin: 0; padding: 0; display: grid; counter-reset: step; }
.steps__list .step { display: grid; gap: var(--s4); padding-block: var(--s6); border-top: 2px solid var(--ink); counter-increment: step; }
.steps__list .step::before { content: counter(step); font-size: clamp(3.5rem, 2rem + 4vw, 6.5rem); font-weight: 200; font-stretch: 125%; letter-spacing: -0.04em; line-height: 0.8; }
.steps__list .step h2 { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; }
.steps__list .step p { color: var(--mute-l); max-width: 60ch; }
.step__fig { margin: var(--s2) 0 0; aspect-ratio: 16 / 10; overflow: hidden; background: var(--stone-deep); }
.step__fig picture, .step__fig img { width: 100%; height: 100%; }
.step__fig img { object-fit: cover; }
#inquiry .step__fig { background: var(--white); }
#inquiry .step__fig img { object-position: 0 40%; transform: scale(1.4); transform-origin: 0 42%; mix-blend-mode: multiply; }
@media (min-width: 1024px) {
  .steps__list .step { grid-template-columns: minmax(0, 2fr) minmax(0, 4fr) minmax(0, 5fr); grid-template-areas: "n h fig" "n p fig"; column-gap: var(--gutter); align-items: start; }
  .steps__list .step::before { grid-area: n; }
  .steps__list .step h2 { grid-area: h; }
  .steps__list .step p { grid-area: p; }
  .steps__list .step .step__fig { grid-area: fig; margin: 0; }
}

/* ---------------------------------------------------------------- Om os, kontakt og jura */
.prose { display: grid; gap: var(--s5); }
.prose p { max-width: 62ch; }
.about-body { padding-block: var(--plate); }
.about-body .grid { row-gap: var(--s6); }
.about-body__text { grid-column: 1 / -1; font-size: var(--t-lead); line-height: 1.45; }
.about-body__people { grid-column: 1 / -1; }
.about-body__people .arrowlink { margin-top: var(--s5); }
.people--big li { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 1; padding-block: 12px 8px; }
@media (min-width: 1024px) { .about-body__text { grid-column: 1 / 7; } .about-body__people { grid-column: 8 / 13; } }
.about-body .crew__w figcaption, .about-body .crew { color: var(--ink); }
.people { list-style: none; margin: var(--s5) 0 0; padding: 0; display: grid; gap: var(--s4); }
.people li { display: grid; gap: 2px; padding-top: var(--s3); border-top: 1px solid var(--rule-l); font-weight: 700; }
.people a { font-weight: 500; }
.contact-grid { padding-block: var(--plate); }
.contact-grid .grid { row-gap: var(--s7); }
.contact-grid__info { grid-column: 1 / -1; display: grid; gap: var(--s6); align-content: start; }
.contact-grid__faq { grid-column: 1 / -1; }
@media (min-width: 640px) { .contact-grid__info { grid-column: 1 / 4; } .contact-grid__faq { grid-column: 4 / 9; } }
@media (min-width: 1024px) { .contact-grid__info { grid-column: 1 / 5; } .contact-grid__faq { grid-column: 6 / 13; } }
.contact-grid__info .cap { margin-bottom: var(--s2); }
.faq { border-top: 2px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--rule-l); }
.faq summary { display: flex; justify-content: space-between; gap: var(--s5); align-items: baseline; padding-block: var(--s5); cursor: pointer; list-style: none;
               font-size: clamp(1.1875rem, 1rem + 0.6vw, 1.5rem); font-weight: 750; font-stretch: 104%; letter-spacing: -0.02em; line-height: 1.2; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; flex: none; width: 11px; height: 11px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-3px) rotate(45deg); transition: transform 0.24s var(--settle); }
.faq details[open] summary::after { transform: translateY(2px) rotate(-135deg); }
.faq details > div { padding-bottom: var(--s5); max-width: 58ch; color: var(--mute-l); }
.doc { padding-block: var(--plate); }
.doc__in { grid-column: 1 / -1; }
@media (min-width: 1024px) { .doc__in { grid-column: 1 / 9; } }
.doc section { padding-top: var(--s5); border-top: 2px solid var(--ink); }
.doc section + section { margin-top: var(--s7); }
.doc h2 { font-size: var(--t-h3); font-weight: 800; font-stretch: 105%; letter-spacing: -0.03em; line-height: 1.1; margin-bottom: var(--s4); }
.doc p + p { margin-top: var(--s4); }
.doc .cap { margin-bottom: var(--s6); }
.installments-example { margin-top: var(--s6); padding-top: var(--s5); border-top: 1px solid var(--rule-l); font-size: var(--t-cap); color: var(--mute-l); max-width: 62ch; }

/* ---------------------------------------------------------------- Tilbudsformularen */
.quote { padding-block: var(--plate); }
.quote__in { grid-column: 1 / -1; }
@media (min-width: 1024px) { .quote__in { grid-column: 1 / 9; } }
.form { display: grid; gap: var(--s7); }
.form fieldset { margin: 0; padding: 0; border: 0; min-inline-size: 0; }
.form__step { display: grid; gap: var(--s6); }
.form__steplabel { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s5); padding-top: var(--s4); border-top: 2px solid var(--ink); }
.form__steplabel legend, .form__steplabel h2 { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; padding: 0; }
.form__steplabel .cap { flex: none; }
.form__summary { display: none; padding: var(--s4) var(--s5); background: var(--stone-deep); align-items: baseline; justify-content: space-between; gap: var(--s5); }
.form.is-step2 .form__summary { display: flex; }
.form.is-step2 [data-step="1"] { display: none; }
html.js-form .form:not(.is-step2) [data-step="2"] { display: none; }
.field { display: grid; gap: var(--s2); }
.field > label, .field > .field__label, .choices legend { font-weight: 700; font-size: 1rem; padding: 0; }
.field__hint { font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); }
.field__opt { font-weight: 500; color: var(--mute-l); font-size: var(--t-cap); }
.input, .select, .textarea { width: 100%; min-height: 52px; padding: 12px 14px; background: var(--chalk); border: 1px solid rgba(13, 14, 15, 0.5); border-radius: 0; font-size: max(16px, 1rem);
                             transition: border-color 0.2s var(--settle), box-shadow 0.2s var(--settle); }
.textarea { min-height: 140px; resize: vertical; line-height: 1.5; }
.select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);
          background-position: calc(100% - 20px) 52%, calc(100% - 15px) 52%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 40px; }
.input:focus, .select:focus, .textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 1px var(--ink); }
.input:focus-visible, .select:focus-visible, .textarea:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.field.is-invalid .input, .field.is-invalid .textarea, .field.is-invalid .select { border-color: var(--error); box-shadow: 0 0 0 1px var(--error); }
.field__err { color: var(--error); font-size: var(--t-cap); font-weight: 650; }
.field__err:empty { margin-top: calc(-1 * var(--s2)); }
.choices { margin: 0; padding: 0; border: 0; display: grid; gap: var(--s3); }
.choices__opts { display: flex; flex-wrap: wrap; gap: var(--s2); }
.choice { position: relative; display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 0 16px 0 12px; border: 1px solid var(--rule-l); border-radius: 999px; cursor: pointer; font-weight: 550; }
.choice:hover { border-color: var(--ink); }
.choice:has(input:checked) { background: var(--ink); color: var(--chalk); border-color: var(--ink); }
.choice input { width: 18px; height: 18px; margin: 0; accent-color: var(--ink); }
.choice:has(input:checked) input { accent-color: var(--chalk); }
.chip { display: inline-flex; align-items: center; gap: var(--s4); padding: 6px; background: var(--chalk); border: 1px solid var(--rule-l); max-width: 100%; }
.chip__img { width: 40px; height: 52px; flex: none; overflow: hidden; background: var(--c, var(--stone-deep)); }
.chip__img img { width: 100%; height: 100%; object-fit: cover; }
.chip__text { display: grid; line-height: 1.3; font-weight: 600; }
.chip__text small { font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); }
.chip__remove { min-height: 44px; padding: 0 10px; background: none; border: 0; cursor: pointer; font-size: var(--t-cap); font-weight: 600; color: var(--mute-l); text-decoration: underline; text-underline-offset: 0.28em; }
.disclose { border-top: 1px solid var(--rule-l); border-bottom: 1px solid var(--rule-l); }
.disclose summary { display: flex; justify-content: space-between; gap: var(--s5); align-items: center; min-height: 56px; cursor: pointer; list-style: none; font-weight: 700; }
.disclose summary::-webkit-details-marker { display: none; }
.disclose summary::after { content: "+"; font-weight: 400; font-size: 1.4rem; line-height: 1; }
.disclose[open] summary::after { content: "–"; }
.disclose__body { display: grid; gap: var(--s6); padding-bottom: var(--s6); }
.two { display: grid; gap: var(--s6) var(--gutter); }
@media (min-width: 640px) { .two { grid-template-columns: 1fr 1fr; } }
.files { display: grid; gap: var(--s3); }
.filepick { position: relative; display: inline-flex; width: max-content; }
.filepick__input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.filepick__btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border: 1px solid var(--ink); border-radius: 999px; font-weight: 650; pointer-events: none; }
.filepick:hover .filepick__btn { background: var(--ink); color: var(--chalk); }
.filepick__input:focus-visible + .filepick__btn { outline: 2px solid var(--ink); outline-offset: 3px; }
.files__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); font-size: var(--t-cap); color: var(--mute-l); }
.note { font-size: var(--t-cap); font-weight: 500; color: var(--mute-l); }
.form__send { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s5) var(--s6); }
.form__send .pill { min-height: 60px; padding: 0 32px; }
.form__send .pill[aria-disabled="true"] { opacity: 0.7; cursor: progress; }
.err-summary { padding: var(--s5); border: 2px solid var(--error); background: var(--chalk); }
.err-summary h2 { font-weight: 750; font-size: 1rem; letter-spacing: 0; color: var(--error); }
.err-summary ul { margin: var(--s3) 0 0; padding-left: 1.2em; }
.err-summary a { color: var(--error); }
.hp { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.form-done { padding: var(--s7) var(--s5); }
.form-done h2 { font-size: var(--t-h2); font-weight: 850; font-stretch: 108%; letter-spacing: -0.045em; line-height: 0.95; }
.form-done p { margin-top: var(--s5); color: var(--mute-d); }
.form-done .demo { margin-top: var(--s6); color: var(--chalk); font-size: var(--t-cap); font-weight: 600; }
.form-done .actions { margin-top: var(--s6); }
.form-fail { padding: var(--s5); border: 2px solid var(--error); background: var(--chalk); color: var(--error); font-weight: 650; }
.form-fail a { color: var(--error); }

/* ---------------------------------------------------------------- 404 */
.nf { padding-top: calc(var(--header-h) + var(--plate)); padding-bottom: var(--plate); }
.nf__in { grid-column: 1 / -1; }
.nf__in .h2 { font-size: var(--t-xl); font-weight: 850; font-stretch: 107%; letter-spacing: -0.048em; line-height: 0.92; max-width: 14ch; }
.nf__in .actions { margin-top: var(--s6); }
@media (min-width: 1024px) { .nf__in { grid-column: 1 / 10; } }
.nf-stone { height: 32svh; overflow: hidden; }
.nf-stone picture, .nf-stone img { width: 100%; height: 100%; }
.nf-stone img { object-fit: cover; }

/* ---------------------------------------------------------------- Footer: ordmærket i fuld bredde, som på varevognen */
.site-footer { background: #090a0b; padding-top: clamp(56px, 6vw, 104px); padding-bottom: calc(var(--s6) + env(safe-area-inset-bottom)); }
.foot { display: grid; gap: clamp(40px, 5vw, 72px); }
.foot__brand { display: block; color: var(--stone); text-decoration: none; }
.foot__mark { width: 100%; height: auto; }
.foot__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s6) var(--gutter); padding-top: var(--s5); border-top: 1px solid var(--rule-d); }
.foot__label { font-size: var(--t-cap); font-weight: 600; color: var(--mute-d); margin-bottom: var(--s3); }
.foot__list { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--s2); }
.foot__legal { margin-top: var(--s5); }
.foot__tel { display: grid; text-decoration: none; }
.foot__tel span:first-child { color: var(--mute-d); font-size: var(--t-cap); }
.foot__tel .num { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.28em; text-decoration-color: var(--rule-d); }
.foot__tel:hover .num { text-decoration-color: currentColor; }
.foot__hours { margin-top: var(--s2); color: var(--mute-d); font-size: var(--t-cap); }
.site-footer address { color: var(--chalk); }
.site-footer p, .site-footer address { line-height: 1.6; }
.foot__base { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: var(--s4); padding-top: var(--s5); border-top: 1px solid var(--rule-d); color: var(--mute-d); font-size: var(--t-cap); }
.foot__powered { color: var(--mute-d); font-size: var(--t-cap); }
@media (min-width: 640px) { .foot__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------------------------------------------------------------- Den ovale pille (mobil): kun den, aldrig en bjælke */
.float-pill { position: fixed; right: max(16px, env(safe-area-inset-right)); bottom: calc(16px + env(safe-area-inset-bottom)); z-index: 40;
              display: inline-flex; align-items: center; min-height: 54px; padding: 0 26px; border-radius: 999px; background: var(--ink); color: var(--chalk);
              font-weight: 700; font-size: 1rem; text-decoration: none; opacity: 0; transform: translateY(140%); pointer-events: none;
              box-shadow: 0 12px 32px -10px rgba(13, 14, 15, 0.5);
              transition: opacity 0.3s var(--settle), transform 0.6s var(--heavy), background-color 0.3s var(--settle), color 0.3s var(--settle); }
.float-pill.is-on { opacity: 1; transform: none; pointer-events: auto; }
.float-pill.is-on-ink { background: var(--chalk); color: var(--ink); }
.float-pill[hidden] { display: none; }
@media (min-width: 1120px) { .float-pill { display: none; } }

/* ================================================================ PRISBEREGNEREN (runde 3): kridt på stenen
   Siden er en mørk stenplade under en lampe. Bordpladen skrives som én sætning, og de ord, man kan skifte, er kridtstreger.
   Vask og kogeplade er isometriske snit i kridt på en tegneplade. Prisen er et spænd i modvægten (tynd og bred).
   Én koreograferet indgang: lampen tændes, titlen lægges ned, tegningen tegnes, vask og kogeplade sættes i, regningen glider op. */
.est { --chalk-line: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 6' preserveAspectRatio='none'%3E%3Cpath d='M0 3.3C6 2.4 10 3.9 17 3.1S29 2.2 35 3.2 43 3.6 48 2.8' fill='none' stroke='%23F4F2ED' stroke-width='2.6' stroke-linecap='round' stroke-dasharray='9 .7 13 1 7 .6' opacity='.92'/%3E%3C/svg%3E");
       --plate-d: #121315;
       position: relative; isolation: isolate; overflow: clip; padding: calc(var(--header-h) + clamp(40px, 6vw, 104px)) 0 var(--plate); }
.est__stone { position: absolute; inset: 0; z-index: -1; pointer-events: none;
              background: linear-gradient(180deg, rgba(13, 14, 15, 0.4) 0, rgba(13, 14, 15, 0.78) 300px, rgba(13, 14, 15, 0.94) 470px, var(--ink) 540px), var(--ink) var(--tex) 50% 0 / max(100%, 1200px) auto no-repeat; }
.est__stone::after { content: ""; position: absolute; inset: 0; background: radial-gradient(64vw 52vh at 20% 4%, rgba(244, 242, 237, 0.14), rgba(244, 242, 237, 0.04) 46%, transparent 72%); }
.est__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gutter); row-gap: clamp(36px, 4.4vw, 72px); align-items: start; }
.est__head { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; row-gap: var(--s5); align-items: end; }
.est__h1 { grid-column: 1 / 9; font-size: var(--t-mega); font-weight: 850; font-stretch: 108%; letter-spacing: -0.052em; line-height: 0.86; margin-left: -0.045em; }
.est__lead { grid-column: 9 / 13; font-size: var(--t-lead); line-height: 1.4; color: var(--mute-d); padding-bottom: 0.35em; }
.est__order { grid-column: 1 / 8; grid-row: 2; }
.bill { grid-column: 8 / 13; grid-row: 2; }
.est__board { grid-column: 1 / -1; grid-row: 3; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.est__board-note { grid-column: 1 / -1; margin-top: 8px; color: var(--mute-d); font-size: var(--t-cap); max-width: none; }
.est__nojs { font-size: var(--t-lead); }
html.js .est__nojs { display: none; }
html.no-js .order, html.no-js .est__board, html.no-js .bill { display: none; }

/* Sætningen: de ord, man kan skifte, står med kridt under; målene skrives direkte i den */
.order { max-width: none; font-size: clamp(1.75rem, 1.02rem + 2.25vw, 3.5rem); font-weight: 760; font-stretch: 104%; letter-spacing: -0.036em; line-height: 1.22; text-wrap: pretty; }
.order--more { margin-top: 0.85em; font-size: clamp(1.25rem, 0.96rem + 0.95vw, 2rem); font-weight: 650; letter-spacing: -0.024em; line-height: 1.32; }
.w, .n { margin: 0; border: 0; border-radius: 0; font: inherit; letter-spacing: inherit; color: var(--chalk);
         background: transparent var(--chalk-line) repeat-x 0 100% / 1.7em 0.17em; -webkit-box-decoration-break: clone; box-decoration-break: clone;
         transition: background-color 0.25s var(--settle); }
.w { display: inline; padding: 0 0.05em 0.07em; text-align: inherit; cursor: pointer; }
.n { width: calc(var(--n, 3) * 1ch + 0.32em); padding: 0 0.08em 0.07em; text-align: center; caret-color: var(--chalk); font-variant-numeric: tabular-nums lining-nums; }
.w:hover, .n:hover { background-color: rgba(244, 242, 237, 0.08); }
.n:focus { outline: none; background-color: rgba(244, 242, 237, 0.13); }
.w:focus-visible, .n:focus-visible { outline: 2px solid var(--chalk); outline-offset: 4px; }
.n[aria-invalid="true"] { color: #f2aa9f; }
.w.is-set { animation: chalk-set 1.1s var(--settle); }
@keyframes chalk-set { from { background-color: rgba(244, 242, 237, 0.3); } }
.est__corner { margin-top: var(--s5); color: var(--mute-d); font-size: var(--t-cap); }

/* Tegnepladen: to snit, vasken og kogepladen */
.iso-fig { margin: 0; padding: clamp(10px, 1.4vw, 22px) clamp(12px, 1.6vw, 26px) clamp(12px, 1.4vw, 20px); background: var(--plate-d); border: 1px solid var(--rule-d); }
.iso-fig figcaption { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 14px; padding-top: 12px; border-top: 1px solid var(--rule-d);
                      font-size: var(--t-cap); color: var(--mute-d); }
.iso-fig figcaption b { color: var(--chalk); font-weight: 700; text-align: right; }
.iso-legend { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 6px 22px; margin: 0; padding: 0; list-style: none; color: var(--chalk); font-weight: 550; }
.iso-legend:empty { display: none; }
.iso-legend li { display: inline-flex; align-items: center; gap: 8px; }
.iso-legend b { display: inline-grid; place-items: center; width: 22px; height: 22px; border: 1px solid var(--chalk); border-radius: 50%; font-size: 0.75rem; font-weight: 700; }
.iso { display: block; width: 100%; height: auto; overflow: visible; font-family: var(--font); --wait: 0ms; }
.iso path { stroke: var(--chalk); stroke-width: 1.4; stroke-linejoin: round; stroke-linecap: round; }
.iso .f-top { fill: #2a2d31; }
.iso .f-front { fill: #1c1e21; }
.iso .f-arc { stroke-opacity: 0; }
.iso .f-arc--0 { fill: #2a2d31; } .iso .f-arc--1 { fill: #26292d; } .iso .f-arc--2 { fill: #222528; } .iso .f-arc--3 { fill: #1f2124; } .iso .f-arc--4 { fill: #1c1e21; }
.iso .f-deep { fill: #141517; }
.iso .f-fals { fill: #191a1d; }
.iso .f-cut { stroke-width: 1.6; }
.iso .hatch-bg { fill: #17181b; }
.iso .hatch { stroke-width: 0.9; stroke-opacity: 0.62; }
.iso .f-hole { fill: #08090a; }
.iso .f-steel { fill: #383c41; stroke-opacity: 0.85; }
.iso .f-steel2 { fill: #2e3135; stroke-opacity: 0.85; }
.iso .f-steel3 { fill: #42474c; stroke-opacity: 0.85; }
.iso .f-steel4 { fill: #24272b; stroke-opacity: 0.85; }
.iso .l-steel { fill: none; stroke-width: 2.6; }
.iso .f-rim { fill: #4c5157; }
.iso .f-rim2 { fill: #34383c; }
.iso .f-body { fill: #1a1c1f; stroke-opacity: 0.6; stroke-dasharray: 5 4; }
.iso .f-glass { fill: #07080a; }
.iso .f-glass2 { fill: #101113; }
.iso .f-glass-cut { fill: #07080a; stroke-width: 1.6; }
.iso .zone { fill: none; stroke-width: 1.1; stroke-opacity: 0.55; }
.iso .glint { fill: none; stroke-width: 7; stroke-opacity: 0.07; }
.iso .seal, .iso .polish { fill: none; stroke-opacity: 0; }
.iso .polish { stroke-width: 2.6; }
.iso .brk { fill: none; stroke-width: 1; }
.iso .iso-mark__l { fill: none; stroke-width: 1; stroke-opacity: 0.8; }
.iso .iso-mark__d { fill: var(--chalk); }
.iso .iso-mark__c { fill: var(--plate-d); stroke: var(--chalk); stroke-width: 1.3; }
.iso .iso-mark__n { fill: var(--chalk); font-size: 15px; font-weight: 700; text-anchor: middle; }
.iso .iso-dim path { fill: none; stroke-width: 1.1; stroke-opacity: 0.85; }
.iso .iso-dim text { fill: var(--chalk); font-size: 17px; font-weight: 650; font-variant-numeric: tabular-nums; }
.iso .crumb { fill: var(--chalk); opacity: 0; }
.iso--thumb { overflow: hidden; }
.iso--thumb path { stroke-width: 2.4; }
.est__board.is-waiting .iso, .est__board.is-waiting .iso * { animation-play-state: paused !important; }

/* Kridtet tegner pladen, falsen fræses, vasken eller kogepladen sættes i, og krummerne fejes */
.iso.is-first { --t-slab: 350ms; --t-mill: 1050ms; --t-app: 1350ms; --t-note: 2050ms; --t-crumb: 2150ms; }
.iso.is-swap { --t-mill: 0ms; --t-app: 150ms; --t-note: 850ms; --t-crumb: 950ms; }
.iso.is-swap[data-type="flush"] { --t-app: 520ms; --t-note: 1200ms; --t-crumb: 1300ms; }
.iso[data-dir="up"] { --from: 18px; }
.iso.is-first .pen { stroke-dasharray: 1; animation: pen 1.1s var(--heavy) calc(var(--wait) + var(--t-slab)) both, fill-in 0.9s var(--settle) calc(var(--wait) + var(--t-slab) + 500ms) both; }
.iso.is-first .mill path, .iso.is-swap .mill path { stroke-dasharray: 1; animation: pen 0.5s linear calc(var(--wait) + var(--t-mill)) both, fill-in 0.4s var(--settle) calc(var(--wait) + var(--t-mill) + 300ms) both; }
.iso.is-first .app, .iso.is-swap .app { animation: app-in 0.8s var(--heavy) calc(var(--wait) + var(--t-app)) both; }
.iso.is-first .iso-notes, .iso.is-swap .iso-notes { animation: fade 0.6s var(--settle) calc(var(--wait) + var(--t-note)) both; }
.iso.is-first .seal, .iso.is-swap .seal { stroke-dasharray: 1; animation: seal 1.2s var(--settle) calc(var(--wait) + var(--t-note)) both; }
.iso.is-first .polish, .iso.is-swap .polish { animation: polish 1.6s linear calc(var(--wait) + var(--t-note)) both; }
.iso.is-first .zones path, .iso.is-swap .zones path { animation: glow 1.8s var(--settle) calc(var(--wait) + var(--t-note)) both; }
.iso.is-first .crumb, .iso.is-swap .crumb { animation: crumb-fall 1.7s var(--settle) calc(var(--wait) + var(--t-crumb) + var(--cd, 0ms)) both; }
.iso.is-first .crumb--stop, .iso.is-swap .crumb--stop { animation-name: crumb-stop; }
.iso.is-redraw .f-cut, .iso.is-redraw .f-front, .iso.is-redraw .f-top { stroke-dasharray: 1; animation: pen 0.7s var(--heavy) both; }
@keyframes pen { from { stroke-dashoffset: 1; } }
@keyframes fill-in { from { fill-opacity: 0; } }
@keyframes app-in { from { opacity: 0; transform: translateY(var(--from, -18px)); } }
@keyframes seal { 0% { stroke-opacity: 0.95; stroke-dashoffset: 1; } 70% { stroke-opacity: 0.95; stroke-dashoffset: 0; } 100% { stroke-opacity: 0; stroke-dashoffset: 0; } }
@keyframes polish { 0% { stroke-opacity: 0; stroke-dasharray: 0.16 0.84; stroke-dashoffset: 1; } 15% { stroke-opacity: 0.95; } 100% { stroke-opacity: 0; stroke-dasharray: 0.16 0.84; stroke-dashoffset: -0.2; } }
@keyframes glow { 35% { stroke-opacity: 1; stroke-width: 1.7; } }
@keyframes crumb-fall { 0% { opacity: 0; transform: none; } 12% { opacity: 1; } 62% { transform: translate(var(--tx), var(--ty)); opacity: 1; } 100% { opacity: 0; transform: translate(var(--fx), var(--fy)); } }
@keyframes crumb-stop { 0% { opacity: 0; transform: none; } 12% { opacity: 1; } 70% { transform: translate(var(--tx), var(--ty)); } 82%, 100% { opacity: 1; transform: translate(var(--bx), var(--by)); } }

/* Regningen: spændet i modvægten, en bjælke med den skraverede forskel og hver post på sin egen linje */
.bill { padding: clamp(22px, 2.2vw, 34px) clamp(20px, 2.2vw, 34px) clamp(24px, 2.4vw, 36px); background: rgba(13, 14, 15, 0.72); border: 1px solid var(--rule-d); border-top: 2px solid var(--chalk); }
.bill__pre { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--s3) var(--s4); max-width: none; font-weight: 650; font-size: var(--t-lead); }
.bill__demo { font-size: 0.8125rem; font-weight: 650; padding: 5px 11px; border: 1px solid var(--rule-d); border-radius: 999px; color: var(--mute-d); }
.bill__sum { margin: 0.12em 0 0 -0.045em; max-width: none; font-size: clamp(2.5rem, 0.55rem + 2.75vw, 4.5rem); font-weight: 220; font-stretch: 122%; letter-spacing: -0.045em; line-height: 1; }
.bill__sum.is-new { animation: sum-new 0.7s var(--heavy); }
@keyframes sum-new { from { opacity: 0.2; transform: translateY(-0.08em); } }
.bill__bar { display: flex; gap: 3px; height: 14px; margin-top: var(--s5); }
.bill__bar i { display: block; min-width: 3px; transition: flex-grow 0.8s var(--heavy); }
.bar__stone, .sw--stone { background: var(--chalk); }
.bar__work, .sw--work { background: rgba(244, 242, 237, 0.58); }
.bar__service, .sw--service { background: rgba(244, 242, 237, 0.3); }
.bar__spread { background: repeating-linear-gradient(-45deg, rgba(244, 242, 237, 0.75) 0 1.5px, transparent 1.5px 6px); box-shadow: inset 0 0 0 1px rgba(244, 242, 237, 0.55); }
.bill__note { margin-top: var(--s4); color: var(--mute-d); font-size: var(--t-cap); max-width: 62ch; }
.bill__lines { list-style: none; margin: var(--s5) 0 0; padding: 0; display: grid; grid-template-columns: minmax(0, 1fr); }
.bill__line { display: grid; grid-template-columns: 10px minmax(0, 1fr) auto; align-items: baseline; gap: 10px; padding: 10px 0; border-top: 1px solid var(--rule-d); font-size: 0.9375rem; line-height: 1.4; }
.bill__line b { font-weight: 650; white-space: nowrap; }
.sw { width: 10px; height: 10px; align-self: center; }
.bill__act { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s3) var(--s6); margin-top: clamp(28px, 3vw, 44px); }
.bill__act .pill { flex: 1 1 100%; justify-content: space-between; }
.bill__act .text-btn { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.26em; text-decoration-color: var(--rule-d); }
.bill__act .text-btn:hover { text-decoration-color: currentColor; }
.bill__saved { flex-basis: 100%; min-height: 1.4em; margin-top: calc(-1 * var(--s3)); color: var(--mute-d); font-size: var(--t-cap); }
.bill__assure { margin-top: var(--s3); font-weight: 550; max-width: 44ch; }

/* Arket med valgene: fra højre på skærmen, nedefra på telefonen (native dialog) */
.desk { position: fixed; inset: 0 0 0 auto; width: min(560px, 100%); height: 100%; max-width: none; max-height: none; margin: 0; padding: 0; border: 0;
        border-left: 1px solid var(--rule-d); display: none; grid-template-rows: auto minmax(0, 1fr) auto; background: #101113; color: var(--chalk); overscroll-behavior: contain; }
.desk[open] { display: grid; animation: desk-in 0.5s var(--heavy); }
.desk::backdrop { background: rgba(13, 14, 15, 0.5); }
@keyframes desk-in { from { opacity: 0; transform: translateX(48px); } }
.desk__top { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 6px 16px; padding: 22px var(--g) 16px; border-bottom: 1px solid var(--rule-d); }
.desk__h { font-size: clamp(2.25rem, 1.6rem + 2vw, 3.5rem); font-weight: 850; font-stretch: 107%; letter-spacing: -0.048em; line-height: 0.9; }
.desk__x { grid-column: 2; grid-row: 1; align-self: start; min-height: 44px; min-width: 44px; padding: 0; background: none; border: 0; color: inherit; font-weight: 650; cursor: pointer; text-align: right; }
.desk__sum { grid-column: 1 / -1; color: var(--mute-d); font-weight: 600; max-width: none; }
.desk__body { overflow-y: auto; display: grid; gap: 14px; align-content: start; padding: 16px var(--g) 24px; }
.desk__end { display: flex; justify-content: flex-end; padding: 14px var(--g) calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--rule-d); }
.desk__foot { color: var(--mute-d); font-size: var(--t-cap); }
.iso-fig--desk { padding-bottom: 10px; }
.iso-fig--desk .iso { max-height: min(36vh, 330px); margin-inline: auto; }
.opts { margin: 0; padding: 0; border: 0; display: grid; gap: 6px; min-width: 0; }
.opt { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 14px; min-height: 64px; padding: 10px 16px 10px 12px;
       border: 1px solid var(--rule-d); cursor: pointer; transition: border-color 0.2s var(--settle), background-color 0.2s var(--settle), box-shadow 0.3s var(--heavy); }
.opt:hover { border-color: rgba(244, 242, 237, 0.5); }
.opt:has(.opt__in:checked) { border-color: var(--chalk); background: rgba(244, 242, 237, 0.06); box-shadow: inset 5px 0 0 var(--chalk); }
.opt:has(.opt__in:focus-visible) { outline: 2px solid var(--chalk); outline-offset: 3px; }
.opt__in { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.opt__pic { display: grid; place-items: center; width: 64px; height: 44px; pointer-events: none; }
.opt__pic svg { width: 100%; height: 100%; }
.opt__pic:not(.opt__pic--iso) path { fill: var(--chalk); }
.opt__pic--stone { overflow: hidden; }
.opt__pic--stone img { width: 100%; height: 100%; object-fit: cover; }
.opt__pic--iso { width: 92px; height: 66px; background: var(--plate-d); }
.opt__t { display: grid; gap: 3px; pointer-events: none; }
.opt__n { font-weight: 750; font-size: 1.0625rem; letter-spacing: -0.012em; line-height: 1.2; }
.opt__d { color: var(--mute-d); font-size: 0.875rem; line-height: 1.4; }
.opt__p { font-weight: 650; font-size: 0.9375rem; white-space: nowrap; pointer-events: none; }
.opts .opt:not(:has(.opt__pic)) { grid-template-columns: minmax(0, 1fr) auto; }

/* Indgangen */
html.js-ready .est__stone::after { animation: fade 1.8s var(--settle) 0.1s both; }
html.js-ready .est__h1 { animation: lay-down 1.05s var(--heavy) 0.25s both; }
html.js-ready .bill { animation: bill-up 1s var(--heavy) 0.95s both; }
html.arrive.js-ready .est__stone::after { animation-delay: 1s; }
html.arrive.js-ready .est__h1 { animation-delay: 1.15s; }
html.arrive.js-ready .bill { animation-delay: 1.85s; }
@keyframes bill-up { from { opacity: 0; transform: translateY(36px); } }
@keyframes sheet-up { from { opacity: 0; transform: translateY(60px); } }

@media (max-width: 1023px) {
  .est__grid { grid-template-columns: minmax(0, 1fr); }
  .est__head { grid-template-columns: minmax(0, 1fr); }
  .est__h1, .est__lead, .est__order, .bill, .est__board { grid-column: 1; grid-row: auto; }
  .bill__sum { font-size: clamp(2.5rem, 1rem + 6vw, 4.5rem); }
}
@media (max-width: 767px) {
  .est__board { grid-template-columns: minmax(0, 1fr); }
  .iso-fig { padding: 8px 10px 10px; }
  .bill { margin-inline: calc(-1 * var(--g) / 2); }
  .bill__sum { font-size: min(11.5vw, 4rem); }
  .desk { inset: auto 0 0 0; width: 100%; height: auto; max-height: 92svh; border-left: 0; border-top: 1px solid var(--rule-d); }
  .desk[open] { animation-name: sheet-up; }
  .desk__top { padding-top: 16px; }
  .iso-fig--desk .iso { max-height: 30svh; }
  .opt { min-height: 58px; gap: 12px; padding: 8px 12px 8px 10px; }
  .opt__pic--iso { width: 78px; height: 56px; }
}

/* ================================================================ Tablet og mobil */
@media (max-width: 1100px) {
  .hero__plate { grid-template-columns: minmax(0, 1fr) auto; }
  .hero__cta { grid-column: 1 / -1; justify-self: start; }
  .pick { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .steps-row { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--s6); }

}
@media (max-width: 767px) {
  .hero { min-height: 640px; --hero-fs: min(27.5vw, calc((100vw - 2 * var(--g)) / var(--fit-m, 3.3))); }
  .hero__poster img, .hero__video { object-position: 50% 50%; }
  .hero__shade { background: linear-gradient(180deg, rgba(13, 14, 15, 0.62) 0, rgba(13, 14, 15, 0) 18%),
                             linear-gradient(0deg, rgba(13, 14, 15, 0.92) 0, rgba(13, 14, 15, 0.5) 30%, rgba(13, 14, 15, 0) 54%); }
  .hero__title { line-height: 0.8; margin-bottom: -0.14em; }
  .hero__title .hero__w { display: inline; }
  .hero__title .hero__w:first-child { display: block; }
  .film-ui { top: calc(var(--header-h) + 10px); }
  .film-ui__cap { display: none; }
  .film-ui__toggle { min-height: 36px; padding: 0 12px; font-size: 0.75rem; }
  .hero__plate { grid-template-columns: minmax(0, 1fr); gap: 18px; padding: calc(var(--hero-fs) * 0.2 + 16px) var(--g) calc(24px + env(safe-area-inset-bottom)); }
  .hero__price { grid-template-columns: auto 1fr; align-items: baseline; gap: 12px; padding: 16px 0 0; border-inline-start: 0; border-top: 1px solid rgba(244, 242, 237, 0.26); }
  .hero__price b { font-size: 1.625rem; }

  .deal__post { justify-self: start; text-align: left; font-size: 12vw; margin-top: 0.35em; }
  .deal__body { grid-template-columns: 1fr; gap: var(--s6); }
  .calc__row, .axis, .calc--ranges .calc__row, .calc--ranges .axis { grid-template-columns: 1fr; gap: 6px; }
  .calc--ranges .calc__row { grid-template-columns: minmax(0, 1fr) auto; }
  .calc--ranges .calc__label { grid-column: 1; }
  .calc--ranges .ranges__val { grid-column: 2; grid-row: 1; }
  .calc--ranges .calc__track { grid-column: 1 / -1; }
  .axis__pad { display: none; }
  .calc__track { height: 52px; }
  .calc__cap { padding-inline-start: 0; }
  .calc__gap i { font-size: 0.75rem; padding: 3px 5px; }

  .steps-row { grid-template-columns: 1fr; }
  .step__media { aspect-ratio: 16 / 10; }
  .dims { grid-template-columns: minmax(0, 1fr); }
  .dim { grid-column: 1 / -1 !important; }
  .dim b { font-size: 1.75rem; }
  .dim__sub { font-size: 0.875rem; }
  .stage__dim--x .d-w, .stage__dim--y .d-h { display: none; }
  .stage__dim--x .d-h, .stage__dim--y .d-w { display: inline; }
  .crew__row { grid-template-columns: minmax(0, 1fr); }
  .page-band { aspect-ratio: 4 / 3; }
  .calc--big .calc__row { grid-template-columns: minmax(0, 1fr); }
  .calc--big .calc__track { height: 72px; }
  .calc--big .calc__cap { padding-inline-start: 0; }
  .deal__body:has(.calc--big) .deal__why { grid-template-columns: minmax(0, 1fr); }

  .slabs__head { grid-template-columns: 1fr; gap: var(--s4); }
  /* På telefonen står pladen op, som når den bæres ind ad døren */
  .stage { --dim: 30px; --fw: calc(100vw - 2 * var(--g) - var(--dim)); }
  .stage__frame { aspect-ratio: auto; height: calc(var(--fw) * var(--sw) / var(--sh)); transition: height 0.9s var(--heavy); }
  .stage__frame img { position: absolute; left: 50%; top: 50%; width: calc(var(--fw) * var(--sw) / var(--sh)); height: var(--fw); max-width: none; transform: translate(-50%, -50%) rotate(90deg); }
  .stage.is-swapping .stage__frame img { transform: translate(-50%, -50%) rotate(90deg) scale(1.03); }
  .stage__dim--x { margin-bottom: 10px; }
  .stage__dim--y { margin-right: 10px; }
  .pick { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-left: 0; margin-top: 28px; }
  .pick__btn { grid-template-columns: 44px minmax(0, 1fr); gap: 10px; min-height: 60px; font-size: 0.8125rem; }
  .pick__btn picture, .pick__btn img { width: 44px; height: 44px; }
  .mat { grid-template-columns: minmax(0, 1fr) 30%; grid-template-areas: "name img" "line img" "meta img"; row-gap: 4px; min-height: 0; padding: 16px 0; }
  .mat__name { font-size: clamp(2.25rem, 10vw, 3rem); }
  .mat__line { align-self: start; font-size: 1rem; }
  .mat__img { min-height: 104px; }

  .work__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; gap: 4px; }
  .work__w--0 { grid-column: 1 / -1; aspect-ratio: 4 / 5; }
  .work__w--0 img { object-position: 30% 60%; }
  .work__w--1 { grid-column: 1 / -1; aspect-ratio: 4 / 3; }
  .work__w--2 { grid-column: 1; grid-row: auto; aspect-ratio: 3 / 4; }
  .work__w--3 { grid-column: 2; aspect-ratio: 3 / 4; }
  .work__w--4 { grid-column: 1 / -1; aspect-ratio: 16 / 10; }
  .work__grid figcaption { padding: 32px 14px 12px; font-size: 0.8125rem; }

  .voices__in { grid-template-columns: 1fr; }
  .origin__film { min-height: 88svh; }
  .origin__in { grid-template-columns: 1fr; gap: var(--s5); }
  .origin__title { font-size: 30vw; }
  .site-footer { padding-bottom: calc(104px + env(safe-area-inset-bottom)); }
}

/* ---------------------------------------------------------------- Mindre bevægelse */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
  html.arrive .loader { animation: loader-out 0.01ms linear 0.9s forwards !important; }
  .loader__bar { transform: none; animation: none !important; }
  html.js-ready .rise { opacity: 1; transform: none; }
  html.js-ready .hero__plate, html.js-ready .hero__title .hero__w, html.js-ready .film-ui { animation: none !important; }
  html.js-ready .calc:not(.is-in) .calc__bar { width: calc(var(--v) * 1%); }
  html.js-ready .calc:not(.is-in) .calc__gap { opacity: 1; }
  html.js-ready .calc--ranges:not(.is-in) .ranges__bar { width: calc((var(--b) - var(--a)) * 1%); }
  .expose::after { display: none; }
  html.js-ready .est__stone::after, html.js-ready .est__h1, html.js-ready .bill, .desk[open] { animation: none !important; }
  .iso * { animation: none !important; }
}

/* ---------------------------------------------------------------- Print: én farve til køleskabet */
@media print {
  html, body { background: #fff; color: #000; }
  .site-header, .sheet, .float-pill, .loader, .site-footer .foot__cols, .filters, .slab__tools, .loop, .skip, .actions, .film-ui, .hero__media, .invite__drawing { display: none !important; }
  .page-head, .mat-head { padding-top: 0; }
  [data-ground] { background: #fff !important; color: #000 !important; }
  .hero { height: auto; min-height: 0; }
  .slab__scroller { overflow: visible; }
  .slab__sheet { width: 100% !important; height: auto; }
  .slab__img { height: auto; }
  a { text-decoration: none; }
  .desk, .bill__act, .est__stone, .bill__bar { display: none !important; }
  .est { padding-top: 0; }
  .w, .n { background: none; }
}