/* Th. Holm Ejendomme — design "Blandet".
   Strukturen og overblikket fra katalog-oplægget, det visuelle udtryk
   (petroleumsblå + brændt orange) fra det tidligere site. */

*, *::before, *::after { box-sizing: border-box; }
body { margin: 0; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, dl, figure { margin: 0; }
ul { padding: 0; list-style: none; }
svg:not([width]) { max-width: 100%; }

:root {
  --blaa: #16323f; --blaa-2: #1f4757; --orange: #bf4f1c;
  --ink: #14181a; --ink2: #4b555b; --ink3: #78848a;
  --line: #e2e6e8; --bg2: #f7f7f5;
  --ok: #1a7a4a; --warn: #94600a;
}
body { font: 15px/1.55 ui-sans-serif, system-ui, "Segoe UI", sans-serif; color: var(--ink); background: #fff; }
.wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.kick { font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .13em; color: var(--orange); }

.skip { position: absolute; left: -9999px; top: 0; z-index: 2000; background: #fff; color: var(--blaa);
  padding: 12px 18px; font-weight: 700; border-radius: 0 0 6px 0; }
.skip:focus { left: 0; }

/* --- Header -------------------------------------------------------------- */
.hd { background: var(--blaa); position: sticky; top: 0; z-index: 50; }
.hd-in { display: flex; align-items: center; gap: 30px; height: 60px; }
.brand { display: flex; align-items: center; gap: 10px; text-decoration: none; }
.brand-mark { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 5px;
  background: var(--orange); color: #fff; font-weight: 800; font-size: 12px; letter-spacing: .04em; }
.brand-tx { display: flex; flex-direction: column; line-height: 1.15; }
.brand-tx b { color: #fff; font-size: 15px; font-weight: 700; }
.brand-tx span { color: rgba(255,255,255,.55); font-size: 9.5px; text-transform: uppercase; letter-spacing: .15em; }
.hd-nav { display: flex; gap: 24px; margin-left: auto; }
.hd-nav a { color: rgba(255,255,255,.75); text-decoration: none; font-size: 14px; font-weight: 550;
  padding: 3px 0; border-bottom: 2px solid transparent; }
.hd-nav a:hover { color: #fff; }
.hd-nav a.on { color: #fff; border-color: var(--orange); }
.hd-book { background: var(--orange); color: #fff; text-decoration: none; font: 700 14px/1 inherit;
  padding: 11px 17px; border: 0; border-radius: 5px; cursor: pointer; white-space: nowrap; }
.hd-book:hover { filter: brightness(1.08); }
.hd-menu { display: none; font: 700 13px/1 inherit; color: #fff; background: rgba(255,255,255,.12);
  border: 0; border-radius: 5px; padding: 10px 13px; cursor: pointer; }
.ft-book { font: 650 13.5px/1.4 inherit; padding: 0; border: 0; background: none; cursor: pointer;
  color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ft-book:hover { color: var(--orange); }

/* --- Blåt topbånd -------------------------------------------------------- */
.top { background: var(--blaa); color: #fff; padding-bottom: 30px; }
.top-in { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 40px; align-items: end; padding: 34px 24px 26px; }
.top-tx h1 { font-size: clamp(28px, 3.6vw, 40px); font-weight: 750; letter-spacing: -.025em; line-height: 1.1; }
.top-tx p { color: rgba(255,255,255,.72); margin-top: 12px; max-width: 62ch; }
.top-tal { display: flex; gap: 34px; }
.top-tal dt { font-size: 27px; font-weight: 750; letter-spacing: -.02em; }
.top-tal dd { margin: 2px 0 0; font-size: 11.5px; color: rgba(255,255,255,.6); text-transform: uppercase; letter-spacing: .07em; }

.fil { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)) auto; gap: 10px; align-items: end;
  background: #fff; padding: 14px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.fil label { display: flex; flex-direction: column; gap: 5px; font-size: 10.5px; font-weight: 800;
  text-transform: uppercase; letter-spacing: .07em; color: var(--ink3); }
.fil select { font: inherit; font-size: 14px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 5px; background: #fff; color: var(--ink); }
.fil button { font: 700 14px/1 inherit; padding: 12px 22px; border: 0; border-radius: 5px; background: var(--orange); color: #fff; cursor: pointer; }

/* --- Listeoverskrift + visningsskift -------------------------------------- */
.main { padding: 34px 24px 56px; }
.liste-hd { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: 20px; }
.liste-hd h2 { font-size: 24px; font-weight: 750; letter-spacing: -.02em; margin-top: 5px; }
.liste-nb { font-size: 14px; color: var(--ink2); margin-top: 6px; max-width: 64ch; }
.vis { display: flex; gap: 3px; background: var(--bg2); padding: 3px; border-radius: 6px; }
.vis button { font: 650 13px/1 inherit; padding: 8px 15px; border: 0; border-radius: 4px; background: none; color: var(--ink2); cursor: pointer; }
.vis button.on { background: #fff; color: var(--blaa); box-shadow: 0 1px 3px rgba(0,0,0,.12); }

.grp { margin-bottom: 30px; }
.grp[hidden] { display: none; }
.grp-hd { display: flex; align-items: baseline; gap: 11px; flex-wrap: wrap;
  padding-bottom: 9px; border-bottom: 2px solid var(--blaa); margin-bottom: 16px; }
.grp-hd h3 { font-size: 17px; font-weight: 750; letter-spacing: -.01em; }
.grp-hd span { font-size: 12.5px; color: var(--ink3); }

.antal { font-size: 13.5px; color: var(--ink3); margin-bottom: 16px; }
.tomt { padding: 26px 28px; border: 1px dashed var(--line); border-radius: 8px; background: var(--bg2); margin-bottom: 30px; }
.tomt h3 { font-size: 17px; font-weight: 750; }
.tomt p { color: var(--ink2); font-size: 14px; margin-top: 6px; }

/* --- Lejemålskortene: samme markup i begge visninger ---------------------- */
.u { cursor: pointer; text-decoration: none; color: inherit; }
.u[hidden] { display: none; }
.u:focus-visible, .ejd-k:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.u-img { position: relative; background: var(--bg2); overflow: hidden; }
.u-img img { width: 100%; height: 100%; object-fit: cover; }
.tag { position: absolute; left: 9px; top: 9px; font-size: 10px; font-weight: 800; text-transform: uppercase;
  letter-spacing: .06em; color: #fff; background: var(--ok); padding: 3px 7px; border-radius: 3px; }
.tag-res { background: var(--warn); }
.tag-fuld { background: var(--ink3); }
.u-body h3 { font-size: 16px; font-weight: 700; letter-spacing: -.01em; }
.u-adr { font-size: 12.5px; color: var(--ink3); margin-top: 3px; }
.u-res { font-size: 13.5px; color: var(--ink2); margin-top: 7px;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.u-facts dt { font-size: 10px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--ink3); }
.u-facts dd { margin: 2px 0 0; font-size: 14px; font-weight: 650; text-transform: capitalize; }
.u-facts .pris { color: var(--orange); font-weight: 800; text-transform: none; }
.u-go span { font-size: 13px; font-weight: 650; color: var(--ink3); white-space: nowrap; }

.vis-gitter .enheder { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.vis-gitter .u { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
  transition: box-shadow .16s, transform .16s; }
.vis-gitter .u:hover { box-shadow: 0 12px 28px rgba(22,50,63,.14); transform: translateY(-2px); }
.vis-gitter .u-img { aspect-ratio: 3/2; }
.vis-gitter .u-body { padding: 14px 15px 0; flex: 1; }
.vis-gitter .u-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; padding: 13px 15px;
  margin-top: 13px; border-top: 1px solid var(--line); background: var(--bg2); }
.vis-gitter .u-go { display: none; }

.vis-liste .enheder { display: block; }
.vis-liste .u { display: grid; grid-template-columns: 128px minmax(0,1fr) 320px auto; gap: 20px;
  align-items: center; padding: 13px 0; border-bottom: 1px solid var(--line); }
.vis-liste .u:hover { background: var(--bg2); box-shadow: -12px 0 0 var(--bg2), 12px 0 0 var(--bg2); }
.vis-liste .u:hover .u-go span { color: var(--orange); }
.vis-liste .u-img { aspect-ratio: 4/3; border-radius: 5px; }

/* ⚠️ SKAL stå her — EFTER .vis-gitter .u og .vis-liste .u.
   ".u[hidden]" længere oppe har præcis samme specificitet som dem, og ved
   uafgjort vinder den regel der står sidst. Uden disse to selektorer bliver
   et bortfiltreret kort ved med at være synligt: filtreringen sætter
   [hidden] korrekt, men "display: grid/flex" tegner kortet alligevel.
   Tilføjes en ny visningstilstand, skal den også ind her. */
.vis-gitter .u[hidden], .vis-liste .u[hidden] { display: none; }
.vis-liste .u-facts { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }

/* --- Resten -------------------------------------------------------------- */
.usp { display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; margin: 12px 0 44px;
  padding: 26px 28px; background: var(--bg2); border-radius: 8px; }
.usp h3 { font-size: 16px; font-weight: 750; padding-top: 11px; border-top: 3px solid var(--orange); }
.usp p { font-size: 13.5px; color: var(--ink2); margin-top: 7px; }

.ejd { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; margin-bottom: 46px; }
.ejd-k { display: block; border: 1px solid var(--line); border-radius: 8px; overflow: hidden;
  cursor: pointer; transition: box-shadow .16s; text-decoration: none; color: inherit; }
.ejd-k:hover { box-shadow: 0 12px 28px rgba(22,50,63,.14); }
.ejd-img { position: relative; aspect-ratio: 16/9; background: var(--bg2); }
.ejd-img img { width: 100%; height: 100%; object-fit: cover; }
.ejd-tx { padding: 13px 15px 15px; }
.ejd-tx h4 { font-size: 15.5px; font-weight: 700; }
.ejd-adr { font-size: 12.5px; color: var(--ink3); margin-top: 3px; }
.ejd-res { font-size: 13.5px; color: var(--ink2); margin-top: 9px;
  display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.ejd-nb { font-size: 12px; font-weight: 650; color: var(--blaa); margin-top: 8px; }

.cta { display: flex; align-items: center; justify-content: space-between; gap: 34px; flex-wrap: wrap;
  background: var(--blaa); color: #fff; padding: 30px 32px; border-radius: 8px; }
.cta h2 { font-size: 22px; font-weight: 750; letter-spacing: -.02em; }
.cta p { color: rgba(255,255,255,.75); margin-top: 8px; max-width: 62ch; font-size: 14px; }
.cta-btn { display: flex; gap: 10px; flex-wrap: wrap; }
.btn { display: inline-block; text-decoration: none; font: 700 14.5px/1.2 inherit; padding: 12px 22px;
  border: 0; border-radius: 5px; background: var(--orange); color: #fff; white-space: nowrap; cursor: pointer; }
.btn:hover { filter: brightness(1.08); }
.btn-b { background: transparent; box-shadow: inset 0 0 0 1px rgba(255,255,255,.4); }
.btn-b:hover { background: rgba(255,255,255,.12); }
.cta-btn .btn, .lj-helt-btn .btn, .lj-tekst .btn { border: 0; cursor: pointer; font-family: inherit; }

.ft { background: var(--blaa); color: rgba(255,255,255,.7); font-size: 13.5px; margin-top: 10px; }
.ft-in { display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px; padding: 34px 24px 22px; }
.ft-in b { color: #fff; display: block; margin-bottom: 8px; font-size: 11px; text-transform: uppercase; letter-spacing: .1em; }
.ft-in a { color: inherit; text-decoration: none; }
.ft-in a:hover { color: #fff; text-decoration: underline; text-underline-offset: 3px; }
.ft-in li { margin-bottom: 4px; }
.ft-nb { border-top: 1px solid rgba(255,255,255,.13); padding: 16px 24px 26px; font-size: 11.5px; color: rgba(255,255,255,.45); }

/* --- Præsentationsside for ét lejemål ------------------------------------- */
.lj-sti { font-size: 12.5px; color: var(--ink3); padding: 4px 0 16px; }
.lj-sti a { color: var(--ink3); text-decoration: none; }
.lj-sti a:hover { color: var(--orange); }
.lj-sti span { padding: 0 6px; color: var(--line); }
.lj-hd { margin-bottom: 20px; }
.lj-hd .tag { position: static; display: inline-block; margin-bottom: 9px; }
.lj-hd h1 { font-size: clamp(25px, 3.4vw, 36px); font-weight: 750; letter-spacing: -.025em; line-height: 1.12; }
.lj-adr { color: var(--ink3); font-size: 14px; margin-top: 6px; }

.lj-tal { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 1px;
  background: var(--line); border: 1px solid var(--line); border-radius: 8px; overflow: hidden; margin-bottom: 26px; }
.lj-tal > div { background: #fff; padding: 15px 17px; }
.lj-tal dt { font-size: 10.5px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--ink3); }
.lj-tal dd { margin: 5px 0 0; font-size: 19px; font-weight: 750; letter-spacing: -.02em; color: var(--blaa); }
.lj-tal-flad > div { padding: 13px 15px; }
.lj-tal-flad dd { font-size: 16px; }

.lj-gal { display: grid; grid-template-columns: minmax(0,2fr) minmax(0,1fr); gap: 8px; margin-bottom: 30px; }
.lj-gal-stor { aspect-ratio: 3/2; border-radius: 8px; overflow: hidden; background: var(--bg2); }
.lj-gal-stor img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
.lj-gal-smaa { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.lj-gal-smaa > div { position: relative; border-radius: 6px; overflow: hidden; background: var(--bg2); }
.lj-gal-smaa img { width: 100%; height: 100%; object-fit: cover; cursor: zoom-in; }
/* Selektoren SKAL være mindst lige så specifik som ".lj-gal-smaa > div"
   ovenfor. Med bare ".lj-gal-mere" vinder den lyse baggrund derfra, og
   knappen bliver hvid tekst på lysegråt — praktisk talt usynlig. */
.lj-gal-smaa > .lj-gal-mere { display: grid; place-items: center; background: var(--blaa); color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; text-align: center; padding: 8px; transition: background .15s; }
.lj-gal-smaa > .lj-gal-mere:hover, .lj-gal-smaa > .lj-gal-mere:focus-visible { background: var(--blaa-2); }

.lj-2sp { display: grid; grid-template-columns: minmax(0,1fr) 330px; gap: 40px; align-items: start; }
.lj-tekst h2 { font-size: 21px; font-weight: 750; letter-spacing: -.02em; margin-bottom: 12px; }
.lj-tekst h3 { font-size: 16px; font-weight: 750; margin: 24px 0 10px; }
.lj-tekst p { color: var(--ink2); margin-bottom: 12px; max-width: 68ch; }
.lj-tekst a { color: var(--blaa); }
.lj-fac { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px 20px; }
.lj-fac li { position: relative; padding-left: 21px; font-size: 14px; color: var(--ink2); }
.lj-fac li::before { content: ""; position: absolute; left: 3px; top: 7px; width: 9px; height: 5px;
  border-left: 2px solid var(--orange); border-bottom: 2px solid var(--orange); transform: rotate(-45deg); }

.lj-kort { position: sticky; top: 76px; border: 1px solid var(--line); border-radius: 10px; padding: 20px;
  box-shadow: 0 10px 30px rgba(22,50,63,.08); }
.lj-pris { padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.lj-pris-tal { display: block; font-size: 27px; font-weight: 800; letter-spacing: -.03em; color: var(--blaa); }
.lj-pris-nb { display: block; font-size: 12.5px; color: var(--ink3); margin-top: 3px; }
.lj-kort-fakta { display: grid; gap: 9px; padding: 15px 0; }
.lj-kort-fakta > div { display: flex; justify-content: space-between; gap: 12px; font-size: 13.5px; }
.lj-kort-fakta dt { color: var(--ink3); }
.lj-kort-fakta dd { margin: 0; font-weight: 700; }
.btn-block { display: block; text-align: center; margin-bottom: 8px; width: 100%; }
.lj-kort .btn-b { color: var(--blaa); box-shadow: inset 0 0 0 1px var(--line); }
.lj-kort .btn-b:hover { background: var(--bg2); }
.lj-kort-nb { font-size: 12px; color: var(--ink3); text-align: center; margin-top: 10px; }

.lj-afs { margin-top: 30px; }
.lj-afs h3, .lj-andre h3 { font-size: 16px; font-weight: 750; margin-bottom: 12px;
  padding-bottom: 8px; border-bottom: 2px solid var(--blaa); }
.lj-afs dl { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.lj-afs dt { font-size: 12px; color: var(--ink3); }
.lj-afs dd { margin: 2px 0 0; font-weight: 700; font-size: 14.5px; }

.lj-andre { margin: 34px 0 40px; }
.lj-andre li { border-bottom: 1px solid var(--line); }
.lj-andre li a { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr) 90px 120px; gap: 14px;
  align-items: center; padding: 11px 8px; font-size: 14px; text-decoration: none; color: inherit; }
.lj-andre li a:hover { background: var(--bg2); }
.lj-andre span { color: var(--ink3); font-size: 13px; }
.lj-andre .pris { text-align: right; color: var(--orange); font-weight: 800; font-size: 14.5px; }
.lj-udlejet li { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(0,1fr) 90px 120px; gap: 14px;
  align-items: center; padding: 10px 8px; font-size: 13.5px; color: var(--ink3); }
.lj-udlejet .pris { color: var(--ink3); font-weight: 650; text-align: right; }
.lj-udlejet b { color: var(--ink2); font-weight: 650; }

/* --- Booking: opfordringen på siden --------------------------------------- */
.bk-kald { display: flex; align-items: center; justify-content: space-between; gap: 26px; flex-wrap: wrap;
  margin-top: 34px; padding: 22px 26px; border: 1px solid var(--line); border-left: 4px solid var(--orange);
  border-radius: 10px; background: var(--bg2); }
.bk-kald h2 { font-size: 20px; font-weight: 750; letter-spacing: -.02em; }
.bk-kald p { color: var(--ink2); font-size: 14px; margin-top: 6px; max-width: 60ch; }
.bk-kald .btn { border: 0; cursor: pointer; font-family: inherit; white-space: nowrap; }
/* Reserveret lejemål: samme kasse, men uden den orange opfordringsstribe —
   her er der intet at bestille, og farven må ikke love det modsatte. */
.bk-res { border-left-color: var(--warn); }
.bk-res .btn { background: var(--blaa); }

/* --- Booking: selve lightboxen -------------------------------------------- */
.bk-lys { position: fixed; inset: 0; z-index: 1000; background: rgba(15,24,29,.72);
  backdrop-filter: blur(3px); display: grid; place-items: center; padding: 20px; overflow-y: auto; }
.bk-lys[hidden] { display: none; }
.bk-boks { background: #fff; border-radius: 12px; width: min(680px, 100%); max-height: calc(100vh - 40px);
  display: flex; flex-direction: column; box-shadow: 0 30px 80px rgba(0,0,0,.4); }
.bk-hd { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px;
  padding: 20px 24px; border-bottom: 1px solid var(--line); }
.bk-hd h2 { font-size: 20px; font-weight: 750; letter-spacing: -.02em; }
.bk-hd p { font-size: 13px; color: var(--ink3); margin-top: 3px; }
.bk-luk { font: 400 26px/1 inherit; width: 34px; height: 34px; flex: none; cursor: pointer;
  border: 0; border-radius: 7px; background: var(--bg2); color: var(--ink2); }
.bk-luk:hover { background: var(--blaa); color: #fff; }
.bk-krop { padding: 4px 24px 24px; overflow-y: auto; }
.bk-vaelg { font: inherit; font-size: 15px; width: 100%; padding: 11px 12px;
  border: 1px solid var(--line); border-radius: 6px; background: #fff; color: var(--ink); }
.bk-advarsel { margin-top: 14px; padding: 10px 13px; border-radius: 6px; background: #fdeecd; color: #6b4700; font-size: 13px; }
.bk-trin { margin-top: 22px; }
.bk-trin h3 { display: flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 750; margin-bottom: 11px; }
.bk-trin h3 span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%;
  background: var(--blaa); color: #fff; font-size: 12px; font-weight: 800; }
.bk-henter { color: var(--ink3); font-size: 14px; }
.bk-dage { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; }
.bk-dag { display: flex; flex-direction: column; gap: 3px; text-align: left; font: inherit; cursor: pointer;
  padding: 11px 13px; border: 1px solid var(--line); border-radius: 7px; background: #fff; color: var(--ink); }
.bk-dag b { font-size: 14px; font-weight: 700; text-transform: capitalize; }
.bk-dag span { font-size: 11.5px; color: var(--ink3); }
.bk-dag:hover { border-color: var(--blaa); }
.bk-dag.on { background: var(--blaa); border-color: var(--blaa); color: #fff; }
.bk-dag.on span { color: rgba(255,255,255,.7); }
.bk-tider { display: flex; flex-wrap: wrap; gap: 7px; }
.bk-tid { font: 650 14px/1 inherit; cursor: pointer; padding: 11px 17px; border: 1px solid var(--line);
  border-radius: 7px; background: #fff; color: var(--ink); }
.bk-tid:hover { border-color: var(--blaa); }
.bk-tid.on { background: var(--orange); border-color: var(--orange); color: #fff; }
.bk-koersel { font-size: 12.5px; color: var(--ink3); margin-top: 10px; }
.bk-form { background: #fff; }
.bk-faelde { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.bk-opsummering { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; margin-bottom: 14px;
  border-radius: 7px; background: var(--bg2); border-left: 3px solid var(--orange); }
.bk-opsummering b { font-size: 15px; text-transform: capitalize; }
.bk-opsummering span { font-size: 12.5px; color: var(--ink3); }
.bk-fejl { margin-top: 12px; padding: 10px 13px; border-radius: 6px; background: #fde8e2; color: #8a2b0c; font-size: 13.5px; }
.bk-kvittering { padding: 22px 24px; border-radius: 8px; background: #dcefe9; border-left: 4px solid var(--ok); margin-top: 18px; }
.bk-kvittering h3 { font-size: 19px; font-weight: 750; margin-bottom: 8px; text-transform: capitalize; }
.bk-kvittering p { color: var(--ink2); font-size: 14px; margin-bottom: 6px; }
.bk-proeve { color: #8a5a00; font-weight: 650; }
.bk-lys button:focus-visible, .bk-lys input:focus-visible, .bk-lys textarea:focus-visible,
.bk-kald .btn:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }

/* --- Billed-lightbox ------------------------------------------------------ */
.foto-lys { position: fixed; inset: 0; z-index: 1100; background: rgba(10,16,20,.93);
  display: none; place-items: center; padding: 40px 20px; }
.foto-lys.open { display: grid; }
.foto-lys img { max-width: min(1300px, 100%); max-height: calc(100vh - 110px); object-fit: contain; border-radius: 6px; }
.foto-lys button { position: absolute; font: 400 34px/1 inherit; color: #fff; background: rgba(255,255,255,.14);
  border: 0; border-radius: 8px; width: 52px; height: 52px; cursor: pointer; }
.foto-lys button:hover { background: rgba(255,255,255,.28); }
.fl-luk { top: 18px; right: 18px; font-size: 26px !important; }
.fl-forrige { left: 18px; top: 50%; transform: translateY(-50%); }
.fl-naeste { right: 18px; top: 50%; transform: translateY(-50%); }
.fl-tal { position: absolute; bottom: 20px; left: 0; right: 0; text-align: center; color: rgba(255,255,255,.7); font-size: 13px; }

/* --- Formularer ----------------------------------------------------------- */
.kt-form { margin-top: 22px; border: 1px solid var(--line); border-radius: 10px; padding: 20px; }
.kt-form label { display: flex; flex-direction: column; gap: 5px; margin-bottom: 14px;
  font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .07em; color: var(--ink3); }
.kt-form input, .kt-form select, .kt-form textarea {
  font: inherit; font-size: 15px; text-transform: none; letter-spacing: 0; font-weight: 400;
  color: var(--ink); padding: 10px 12px; border: 1px solid var(--line); border-radius: 6px; background: #fff; }
.kt-form input:focus, .kt-form select:focus, .kt-form textarea:focus { outline: 2px solid var(--orange); outline-offset: 1px; border-color: var(--orange); }
.kt-form textarea { resize: vertical; }
.kt-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; }
.kt-form button { border: 0; cursor: pointer; }
.kt-nb { font-size: 12px; color: var(--ink3); margin-top: 12px; }
.hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* --- Tekstsider (om os, cookies, privatliv, 404) -------------------------- */
.smal { max-width: 760px; margin: 0 auto; padding: 0 24px; }
.prose h2 { font-size: 19px; font-weight: 750; letter-spacing: -.02em; margin: 30px 0 10px; }
.prose h3 { font-size: 16px; font-weight: 750; margin: 24px 0 8px; }
.prose p { color: var(--ink2); margin-bottom: 13px; }
.prose p.lead { font-size: 17px; color: var(--ink); }
.prose a { color: var(--blaa); }
.midt { text-align: center; padding: 60px 0 20px; }
.midt h1 { font-size: clamp(26px, 4vw, 38px); font-weight: 750; letter-spacing: -.025em; }
.midt p { color: var(--ink2); margin: 12px 0 24px; }
.midt .btn { margin: 0 5px; }

@media (max-width: 1020px) {
  .vis-gitter .enheder, .ejd { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .vis-liste .u { grid-template-columns: 108px minmax(0,1fr); grid-template-areas: "img body" "facts facts"; }
  .vis-liste .u-img { grid-area: img; } .vis-liste .u-body { grid-area: body; } .vis-liste .u-facts { grid-area: facts; }
  .vis-liste .u-go { display: none; }
  .top-in { grid-template-columns: 1fr; gap: 22px; }
  .fil { grid-template-columns: repeat(2, 1fr); }
  .ft-in { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .lj-2sp { grid-template-columns: 1fr; gap: 26px; }
  .lj-kort { position: static; }
  .lj-tal { grid-template-columns: repeat(2, 1fr); }
  .lj-gal { grid-template-columns: 1fr; }
  .lj-afs dl { grid-template-columns: repeat(2, 1fr); }
  .lj-fac { grid-template-columns: 1fr; }
  .lj-andre li a, .lj-udlejet li { grid-template-columns: minmax(0,1fr) 110px; }
  .lj-andre li span:nth-of-type(1), .lj-udlejet li span:nth-of-type(1) { display: none; }
  .kt-2 { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .hd-nav { position: absolute; left: 0; right: 0; top: 60px; display: none; flex-direction: column; gap: 0;
    background: var(--blaa-2); padding: 6px 24px 14px; }
  .hd-nav.open { display: flex; }
  .hd-nav a { padding: 11px 0; border-bottom: 1px solid rgba(255,255,255,.12); }
  .hd-menu { display: block; margin-left: auto; }
  .hd-book { padding: 10px 13px; font-size: 13px; }
  .vis-gitter .enheder, .ejd, .usp, .ft-in { grid-template-columns: 1fr; }
}
@media (max-width: 620px) {
  .bk-lys { padding: 0; }
  .bk-boks { border-radius: 0; width: 100%; height: 100vh; max-height: none; }
}