:root {
  --klv-asfalt: #0b1c24;
  --klv-asfaltlyft: #132c35;
  --klv-papper: #f4f0e4;
  --klv-papperlyft: #fffdf7;
  --klv-sot: #172126;
  --klv-orange: #e66a2c;
  --klv-orange-deep: #a94318;
  --klv-bla: #63aaa6;
  --klv-mossa: #91a95f;
  --klv-gul: #f0c34e;
  --klv-regel: #d6d0c1;
  --klv-brod: "Avenir Next", "Century Gothic", "Trebuchet MS", "Segoe UI", sans-serif;
  --klv-rubrik: Baskerville, "Baskerville Old Face", "Iowan Old Style", "Times New Roman", serif;
  --klv-data: "SFMono-Regular", Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  --klv-max: 1220px;
}

* { box-sizing: border-box; }
html { background: var(--klv-papper); color: var(--klv-sot); font-family: var(--klv-brod); line-height: 1.6; text-rendering: optimizeLegibility; }
body { margin: 0; min-width: 320px; }
body, button, input, textarea { font-family: var(--klv-brod); }
a { color: inherit; text-decoration-color: var(--klv-orange); text-decoration-thickness: 2px; text-underline-offset: 4px; }
a:hover { color: var(--klv-orange-deep); }
a:focus-visible { outline: 3px solid var(--klv-bla); outline-offset: 4px; }
img { display: block; height: auto; max-width: 100%; object-fit: cover; }
figure, p, h1, h2, h3, ul, dl { margin-top: 0; }
code { background: #e5dfd0; font-family: var(--klv-data); font-size: .85em; padding: .1rem .25rem; }

.klv-hoppa { background: var(--klv-papperlyft); border: 2px solid var(--klv-orange); color: var(--klv-sot); left: 1rem; padding: .55rem .8rem; position: fixed; top: -5rem; z-index: 20; }
.klv-hoppa:focus { top: 1rem; }

.klv-mast { align-items: center; background: var(--klv-asfalt); color: var(--klv-papper); display: flex; gap: 2rem; justify-content: space-between; min-height: 68px; padding: .9rem max(1.25rem, calc((100vw - var(--klv-max)) / 2)); position: relative; z-index: 2; }
.klv-ordmarke { color: var(--klv-papper); font-family: var(--klv-data); font-size: 1.18rem; font-weight: 800; letter-spacing: .08em; text-decoration: none; white-space: nowrap; }
.klv-ordmarke span { color: var(--klv-orange); }
.klv-nav { align-items: center; display: flex; gap: 1.05rem; overflow-x: auto; padding: .15rem .1rem .3rem; scrollbar-width: thin; white-space: nowrap; }
.klv-nav a { color: var(--klv-papper); font-family: var(--klv-data); font-size: .74rem; letter-spacing: .02em; text-decoration: none; }
.klv-nav a:hover, .klv-nav a[aria-current="page"] { border-bottom: 2px solid var(--klv-orange); color: var(--klv-papper); }
.klv-navbok { border-left: 1px solid #52707a; padding-left: 1rem; }

.klv-vagbok { margin: 0 auto; max-width: var(--klv-max); padding-left: 1.25rem; padding-right: 1.25rem; }
.klv-stig { align-items: center; color: #53636a; display: flex; flex-wrap: wrap; font-family: var(--klv-data); font-size: .68rem; gap: .55rem; padding: 1.15rem 0 .8rem; }
.klv-stig a { text-decoration-thickness: 1px; }
.klv-stig-home { color: var(--klv-papper); left: max(1.25rem, calc((100vw - var(--klv-max)) / 2)); padding: 0; position: absolute; top: 1rem; z-index: 1; }

.klv-hero { color: var(--klv-papper); height: 316px; isolation: isolate; overflow: hidden; position: relative; }
.klv-herobild, .klv-herobild img, .klv-voile { height: 100%; inset: 0; position: absolute; width: 100%; }
.klv-herobild { z-index: -2; }
.klv-herobild img { object-position: center 58%; }
.klv-voile { background: rgba(11, 28, 36, .84); z-index: -1; }
.klv-heroord { margin: 0 auto; max-width: var(--klv-max); padding: 4.15rem 1.25rem 2rem; }
.klv-overrad, .klv-markor { color: var(--klv-orange); font-family: var(--klv-data); font-size: .68rem; font-weight: 800; letter-spacing: .1em; line-height: 1.35; text-transform: uppercase; }
.klv-hero h1 { color: var(--klv-papper); font-family: var(--klv-rubrik); font-size: clamp(2.8rem, 6vw, 5.35rem); font-weight: 400; letter-spacing: -.03em; line-height: .9; margin: .35rem 0 .85rem; }
.klv-herointro { font-size: clamp(1rem, 1.6vw, 1.2rem); margin-bottom: 1.3rem; max-width: 39rem; }
.klv-data { display: flex; flex-wrap: wrap; gap: .6rem 1.25rem; margin: 0; }
.klv-data span { border-left: 2px solid var(--klv-orange); font-family: var(--klv-data); font-size: .68rem; line-height: 1.35; padding-left: .55rem; }
.klv-data b { color: var(--klv-papper); display: block; font-weight: 800; text-transform: uppercase; }

.klv-etapp { padding: 3.05rem 0; }
.klv-etappstart { padding-top: 2.3rem; }
.klv-rubrik { align-items: end; display: flex; gap: 1.5rem; justify-content: space-between; margin-bottom: 1.1rem; }
.klv-rubrik h2, .klv-prosa h2, .klv-lista h2, .klv-korsning h2 { color: var(--klv-sot); font-family: var(--klv-rubrik); font-size: clamp(1.8rem, 3vw, 2.65rem); font-weight: 400; letter-spacing: -.02em; line-height: 1; margin: .2rem 0 0; }
.klv-lankpil { color: var(--klv-sot); font-family: var(--klv-data); font-size: .7rem; font-weight: 800; letter-spacing: .04em; text-decoration-thickness: 1px; text-transform: uppercase; white-space: nowrap; }
.klv-lankpil span { color: var(--klv-orange); font-size: 1.1em; }
.klv-avfarter { display: grid; gap: 1rem; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.klv-avfart { background: var(--klv-papperlyft); border-top: 4px solid var(--klv-orange); display: flex; flex-direction: column; grid-column: span 2; min-width: 0; }
.klv-avfart:nth-child(4), .klv-avfart:nth-child(5) { grid-column: span 3; }
.klv-avfartbild { aspect-ratio: 16 / 9; overflow: hidden; }
.klv-avfartbild img { height: 100%; width: 100%; }
.klv-avfarttext { display: flex; flex: 1; flex-direction: column; padding: 1rem 1.05rem 1.05rem; }
.klv-avfarttext .klv-markor { margin-bottom: .15rem; }
.klv-avfart h2 { font-family: var(--klv-rubrik); font-size: clamp(1.35rem, 2.4vw, 1.85rem); font-weight: 400; line-height: 1; margin: .2rem 0 .45rem; }
.klv-avfart h2 a { text-decoration-thickness: 1px; }
.klv-avfarttext > p:not(.klv-markor):not(.klv-kortlankar) { font-size: .9rem; margin-bottom: .9rem; }
.klv-kortlankar { border-top: 1px solid var(--klv-regel); font-size: .78rem; margin: auto 0 0; padding-top: .7rem; }
.klv-kortlankar a { text-decoration-thickness: 1px; }

.klv-ruttpuff { align-items: center; background: var(--klv-asfalt); color: var(--klv-papper); display: flex; gap: 2rem; justify-content: space-between; margin: 0 calc(-1 * max(0rem, (100vw - var(--klv-max)) / 2)); padding: 1.65rem max(1.25rem, calc((100vw - var(--klv-max)) / 2)); }
.klv-ruttpuff .klv-overrad { color: var(--klv-bla); margin-bottom: .45rem; }
.klv-ruttpuff h2 { color: var(--klv-papper); font-family: var(--klv-rubrik); font-size: clamp(1.8rem, 3vw, 2.6rem); font-weight: 400; line-height: 1; margin: 0 0 .35rem; }
.klv-ruttpuff p:not(.klv-overrad) { color: #d9e1d8; margin: 0; max-width: 47rem; }
.klv-ruttpuff .klv-lankpil { color: var(--klv-papper); }

.klv-notisetapp { padding-bottom: 4.5rem; }
.klv-notisflode { display: grid; gap: 1rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.klv-notisflode .klv-dispatch { background: var(--klv-papperlyft); border-top: 2px solid var(--klv-regel); display: block; padding-bottom: .95rem; }
.klv-notisflode .klv-dispatchbild { aspect-ratio: 16 / 9; margin-bottom: .75rem; }
.klv-notisflode .klv-dispatchtext { padding: 0 .9rem; }
.klv-notisflode .klv-dispatchtext > p:not(.klv-markor), .klv-notisflode .klv-taggar { display: none; }
.klv-dispatch h3 { font-family: var(--klv-rubrik); font-size: 1.35rem; font-weight: 400; line-height: 1.05; margin: .3rem 0 .55rem; }
.klv-dispatch h3 a { text-decoration-thickness: 1px; }
.klv-dispatchbild { overflow: hidden; }
.klv-dispatchbild img { height: 100%; width: 100%; }
.klv-taggar { display: flex; flex-wrap: wrap; gap: .35rem; list-style: none; margin: .65rem 0 0; padding: 0; }
.klv-taggar li a { color: #55666b; font-family: var(--klv-data); font-size: .63rem; text-decoration: none; }
.klv-taggar li:not(:last-child)::after { color: var(--klv-orange); content: " /"; margin-left: .35rem; }

.klv-sidhuvud { background: var(--klv-asfalt); color: var(--klv-papper); display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); margin: 0 -1.25rem 2.6rem; min-height: 340px; }
.klv-sidbild { min-height: 300px; overflow: hidden; }
.klv-sidbild img { height: 100%; width: 100%; }
.klv-sidord { align-self: center; padding: 2.6rem clamp(1.5rem, 4vw, 3.75rem); }
.klv-sidord h1, .klv-artikelkopf h1 { color: var(--klv-papper); font-family: var(--klv-rubrik); font-size: clamp(2.45rem, 5vw, 4.6rem); font-weight: 400; letter-spacing: -.035em; line-height: .94; margin: .35rem 0 1rem; }
.klv-sidord > p:not(.klv-overrad):not(.klv-datumrad) { color: #e0e5dc; font-size: 1.05rem; max-width: 32rem; }
.klv-sidord .klv-overrad { color: var(--klv-bla); }
.klv-datumrad { color: #b8c7bd; font-family: var(--klv-data); font-size: .68rem; margin: 1.25rem 0 0; }
.klv-introblock { align-items: end; border-bottom: 1px solid var(--klv-regel); display: flex; gap: 2rem; justify-content: space-between; margin: 0 auto 2.4rem; max-width: 900px; padding: 0 0 1.4rem; }
.klv-introblock p { font-size: 1.1rem; margin: 0; max-width: 700px; }
.klv-lista { margin: 0 auto 2.4rem; max-width: 980px; }
.klv-dispatchflode { border-top: 2px solid var(--klv-sot); }
.klv-dispatchflode .klv-dispatch { border-bottom: 1px solid var(--klv-regel); display: grid; gap: 1.4rem; grid-template-columns: 250px minmax(0, 1fr); padding: 1.15rem 0; }
.klv-dispatchflode .klv-dispatchbild { aspect-ratio: 16 / 10; }
.klv-dispatchflode .klv-dispatchtext { align-self: center; }
.klv-dispatchtext > p:not(.klv-markor) { margin-bottom: .4rem; }

.klv-kallbox { background: #e4ecdf; border-left: 4px solid var(--klv-mossa); font-size: .88rem; margin: 2.7rem auto; max-width: 980px; padding: 1rem 1.15rem 1.05rem; }
.klv-kallrubrik { align-items: center; display: flex; gap: .75rem; margin-bottom: .45rem; }
.klv-kallrubrik b { font-family: var(--klv-data); font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; }
.klv-signal { background: var(--klv-mossa); color: var(--klv-asfalt); font-family: var(--klv-data); font-size: .62rem; font-weight: 800; letter-spacing: .05em; padding: .25rem .45rem; text-transform: uppercase; }
.klv-kallbox > p { margin: .35rem 0 .65rem; }
.klv-kallista { display: flex; flex-wrap: wrap; gap: .25rem 1.25rem; list-style: none; margin: .4rem 0 .7rem; padding: 0; }
.klv-kallista li::before { color: var(--klv-mossa); content: "↗"; margin-right: .35rem; }
.klv-kallank { text-decoration-thickness: 1px; }
.klv-kallnot { color: #485b59; font-size: .8rem; }
.klv-korsning { border-top: 3px solid var(--klv-asfalt); margin: 2.5rem auto 3.5rem; max-width: 980px; padding-top: .8rem; }
.klv-korsning .klv-overrad { margin-bottom: .35rem; }
.klv-korsning h2 { font-family: var(--klv-data); font-size: .75rem; letter-spacing: .08em; text-transform: uppercase; }
.klv-korsning p:last-child { line-height: 1.9; margin-bottom: 0; }
.klv-korsning p:last-child a { font-size: .92rem; text-decoration-thickness: 1px; }
.klv-servicelankar { background: #e9e4d7; border-left: 3px solid var(--klv-bla); margin: 2.3rem 0 0; padding: 1rem 1.15rem; }
.klv-servicelankar p:last-child { margin-bottom: 0; }
.klv-servicelankar a { text-decoration-thickness: 1px; }

.klv-ruttpuff + .klv-etapp { border-top: 1px solid var(--klv-regel); }
.klv-tabellsektion { margin: 0 auto 2.8rem; max-width: 1110px; }
.klv-tabellwrap { border: 1px solid var(--klv-regel); overflow-x: auto; }
.klv-tabellwrap:focus-visible { outline: 3px solid var(--klv-bla); outline-offset: 3px; }
table { border-collapse: collapse; min-width: 820px; width: 100%; }
caption { color: #506166; font-family: var(--klv-data); font-size: .67rem; padding: .85rem; text-align: left; }
th, td { border-top: 1px solid var(--klv-regel); padding: .9rem .8rem; text-align: left; vertical-align: top; }
thead th { background: var(--klv-asfalt); color: var(--klv-papper); font-family: var(--klv-data); font-size: .66rem; font-weight: 700; letter-spacing: .03em; text-transform: uppercase; }
tbody th { font-weight: 600; min-width: 16rem; }
tbody th a { text-decoration-thickness: 1px; }
.klv-ruttnummer { color: var(--klv-orange); display: inline-block; font-family: var(--klv-data); font-size: .72rem; margin-right: .55rem; }
.klv-status { border: 1px solid currentColor; display: inline-block; font-family: var(--klv-data); font-size: .64rem; padding: .2rem .35rem; white-space: nowrap; }
.klv-status-desk { color: #356c69; }
.klv-status-planerad { color: #8a641a; }
.klv-tabellnot { color: #536166; font-size: .82rem; margin: .75rem 0 0; }
.klv-pufflankar { display: flex; flex-wrap: wrap; gap: 1rem 1.5rem; }

.klv-artikel { padding-bottom: 1rem; }
.klv-artikelkopf { margin: 0 auto 2.5rem; max-width: 980px; }
.klv-artikelkopf h1 { color: var(--klv-sot); font-size: clamp(2.7rem, 6vw, 5.2rem); max-width: 900px; }
.klv-artikelkopf .klv-overrad { margin-bottom: .45rem; }
.klv-ingress { color: #4c5c60; font-size: clamp(1.08rem, 2vw, 1.35rem); line-height: 1.45; max-width: 760px; }
.klv-bildfigur { margin: 1.7rem 0 .75rem; }
.klv-bildfigur img { aspect-ratio: 16 / 9; width: 100%; }
.klv-bildfigur figcaption { color: #59666a; font-size: .76rem; margin-top: .45rem; }
.klv-byline { align-items: center; display: flex; flex-wrap: wrap; font-family: var(--klv-data); font-size: .68rem; gap: .55rem; margin: .8rem 0 0; }
.klv-byline a { text-decoration-thickness: 1px; }
.klv-artikelkopf .klv-taggar { margin-top: .85rem; }
.klv-lasning { align-items: start; display: grid; gap: 3.6rem; grid-template-columns: minmax(0, 1fr) 19rem; margin: 0 auto; max-width: 980px; }
.klv-prosa { font-size: 1.04rem; max-width: 720px; }
.klv-prosabred { margin: 0 auto; max-width: 850px; }
.klv-prosastycke + .klv-prosastycke { margin-top: 2.8rem; }
.klv-prosa h2 { font-size: clamp(1.65rem, 3vw, 2.25rem); margin-bottom: .8rem; }
.klv-prosa p { margin-bottom: 1.15rem; }
.klv-prosa strong { color: #263f44; }
.klv-checklista { list-style: none; margin: 1rem 0 0; padding: 0; }
.klv-checklista li { border-top: 1px solid var(--klv-regel); padding: .72rem 0 .72rem 1.6rem; position: relative; }
.klv-checklista li::before { background: var(--klv-orange); content: ""; height: .48rem; left: .2rem; position: absolute; top: 1.15rem; transform: rotate(45deg); width: .48rem; }
.klv-fakta { background: var(--klv-asfalt); color: var(--klv-papper); display: grid; gap: 1px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin: 0 0 2.4rem; }
.klv-fakta div { background: var(--klv-asfaltlyft); padding: .85rem .95rem; }
.klv-fakta dt { color: var(--klv-bla); font-family: var(--klv-data); font-size: .64rem; letter-spacing: .06em; text-transform: uppercase; }
.klv-fakta dd { font-size: .9rem; margin: .25rem 0 0; }
.klv-lasning .klv-kallbox { margin: 0; position: sticky; top: 1rem; }

.klv-fot { background: var(--klv-asfalt); color: var(--klv-papper); display: grid; gap: 2rem; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-top: 2rem; padding: 3rem max(1.25rem, calc((100vw - var(--klv-max)) / 2)); }
.klv-fot b { color: var(--klv-bla); font-family: var(--klv-data); font-size: .68rem; letter-spacing: .1em; text-transform: uppercase; }
.klv-fot p { color: #dce5dc; font-size: .84rem; margin: .5rem 0 .8rem; }
.klv-fot a { color: var(--klv-papper); display: block; font-size: .82rem; margin: .42rem 0; text-decoration-thickness: 1px; }
.klv-fot a:hover { color: var(--klv-orange); }
.klv-fel { margin: 0 auto; min-height: 60vh; padding-bottom: 6rem; padding-top: 6rem; }

@media (max-width: 66rem) {
  .klv-mast { align-items: flex-start; flex-direction: column; gap: .75rem; }
  .klv-nav { max-width: 100%; width: 100%; }
  .klv-avfarter { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .klv-avfart, .klv-avfart:nth-child(4), .klv-avfart:nth-child(5) { grid-column: auto; }
  .klv-notisflode { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .klv-lasning { gap: 2rem; grid-template-columns: minmax(0, 1fr) 16rem; }
}

@media (max-width: 46rem) {
  .klv-mast { min-height: 106px; padding: .85rem 1rem .7rem; }
  .klv-nav { gap: .5rem; }
  .klv-nav a { font-size: .65rem; }
  .klv-stig { padding-top: 1rem; }
  .klv-stig-home { left: 1rem; top: .8rem; }
  .klv-hero { height: 330px; }
  .klv-heroord { padding: 4.6rem 1rem 1.6rem; }
  .klv-hero h1 { font-size: clamp(2.7rem, 14vw, 4rem); }
  .klv-herointro { font-size: 1rem; max-width: 20rem; }
  .klv-data { display: grid; gap: .45rem; grid-template-columns: 1fr 1fr; }
  .klv-data span:last-child { grid-column: span 2; }
  .klv-vagbok { padding-left: 1rem; padding-right: 1rem; }
  .klv-etapp { padding: 2.5rem 0; }
  .klv-rubrik { align-items: start; flex-direction: column; gap: .8rem; }
  .klv-avfarter { grid-template-columns: 1fr; }
  .klv-ruttpuff { align-items: start; flex-direction: column; gap: 1.15rem; margin-left: -1rem; margin-right: -1rem; padding-left: 1rem; padding-right: 1rem; }
  .klv-notisflode { gap: .75rem; grid-template-columns: 1fr 1fr; }
  .klv-notisflode .klv-dispatch h3 { font-size: 1.1rem; }
  .klv-notisflode .klv-dispatchtext { padding-left: .65rem; padding-right: .65rem; }
  .klv-sidhuvud { display: block; margin-left: -1rem; margin-right: -1rem; min-height: 0; }
  .klv-sidbild { height: 230px; min-height: 0; }
  .klv-sidord { padding: 1.6rem 1rem 1.8rem; }
  .klv-sidord h1, .klv-artikelkopf h1 { font-size: clamp(2.65rem, 13vw, 4.1rem); }
  .klv-introblock { align-items: start; flex-direction: column; gap: 1rem; }
  .klv-introblock p { font-size: 1rem; }
  .klv-dispatchflode .klv-dispatch { gap: .8rem; grid-template-columns: 112px minmax(0, 1fr); padding: .9rem 0; }
  .klv-dispatchflode .klv-dispatch h3 { font-size: 1.3rem; }
  .klv-dispatchflode .klv-dispatchtext > p:not(.klv-markor) { font-size: .84rem; }
  .klv-dispatchflode .klv-taggar { display: none; }
  .klv-kallista { display: block; }
  .klv-kallista li { margin: .35rem 0; }
  .klv-tabellsektion { margin-left: -1rem; margin-right: -1rem; }
  .klv-tabellsektion .klv-rubrik, .klv-tabellnot { margin-left: 1rem; margin-right: 1rem; }
  .klv-tabellwrap { border-left: 0; border-right: 0; }
  .klv-lasning { display: block; }
  .klv-lasning .klv-kallbox { margin: 2rem 0; position: static; }
  .klv-fakta { grid-template-columns: 1fr; }
  .klv-prosa { font-size: 1rem; }
  .klv-fot { gap: 1.4rem; grid-template-columns: 1fr 1fr; padding: 2.3rem 1rem; }
  .klv-fot a, .klv-fot p { font-size: .77rem; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; }
}
