/* ===========================================================================
   Ordlistene, /ordliste (havbruk), /ordliste/shipping og /ordliste/fornybar-energi (tools/ai/ordliste.py). Lastes bare der.
   29 Okt 2026: bransjene og overskriften paa flaten, saa bokstavene og begrepene i ett ark, ett per rad med en haarstrek over.
   Fra 900 px staar begrepet til venstre og teksten til hoeyre; smalere staar de under hverandre. Sensa og Kilde er
   smaa versaler paa samme linje som teksten. Tokens fra stilarkene, aldri fargeverdier i komponentene.
   =========================================================================== */
html.bred .u-topp.ol-hode{padding-bottom:clamp(24px,3vw,40px)}
/* bransjene over overskriften: én linje tekst med smaa ikoner, og noden foran listen du ser paa, som i menyen */
html.bred .ol-bransje ul{display:flex;flex-wrap:wrap;gap:0 clamp(20px,2.4vw,32px);margin:0 0 clamp(16px,2vw,28px);padding:0;list-style:none}
html.bred .ol-bransje a,html.bred .ol-bransje span{position:relative;display:inline-flex;align-items:center;gap:8px;min-height:32px;
  font-size:15px;line-height:1.2;color:var(--ink-2);text-decoration:none;white-space:nowrap;transition:color .2s}
html.bred .ol-bransje svg{width:16px;height:16px;flex-shrink:0}
html.bred .ol-bransje [aria-current]{padding-left:16px;color:var(--ink)}
html.bred .ol-bransje [aria-current]::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;
  border-radius:50%;background:var(--ink)}
/* bokstavene staar oeverst i arket, der begrepene starter, med en haarstrek under */
html.bred .ol-abc{display:flex;flex-wrap:wrap;gap:2px;padding:clamp(8px,1vw,14px) 0 clamp(12px,1.4vw,18px);border-bottom:1px solid var(--rule)}
html.bred .ol-abc a{display:inline-grid;place-items:center;min-width:34px;min-height:34px;border-radius:999px;
  font:500 14px/1 var(--mono);color:var(--ink-2);text-decoration:none;transition:background-color .2s,color .2s}

/* arket rykker opp under teksten, saa bokstavene staar i foerste skjerm */
html.bred main .b-band.ol{padding-top:clamp(8px,1.5vw,24px)}
html.bred .ol .b-in{padding-bottom:clamp(120px,14vw,240px)}
html.bred .ol-ark{background:var(--surface);border-radius:var(--r-ark);box-shadow:var(--fluid-lift);
  padding:clamp(8px,1.6vw,24px) clamp(20px,4vw,56px) clamp(24px,3vw,40px)}
/* bokstaven og hvert begrep staar under toppoeya naar et anker aapner dem */
html.bred .ol-g,html.bred .ol-t{scroll-margin-top:120px}
html.bred .ol-b{margin:clamp(32px,4vw,56px) 0 8px;font:400 clamp(32px,3.4vw,48px)/1 Archivo,var(--sans);letter-spacing:-.02em;color:var(--ink)}
html.bred .ol-abc+.ol-g .ol-b{margin-top:clamp(16px,2vw,32px)}
html.bred .ol-t{display:grid;gap:8px clamp(24px,4vw,64px);padding:clamp(18px,2vw,28px) 0;border-top:1px solid var(--rule)}
@media (min-width:900px){html.bred .ol-t{grid-template-columns:minmax(0,1fr) minmax(0,2.2fr)}}
html.bred .ol-n{margin:0;font-size:clamp(18px,1.5vw,21px);line-height:1.3;font-weight:500;color:var(--ink);hyphens:manual}
html.bred .ol-d{max-width:68ch}
html.bred .ol-d p{margin:0;font-size:17px;line-height:1.55;color:var(--ink)}
html.bred .ol-d p+p{margin-top:10px}
html.bred .ol-d .ol-s,html.bred .ol-d .ol-kilde{font-size:15px;line-height:1.5;color:var(--ink-2)}
html.bred .ol-k{margin-right:.6em;font:500 12px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--ink-3)}
html.bred .ol-d a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);
  text-decoration-thickness:1px;text-underline-offset:3px;transition:text-decoration-color .2s}

@media (hover:hover){
  html.bred .ol-bransje a:hover{color:var(--ink)}
  html.bred .ol-abc a:hover{background:var(--surface-2);color:var(--ink)}
  html.bred .ol-d a:hover{text-decoration-color:var(--ink)}
}
html.bred .ol-abc a:focus-visible{background:var(--surface-2);color:var(--ink)}
html.bred .ol-bransje a:focus-visible{color:var(--ink)}

/* TRYKK PAA TOUCH (se TRYKK PAA TOUCH i boom.css): det hover viser, straks og uten overgang */
@media (pointer: coarse){
  html.bred .ol-bransje a:active{color:var(--ink);transition:none}
  html.bred .ol-abc a:active{background:var(--surface-2);color:var(--ink);transition:none}
  html.bred .ol-d a:active{text-decoration-color:var(--ink);transition:none}
}
