/* Kirurgisk Klinik Aarhus – fælles stilark
   Farverne er hentet fra logoet og klinikkens egne lokaler:
   sort skrift og lys varmgrå fra logoet, salviegrøn fra venteværelsets væg,
   egetræ fra sildebensparketten og de bronzefarvede bogstaver ved indgangen. */

:root {
  --paper: #ffffff;
  --ink: #000000;          /* logoets sorte */
  --text: #2e2c29;         /* brødtekst, varm mørkegrå */
  --muted: #5f5b55;        /* sekundær tekst */
  --stone: #c8c6bf;        /* logoets "/AARHUS" – kun dekorativt */
  --sage: #e6ebe3;         /* venteværelsets væg */
  --sage-deep: #d3dbcf;
  --green: #637562;        /* salviegrøn – links */
  --green-on-sage: #5a6c59; /* samme grønne, en anelse mørkere på den lysegrønne flade, så den kan læses */
  --green-dark: #3a4838;
  --green-soft: #637562;   /* sidefod og knapper */
  --rule: #dcd9d2;

  --display: "Century Gothic", "Futura", "Avenir Next", "Avenir", "URW Gothic", "Jost", system-ui, sans-serif;
  --body: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;

  --wrap: 120rem;
  --gutter: clamp(1.25rem, 7.1vw, 8.6rem);
  --slash: 11%;            /* hældningen fra logoets skråstreg (bruges ikke p.t.) */
  /* Pouls designjusteringer 12. okt. 2026 (målt ved 1920 px, skalerer med skærmen) */
  --logo-w: clamp(200px, 21vw, 404px);
  --logo-w-small: var(--logo-w);
  --nav-size: clamp(1.1rem, 1.15vw, 1.375rem);
  --topbar-pad: clamp(1.2rem, 1.56vw, 1.875rem);
  --topbar-pad-small: clamp(1rem, 1.3vw, 1.5625rem);
  --hero-min-h: min(70vh, 34.7rem);
  --hero-pad-top: clamp(1.5rem, 3.65vw, 4.375rem);
  --hero-pad-bottom: clamp(1.5rem, 1.7vw, 2.1rem);
  --who-size: 1.125rem;
  --who-gap: 2.95rem;
  --h1-hero: clamp(1.6rem, 1.56vw, 1.875rem);
  --lead-size: 1.125rem;
  --booking-photo: 36%;
  --booking-min-h: clamp(16rem, 15.2vw, 18.25rem);
  --booking-pad: clamp(2.5rem, 3.8vw, 4.6rem);
  --phone-size: 1.7rem;
  --band-size: clamp(.75rem, .94vw, 1.125rem);
  --section-pad: clamp(2rem, 2.2vw, 2.6rem);
  --h2-size: clamp(1.5rem, 1.56vw, 1.875rem);
  --head-gap: .875rem;
  --area-min: min(23.75rem, 100%);
  --area-gap: clamp(2rem, 6.25vw, 7.5rem);
  --area-title: 1.25rem;
  --footer-pad: 1.875rem;
  --line: 2;
  --para-gap: 0;
  --measure: 44em;
  /* Pouls justeringer af kontaktsiden og undersidernes overskrift, 12. okt. 2026 (målt ved 1920 px) */
  --intro-pad-top: 1.875rem;
  --intro-pad-bottom: .625rem;
  --contact-left: .78fr;
  --contact-gap: clamp(2rem, 2.6vw, 3.1rem);
  --tiles-w: 757px;
  --tile-gap: clamp(1rem, 2.3vw, 2.75rem);
  --tile-pad: 1rem;
  --tile-num: clamp(1.7rem, 1.93vw, 2.3rem);
  --tile-mail: clamp(1.1rem, 1.56vw, 1.875rem);
  --tile-small: 1.0625rem;
  --radius: 32px;
  --pair-h: clamp(16rem, 29vw, 35rem);
}

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

html { -webkit-text-size-adjust: 100%; overflow-anchor: none; }

body {
  margin: 0;
  background: var(--paper);
  color: var(--text);
  font: 400 var(--body-size, 1.125rem)/var(--line, 1.6) var(--body);
  hyphens: manual;
  overflow-wrap: break-word;
}

img { display: block; max-width: 100%; height: auto; }

