/* Fælles læseoplevelse for nye og eksisterende permanente artikelsider. */
:root {
  --bg:#fff;
  --bg-kort:#fff;
  --blaek:#182131;
  --blaek-svag:#596578;
  --linje:#dce1e9;
  --accent:#254bdc;
  --accent-svag:#eef2ff;
  color-scheme:light
}

html {
  scroll-behavior:smooth;
  scroll-padding-top:100px
}

body {
  font-size:1.0625rem;
  line-height:1.85;
  background:var(--bg)
}

a {
  text-underline-offset:4px
}

a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:4px
}

.topbar {
  z-index:10;
  background:#fff;
  border-top:4px solid var(--accent);
  padding:18px max(24px,calc((100vw - 1120px)/2));
  backdrop-filter:none
}

.brand {
  font-size:1.65rem;
  letter-spacing:-.055em
}

.brand em {
  color:var(--blaek)
}

.brand-logo {
  width:30px;
  height:30px
}

main {
  max-width:760px;
  padding:48px 40px 80px
}

.kicker {
  font-size:.8125rem;
  letter-spacing:.035em;
  line-height:1.8;
  margin-bottom:18px;
  overflow-wrap:anywhere
}

h1 {
  font-size:clamp(2.15rem,4.5vw,3.2rem);
  line-height:1.15;
  letter-spacing:-.035em;
  font-weight:800;
  margin-bottom:22px;
  text-wrap:pretty
}

.manchet {
  font-size:1.1875rem;
  line-height:1.8;
  margin-bottom:28px;
  color:var(--blaek-svag)
}

p {
  font-size:1.0625rem;
  line-height:1.85;
  margin-bottom:20px;
  overflow-wrap:break-word
}

h2 {
  font-size:1.7rem;
  line-height:1.35;
  letter-spacing:-.025em;
  margin:36px 0 14px
}

li {
  font-size:1rem;
  line-height:1.85;
  margin:10px 0 10px 22px
}

.boks {
  padding:22px 26px;
  border-radius:0;
  font-size:1rem;
  line-height:1.85;
  margin:30px 0;
  background:var(--accent-svag)
}

.boks>strong {
  display:block;
  font-size:.9375rem;
  margin-bottom:8px
}

.kilde {
  border-radius:4px;
  font-size:.875rem;
  padding:10px 16px;
  min-height:46px;
  margin:8px 8px 0 0
}

.cta {
  border-radius:4px;
  font-size:.9375rem;
  padding:14px 22px;
  line-height:1.6
}

.note {
  font-size:.8125rem;
  line-height:1.8;
  margin-top:26px
}

img.top {
  border-radius:4px;
  max-height:450px;
  object-fit:cover;
  margin:12px 0 28px
}

footer {
  font-size:.8125rem;
  line-height:2;
  padding:28px 22px
}

.article-back {
  display:block;
  color:var(--accent);
  font-size:.875rem;
  text-decoration:none;
  margin-bottom:28px
}

.article-skip {
  position:absolute;
  top:-100px;
  left:20px;
  background:var(--blaek);
  color:#fff;
  padding:12px;
  z-index:20
}

.article-skip:focus {
  top:12px
}

@media(max-width:600px) {
  main {
    padding:28px 22px 56px
  }

  .topbar {
    padding:14px 20px
  }

  .brand {
    font-size:1.5rem
  }

  .kicker {
    font-size:.75rem
  }

  h1 {
    font-size:2.1rem;
    line-height:1.18
  }

  .manchet {
    font-size:1.125rem
  }

  p {
    font-size:1.0625rem;
    line-height:1.85
  }

  h2 {
    font-size:1.5rem
  }

  .boks {
    padding:18px 20px
  }

  .kilde {
    max-width:100%;
    overflow-wrap:anywhere
  }

  .cta {
    display:block;
    text-align:center
  }

}

@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto
  }

}

@media print {
  .topbar,.cta,footer,.article-back {
    display:none
  }

  main {
    padding:0;
    max-width:100%
  }

  body {
    background:#fff;
    color:#000
  }

}
