/* Variant 2 – «Velg din bolig» */
/* Manrope fra egen server (samme fil som info.hamrevann.no), så ingenting lastes fra Google før samtykke */
@font-face { font-family: "Manrope"; src: url(/assets/fonts/manrope-latin-wght-normal.woff2) format("woff2"); font-weight: 200 800; font-style: normal; font-display: swap; }
:root {
  --blekk: #10201a;
  --demp: #56645d;
  --linje: #e2e6df;
  --flate: #f4f6f1;
  --hvit: #fff;
  --gronn: #1d6b47;
  --gronn-mork: #124a31;
  --lime: #d4ecb8;
  --lime-sterk: #9ed36a;
  --lyng: #8e4a5e;
  --gul: #f2c14e;
  --sans: "Manrope", system-ui, sans-serif;
  --r: 18px;
  --gutter: clamp(16px, 4.5vw, 56px);
  --maks: 1280px;
  --t-6A: #1d6b47;
  --t-5A: #c7803a;
  --t-1AHC: #3f6fa6;
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body { margin: 0; font: 500 16px/1.6 var(--sans); color: var(--blekk); background: var(--hvit); overflow-x: hidden; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3 { font-weight: 800; letter-spacing: -0.03em; line-height: 1.05; margin: 0 0 .5em; }
h1 { font-size: clamp(2.4rem, 6.4vw, 4.4rem); }
h2 { font-size: clamp(1.8rem, 4.2vw, 2.9rem); }
h3 { font-size: 1.25rem; letter-spacing: -0.015em; }
p { margin: 0 0 1em; }
.ingress { font-size: clamp(1.05rem, 1.8vw, 1.2rem); color: var(--demp); max-width: 56ch; }
.liten { font-size: .85rem; color: var(--demp); }
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
:focus-visible { outline: 3px solid var(--gronn); outline-offset: 3px; }
section { padding: clamp(56px, 9vw, 112px) var(--gutter); }
section > * { max-width: var(--maks); margin-inline: auto; }
.seksjon-topp { margin-bottom: 28px; }

.knapp { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: .75em 1.25em; border-radius: 12px; background: var(--gronn); color: #fff; font: 700 .98rem/1.1 var(--sans); text-decoration: none; border: 0; cursor: pointer; transition: background .15s, transform .15s; text-align: center; }
.knapp:hover { background: var(--gronn-mork); }
.knapp:active { transform: scale(.98); }
.knapp-stor { min-height: 56px; padding: 1em 1.6em; font-size: 1.05rem; }
.knapp-hvit { background: var(--hvit); color: var(--blekk); box-shadow: inset 0 0 0 1.5px var(--linje); }
.knapp-hvit:hover { background: var(--flate); }
.knapp-full { width: 100%; min-height: 56px; }
.knapp-lenke { background: none; border: 0; padding: .4em 0; font: 700 .95rem var(--sans); color: var(--gronn); cursor: pointer; }

.chip { display: inline-flex; align-items: center; gap: .5em; padding: .45em .85em; border-radius: 999px; font-size: .8rem; font-weight: 700; background: var(--flate); color: var(--blekk); }
.chip-i-salg { background: var(--lime); color: var(--gronn-mork); }
.chip-snart { background: #fdf0cf; color: #6b4d05; }
.prikk { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #9aa39e; flex: none; }
.prikk-i-salg { background: #28a35f; box-shadow: 0 0 0 0 rgba(40,163,95,.6); animation: puls 2s infinite; }
.prikk-snart { background: #e0a31a; }
.prikk-planlagt { background: #9aa39e; }
.prikk-innflyttet { background: var(--gronn-mork); }
@keyframes puls { 70% { box-shadow: 0 0 0 8px rgba(40,163,95,0); } 100% { box-shadow: 0 0 0 0 rgba(40,163,95,0); } }
@media (prefers-reduced-motion: reduce) { .prikk-i-salg { animation: none; } html { scroll-behavior: auto; } }

/* Topp */
.topp { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 12px var(--gutter); background: rgba(255,255,255,.92); backdrop-filter: blur(12px); border-bottom: 1px solid var(--linje); }
.logo { display: flex; align-items: center; gap: .5rem; text-decoration: none; font-weight: 800; font-size: 1.2rem; letter-spacing: -.02em; }
.logo img { width: 18px; }
.topp-nav { display: none; gap: 6px; }
.topp-nav a { display: inline-flex; align-items: center; gap: .45em; padding: .5em .8em; border-radius: 10px; text-decoration: none; font-weight: 700; font-size: .92rem; }
.topp-nav a:hover { background: var(--flate); }
.topp-cta { display: flex; align-items: center; gap: 14px; }
.topp-tlf { display: none; font-weight: 700; text-decoration: none; }
.topp .knapp { min-height: 40px; padding: .55em 1em; font-size: .9rem; }
@media (min-width: 960px) { .topp-nav { display: flex; } .topp-tlf { display: inline; } }

/* Hero */
.hero { display: grid; gap: 28px; padding-top: clamp(24px, 4vw, 56px); max-width: none; }
.hero > * { max-width: none; margin: 0; }
.hero-tekst .chip { margin-bottom: 18px; }
.hero-knapper { display: grid; gap: 10px; margin: 26px 0; }
.hero-tall { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin: 0; padding-top: 22px; border-top: 1px solid var(--linje); }
.hero-tall dt { font-size: .78rem; color: var(--demp); font-weight: 600; }
.hero-tall dd { margin: 0; font-size: clamp(1.1rem, 2.4vw, 1.5rem); font-weight: 800; letter-spacing: -.02em; white-space: nowrap; }
.hero-bilde { position: relative; border-radius: var(--r); overflow: hidden; min-height: 320px; order: -1; }
.hero-bilde img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.hero-flytkort { position: absolute; left: 14px; right: 14px; bottom: 14px; background: rgba(255,255,255,.95); border-radius: 14px; padding: 14px 16px; display: grid; gap: 2px; box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.hero-flytkort span { font-size: .85rem; color: var(--demp); }
@media (min-width: 560px) { .hero-knapper { grid-template-columns: auto auto; justify-content: start; } }
@media (min-width: 1000px) {
  .hero { grid-template-columns: 1fr 1.05fr; align-items: center; gap: 56px; padding-left: max(var(--gutter), calc((100vw - var(--maks)) / 2)); min-height: calc(calc(var(--lh, 1svh) * 100) - 70px); padding-block: 40px; }
  .hero-bilde { order: 0; height: 100%; min-height: 560px; }
  .hero-flytkort { left: auto; right: 24px; bottom: 24px; max-width: 320px; }
}
@media (max-width: 999px) { .hero-bilde { aspect-ratio: 16/11; min-height: 0; } .hero-tun .hero-bilde { aspect-ratio: 16/10; } }

/* Tidslinje */
.tidslinje { padding-block: 0 24px; }
.tidslinje ol { list-style: none; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(150px, 1fr); gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }
.tl > a, .tl > div { display: grid; gap: 2px; padding: 14px 16px; border-radius: 14px; background: var(--flate); text-decoration: none; scroll-snap-align: start; height: 100%; }
.tl > a:hover { background: var(--lime); }
.tl .prikk { margin-bottom: 6px; }
.tl strong { font-size: 1.05rem; }
.tl span { font-size: .82rem; color: var(--demp); }
.tl-i-salg > a { background: var(--gronn); color: #fff; }
.tl-i-salg > a span { color: rgba(255,255,255,.8); }
.tl-i-salg > a:hover { background: var(--gronn-mork); }

/* Filter + typekort */
.filter { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.filter button { font: 700 .9rem var(--sans); padding: .65em 1.05em; border-radius: 999px; border: 1.5px solid var(--linje); background: var(--hvit); color: var(--blekk); cursor: pointer; min-height: 42px; }
.filter button[aria-pressed="true"] { background: var(--blekk); border-color: var(--blekk); color: #fff; }
.typegrid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); }
.typekort { text-decoration: none; border-radius: var(--r); overflow: hidden; background: var(--hvit); border: 1px solid var(--linje); display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s; }
.typekort[hidden] { display: none; }
.typekort:hover { box-shadow: 0 16px 36px -16px rgba(16,32,26,.3); transform: translateY(-3px); }
.typekort-bilde { position: relative; aspect-ratio: 4/3; background: var(--flate); }
.typekort-bilde img { width: 100%; height: 100%; object-fit: cover; }
.typekort-bilde.er-plan img { object-fit: contain; padding: 14px; background: #fff; }
.typekort-bilde .chip { position: absolute; top: 12px; left: 12px; }
.typekort-tekst { padding: 16px 18px 18px; }
.typekort-tekst h3 { margin-bottom: .2em; }
.typekort-tekst p { margin: 0; color: var(--demp); }
.typekort-pris { margin-top: 8px !important; font-weight: 800; color: var(--blekk) !important; font-size: 1.1rem; }

/* Bevis */
.bevis { background: var(--gronn-mork); color: #fff; }
.bevis > * { max-width: var(--maks); }
.bevis blockquote { margin: 0 auto 40px; }
.bevis blockquote p { font-size: clamp(1.4rem, 3.2vw, 2.2rem); font-weight: 700; line-height: 1.25; letter-spacing: -.02em; max-width: 30ch; }
.bevis footer { color: var(--lime-sterk); font-weight: 700; }
.bevis-tall { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; }
.bevis-tall div { background: rgba(255,255,255,.07); border-radius: 14px; padding: 18px; display: grid; gap: 4px; }
.bevis-tall strong { font-size: clamp(1.6rem, 3.6vw, 2.4rem); letter-spacing: -.03em; color: var(--lime); }
.bevis-tall span { font-size: .88rem; color: rgba(255,255,255,.75); }
@media (min-width: 900px) { .bevis-tall { grid-template-columns: repeat(4, 1fr); } }

/* Område */
.omrade { display: grid; gap: 32px; align-items: center; }
.omrade-bilder { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 0; }
.omrade-bilder img { border-radius: var(--r); aspect-ratio: 3/4; object-fit: cover; width: 100%; }
.omrade-bilder img:last-child { margin-top: 40px; }
.naerhet { list-style: none; padding: 0; margin: 20px 0 0; }
.naerhet li { display: flex; justify-content: space-between; gap: 16px; padding: 12px 0; border-top: 1px solid var(--linje); font-size: .95rem; }
.naerhet span { color: var(--demp); text-align: right; }
@media (min-width: 1000px) { .omrade { grid-template-columns: 1fr 1fr; gap: 64px; max-width: calc(var(--maks) + 2 * var(--gutter)); margin: 0 auto; } .omrade > * { max-width: none; margin: 0; } }

/* Skjema */
.skjema { background: var(--flate); }
.skjema-inn { display: grid; gap: 32px; align-items: start; }
.sjekk { list-style: none; padding: 0; margin: 18px 0; }
.sjekk li { position: relative; padding: 7px 0 7px 32px; }
.sjekk li::before { content: "✓"; position: absolute; left: 0; top: 7px; width: 22px; height: 22px; border-radius: 50%; background: var(--lime); color: var(--gronn-mork); font-size: .75rem; font-weight: 800; display: grid; place-items: center; }
.person { display: flex; align-items: center; gap: 12px; margin-top: 24px; }
.person-ikon { width: 48px; height: 48px; border-radius: 50%; background: var(--gronn); color: #fff; display: grid; place-items: center; font-weight: 800; }
.person strong { display: block; }
.person span { font-size: .9rem; color: var(--demp); }
.person a { color: var(--gronn); font-weight: 700; }
.skjema-kort { background: var(--hvit); border-radius: 22px; padding: clamp(20px, 4vw, 36px); box-shadow: 0 24px 60px -30px rgba(16,32,26,.35); position: relative; overflow: hidden; }
.progress { position: absolute; inset: 0 0 auto; height: 5px; background: var(--linje); }
.progress i { display: block; height: 100%; width: var(--p, 33%); background: var(--gronn); transition: width .3s; }
form[data-lead] fieldset { border: 0; margin: 0; padding: 8px 0 0; display: grid; gap: 14px; }
form[data-lead] legend { font-size: 1.3rem; font-weight: 800; letter-spacing: -.02em; margin-bottom: 14px; padding: 0; }
.valg { display: grid; gap: 10px; }
.valg button { display: grid; gap: 2px; text-align: left; padding: 14px 16px; border-radius: 14px; border: 1.5px solid var(--linje); background: var(--hvit); font: inherit; color: inherit; cursor: pointer; min-height: 56px; transition: border-color .15s, background .15s; }
.valg button:hover { border-color: var(--gronn); background: #f7fbf3; }
.valg button[aria-pressed="true"] { border-color: var(--gronn); background: var(--lime); }
.valg button span { font-size: .84rem; color: var(--demp); font-weight: 600; }
@media (min-width: 560px) { .valg { grid-template-columns: 1fr 1fr; } }
form label { display: grid; gap: 6px; font-weight: 700; font-size: .9rem; }
form input { min-height: 54px; padding: 0 16px; font: 500 16px var(--sans); border: 1.5px solid var(--linje); border-radius: 12px; background: #fff; color: var(--blekk); }
form input:focus { outline: none; border-color: var(--gronn); box-shadow: 0 0 0 3px rgba(29,107,71,.15); }
.tilbake { justify-self: start; background: none; border: 0; font: 700 .9rem var(--sans); color: var(--demp); cursor: pointer; padding: 6px 0; }
.feil { color: #b3261e; font-weight: 700; margin: 0; }
.valgt { margin: 0; padding: 12px 14px; border-radius: 12px; background: var(--lime); font-weight: 700; color: var(--gronn-mork); }
.valgt::before { content: "Interessert i: "; font-weight: 500; }
.samtykke { font-size: .8rem; color: var(--demp); margin: 0; }
.samtykke a { color: var(--demp); }
.takk { text-align: center; display: grid; gap: 6px; justify-items: center; padding: 12px 0; }
.takk[hidden] { display: none; }
.takk-ikon { width: 64px; height: 64px; border-radius: 50%; background: var(--lime); color: var(--gronn-mork); font-size: 1.8rem; font-weight: 800; display: grid; place-items: center; margin-bottom: 8px; }
.takk p { color: var(--demp); }
@media (min-width: 1000px) { .skjema-inn { grid-template-columns: 1fr 1.1fr; gap: 64px; } .skjema-tekst { position: sticky; top: 100px; } }

/* FAQ */
.faq-liste { display: grid; gap: 10px; margin-top: 24px; }
.faq details { border: 1px solid var(--linje); border-radius: 14px; padding: 0 18px; }
.faq summary { cursor: pointer; font-weight: 700; padding: 18px 28px 18px 0; list-style: none; position: relative; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; position: absolute; right: 0; top: 14px; font-size: 1.5rem; font-weight: 500; color: var(--gronn); }
.faq details[open] summary::after { content: "–"; }
.faq details p { color: var(--demp); }

/* Bunn + sticky */
.bunn { background: var(--blekk); color: rgba(255,255,255,.72); padding: 48px var(--gutter) 120px; display: grid; gap: 24px; font-size: .9rem; }
.bunn .logo { color: #fff; margin-bottom: 12px; }
.bunn .logo img { filter: brightness(0) invert(1); }
.bunn a { color: #fff; }
.forbehold { font-size: .8rem; max-width: 70ch; }
@media (min-width: 960px) { .bunn { grid-template-columns: 1fr 1fr; padding-bottom: 48px; } }
.sticky { position: fixed; left: 0; right: 0; bottom: 0; z-index: 50; display: flex; gap: 10px; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(255,255,255,.96); backdrop-filter: blur(10px); border-top: 1px solid var(--linje); transform: translateY(110%); transition: transform .3s; }
.sticky.vis { transform: none; }
.sticky a { min-height: 52px; display: flex; align-items: center; justify-content: center; border-radius: 12px; text-decoration: none; font-weight: 800; }
.sticky-ring { width: 56px; flex: none; border: 1.5px solid var(--linje); color: var(--gronn); }
.sticky-ring svg { width: 22px; height: 22px; fill: currentColor; }
.sticky-hoved { flex: 1; background: var(--gronn); color: #fff; }
@media (min-width: 960px) { .sticky { display: none; } }

/* Tomtekart */
.velg { background: var(--flate); }
.velg-grid { display: grid; gap: 20px; align-items: start; }
.kart { position: relative; border-radius: var(--r); overflow: hidden; background: #eef0e3; }
.kart img { width: 100%; }
.pin { position: absolute; transform: translate(-50%, -50%); width: clamp(26px, 3.6vw, 38px); height: clamp(26px, 3.6vw, 38px); border-radius: 50%; border: 2.5px solid #fff; background: var(--t-6A); color: #fff; font: 800 clamp(.62rem, 1.1vw, .8rem)/1 var(--sans); cursor: pointer; box-shadow: 0 3px 10px rgba(0,0,0,.25); transition: transform .15s, opacity .2s, box-shadow .15s; padding: 0; }
.pin::before { content: ""; position: absolute; inset: -8px; }
.pin:hover, .pin.aktiv { transform: translate(-50%, -50%) scale(1.25); z-index: 2; box-shadow: 0 0 0 4px rgba(255,255,255,.7), 0 6px 16px rgba(0,0,0,.35); }
.pin.aktiv { background: var(--blekk) !important; }
.pin-5A { background: var(--t-5A); }
.pin-1AHC { background: var(--t-1AHC); }
.pin.solgt { background: #9aa39e; text-decoration: line-through; }
.pin.dempet { opacity: .25; }
.pin-t4 { background: var(--farge); }
.enhetspanel { background: var(--hvit); border-radius: var(--r); padding: 24px; box-shadow: 0 16px 40px -24px rgba(16,32,26,.3); }
.panel-hint { font-weight: 800; font-size: 1.2rem; }
.panel-tom p:not(.panel-hint) { color: var(--demp); }
.legende { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 10px; font-size: .92rem; }
.legende li { display: flex; align-items: center; gap: 10px; }
.pin-farge { width: 16px; height: 16px; border-radius: 50%; background: var(--t-6A); flex: none; }
.pin-farge.pin-5A { background: var(--t-5A); }
.pin-farge.pin-1AHC { background: var(--t-1AHC); }
.panel-over { font-size: .85rem; font-weight: 700; color: var(--demp); margin-bottom: 4px; }
.panel-pris { font-size: 2rem; font-weight: 800; letter-spacing: -.03em; margin-bottom: 8px; }
.panel-pris span { display: block; font-size: .82rem; font-weight: 600; color: var(--demp); letter-spacing: 0; }
.spes { display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; margin: 0 0 20px; }
.spes div { border-top: 1px solid var(--linje); padding: 10px 0; }
.spes dt { font-size: .78rem; color: var(--demp); font-weight: 600; }
.spes dd { margin: 0; font-weight: 700; }
.enhetspanel .knapp-lenke { display: block; margin: 10px auto 0; }
@media (min-width: 1000px) { .velg-grid { grid-template-columns: 1.4fr 1fr; gap: 28px; } .enhetspanel { position: sticky; top: 90px; } }

.prisliste-wrap { margin-top: 24px; background: var(--hvit); border-radius: var(--r); padding: 4px 18px; }
.prisliste-wrap summary { cursor: pointer; font-weight: 800; padding: 16px 0; }
.prisliste { width: 100%; border-collapse: collapse; font-size: .92rem; }
.prisliste th { text-align: left; font-size: .75rem; color: var(--demp); padding: 10px 8px; border-bottom: 1px solid var(--linje); }
.prisliste td { padding: 10px 8px; border-bottom: 1px solid var(--linje); }
.prisliste td:last-child, .prisliste th:last-child { text-align: right; white-space: nowrap; }
.prisliste tr.solgt { color: #9aa39e; }
@media (max-width: 520px) { .prisliste th:nth-child(3), .prisliste td:nth-child(3) { display: none; } }
.fotnote { font-size: .82rem; color: var(--demp); padding: 12px 0; }

/* Faner */
.faner { display: flex; gap: 6px; overflow-x: auto; margin: 20px auto; padding-bottom: 4px; }
.faner button { font: 700 .95rem var(--sans); padding: .75em 1.1em; border-radius: 12px; border: 0; background: var(--flate); color: var(--blekk); cursor: pointer; white-space: nowrap; min-height: 46px; }
.faner button[aria-selected="true"] { background: var(--blekk); color: #fff; }
.fane { display: grid; gap: 24px; }
.fane[hidden] { display: none; }
.fane-bilder { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fane-bilder > img { grid-column: 1 / -1; border-radius: var(--r); aspect-ratio: 16/10; object-fit: cover; width: 100%; }
.fane-bilder figure { margin: 0; background: var(--flate); border-radius: 14px; padding: 10px; }
.fane-bilder figcaption { font-size: .8rem; color: var(--demp); text-align: center; font-weight: 700; padding-top: 6px; }
.fane-tekst p { font-size: 1.1rem; }
@media (min-width: 1000px) { .fane { grid-template-columns: 1.5fr 1fr; gap: 48px; align-items: start; } }

.leveranse { display: grid; gap: 28px; align-items: center; }
.leveranse > img { border-radius: var(--r); width: 100%; aspect-ratio: 4/3; object-fit: cover; }
@media (min-width: 1000px) { .leveranse { grid-template-columns: 1fr 1fr; gap: 64px; max-width: calc(var(--maks) + 2 * var(--gutter)); margin: 0 auto; } .leveranse > * { max-width: none; margin: 0; } }
/* Tun 4: utbyggeren under leveranselista */
.leveranse-t4 .fotnote { padding-top: 0; }
.utbygger { display: grid; gap: 12px; margin-top: 18px; padding: 18px 20px; border-radius: var(--r); background: var(--flate); }
.utbygger img { width: auto; height: 34px; }
.utbygger p { margin: 0; color: var(--demp); font-size: .92rem; }

/* Tun 4 */
.t4-typer { display: grid; gap: 12px; }
.t4-type { display: grid; grid-template-columns: 96px 1fr; gap: 14px; align-items: center; background: var(--hvit); border-radius: 16px; padding: 12px; border-left: 6px solid var(--farge); transition: box-shadow .2s, transform .2s; }
.t4-type.aktiv { box-shadow: 0 0 0 2px var(--farge), 0 14px 30px -18px rgba(0,0,0,.35); transform: translateX(4px); }
.t4-plan { background: #fff; border-radius: 10px; aspect-ratio: 1; overflow: hidden; }
.t4-plan img { width: 100%; height: 100%; object-fit: contain; }
.t4-type h3 { margin: 0 0 2px; color: var(--farge); }
.t4-type p { margin: 0; }
.t4-tall { margin-top: 4px !important; }
@media (min-width: 560px) { .t4-type { grid-template-columns: 130px 1fr; } }

.kryss { display: grid; gap: 24px; align-items: center; background: var(--flate); }
.kryss img { border-radius: var(--r); aspect-ratio: 16/10; object-fit: cover; width: 100%; }
@media (min-width: 1000px) { .kryss { grid-template-columns: 1fr 1fr; gap: 56px; max-width: none; } .kryss > * { max-width: none; margin: 0; } }

/* Tette kart på mobil: mindre pins og uten utvidet treffflate, så naboene ikke stjeler klikket */
.pin-t4 { width: clamp(18px, 3vw, 32px); height: clamp(18px, 3vw, 32px); border-width: 2px; font-size: clamp(.55rem, 1vw, .75rem); }
.pin-t4::before { inset: 0; }
@media (max-width: 600px) { .pin { border-width: 2px; } .pin::before { inset: -2px; } }

/* Tema for Hamrevann-historien */
.hv { --h-display: var(--sans); --h-display-vekt: 800; --h-mork: var(--gronn-mork); --h-lys: var(--flate); --h-papir: #fff; --h-blekk: var(--blekk); --h-demp: var(--demp); --h-aksent: #e9c46a; --h-lime: var(--lime); --h-baer: #8e4a5e; --h-topp: 65px; --h-gutter: var(--gutter); }
.hv h2 { letter-spacing: -.035em; }
.hv-scene-tekst p { letter-spacing: -.04em; }

.t4-plan img { object-fit: cover; }
@media (max-width: 700px) { .prisliste th:nth-child(4), .prisliste td:nth-child(4), .prisliste th:nth-child(6), .prisliste td:nth-child(6) { display: none; } }
.hv .hv-linjer { font-size: clamp(1.7rem, 3.3vw, 2.7rem); letter-spacing: -.035em; line-height: 1.12; }

/* Galleri i boligpanelet */
.panel-galleri { margin: -24px -24px 18px; }
.panel-hoved { position: relative; margin: 0; aspect-ratio: 16/10; background: #e9ece4; border-radius: var(--r) var(--r) 0 0; overflow: hidden; }
.panel-hoved img { width: 100%; height: 100%; object-fit: cover; animation: panel-inn .35s ease; }
.panel-hoved.er-plan img { object-fit: contain; background: #fff; padding: 10px; }
.panel-hoved figcaption { position: absolute; left: 10px; bottom: 10px; background: rgba(16,32,26,.78); color: #fff; font-size: .75rem; font-weight: 700; padding: .35em .7em; border-radius: 999px; }
@keyframes panel-inn { from { opacity: .3; } }
.panel-tommel { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; padding: 8px 24px 0; }
.panel-tommel button { padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; background: #f1f3ee; cursor: pointer; display: grid; font: inherit; }
.panel-tommel button[aria-pressed="true"] { border-color: var(--gronn); }
.panel-tommel img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.panel-tommel .er-plan img { object-fit: contain; background: #fff; }
.panel-tommel span { font-size: .66rem; font-weight: 700; color: var(--demp); padding: 3px 2px 4px; }

/* Felles bildegalleri */
.gal-hoved { position: relative; margin: 0; aspect-ratio: 16/10; background: #e9ece4; overflow: hidden; }
.gal-hoved img { width: 100%; height: 100%; object-fit: cover; animation: gal-inn .35s ease; }
.gal-hoved.er-plan img { object-fit: contain; background: #fff; padding: 10px; }
.gal-hoved figcaption { position: absolute; left: 10px; bottom: 10px; background: rgba(16,32,26,.8); color: #fff; font-size: .75rem; font-weight: 700; padding: .35em .75em; border-radius: 999px; }
@keyframes gal-inn { from { opacity: .3; } }
.gal-tommel { display: grid; grid-template-columns: repeat(auto-fill, minmax(72px, 1fr)); gap: 6px; padding: 8px 0 0; }
.gal-tommel button { padding: 0; border: 2px solid transparent; border-radius: 10px; overflow: hidden; background: #f1f3ee; cursor: pointer; display: grid; font: inherit; text-align: center; }
.gal-tommel button[aria-pressed="true"] { border-color: currentColor; }
.gal-tommel img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.gal-tommel .er-plan img { object-fit: contain; background: #fff; }
.gal-tommel span { font-size: .64rem; font-weight: 700; padding: 3px 2px 4px; line-height: 1.2; opacity: .8; }
.romliste { list-style: none; margin: 10px 0 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 18px; font-size: .9rem; }
.romliste li { display: flex; justify-content: space-between; gap: 8px; padding: 6px 0; border-bottom: 1px solid rgba(0,0,0,.08); }
.romliste li span:last-child { font-weight: 700; white-space: nowrap; }
.ekstra { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0 0; padding: 0; list-style: none; }
.ekstra li { font-size: .78rem; font-weight: 700; padding: .35em .75em; border-radius: 999px; background: color-mix(in srgb, var(--farge, #1d6b47) 14%, white); color: var(--farge, #1d6b47); }

.t4-panel { padding: 0 20px 20px; overflow: hidden; }
.t4-panel .gal { margin: 0 -20px 16px; color: var(--farge); }
.t4-panel .gal-tommel { padding: 8px 20px 0; }
.t4-panel h3 { color: var(--farge); margin-bottom: 6px; }
.t4-panel > p:not(.panel-over):not(.t4-tomtinfo) { color: var(--demp); font-size: .95rem; }
.t4-panel .ekstra { margin-bottom: 14px; }
.romdetaljer { margin: 0 0 16px; }
.romdetaljer summary { cursor: pointer; font-weight: 800; padding: 6px 0; }
@media (min-width: 1000px) { .t4-side { position: sticky; top: 90px; } }

/* ================= Konvertering: header/TOC, hero, CTA-er, skjema, film ================= */
.topp-nav a { position: relative; color: var(--demp); transition: color .2s; }
.topp-nav a:hover, .topp-nav a.aktiv { color: var(--blekk); background: transparent; }
.topp-nav a::after { content: ""; position: absolute; left: .8em; right: .8em; bottom: 2px; height: 2px; border-radius: 2px; background: var(--gronn); transform: scaleX(0); transition: transform .25s; }
.topp-nav a.aktiv::after { transform: scaleX(1); }
.topp-nav a[href^="/"] { color: var(--gronn); }
@media (max-width: 1279px) { .topp-nav a.sek { display: none; } }
.topp-fremdrift { position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: var(--gronn); transform: scaleX(0); transform-origin: 0 50%; pointer-events: none; }
.toc-knapp { display: none; align-items: center; gap: 4px; min-height: 40px; padding: 0 12px; border-radius: 999px; border: 1.5px solid var(--linje); background: var(--hvit); font: 700 .88rem var(--sans); color: var(--blekk); cursor: pointer; max-width: 42vw; }
.toc-knapp span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.toc-knapp svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; transition: transform .2s; }
.toc-knapp[aria-expanded="true"] svg { transform: rotate(180deg); }
.toc-meny { position: absolute; left: 12px; right: 12px; top: calc(100% + 6px); background: var(--hvit); border-radius: 16px; box-shadow: 0 20px 50px -10px rgba(16,32,26,.35); padding: 8px; display: grid; z-index: 60; }
.toc-meny[hidden] { display: none; }
.toc-meny a { padding: 13px 14px; border-radius: 10px; text-decoration: none; font-weight: 700; }
.toc-meny a.aktiv { background: var(--lime); color: var(--gronn-mork); }
.toc-meny .toc-tlf { color: var(--gronn); border-top: 1px solid var(--linje); border-radius: 0; margin-top: 4px; }
@media (max-width: 959px) {
  .toc-knapp { display: inline-flex; }
  .topp { gap: 8px; }
  .topp .knapp { padding: .55em .85em; }
}
@media (max-width: 420px) { .logo span { display: none; } }

/* Hero */
.hero-tekst h1 { text-wrap: balance; }
.hero-tekst .ingress strong { color: var(--blekk); white-space: nowrap; }
.hero-usp { list-style: none; margin: 4px 0 0; padding: 20px 0 0; border-top: 1px solid var(--linje); display: flex; flex-wrap: wrap; gap: 10px 22px; }
.hero-usp li { display: flex; align-items: center; gap: 8px; font-weight: 800; font-size: .98rem; }
.hero-usp li::before { content: ""; width: 22px; height: 22px; border-radius: 50%; flex: none; background: var(--lime) url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 24 24%22 fill=%22none%22 stroke=%22%23124a31%22 stroke-width=%223%22 stroke-linecap=%22round%22 stroke-linejoin=%22round%22%3E%3Cpath d=%22m6 12 4 4 8-8%22/%3E%3C/svg%3E") center/14px no-repeat; }
.hero-tillit { margin: 14px 0 0; font-size: .84rem; color: var(--demp); }
.hero-film { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); z-index: 2; display: grid; justify-items: center; gap: 10px; background: none; border: 0; cursor: pointer; color: #fff; font: 800 1rem var(--sans); }
.hero-play { width: 84px; height: 84px; border-radius: 50%; display: grid; place-items: center; background: rgba(255,255,255,.95); box-shadow: 0 0 0 0 rgba(255,255,255,.5), 0 14px 40px rgba(0,0,0,.35); animation: hero-puls 2.4s infinite; transition: transform .2s; }
.hero-play svg { width: 34px; height: 34px; fill: var(--gronn-mork); margin-left: 4px; }
.hero-film:hover .hero-play { transform: scale(1.08); }
@keyframes hero-puls { 70% { box-shadow: 0 0 0 18px rgba(255,255,255,0), 0 14px 40px rgba(0,0,0,.35); } 100% { box-shadow: 0 0 0 0 rgba(255,255,255,0), 0 14px 40px rgba(0,0,0,.35); } }
.hero-film-tekst { background: rgba(16,32,26,.6); padding: .45em .9em; border-radius: 999px; backdrop-filter: blur(6px); }
.hero-idag { position: absolute; left: 14px; right: 14px; bottom: 14px; z-index: 2; display: flex; align-items: center; gap: 12px; padding: 8px 14px 8px 8px; background: rgba(255,255,255,.96); border-radius: 14px; text-decoration: none; box-shadow: 0 10px 30px rgba(0,0,0,.2); transition: transform .2s; }
.hero-idag:hover { transform: translateY(-2px); }
.hero-idag img { position: static !important; width: 96px !important; height: 54px !important; object-fit: cover; border-radius: 8px; flex: none; }
.hero-idag strong { display: block; font-size: .95rem; }
.hero-idag small { color: var(--gronn); font-weight: 700; }
@media (min-width: 1000px) { .hero-idag { left: auto; right: 24px; bottom: 24px; } }
@media (max-width: 999px) { .hero-play { width: 64px; height: 64px; } .hero-play svg { width: 26px; height: 26px; } .hero-film { top: 40%; } .hero-film-tekst { font-size: .85rem; } .hero-idag { padding: 6px 12px 6px 6px; } .hero-idag img { width: 72px !important; height: 44px !important; } }
@media (prefers-reduced-motion: reduce) { .hero-play { animation: none; } }

/* Flytende CTA (desktop) */
.flyt-cta { position: fixed; right: 24px; bottom: 24px; z-index: 45; width: 340px; display: grid; grid-template-columns: 64px 1fr; gap: 14px; align-items: start; padding: 16px; background: var(--hvit); border-radius: 18px; box-shadow: 0 24px 60px -18px rgba(16,32,26,.45); border: 1px solid var(--linje); opacity: 0; transform: translateY(16px); transition: opacity .3s, transform .3s; }
.flyt-cta.vis { opacity: 1; transform: none; }
.flyt-cta[hidden] { display: none; }
.flyt-cta img { width: 64px; height: auto; border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,.2); }
.flyt-cta strong { display: block; font-size: 1rem; margin-bottom: 2px; padding-right: 20px; }
.flyt-cta span { display: flex; align-items: center; gap: 6px; font-size: .84rem; color: var(--demp); margin-bottom: 10px; }
.flyt-cta .knapp { min-height: 40px; font-size: .9rem; padding: .55em 1em; }
.flyt-lukk { position: absolute; top: 8px; right: 8px; width: 28px; height: 28px; border-radius: 50%; border: 0; background: var(--flate); cursor: pointer; font-size: 1rem; line-height: 1; }

/* Sticky mobil: animasjon ved tekstbytte */
.sticky-hoved.bytt { animation: sticky-bytt .45s ease; }
@keyframes sticky-bytt { 0% { transform: scale(.96); opacity: .5; } 100% { transform: none; opacity: 1; } }
.sticky-hoved { text-align: center; padding: 0 10px; line-height: 1.15; }

/* Skjema: ønske, prospektforside, partnere */
.valg-onske { grid-template-columns: 1fr !important; }
.valg-onske button { padding: 16px 18px; }
.valg-onske button strong { font-size: 1.05rem; }
.prospekt-kort { display: flex; align-items: center; gap: 14px; margin: 22px 0 6px; padding: 12px; border-radius: 14px; background: var(--hvit); border: 1px solid var(--linje); }
.prospekt-kort img { width: 64px; height: auto; border-radius: 3px; box-shadow: 0 6px 14px rgba(0,0,0,.18); transform: rotate(-3deg); }
.prospekt-kort strong { display: block; }
.prospekt-kort span { font-size: .85rem; color: var(--demp); }
.partnere { font-size: .88rem; color: var(--demp); margin: 0; }

/* Filmmodal */
.film-modal { position: fixed; inset: 0; z-index: 1000; background: rgba(6,14,10,.92); display: grid; place-items: center; padding: 16px; animation: film-inn .25s ease; }
@keyframes film-inn { from { opacity: 0; } }
.film-ramme { position: relative; width: min(1100px, 100%); display: grid; gap: 14px; justify-items: center; }
.film-ramme iframe { width: 100%; aspect-ratio: 16/9; border: 0; border-radius: 14px; background: #000; }
.film-lukk { position: absolute; top: -52px; right: 0; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255,255,255,.16); color: #fff; font-size: 1.6rem; cursor: pointer; }
.film-cta { background: #e9c46a; color: var(--gronn-mork); }
.film-cta:hover { background: #f1d27f; }

@media (max-width: 999px) {
  .hero:not(.hero-tun) .hero-bilde { aspect-ratio: 4/3.4; }
  .hero-film-tekst { display: none; }
  .hero-film { top: 42%; }
}

/* Nærhet i hero */
.hero-naer { list-style: none; margin: 16px 0 0; padding: 0; display: grid; grid-template-columns: repeat(4, auto); gap: 8px; justify-content: start; }
.hero-naer li { display: flex; align-items: center; gap: 8px; padding: 8px 12px 8px 8px; border-radius: 12px; background: var(--flate); font-size: .86rem; line-height: 1.2; color: var(--demp); }
.hero-naer strong { display: block; color: var(--blekk); font-size: .95rem; }
.hero-naer svg { width: 28px; height: 28px; flex: none; padding: 5px; border-radius: 8px; background: var(--hvit); fill: none; stroke: var(--gronn); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
@media (max-width: 1439px) { .hero-naer { grid-template-columns: repeat(2, auto); } }
@media (max-width: 420px) { .hero-naer { grid-template-columns: 1fr 1fr; } .hero-naer li { padding: 7px 8px 7px 6px; } }

.hero:not(.hero-tun) h1 { font-size: clamp(2.1rem, 3.9vw, 3.5rem); line-height: 1.04; }
.hero:not(.hero-tun) h1 .h1-sted { color: var(--gronn); }

/* Boligpanelet skal få plass i skjermhøyden på desktop, ved siden av kartet */
@media (min-width: 1000px) {
  .velg-grid { align-items: start; }
  .enhetspanel { top: 81px; max-height: calc(var(--lh, 1svh) * 100 - 97px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 20px 22px; }
  .panel-galleri { margin: -20px -22px 12px; }
  .panel-hoved { aspect-ratio: 16/8.2; }
  .panel-tommel { padding: 6px 22px 0; gap: 5px; }
  .panel-tommel img { aspect-ratio: 16/9; }
  .panel-tommel span { font-size: .62rem; padding: 2px 2px 3px; }
  .enhetspanel .panel-over { margin-bottom: 0; font-size: .8rem; }
  .enhetspanel h3 { margin-bottom: 2px; font-size: 1.15rem; }
  .enhetspanel .panel-pris { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 12px; font-size: 1.65rem; margin-bottom: 6px; }
  .enhetspanel .panel-pris span { display: inline; }
  .enhetspanel .spes { grid-template-columns: repeat(3, 1fr); gap: 0 14px; margin-bottom: 14px; }
  .enhetspanel .spes div { padding: 7px 0; }
  .enhetspanel .spes dd { font-size: .9rem; line-height: 1.3; }
  .enhetspanel .knapp-full { min-height: 50px; }
  .enhetspanel .knapp-lenke { margin-top: 4px; }
  /* Tun 4-panelet */
  .t4-panel .gal { margin: -20px -22px 12px; }
  .t4-panel .gal-hoved { aspect-ratio: 16/8.2; }
  .t4-panel .gal-tommel { grid-template-columns: repeat(auto-fill, minmax(62px, 1fr)); padding: 6px 22px 0; }
  .t4-panel .gal-tommel img { aspect-ratio: 16/10; }
  .t4-panel > p:not(.panel-over) { font-size: .9rem; margin-bottom: 8px; }
  .t4-panel .ekstra { margin: 0 0 10px; }
}

/* ---------- Tun 4: planløsninger, sammenligning, leveranse ---------- */
.hero-tun .hero-usp + .hero-tall { border-top: 0; padding-top: 16px; }
.t4-faner { gap: 10px; margin: 4px auto 24px; padding-bottom: 6px; }
.t4-faner button[role="tab"] { display: grid; gap: 2px; min-width: 220px; min-height: 0; padding: 14px 16px; border-radius: 16px; border: 2px solid var(--linje); background: var(--hvit); text-align: left; white-space: normal; }
.t4-faner button strong { color: var(--farge); font-size: 1rem; }
.t4-faner button span { font-size: .92rem; }
.t4-faner button small { color: var(--demp); font-size: .8rem; font-weight: 600; line-height: 1.3; }
.t4-faner button[aria-selected="true"] { background: var(--farge); border-color: var(--farge); color: #fff; }
.t4-faner button[aria-selected="true"] strong, .t4-faner button[aria-selected="true"] small { color: #fff; }
@media (min-width: 1000px) { .t4-faner { display: grid; grid-template-columns: repeat(4, 1fr); overflow: visible; } .t4-faner button[role="tab"] { min-width: 0; } }
.t4-fane-bilder figure { position: relative; display: grid; align-content: center; }
.t4-fane-bilder .t4-plan-fig img { width: 100%; object-fit: contain; }
.t4-fane-bilder .t4-foto { padding: 0; overflow: hidden; }
.t4-fane-bilder .t4-foto img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.t4-fane-bilder .t4-foto figcaption { position: absolute; left: 8px; bottom: 8px; padding: 3px 10px; border-radius: 999px; background: rgba(16,32,26,.78); color: #fff; font-size: .72rem; }
.t4-fane-bilder .t4-fasade-fig { grid-column: 1 / -1; background: #fff; border: 1px solid var(--linje); }
.t4-fane-bilder .t4-fasade-fig img { width: auto; max-height: 380px; margin: 0 auto; }
.t4-fane-tekst h3 { font-size: clamp(1.6rem, 3vw, 2.1rem); color: var(--farge); margin-bottom: 8px; }
.t4-fane-tekst > p:not(.panel-over) { font-size: 1.05rem; color: var(--demp); }
.t4-etasjer { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin: 0 0 20px; }
.t4-etasjer > div { padding: 12px 14px; border-radius: 14px; background: var(--flate); }
.t4-etasjer h4, .t4-utstyr-tittel { margin: 0 0 6px; font-size: .74rem; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; color: var(--farge); }
.t4-etasjer ul { margin: 0; padding: 0; list-style: none; font-size: .93rem; }
.t4-etasjer li { padding: 2px 0; }
.t4-utstyr { margin: 4px 0 22px; font-size: .95rem; }
.t4-utstyr li { padding-block: 5px; }

.t4-sammenlign { background: var(--flate); }
.t4-tabell-ramme { overflow-x: auto; border-radius: var(--r); background: var(--hvit); }
.t4-tabell { width: 100%; min-width: 660px; border-collapse: collapse; font-size: .95rem; }
.t4-tabell th, .t4-tabell td { padding: 12px 14px; border-bottom: 1px solid var(--linje); text-align: left; vertical-align: top; }
.t4-tabell thead th { border-bottom: 3px solid var(--farge); vertical-align: bottom; }
.t4-tabell tbody th { position: sticky; left: 0; z-index: 1; background: var(--hvit); color: var(--demp); font-size: .8rem; font-weight: 700; white-space: nowrap; }
.t4-tabell thead td { position: sticky; left: 0; z-index: 1; background: var(--hvit); }
.t4-tabell tbody tr:last-child > * { border-bottom: 0; }
.t4-velg { display: grid; gap: 2px; padding: 0; border: 0; background: none; font: inherit; font-size: 1.15rem; font-weight: 800; color: var(--farge); text-align: left; cursor: pointer; }
.t4-velg span { color: var(--demp); font-size: .78rem; font-weight: 600; line-height: 1.3; }
.t4-velg:hover { text-decoration: underline; text-underline-offset: 4px; }

.leveranse-t4 .t4-leveranse-alt { grid-column: 1 / -1; padding: 0 20px; border-radius: var(--r); background: var(--flate); }
.t4-leveranse-alt summary { padding: 18px 0; font-weight: 800; cursor: pointer; }
.t4-leveranse-grid { display: grid; gap: 18px 32px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.t4-leveranse-grid h3 { margin: 0 0 6px; font-size: 1rem; letter-spacing: 0; }
.t4-leveranse-grid ul { margin: 0; padding-left: 18px; color: var(--demp); font-size: .94rem; }
.t4-leveranse-grid li { padding: 2px 0; }

/* ---------- Tun 4: utbygger og kjøpet (i .hv, se historie.mjs) ---------- */
.hv-tun4 .hv-bygger { display: grid; gap: 44px; align-items: center; padding-top: clamp(24px, 5vw, 72px); background: var(--h-papir); }
@media (min-width: 900px) { .hv-tun4 .hv-bygger { grid-template-columns: 1fr 1.15fr; gap: 80px; padding-inline: max(var(--h-gutter), calc((100vw - 1240px) / 2)); } }
.hv-bygger-bilder { position: relative; }
.hv-bygger-hoved img { width: 100%; aspect-ratio: 5/6; object-fit: cover; border-radius: var(--r); }
.hv-bygger-hoved figcaption { max-width: 52%; margin-top: 10px; color: var(--h-demp); font-size: .82rem; line-height: 1.4; }
.hv-bygger-utstilling { position: absolute; right: -10px; top: 62%; width: min(46%, 250px); overflow: hidden; border: 6px solid #fff; border-radius: 16px; box-shadow: 0 22px 44px -22px rgba(0,0,0,.5); }
.hv-bygger-utstilling img { width: 100%; aspect-ratio: 455/310; object-fit: cover; }
.hv-bygger-logo { width: auto; height: 40px; margin-bottom: 20px; }
.hv-bygger-tekst > p:not(.hv-over) { max-width: 56ch; color: var(--h-demp); font-size: 1.08rem; }
.hv-bygger .hv-punkter { margin: 18px 0 26px; }
.hv-bygger .hv-punkter li { color: var(--h-demp); }
.hv-bygger .hv-punkter strong { color: var(--h-blekk); }
.hv-bygger-sitat { margin: 0; padding: 18px 22px; border-left: 4px solid var(--h-baer); border-radius: 0 14px 14px 0; background: var(--flate); }
.hv-bygger-sitat blockquote { margin: 0 0 6px; color: var(--h-blekk); font-size: 1.15rem; font-weight: 800; line-height: 1.35; }
.hv-bygger-sitat figcaption { color: var(--h-demp); font-size: .85rem; }
.hv-tun4 .hv-kjopsteg { background: var(--h-mork); color: #fff; }
.hv-stegliste { counter-reset: none; }
.hv-trygt-grid .hv-stegnr { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 6px; border-radius: 50%; background: var(--h-lime); color: var(--h-mork); font-size: 1.1rem; font-weight: 800; }

/* ---------- Tun 4: priser ---------- */
.t4-faner .t4-tabpris { font-weight: 800; color: var(--farge); }
.t4-faner button[aria-selected="true"] .t4-tabpris { color: #fff; }
.t4-pris { display: grid; gap: 2px; margin: 0 0 14px; padding: 12px 14px; border-radius: 14px; background: color-mix(in srgb, var(--farge, #1d6b47) 9%, white); }
.t4-pris strong { font-size: 1.2rem; font-weight: 800; color: var(--farge, var(--blekk)); }
.t4-pris span { font-size: .82rem; color: var(--demp); line-height: 1.4; }
.t4-fane-tekst > .t4-pris { font-size: 1rem; }
.t4-tomtinfo { margin: 0 0 8px; padding: 8px 12px; border-radius: 10px; background: var(--blekk); color: #fff; font-size: .88rem; font-weight: 700; }
.t4-fra { margin: 2px 0 0 !important; font-weight: 800; color: var(--farge); }
.t4-priskort { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.t4-priskort article { display: flex; flex-direction: column; padding: 18px 18px 14px; border-radius: var(--r); border-top: 5px solid var(--farge); background: var(--flate); }
.t4-priskort h3 { margin: 0 0 4px; font-size: 1.1rem; }
.t4-prisstor { margin: 0 0 12px; font-size: clamp(1.5rem, 3vw, 1.9rem); font-weight: 800; letter-spacing: -.02em; color: var(--farge); }
.t4-prisstor small { display: block; margin-top: 2px; font-size: .8rem; font-weight: 700; letter-spacing: 0; color: var(--demp); }
.t4-priskort ul { list-style: none; margin: 0 0 10px; padding: 0; font-size: .9rem; }
.t4-priskort li { display: flex; justify-content: space-between; gap: 10px; padding: 6px 0; border-top: 1px solid var(--linje); }
.t4-priskort li span { color: var(--demp); }
.t4-priskort li strong { white-space: nowrap; }
.t4-priskort .knapp-lenke { margin-top: auto; align-self: flex-start; }
.t4-betaling { display: grid; gap: 24px; margin-top: 28px; }
@media (min-width: 1000px) { .t4-betaling { grid-template-columns: 1.6fr 1fr; gap: 48px; } }
.t4-betaling h3 { margin: 0 0 12px; font-size: 1.2rem; }
.t4-betalingsliste { list-style: none; display: grid; gap: 8px; margin: 0; padding: 0; grid-template-columns: repeat(auto-fit, minmax(min(100%, 130px), 1fr)); }
.t4-betalingsliste li { display: grid; gap: 4px; padding: 12px 14px; border-radius: 14px; background: var(--flate); }
.t4-betalingsliste strong { font-size: 1.35rem; font-weight: 800; color: var(--gronn); }
.t4-betalingsliste span { font-size: .85rem; color: var(--demp); line-height: 1.35; }
.t4-betaling > div:last-child p { color: var(--demp); }

/* ---- Koblet til info-systemet (2026-11-05) ---- */
/* Samtykkebanner som på info.hamrevann.no: «Godta» og «Nei takk» like store, side om side */
.cookie { position: fixed; z-index: 70; left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); max-width: 480px; margin-inline: auto; padding: 20px 20px 18px; border-radius: 20px; background: var(--hvit); color: var(--blekk); box-shadow: 0 -2px 10px rgba(15, 30, 22, .08), 0 24px 60px rgba(15, 30, 22, .3); animation: cookie-inn .45s cubic-bezier(.2, .8, .2, 1) both; }
.cookie[hidden] { display: none; }
@keyframes cookie-inn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@media (min-width: 1000px) { .cookie { left: 24px; right: auto; bottom: 24px; max-width: 440px; } }
.cookie-tittel { margin: 0 0 6px; font-weight: 800; font-size: 1.2rem; letter-spacing: -.015em; }
.cookie-tekst { margin: 0 0 16px; color: var(--demp); font-size: .92rem; }
.cookie-tekst a { color: var(--gronn); font-weight: 700; }
.cookie-knapper { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.cookie-knapper .knapp { width: 100%; }
/* Linjen under send-knappen for den som kom fra en Meta-annonse uten å godta */
.klikkmelding { margin: 10px 0 0; font-size: .8rem; line-height: 1.45; color: var(--demp); }
.klikkmelding[hidden] { display: none; }
.klikkmelding .knapp-lenke { padding: 2px 0; font-size: inherit; }
/* Skjult felt som bare roboter fyller ut */
.honning { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.takk [data-prospekt][hidden] { display: none; }
.bunn-lenker { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 0; }
.bunn-lenker button { background: none; border: 0; padding: 0; font: inherit; color: #fff; text-decoration: underline; cursor: pointer; }

/* ---- Gjennomgang 2026-11-05 ---- */
.hero-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.hero-tekst .hero-chips .chip { margin-bottom: 0; }
/* Prisstigen i toppen av forsiden: laveste pris per boligtype, rett til riktig side */
.hero-priser { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 4px 0 22px; padding: 0; }
.hero-priser a { display: grid; gap: 2px; padding: 10px 12px; border-radius: 12px; background: var(--flate); color: var(--blekk); text-decoration: none; border: 1.5px solid transparent; transition: border-color .15s, background .15s; }
.hero-priser a:hover { border-color: var(--gronn); background: var(--hvit); }
.hero-priser span { font-size: .8rem; font-weight: 600; color: var(--demp); }
.hero-priser strong { font-size: 1.02rem; font-weight: 800; letter-spacing: -.01em; white-space: nowrap; }
@media (max-width: 380px) { .hero-priser { grid-template-columns: 1fr; } .hero-priser a { grid-template-columns: 1fr auto; align-items: baseline; } }
/* Tabellen i Tun 4 kan sveipes på mobil */
.sveip-hint { display: none; margin: -6px auto 10px; font-size: .85rem; font-weight: 700; color: var(--gronn); }
@media (max-width: 999px) { .sveip-hint { display: block; } }
/* Kjøpet i Tun 2 / Tun 4 på forsiden (radioknapper, ingen JS) */
.hv-kjop-faner { display: inline-flex; gap: 4px; padding: 4px; margin: 0 0 14px; border-radius: 999px; background: rgba(255, 255, 255, .12); }
.hv-kjop-faner label { padding: 7px 16px; border-radius: 999px; font-weight: 800; font-size: .9rem; color: #fff; cursor: pointer; }
#hv-kjop-t2:checked ~ .hv-kjop-faner label[for="hv-kjop-t2"], #hv-kjop-t4:checked ~ .hv-kjop-faner label[for="hv-kjop-t4"] { background: #fff; color: var(--blekk); }
#hv-kjop-t2:focus-visible ~ .hv-kjop-faner label[for="hv-kjop-t2"], #hv-kjop-t4:focus-visible ~ .hv-kjop-faner label[for="hv-kjop-t4"] { outline: 3px solid var(--lime); outline-offset: 2px; }
#hv-kjop-t2:checked ~ .hv-kjop-t4, #hv-kjop-t4:checked ~ .hv-kjop-t2 { display: none; }

/* ---- Tun 4, planløsningene (2026-11-05): kompakt på PC og mobil ---- */
/* Ett stort bilde med miniatyrer (felles galleri), knappen under prisen, rom og utstyr bak åpne/lukk */
.t4-fane .gal { color: var(--farge); }
.t4-fane .gal-hoved { border-radius: var(--r); }
.t4-fane .gal-tommel { grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 8px; padding-top: 10px; }
.t4-fane .gal-tommel span { font-size: .7rem; color: var(--blekk); }
.t4-fane-cta { margin: 0 0 16px; }
.t4-fane-tekst .spes { margin-bottom: 6px; }
.t4-detaljer { border-top: 1px solid var(--linje); }
.t4-detaljer + .t4-detaljer { border-top: 1px solid var(--linje); }
.t4-detaljer:last-child { border-bottom: 1px solid var(--linje); }
.t4-detaljer summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 14px 0; font-weight: 800; cursor: pointer; }
.t4-detaljer summary::-webkit-details-marker { display: none; }
.t4-detaljer summary span { margin-left: auto; font-size: .85rem; font-weight: 600; color: var(--demp); }
.t4-detaljer summary::after { content: "+"; width: 1.2em; text-align: center; font-size: 1.3rem; line-height: 1; font-weight: 600; color: var(--farge); }
.t4-detaljer[open] summary::after { content: "–"; }
.t4-detaljer .t4-etasjer, .t4-detaljer .t4-utstyr { margin: 0 0 16px; }
@media (max-width: 999px) {
  /* Fanene: alle fire typene og prisene synlige samtidig (2 × 2), uten sveip */
  .t4-faner { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; overflow: visible; padding-bottom: 0; margin-bottom: 18px; }
  .t4-faner button[role="tab"] { min-width: 0; padding: 10px 12px; border-radius: 14px; gap: 1px; }
  .t4-faner button strong { font-size: .9rem; }
  .t4-faner button span { font-size: .82rem; }
  .t4-faner button small { display: none; }
  .t4-fane { gap: 18px; }
}
@media (max-width: 599px) { .t4-fane .gal-tommel { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 6px; } .t4-fane .gal-tommel img { aspect-ratio: 16/10; } }

/* ---- Lånekalkulator (2026-11-05) ---- */
.laan { display: grid; border: 1px solid var(--linje); border-radius: var(--r); overflow: hidden; background: var(--hvit); margin-top: 28px; }
@media (min-width: 900px) { .laan { grid-template-columns: 1.15fr 1fr; } }
.laan-inn { padding: 22px; display: grid; gap: 14px; align-content: start; }
.laan-inn h3 { margin: 0; font-size: 1.3rem; }
.laan-ingress { margin: -8px 0 0; color: var(--demp); font-size: .95rem; }
.laan-felt { display: grid; gap: 6px; font-weight: 700; font-size: .9rem; }
.laan-felt > span:first-child { display: flex; justify-content: space-between; align-items: baseline; }
.laan-felt output { color: var(--gronn); font-weight: 800; }
.laan-felt select, .laan-input input { width: 100%; min-height: 46px; font: 600 1rem var(--sans); padding: 10px 12px; border: 1.5px solid var(--linje); border-radius: 10px; background: var(--hvit); color: var(--blekk); }
.laan-input { position: relative; display: block; }
.laan-input input { padding-right: 34px; }
.laan-input i { position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-style: normal; color: var(--demp); }
.laan-felt input[type="range"] { width: 100%; accent-color: var(--gronn); min-height: 28px; }
.laan-rad { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.laan-resultat { background: var(--flate); padding: 22px; display: grid; gap: 10px; align-content: start; }
.laan-over { margin: 0; font-weight: 700; color: var(--demp); font-size: .9rem; }
.laan-tall { margin: 0; font-size: clamp(2rem, 5vw, 2.7rem); font-weight: 800; letter-spacing: -.03em; line-height: 1; color: var(--gronn-mork); }
.laan-tall-liten { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 4px 0 6px; }
.laan-tall-liten div { border-top: 1px solid var(--linje); padding-top: 8px; }
.laan-tall-liten dt { font-size: .78rem; color: var(--demp); font-weight: 600; }
.laan-tall-liten dd { margin: 0; font-weight: 800; }
.laan .fotnote { margin: 0; padding: 0; font-size: .76rem; }
.laan-seksjon { padding-top: 0; }

/* ---- Designrunden 2026-11-05 ---- */
/* Forsidebildet: 3D-illustrasjonen av Tun 4 er merket som illustrasjon */
.hero-illu { position: absolute; left: 12px; top: 12px; z-index: 2; padding: .3em .75em; border-radius: 999px; background: rgba(16,32,26,.72); color: #fff; font-size: .72rem; font-weight: 700; pointer-events: none; }
/* Tun 4 fra lufta: det store bildet fra prospektet, med landskapsbildet ved siden av på PC */
.t4-3d { display: grid; gap: 12px; }
.t4-3d figure { position: relative; margin: 0; border-radius: var(--r); overflow: hidden; background: var(--flate); }
.t4-3d img { display: block; width: 100%; height: 100%; object-fit: cover; }
.t4-3d figcaption { position: absolute; left: 12px; bottom: 12px; padding: .35em .8em; border-radius: 999px; background: rgba(16,32,26,.8); color: #fff; font-size: .78rem; font-weight: 700; pointer-events: none; }
.t4-3d-hoved { aspect-ratio: 16 / 9; }
@media (min-width: 1000px) { .t4-3d { grid-template-columns: 2fr 1fr; } }
@media (max-width: 999px) { .t4-3d-vid { display: none; } }
/* Utsolgt type på forsiden: gråtonet, men synlig (viser at det selger) */
.typekort.utsolgt { opacity: .62; }
.typekort.utsolgt img { filter: grayscale(1); }
@media (max-width: 599px) {
  /* Boligtypene i to kolonner på mobil, så man ser alle typene og prisene nesten samtidig */
  .typegrid { grid-template-columns: 1fr 1fr; gap: 10px; }
  .typekort-bilde .chip { top: 8px; left: 8px; font-size: .66rem; padding: .3em .6em; }
  .typekort-tekst { padding: 10px 12px 12px; }
  .typekort-tekst h3 { font-size: .92rem; letter-spacing: -.01em; }
  .typekort-tekst p { font-size: .78rem; }
  .typekort-pris { font-size: .9rem; margin-top: 6px !important; }
}
@media (max-width: 699px) {
  /* Tun 4 på mobil: tabellen viser det samme som priskortene og må sveipes, så den er skjult */
  .t4-sammenlign { display: none; }
  /* «Fra prospekt til nøkkel» som kompakt nummerert liste */
  .hv-stegliste { gap: 8px; }
  .hv-stegliste li { grid-template-columns: 34px 1fr; column-gap: 12px; row-gap: 2px; padding: 14px 16px; border-radius: 14px; }
  .hv-trygt-grid.hv-stegliste .hv-stegnr { grid-row: 1 / span 2; width: 34px; height: 34px; margin: 0; font-size: .95rem; }
  .hv-stegliste strong { font-size: 1rem; }
  .hv-stegliste li > span:last-child { font-size: .88rem; line-height: 1.45; }
}

/* ---- Skjemaarket (2026-11-05): åpnes rett opp fra alle knappene, som på info.hamrevann.no ---- */
/* Mobil: hele skjermen. PC: kort midt på med uskarp bakgrunn. */
.ark { width: 100%; max-width: 100%; height: 100%; max-height: 100%; margin: 0; padding: 0; border: 0; background: var(--hvit); color: var(--blekk); }
.ark[open] { display: flex; flex-direction: column; }
.ark::backdrop { background: rgba(16, 32, 26, .6); -webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px); }
@media (min-width: 640px) { .ark { width: min(540px, calc(100% - 32px)); height: auto; max-height: calc(100% - 48px); margin: auto; border-radius: 22px; box-shadow: 0 30px 80px -24px rgba(16, 32, 26, .55); } }
.ark-topp { flex: none; display: flex; align-items: center; gap: 14px; padding: 12px 12px 8px 20px; }
.ark-fremdrift { flex: 1; height: 6px; overflow: hidden; border-radius: 3px; background: var(--linje); }
.ark-fremdrift i { display: block; width: var(--p, 25%); height: 100%; border-radius: 3px; background: var(--gronn); transition: width .3s; }
.ark-lukk { flex: none; display: grid; place-items: center; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 50%; background: var(--flate); color: var(--blekk); cursor: pointer; }
.ark-lukk:hover { background: var(--linje); }
.ark-lukk svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; }
.ark-skjema, .ark-takk { flex: 1; overflow-y: auto; overscroll-behavior: contain; padding: 4px 20px calc(24px + env(safe-area-inset-bottom)); }
@media (min-width: 640px) { .ark-skjema, .ark-takk { padding: 4px 28px 28px; } }
/* .ark foran: må slå form[data-lead] fieldset (gap 14px, padding øverst) */
.ark .ark-skjema fieldset { gap: 10px; padding: 0; min-width: 0; }
.ark .ark-tittel { display: block; margin: 6px 0 16px; padding: 0; font-size: clamp(1.45rem, 5.4vw, 1.7rem); font-weight: 800; letter-spacing: -.025em; line-height: 1.15; }
/* Valgene: hele raden er klikkbar, og et trykk går videre */
.ark .ark-valg { position: relative; display: flex; align-items: center; gap: 12px; margin: 0; padding: 14px 16px; border: 1.5px solid var(--linje); border-radius: 14px; background: var(--hvit); font-weight: 500; font-size: 1rem; cursor: pointer; transition: border-color .15s, background .15s; }
.ark .ark-valg input, .ark .ark-brikke input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; min-height: 0; margin: 0; padding: 0; border: 0; }
.ark-valg-tekst { display: grid; gap: 1px; min-width: 0; }
.ark-valg strong { font-weight: 800; letter-spacing: -.01em; line-height: 1.3; }
.ark-valg small { color: var(--demp); font-size: .84rem; font-weight: 600; line-height: 1.35; }
@media (hover: hover) { .ark .ark-valg:hover { border-color: var(--gronn); background: #f7fbf3; } }
.ark .ark-valg:has(input:checked) { border-color: var(--gronn); background: #eef7e4; }
.ark .ark-valg:has(input:focus-visible) { outline: 3px solid var(--gronn); outline-offset: 2px; }
.ark-pil { flex: none; margin: 0 4px 0 auto; width: 9px; height: 9px; border-top: 2.5px solid var(--gronn); border-right: 2.5px solid var(--gronn); transform: rotate(45deg); }
/* Boligvalget: miniatyr, type og størrelse, pris og ledige */
.ark .ark-bolig { padding: 10px 14px 10px 10px; }
.ark-bilde { flex: none; width: 64px; height: 48px; border-radius: 9px; object-fit: cover; background: var(--flate); }
.ark-pris { font-weight: 800; font-size: .95rem; color: var(--gronn-mork); line-height: 1.3; }
.ark-pris small { font-size: .8rem; font-weight: 600; color: var(--demp); }
.ark-gruppe { margin: 6px 0 -2px; font-size: .74rem; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--demp); }
.ark-gruppe:first-of-type { margin-top: 0; }
.ark-valgt { margin: 2px 0 10px; padding: 10px 14px; border-radius: 12px; background: var(--lime); color: var(--gronn-mork); font-weight: 700; font-size: .92rem; }
.ark-valgt::before { content: "Du har valgt: "; font-weight: 500; }
/* Kontaktsteget */
.ark-skjema textarea { width: 100%; min-height: 92px; padding: 12px 16px; font: 500 16px/1.45 var(--sans); border: 1.5px solid var(--linje); border-radius: 12px; background: #fff; color: var(--blekk); resize: vertical; }
.ark-skjema textarea:focus { outline: none; border-color: var(--gronn); box-shadow: 0 0 0 3px rgba(29, 107, 71, .15); }
.ark-skjema input[aria-invalid="true"] { border-color: #b3261e; }
.ark-mer summary { padding: 6px 0; color: var(--gronn); font-weight: 800; cursor: pointer; }
.ark-mer summary small { color: var(--demp); font-weight: 600; font-size: .85rem; }
.ark-mer[open] { display: grid; gap: 12px; }
.ark-skjema .ark-husstand { display: block; margin: 0; padding: 0; border: 0; }
.ark-skjema .ark-husstand legend { margin: 0 0 8px; padding: 0; font-size: .9rem; font-weight: 700; letter-spacing: 0; }
.ark-brikker { display: flex; flex-wrap: wrap; gap: 8px; }
.ark .ark-brikke { position: relative; display: block; }
.ark-brikke span { display: inline-block; padding: 9px 14px; border: 1.5px solid var(--linje); border-radius: 999px; font-weight: 700; font-size: .92rem; cursor: pointer; transition: background .15s, border-color .15s; }
.ark-brikke input:checked + span { background: var(--gronn); border-color: var(--gronn); color: #fff; }
.ark-brikke input:focus-visible + span { outline: 3px solid var(--gronn); outline-offset: 2px; }
.ark-skjema .samtykke { margin-top: -2px; }
/* Takken */
.ark-takk { display: block; text-align: center; }
.ark-takk .takk-ikon { margin: 18px auto 12px; }
.ark-takk .ark-tittel { margin-bottom: 8px; }
.ark-takk > p { margin: 0 auto 18px; max-width: 40ch; color: var(--demp); }
.ark-takk .knapp-full + .knapp-full { margin-top: 10px; }
.ark-person { display: flex; align-items: center; gap: 12px; margin: 22px 0 6px; padding: 14px; border-radius: 14px; background: var(--flate); text-align: left; }
.ark-person p { margin: 0; line-height: 1.4; }
.ark-person strong { display: block; }
.ark-person span { font-size: .88rem; color: var(--demp); }
.ark-takk .knapp-lenke { margin-top: 6px; padding: 10px; }
/* Skjemaseksjonen nederst på siden: de tre valgene åpner arket */
.skjema-velger-tittel { margin: 0 0 14px; font-size: 1.3rem; letter-spacing: -.02em; }
.skjema-velger .valg button { position: relative; padding-right: 48px; }
.skjema-velger .valg button::after { content: ""; position: absolute; right: 22px; top: 50%; width: 9px; height: 9px; border-top: 2.5px solid var(--gronn); border-right: 2.5px solid var(--gronn); transform: translateY(-50%) rotate(45deg); }
.skjema-velger-fot { margin: 14px 0 0; text-align: center; font-size: .85rem; color: var(--demp); }

/* ---- Olav (2026-11-05): bilde i stedet for «OJ», og et ansikt ved «Bli ringt opp» ---- */
.person-foto { flex: none; width: 48px; height: 48px; border-radius: 50%; object-fit: cover; background: var(--flate); }
.ark-person .person-foto { width: 56px; height: 56px; }
@media (min-width: 960px) { .topp-tlf { display: inline-flex; align-items: center; gap: 8px; } }
.topp-foto { width: 30px; height: 30px; border-radius: 50%; object-fit: cover; background: var(--flate); }
.skjema-velger .valg button.med-foto { grid-template-columns: 40px 1fr; column-gap: 14px; align-items: center; }
.skjema-velger .valg button.med-foto strong, .skjema-velger .valg button.med-foto span { grid-column: 2; }
.valg-foto { grid-row: 1 / span 2; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.ark-foto { flex: none; width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.sticky .sticky-ring { position: relative; padding: 0; }
.sticky-foto { width: 40px; height: 40px; border-radius: 50%; object-fit: cover; }
.sticky-tlf { position: absolute; right: 5px; bottom: 5px; display: grid; place-items: center; width: 19px; height: 19px; border-radius: 50%; background: var(--gronn); box-shadow: 0 0 0 2px #fff; }
.sticky-ring .sticky-tlf svg { width: 10px; height: 10px; fill: #fff; }
/* Tynn ring, så den lyse bakgrunnen i bildet ikke glir over i hvite knapper */
.person-foto, .topp-foto, .valg-foto, .ark-foto { box-shadow: 0 0 0 1.5px var(--linje); }

/* Pris uten garasje (Olav 2026-11-06): «+ garasje» under tallet */
.hero-priser small { font-size: .72rem; font-weight: 700; color: var(--demp); line-height: 1.1; }
.hero-tall dd small { display: block; margin-top: 2px; font-size: .72rem; font-weight: 700; color: var(--demp); letter-spacing: 0; }

/* Reservert (status fra adminpanelet): gul ring rundt pinnen, og i prislisten */
.pin.reservert { box-shadow: 0 0 0 3px #f2c14e, 0 3px 10px rgba(0,0,0,.25); }
.prisliste tr.reservert td:nth-child(5) { color: #8a6d1d; }