a { color: var(--green); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { color: var(--green-dark); text-decoration-thickness: 2px; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; border-radius: 2px; }

h1, h2, h3 {
  font-family: var(--display);
  color: var(--ink);
  font-weight: 400;
  line-height: 1.15;
  margin: 0 0 .6em;
}
h1 { font-size: var(--h1-page, clamp(2rem, 4.6vw, 3.1rem)); letter-spacing: -.01em; }
h2 { font-size: var(--h2-size, clamp(1.5rem, 3vw, 2.05rem)); }
h3 { font-size: 1.2rem; font-weight: 700; margin-bottom: .4em; }

p { margin: 0 0 var(--para-gap, 1em); max-width: var(--measure, 38em); }
.nowrap { white-space: nowrap; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.intro-band .page-intro { padding-bottom: var(--intro-pad-bottom-band, clamp(1.75rem, 3vw, 2.75rem)); }

.wrap { max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gutter); }

.skip { position: absolute; left: -999px; top: 0; background: var(--ink); color: #fff; padding: .6rem 1rem; z-index: 10; }
.skip:focus { left: 1rem; top: 1rem; }

/* ---------- Sidehoved: logo og menu på grøn baggrund, følger med ved scroll ---------- */
.topbar { position: sticky; top: 0; z-index: 40; background: var(--sage); font-size: var(--topbar-size, 1.15rem); transition: box-shadow .25s, transform .25s ease; }
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; gap: .4rem 2rem; padding-top: var(--topbar-pad, 2rem); padding-bottom: var(--topbar-pad, 2rem); transition: padding .25s; }
.scrolled .topbar { box-shadow: 0 1px 0 var(--sage-deep); }
.header-hidden .topbar { transform: translateY(-100%); }
.menu-open .topbar { transform: none; }
.scrolled .topbar .wrap { padding-top: var(--topbar-pad-small, .7rem); padding-bottom: var(--topbar-pad-small, .7rem); }
.nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .25rem 2rem; }
.nav a { font-family: var(--display); color: var(--ink); text-decoration: none; font-size: var(--nav-size, 1.2rem); padding: .2rem 0; border-bottom: 2px solid transparent; }
.nav a:hover { border-bottom-color: var(--stone); }
.nav a[aria-current="page"] { border-bottom-color: var(--ink); }

.brand { display: inline-block; }
.brand img { width: var(--logo-w, clamp(200px, 26vw, 495px)); transition: width .25s; }
.scrolled .brand img { width: var(--logo-w-small, clamp(170px, 15vw, 280px)); }

/* ---------- Forside: indledning ---------- */
.hero { display: grid; grid-template-columns: minmax(0, var(--hero-text, 56%)) minmax(0, 1fr); align-items: stretch; min-height: var(--hero-min-h, min(70vh, 40rem)); }
.hero h1 { font-size: var(--h1-hero, clamp(1.75rem, 1.7vw, 2rem)); }
.hero-text { background: var(--sage); display: flex; flex-direction: column; justify-content: var(--hero-valign, flex-start); gap: var(--hero-gap, clamp(2rem, 6.4vw, 7.7rem)); padding: var(--hero-pad-top, clamp(1.5rem, 4vw, 4rem)) clamp(1.5rem, 4vw, 4rem) var(--hero-pad-bottom, clamp(2.5rem, 5vw, 4rem)) max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter))); }
.hero-copy { max-width: 46rem; }
.hero-text .lead { font-size: var(--lead-size, 1.25rem); color: var(--text); }
.hero-photo { position: relative; margin: 0; }
.hero-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 40% 60%; }

.who { font-family: var(--display); font-weight: 700; color: var(--ink); font-size: var(--who-size, clamp(1.15rem, 1.4vw, 1.35rem)); margin-bottom: var(--who-gap, 1.2rem); }
.who strong { color: var(--ink); font-weight: 400; }

/* Bestil tid – billedet fylder hele venstre halvdel */
.booking { display: grid; grid-template-columns: minmax(0, var(--booking-photo, 50%)) minmax(0, 1fr); column-gap: var(--band-size); background: var(--paper); }
.booking-photo { margin: 0; position: relative; min-height: var(--booking-min-h, clamp(22rem, 34vw, 34rem)); }
.booking-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.booking-text { padding: var(--booking-pad, clamp(3rem, 6vw, 5.5rem)) max(var(--gutter), calc((100vw - var(--wrap)) / 2 + var(--gutter))) var(--booking-pad, clamp(3rem, 6vw, 5.5rem)) var(--booking-indent, clamp(2rem, 5vw, 5rem)); align-self: var(--booking-valign, center); text-align: var(--booking-align, left); }
.band { height: var(--band-size); background: var(--paper); }
.big-phone { display: inline-block; font-family: var(--display); font-size: var(--phone-size, clamp(2.2rem, 4.5vw, 3.6rem)); color: var(--ink); text-decoration: none; letter-spacing: .02em; line-height: 1.1; }
.big-phone:hover { color: var(--green); }
.booking-hours { font-family: var(--display); font-size: 1.2rem; color: var(--ink); margin: .4rem 0 1.4rem; }

/* ---------- Sektioner ---------- */
.section { padding: var(--section-pad, clamp(3rem, 7vw, 5.5rem)) 0; }
.section--sage { background: var(--sage); }
.section--sage a:not(.button):not(.big-phone), .hero-text a:not(.big):not(.brand), .note a, .masthead a { color: var(--green-on-sage); }
.section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; flex-wrap: wrap; margin-bottom: var(--head-gap, 2rem); }
.section-head h2 { margin: 0; }

/* Behandlingsoversigt – en åben liste, ikke kort */
.areas { display: grid; grid-template-columns: repeat(auto-fit, minmax(var(--area-min, 15.5rem), 1fr)); gap: 0 var(--area-gap, 3rem); margin: 0; }
.areas > div { padding: 1.3rem 0 1.4rem; border-top: 1px solid var(--sage-deep); }
.areas dt { font-family: var(--display); color: var(--ink); font-size: var(--area-title, 1.2rem); margin-bottom: .35rem; }
.areas dd { margin: 0; color: var(--text); }

/* Endolet */
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(2rem, 6vw, 5rem); align-items: center; }
.split figure { margin: 0; }
.split figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }

/* Find vej */
.visit { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3rem); align-items: start; }
.visit .visit-btn { margin-top: 1.75rem; }
.visit figure { margin: 0; }
.visit figure img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.visit figcaption { font-size: .95rem; color: var(--muted); margin-top: .5rem; }
address { font-style: normal; }

/* Knapper og links */
.button { display: inline-block; font-family: var(--display); background: var(--green-soft); color: #fff; text-decoration: none; padding: .85rem 1.4rem; font-size: 1.05rem; border-radius: 12px; border: 2px solid var(--green-soft); line-height: 1.3; }
.button--outline { background: transparent; color: var(--green-on-sage) !important; border-color: var(--green-soft); }
.button--outline:hover { background: var(--green-soft); color: #fff !important; }
.button:hover { background: var(--green-dark); color: #fff; text-decoration: none; }
.more { font-family: var(--display); }

/* ---------- Patientinformation ---------- */
.page-intro { padding: var(--intro-pad-top, clamp(2rem, 6vw, 4rem)) 0 var(--intro-pad-bottom, clamp(1.5rem, 3vw, 2.5rem)); }
.page-intro p { font-size: 1.2rem; }

.leaflets { display: grid; grid-template-columns: 18.5rem minmax(0, 1fr); gap: 0 3rem; padding: clamp(1.5rem, 2.5vw, 2.25rem) clamp(1.25rem, 3vw, 2.75rem); background: var(--sage); border-radius: 14px; margin-bottom: var(--band-size); }
.leaflets--note { display: block; }
.leaflets--note p { margin: 0; max-width: none; }
.leaflets--note a { color: var(--green-on-sage); }
.leaflets h2 { font-size: 1.35rem; margin: .2rem 0 1rem; }
.leaflets ul { list-style: none; margin: 0; padding: 0; }
.leaflets li a { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; padding: .85rem 0; border-bottom: 1px solid var(--sage-deep); color: var(--text); text-decoration: none; }
.leaflets li:first-child a { padding-top: .2rem; }
.leaflets li a span { color: var(--ink); }
.leaflets li a small { flex: none; font-size: .9rem; color: var(--green-on-sage); }
.leaflets li:last-child a { border-bottom: 0; padding-bottom: .2rem; }
.leaflets li a:hover span { text-decoration: underline; text-underline-offset: .18em; }

.note { background: var(--sage); padding: 1.4rem 1.6rem; margin: 2.5rem 0 0; max-width: 46rem; }
.note p:last-child { margin-bottom: 0; }

/* ---------- Undersider ---------- */
.staff { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(15rem, 100%), 1fr)); gap: 2.5rem var(--area-gap, 3rem); }
.staff img { width: 100%; aspect-ratio: 1; object-fit: cover; margin-bottom: 1rem; }
.staff h3 { font-family: var(--display); font-weight: 400; font-size: var(--area-title, 1.25rem); margin: 0 0 .2rem; }
.staff p { margin: 0; }
.wide-photo { margin: 0; }
.wide-photo img { width: 100%; max-height: 32rem; object-fit: cover; }
.photo-pair { display: grid; grid-template-columns: 1fr 1fr; gap: var(--band-size); }
.photo-pair figure { margin: 0; }
.photo-pair img { width: 100%; height: var(--pair-h, auto); aspect-ratio: 4 / 3; object-fit: cover; }
.contact-grid { display: grid; grid-template-columns: minmax(0, var(--contact-left, 1fr)) minmax(0, 1fr); gap: 2rem var(--contact-gap, var(--area-gap, 3rem)); }
.contact-grid .ramp { max-width: none; }
@media (max-width: 860px) { .contact-grid { grid-template-columns: 1fr; } }
.contact-grid h2 { margin-bottom: .6rem; }
.hours.hours--light dt { color: var(--muted); }
.hours.hours--light { gap: .15rem 1.5rem; }
.pro-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(24rem, 100%), 1fr)); gap: 0 var(--area-gap, 3rem); align-items: start; }
.pro-block { padding: 1.3rem 0 1.4rem; border-top: 1px solid var(--sage-deep); }
.pro-block h2 { font-size: var(--area-title, 1.25rem); margin-bottom: .5rem; }
.pro-block ul, .plain-list, .prose ul { margin: 0; padding-left: 1.2rem; }
.pro-block ul ul, .prose ul ul { margin-top: .2rem; color: var(--muted); }
.plain-list { margin-bottom: 1.5rem; }
.prose { max-width: calc(var(--measure, 44em) + 2 * var(--gutter)); margin-left: 0; }
.prose h2 { font-size: clamp(1.2rem, 1.3vw, 1.45rem); margin: 2rem 0 .5rem; }
.prose p { margin-bottom: .8em; }
.prose ul { margin-bottom: .8em; }
@media (max-width: 860px) {
  .photo-pair { grid-template-columns: 1fr; }
  .hide-mobile { display: none !important; }
  .site-footer { text-align: center; line-height: 1.45; padding: 1.75rem 0; }
  .site-footer .footer-grid { gap: 1.1rem; }
  .site-footer h2 { margin-bottom: .3rem; }
  .site-footer h2[style] { margin-top: .8rem !important; }
  .site-footer .hours { display: inline-grid; text-align: left; }
  .footer-links li { margin-bottom: .15rem; }
  .leaflets { border-radius: 10px; }
}

/* Til fagfolk: første sektion som forsidens, to kolonner nederst */
.hero--sub { min-height: clamp(16rem, 24vw, 26rem); }
.two-up { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 2rem var(--area-gap, 3rem); align-items: start; }
.two-up .note { margin: 0; max-width: none; border-radius: 14px; }

/* Kontakt: telefonkort */
.call-card { display: grid; gap: .2rem; max-width: 26rem; margin: 1.4rem 0 1.2rem; padding: 1.4rem 1.6rem; background: var(--paper); border-radius: 14px; color: var(--ink) !important; text-decoration: none; transition: background .2s; }
.call-card:hover { background: #f6f8f5; }
.call-label { font-size: .95rem; color: var(--muted); }
.call-number { display: flex; align-items: center; gap: .6rem; font-family: var(--display); font-size: clamp(2rem, 3vw, 2.6rem); line-height: 1.2; letter-spacing: .02em; }
.call-icon { width: .75em; height: .75em; fill: var(--green-soft); flex: none; }
.call-hours { color: var(--muted); font-size: 1rem; }
.call-button { display: none; justify-self: start; margin-top: .8rem; }
.mail-row { margin: 0 0 .5rem; }

/* Om klinikken: Poul øverst, øvrige fire på række */
.staff-lead { display: grid; grid-template-columns: minmax(0, 20rem) minmax(0, 1fr); gap: clamp(1.5rem, 4vw, 3.5rem); align-items: start; margin-bottom: clamp(2rem, 4vw, 3.5rem); }
.staff-lead img { width: 100%; aspect-ratio: 1; object-fit: cover; }
.staff-lead h3 { font-family: var(--display); font-weight: 400; font-size: clamp(1.4rem, 1.6vw, 1.8rem); margin: 0; }
.staff-title { color: var(--muted); margin-bottom: 1rem !important; }
.staff-lead p { margin-bottom: .8em; }
@media (min-width: 861px) {
  .staff { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .site-footer { line-height: 1.55; }
  .site-footer .footer-links li { margin-bottom: .2rem; }
}
@media (max-width: 860px) {
  .two-up { grid-template-columns: 1fr; }
  .call-button { display: inline-block; }
  .call-card { max-width: none; }
  /* Personale: hver person på sin egen grønne flade med hvide bjælker imellem */
  .section--sage:has(.staff) { background: var(--paper); padding-bottom: 0; }
  .staff-lead, .staff li { background: var(--sage); margin-inline: calc(-1 * var(--gutter)); padding: 1.75rem var(--gutter); }
  .staff-lead { grid-template-columns: 1fr; margin-bottom: var(--band-size); }
  .staff { gap: var(--band-size); }
}

/* Kontakt: to kontaktfelter */
.contact-tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--tile-gap, var(--band-size)); margin: 1.4rem 0 .5rem; max-width: var(--tiles-w, 40rem); }
.tile { container-type: inline-size; display: grid; align-content: start; gap: .25rem; padding: var(--tile-pad, 1.4rem) calc(var(--tile-pad, 1.4rem) * 1.07); border-radius: var(--radius, 14px); text-decoration: none; transition: filter .2s, background .2s; }
.tile-label { font-size: var(--tile-small, .95rem); }
.tile-main { font-family: var(--display); font-size: var(--tile-num, clamp(1.7rem, 2.3vw, 2.2rem)); line-height: 1.2; letter-spacing: .02em; }
.tile-main--mail { font-size: min(var(--tile-mail, clamp(1.05rem, 1.25vw, 1.25rem)), 8.9cqi); letter-spacing: 0; white-space: nowrap; padding-top: .45rem; }
.tile-sub { font-size: var(--tile-small, .95rem); }
.tile--dark { background: var(--green-soft); color: #fff !important; }
.tile--dark .tile-label, .tile--dark .tile-sub { color: #e3ebe0; }
.tile--dark:hover { background: var(--green-dark); }
.tile--light { background: var(--paper); color: var(--ink) !important; }
.tile--light .tile-label, .tile--light .tile-sub { color: var(--muted); }
.tile--light:hover { background: #f6f8f5; }
@media (max-width: 860px) { .contact-tiles { grid-template-columns: 1fr; max-width: none; } :root { --pair-h: auto; --radius: 20px; } }

/* ---------- Sidefod ---------- */
.site-footer { background: var(--green-soft); color: #ffffff; padding: var(--footer-pad, clamp(3rem, 6vw, 4.5rem)) 0 var(--footer-pad, clamp(3rem, 6vw, 4.5rem)); font-size: 1rem; }
.site-footer a { color: #fff; }
.site-footer :focus-visible { outline-color: #fff; }
.site-footer h2 { color: #fff; font-size: 1.1rem; margin-bottom: .8rem; }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 2rem 3rem; }
.hours { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: .15rem 1rem; }
.hours dt { color: #e3ebe0; }
.hours dd { margin: 0; }
.footer-links { list-style: none; margin: 0; padding: 0; }
.footer-links li { margin-bottom: .35rem; }
.footer-base { margin-top: 3rem; padding-top: 1.2rem; border-top: 1px solid rgba(255,255,255,.3); color: #e3ebe0; font-size: .9rem; }

/* Menuknap (kun mobil) */
.menu-toggle { display: none; align-items: center; gap: .6rem; margin-left: auto; background: none; border: 0; padding: .4rem 0; font: 400 1.05rem var(--display); color: var(--ink); cursor: pointer; }
.menu-icon, .menu-icon::before, .menu-icon::after { display: block; width: 24px; height: 2px; background: var(--ink); position: relative; transition: transform .2s, background .2s; }
.menu-icon::before, .menu-icon::after { content: ""; position: absolute; left: 0; }
.menu-icon::before { top: -7px; } .menu-icon::after { top: 7px; }
.nav-call { display: none; }

/* ---------- Mobil ---------- */
@media (max-width: 860px) {
  .menu-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .booking { grid-template-columns: 1fr; }
  .booking-photo { min-height: 0; }
  .booking-photo img { position: static; aspect-ratio: 16 / 9; height: auto; }
  .booking-text { order: -1; }
  .booking-text { padding: 2.5rem var(--gutter); }
  .menu-toggle { display: inline-flex; position: relative; z-index: 31; padding: .5rem; margin-right: -.5rem; }
  .scrolled .brand img { width: var(--logo-w, clamp(200px, 21vw, 404px)); }
  /* Mobil: sidehovedet glider væk, når man scroller ned, og kommer tilbage, så snart man scroller op (ligesom Chromes adresselinje) */
  .topbar { position: -webkit-sticky; position: sticky; top: 0; box-shadow: none !important; transition: transform .25s ease; }
  .topbar::after { content: ""; position: absolute; left: var(--gutter); right: var(--gutter); bottom: 0; border-bottom: 1px solid var(--sage-deep); }
  .topbar .wrap, .scrolled .topbar .wrap { padding-top: 1.4rem; padding-bottom: 1.4rem; transition: none; }
  .brand img { transition: none; }
  .hero-text { padding-top: 1.5rem !important; }
  .nav { display: none; }
  .menu-open .nav { display: flex; flex-direction: column; gap: .75rem; position: fixed; inset: 0; z-index: 30; background: var(--paper); padding: 5rem var(--gutter) 2rem; overflow-y: auto; }
  .menu-open .nav ul { flex-direction: column; gap: .75rem; }
  .menu-open .nav a { display: block; text-align: center; font-size: 1.15rem; padding: 1rem; background: var(--sage); border: 0; border-radius: 999px; }
  .menu-open .nav a[aria-current="page"] { background: var(--sage-deep); }
  .menu-open .nav .nav-call { display: block; background: var(--green-soft); color: #fff; margin-top: .25rem; }
  .menu-open .menu-icon { background: transparent; }
  .menu-open .menu-icon::before { transform: translateY(7px) rotate(45deg); }
  .menu-open .menu-icon::after { transform: translateY(-7px) rotate(-45deg); }
  .menu-open { overflow: hidden; }
  .hero { grid-template-columns: 1fr; min-height: 0; row-gap: var(--band-size); }
  .hero-text { background: var(--sage); display: flex; flex-direction: column; gap: clamp(2rem, 5vw, 4rem); padding: 2rem var(--gutter) 2.5rem; }
  .hero-photo img { position: static; aspect-ratio: 4 / 3; height: auto; }
  .split, .visit { grid-template-columns: 1fr; }
  .leaflets { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; }
}

/* Forside: oversigt over undersøgelser (drop-down på mobil) og knap til patientinformation */
.areas-toggle > summary { display: none; }
.areas-cta { margin: 2rem 0 0; }
@media (min-width: 861px) {
  .hero:not(.hero--sub) .hero-text { padding-top: clamp(.75rem, 1.25vw, 1.5rem); }
  .hero:not(.hero--sub) h1 { margin-top: 0; }
}
@media (max-width: 860px) {
  .section-head:has(#behandlinger) { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); margin: 0; }
  .areas-toggle > summary { display: flex; justify-content: space-between; align-items: center; gap: 1rem; list-style: none; cursor: pointer; font-family: var(--display); font-size: 1.15rem; line-height: 1.35; color: var(--ink); background: #fff; border-radius: 14px; padding: 1rem 1.2rem; }
  .areas-toggle > summary::-webkit-details-marker { display: none; }
  .areas-toggle > summary::after { content: ""; flex: none; width: .6rem; height: .6rem; border-right: 2px solid var(--green-soft); border-bottom: 2px solid var(--green-soft); transform: rotate(45deg) translateY(-25%); transition: transform .2s ease; }
  .areas-toggle[open] > summary::after { transform: rotate(-135deg) translateY(-25%); }
  .areas-toggle[open] > summary { margin-bottom: 1.25rem; }
  .areas-cta { margin-top: 1.25rem; }
  .areas-cta .button { display: block; text-align: center; }
}
.hero:not(.hero--sub) .hero-copy .lead + p { margin-top: 1em; }

/* --- Ændringer 15. okt. 2026 --- */
:root { --top-gap: clamp(1.5rem, 1.25vw, 1.5rem); }

/* Knapper: tekst og pil centreret */
.button { display: inline-flex; align-items: center; gap: .55em; }
.btn-arrow { display: inline-block; line-height: 1; font-size: 1.05em; transform: translateY(-.04em); transition: transform .2s ease; }
.button:hover .btn-arrow { transform: translate(.15em, -.04em); }
@media (max-width: 860px) { .areas-cta .button { display: flex; justify-content: center; } }

/* Forside: e-mail-besked på egen linje */
.booking-note { margin-top: .9em; }

/* Forside: Find vej-tekst centreret lodret ud for billederne (computer) */
@media (min-width: 861px) { .visit { align-items: stretch; } .visit-text { align-self: center; padding-bottom: 2.1rem; } .visit .visit-btn { margin-top: 1.5rem; } }

/* Mobil: drop-down uden knap – baggrunden folder sig blot ud */
@media (max-width: 860px) {
  .areas-toggle > summary { background: transparent; border-radius: 0; padding: .9rem 0; border-bottom: 1px solid var(--sage-deep); }
  .areas-toggle[open] > summary { margin-bottom: 0; }
}

/* Om klinikken: luft mellem afsnit i indledningen */
.page-intro p + p { margin-top: .8em; }

/* Ensartede overskrifter og afstand fra logo (forsiden er skabelon) */
.page-intro h1, .hero h1 { font-size: var(--h1-hero, clamp(1.6rem, 1.56vw, 1.875rem)); margin-top: 0; }
.page-intro { padding-top: var(--top-gap); }
.section--first { padding-top: var(--top-gap); }
@media (min-width: 861px) { .hero .hero-text { padding-top: var(--top-gap); } }

/* Kontakt: roligere og symmetrisk */
.contact-grid { align-items: stretch; }
.contact-col { display: flex; flex-direction: column; }
.contact-col h2 { margin: 0 0 .6rem; }
.contact-col address, .contact-col .hours, .contact-col p { margin-top: 0; }
.contact-col .contact-h2-next { margin-top: 1.75rem; }
.contact-col--left .contact-tiles { margin: 1.75rem 0 0; }
@media (min-width: 861px) { .contact-col--left .contact-tiles { margin-top: auto; } .contact-col--left address { margin-bottom: 1.75rem; } }
.contact-col .contact-btn { margin: 1.75rem 0 0; }
.tile { display: flex; flex-direction: column; gap: .35rem; padding: 1.35rem 1.5rem; }
.tile-main, .tile-main--mail { font-size: min(clamp(1.3rem, 1.55vw, 1.7rem), 9.4cqi); letter-spacing: .01em; line-height: 1.25; padding-top: 0; white-space: nowrap; }
.tile-sub { margin-top: auto; }
.tile-label, .tile-sub { font-size: .95rem; }

/* Til fagfolk: kontaktkort i første sektion */
.pro-contact { display: flex; gap: 1rem; align-items: flex-start; margin-top: 1.5rem; background: var(--sage); border: 1px solid var(--sage-deep); box-shadow: 0 2px 4px rgba(40,55,40,.06), 0 8px 24px rgba(40,55,40,.10); border-radius: 14px; padding: 1.15rem 1.35rem; max-width: none; width: fit-content; }
.pro-contact-icon { background: #fff; }
@media (min-width: 1440px) { .pro-contact p:first-child { white-space: nowrap; } }
.pro-contact { max-width: 100%; box-sizing: border-box; }
@media (max-width: 860px) {
  .pro-contact { gap: .7rem; padding: .85rem 1rem; margin-top: 1.1rem; width: auto; }
  .pro-contact-icon { width: 1.9rem; height: 1.9rem; }
  .pro-contact-icon svg { width: 17px; height: 17px; }
  .pro-contact p { font-size: .92rem; line-height: 1.45; }
  .pro-contact p + p { margin-top: .25rem; }
}
.pro-contact-icon { flex: none; display: grid; place-items: center; width: 2.4rem; height: 2.4rem; border-radius: 50%; background: var(--sage); color: var(--green-soft); }
.pro-contact p { margin: 0; font-size: 1rem; }
.pro-contact p + p { margin-top: .35rem; }
.pro-contact a { color: var(--green-on-sage); font-weight: 600; text-decoration-thickness: 2px; text-underline-offset: .18em; }

/* Beskedbjælke på forsiden (fx ferielukning) */
.notice { background: #6e806d; color: #fff; }
.notice p { font-weight: 500; }
.notice .wrap { display: flex; align-items: center; justify-content: center; gap: .75rem; padding-top: .7rem; padding-bottom: .7rem; }
.notice p { margin: 0; font-size: 1rem; line-height: 1.45; max-width: none; }
.notice-icon { flex: none; display: grid; place-items: center; width: 1.45rem; height: 1.45rem; border-radius: 50%; border: 1.5px solid currentColor; font-family: Georgia, serif; font-style: italic; font-weight: 700; font-size: .85rem; line-height: 1; }
@media (max-width: 860px) { .notice .wrap { justify-content: flex-start; align-items: flex-start; } .notice p { font-size: .95rem; } .notice-icon { margin-top: .05rem; } }
.contact-col h2 { font-size: var(--h1-hero, clamp(1.6rem, 1.56vw, 1.875rem)); }
@media (min-width: 861px) and (max-width: 1699px) { .contact-grid { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.tile { padding: 1.3rem 1.3rem; }
.tile-sub { font-size: .9rem; }
@media (min-width: 861px) { .pro-contact p { line-height: 1.55; } }
@media (min-width: 861px) and (max-width: 1279px) { .contact-tiles { grid-template-columns: 1fr; } }
.pro-contact .pro-contact-icon { background: #fff; }
@media (max-width: 860px) { .pro-contact .pro-contact-icon { width: 1.9rem; height: 1.9rem; } }

/* Forside: ring-knap */
.call-wrap { margin: .4rem 0 1.1rem; }
.button--call { font-size: clamp(1.15rem, 1.3vw, 1.35rem); padding: .95rem 1.6rem; gap: .65em; letter-spacing: .01em; }
.button--call .btn-icon { flex: none; }
@media (max-width: 860px) { .button--call { display: flex; justify-content: center; width: 100%; box-sizing: border-box; } }

/* Til fagfolk: mere luft over kontaktboksen */
.hero .pro-contact { margin-top: 2.5rem; }
@media (max-width: 860px) { .hero .pro-contact { margin-top: 1.5rem; } }

/* Kontakt: kortlayout */
.kontakt-title { margin: 0 0 1.5rem; }
.kgrid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--band-size, 1.1rem); }
.kcard { container-type: inline-size; display: flex; flex-direction: column; gap: .35rem; background: var(--paper); color: var(--ink); border-radius: 20px; padding: 1.5rem 1.6rem 1.4rem; text-decoration: none; box-shadow: 0 1px 2px rgba(40,55,40,.05); transition: background .2s, box-shadow .2s; }
.kcard--phone, .kcard--mail, .kcard--addr { grid-column: span 2; }
.kcard--hours { grid-column: span 2; }
.kcard--route { grid-column: span 4; }
a.kcard:hover { box-shadow: 0 6px 18px rgba(40,55,40,.12); }
.kcard--dark { background: var(--green-soft); color: #fff; }
a.kcard--dark:hover { background: var(--green-dark); }
.kcard-label { font-size: .9rem; color: var(--muted); letter-spacing: .02em; }
.kcard--dark .kcard-label, .kcard--dark .kcard-sub { color: #e3ebe0; }
.kcard-main { font-family: var(--display); font-style: normal; font-size: min(clamp(1.3rem, 1.5vw, 1.65rem), 8.6cqi); line-height: 1.3; letter-spacing: .01em; margin: .15rem 0; }
.kcard-main--mail { white-space: nowrap; }
.kcard--addr .kcard-main { font-size: min(clamp(1.1rem, 1.2vw, 1.3rem), 7.5cqi); }
.kcard-sub { margin-top: auto; padding-top: .35rem; font-size: .95rem; color: var(--muted); }
.kcard-list { list-style: none; margin: .4rem 0 0; padding: 0; display: grid; gap: .45rem; }
.kcard-list li { position: relative; padding-left: 1.15rem; line-height: 1.6; }
.kcard-list li::before { content: ""; position: absolute; left: 0; top: .65em; width: .45rem; height: .45rem; border-radius: 50%; background: var(--green-soft); }
.kcard-btn { margin: auto 0 0; padding-top: 1.2rem; }
@media (min-width: 861px) and (max-width: 1199px) {
  .kgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kcard--phone, .kcard--mail, .kcard--addr, .kcard--hours { grid-column: span 1; }
  .kcard--route { grid-column: span 2; }
}
@media (max-width: 860px) {
  .kgrid { grid-template-columns: 1fr; gap: .9rem; }
  .kcard { grid-column: auto !important; padding: 1.25rem 1.3rem; }
  .kcard--phone { order: 1; } .kcard--mail { order: 2; } .kcard--hours { order: 3; } .kcard--addr { order: 4; } .kcard--route { order: 5; }
  .kcard-main { font-size: min(1.45rem, 9cqi); }
  .kcard-btn .button { display: flex; justify-content: center; }
}
.kontakt-title { font-size: var(--h1-hero, clamp(1.6rem, 1.56vw, 1.875rem)); }
.section--sage a.kcard { color: var(--ink); }
.section--sage a.kcard--dark { color: #fff; }
.kcard--addr .kcard-main { font-size: min(clamp(1.3rem, 1.5vw, 1.65rem), 8.6cqi); }
@media (max-width: 860px) { .kcard--addr .kcard-main { font-size: min(1.45rem, 9cqi); } }
.section--sage a.kcard:not(.button) { color: var(--ink); }
.section--sage a.kcard.kcard--dark:not(.button) { color: #fff; }
.kcard--hours .kcard-sub { margin-top: 0; }

/* 15/10: større ring-knap */
.button--call { font-size: clamp(1.35rem, 1.6vw, 1.65rem); padding: 1.1rem 1.9rem; gap: .7em; border-radius: 14px; }
@media (max-width: 860px) { .button--call { font-size: 1.3rem; padding: 1.1rem 1.4rem; } }

/* 15/10: Kontakt-kort med indledende sætninger – linjerne flugter på tværs */
@supports (grid-template-rows: subgrid) {
  @media (min-width: 1200px) {
    .kgrid { grid-template-rows: auto auto auto auto; }
    .kcard--phone, .kcard--mail, .kcard--addr { display: grid; grid-row: 1 / span 3; grid-template-rows: subgrid; row-gap: .5rem; align-content: start; }
  }
}
.kcard-intro { font-size: 1rem; line-height: 1.5; color: var(--muted); }
.kcard--dark .kcard-intro { color: #e3ebe0; }
.kcard-intro--label { font-size: .9rem; letter-spacing: .02em; }
.kcard-name { display: block; font-family: var(--body, inherit); font-size: .95rem; letter-spacing: 0; color: var(--muted); margin-bottom: .1rem; }
.kcard--phone .kcard-sub, .kcard--mail .kcard-sub, .kcard--addr .kcard-sub { margin-top: 0; padding-top: 0; }
@media (min-width: 1200px) { .kcard--mail .kcard-sub { align-self: end; } }
.kcard-hours { display: grid; grid-template-columns: auto 1fr; gap: .35rem 1.5rem; margin: .5rem 0 0; font-size: 1.05rem; }
.kcard-hours dt { color: var(--muted); }
.kcard-hours dd { margin: 0; font-family: var(--display); }

/* 15/10 kl. 11: Find vej – luft før offentlig transport */
.visit-text .transit { margin-top: 1em; }
.kcard-list li.transit { margin-top: .55rem; }

/* Kontakt: ring-kort */
.kcard--call { display: flex !important; flex-direction: row; align-items: center; justify-content: center; gap: .9rem; text-align: center; min-height: 9rem; }
.kcard-call-icon { flex: none; display: grid; place-items: center; width: 3.4rem; height: 3.4rem; border-radius: 50%; background: rgba(255,255,255,.14); transition: transform .2s ease; }
.kcard-call-text { font-family: var(--display); font-size: min(clamp(1.45rem, 1.8vw, 1.95rem), 9.5cqi); letter-spacing: .01em; white-space: nowrap; }
a.kcard--call:hover .kcard-call-icon { transform: rotate(-12deg) scale(1.06); }

/* Kontakt: adresse som samlet blok */
.kcard-address { font-style: normal; font-size: clamp(1.08rem, 1.2vw, 1.25rem); line-height: 1.55; color: var(--ink); margin-top: .15rem; }
.kcard-address strong { font-weight: 600; }

/* Kontakt: åbningstider med status */
.kcard-head { display: flex; align-items: center; justify-content: space-between; gap: .75rem; flex-wrap: wrap; }
.kcard-label--icon { display: inline-flex; align-items: center; gap: .45rem; }
.kcard-label--icon svg { color: var(--green-soft); }
.status-badge { display: inline-flex; align-items: center; gap: .4rem; font-size: .85rem; padding: .3rem .7rem; border-radius: 999px; background: #eef1ec; color: var(--muted); white-space: nowrap; }
.status-badge::before { content: ""; width: .5rem; height: .5rem; border-radius: 50%; background: #a3ad9f; }
.status-badge.is-open { background: #e2ecdf; color: #2f5a2c; }
.status-badge.is-open::before { background: #3e8a3a; box-shadow: 0 0 0 3px rgba(62,138,58,.18); }
.hours-table { width: 100%; border-collapse: collapse; margin-top: .9rem; font-size: 1rem; }
.hours-table th, .hours-table td { text-align: left; padding: .5rem .6rem; font-weight: 400; }
.hours-table thead th { font-size: .8rem; color: var(--muted); letter-spacing: .03em; border-bottom: 1px solid var(--sage-deep); padding-top: 0; }
.hours-table tbody th { color: var(--muted); }
.hours-table tbody td { font-family: var(--display); }
.hours-table tbody tr + tr th, .hours-table tbody tr + tr td { border-top: 1px solid #eef1ec; }
.hours-table tr.is-today th, .hours-table tr.is-today td { background: var(--sage); color: var(--ink); }
.hours-table tr.is-today th { border-radius: 8px 0 0 8px; font-weight: 600; }
.hours-table tr.is-today td:last-child { border-radius: 0 8px 8px 0; }
.hours-table th:first-child, .hours-table td:first-child { padding-left: .6rem; }
/* Kontakt: e-mailkort centreret */
.kcard--mail { display: flex !important; flex-direction: column; align-items: stretch; justify-content: flex-start; text-align: left; gap: .35rem; }
.kcard--mail .kcard-main--mail { margin: auto 0; align-self: center; padding: .6rem 0; }
.kcard--mail .kcard-sub { align-self: flex-start !important; }
@media (max-width: 860px) { .booking-text .booking-hours { text-align: center; } }