/* =====================================================================
   SAKENE UNDER AKTUELT · utkast 3 (aktuelt/*.html)
   Sidehodet og skjermbildet er som på de andre undersidene. Teksten står
   i én smal lesespalte, med samme mellomtitler og avsnitt som i
   kjøpsbetingelsene. Datolinja er som «Sist oppdatert» på aktuelt.html.
   ===================================================================== */

/* Ord som skal holde sammen på én linje, som «ta kontakt for pris» */
.hel { white-space: nowrap; }

/* ---------- Sidehodet ---------- */
.oppdatert { font-size: var(--t-liten); color: var(--svakere); }

/* ---------- Lesespalten ----------
   Sidehodet har allerede luft under seg, så teksten starter tett under. */
.artikkel { padding-top: 0; }
.artikkel-tekst { max-width: 40rem; margin-inline: auto; font-size: 1.0625rem; }
.artikkel-tekst h2 {
  margin: clamp(2.5rem, 2rem + 1.5vw, 3.25rem) 0 1.1rem;
  font-size: clamp(1.5rem, 1.3rem + .75vw, 1.95rem); font-weight: 300; line-height: 1.15; letter-spacing: -.03em; color: var(--tekst);
}
.artikkel-tekst h2:first-child { margin-top: 0; }
.artikkel-tekst p { color: var(--svak); line-height: 1.75; }
.artikkel-tekst p + p { margin-top: 1em; }
.artikkel-tekst p a, .artikkel-tekst li a { color: var(--tekst); overflow-wrap: anywhere; }
.artikkel-tekst strong { font-weight: 600; color: var(--tekst); }
/* Små mellomtitler inne i en del (f.eks. «Elektriker» og «Rørlegger») */
.artikkel-tekst h3 { margin: 1.75em 0 .5em; font-size: 1.0625rem; font-weight: 600; color: var(--tekst); }
/* Lister i teksten (stil.css nullstiller alle lister) */
.artikkel-tekst ul, .artikkel-tekst ol { display: grid; gap: .55em; margin: 1em 0 0; padding-left: 1.3em; color: var(--svak); line-height: 1.7; }
.artikkel-tekst ul { list-style: disc; }
.artikkel-tekst ol { list-style: decimal; }
.artikkel-tekst li::marker { color: var(--svakere); }
.artikkel-tekst ul + p, .artikkel-tekst ol + p { margin-top: 1em; }

/* Knappen og lenkene nederst, skilt fra teksten med en strek */
.artikkel-lenker {
  display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem;
  margin-top: clamp(2.5rem, 2rem + 1.5vw, 3.25rem); padding-top: clamp(2rem, 1.6rem + 1.2vw, 2.75rem);
  border-top: 1px solid var(--strek);
}

/* Spørsmål og svar nederst i en artikkel: lista har allerede en strek under seg,
   så knappen og lenkene under trenger ikke en til */
.sporsmal + .artikkel-lenker { padding-top: 0; border-top: 0; }

/* ---------- Pristabellene i markedsoversiktene ----------
   Vanlig tabell på PC. På mobil blir hver rad et lite kort med
   etiketten foran hver verdi (data-etikett), så ingenting må rulles
   sidelengs. Tabellen har ARIA-roller, så skjermlesere fortsatt leser
   den som en tabell når radene vises som kort. Det som er med i
   prisen, står i en vanlig liste under tabellen (.pris-detaljer). */
.pristabell { margin-top: 1.5em; overflow-x: auto; }
.pristabell:focus-visible { outline: 2px solid var(--fokus); outline-offset: 4px; border-radius: 4px; }
.pristabell table { width: 100%; border-collapse: collapse; font-size: .875rem; line-height: 1.5; font-variant-numeric: tabular-nums; }
.pristabell th, .pristabell td { padding: .75rem .9rem .75rem 0; text-align: left; vertical-align: top; border-top: 1px solid var(--strek); }
.pristabell th:last-child, .pristabell td:last-child { padding-right: 0; }
.pristabell thead th { padding-top: 0; border-top: 0; border-bottom: 1px solid var(--strek-sterk); font-size: .75rem; font-weight: 600; color: var(--tekst); }
.pristabell tbody th { font-weight: 500; color: var(--tekst); }
.pristabell td { color: var(--svak); }
.pristabell a { color: var(--tekst); }
.artikkel-tekst .pristabell + h3 { margin-top: 2em; }
@media (max-width: 760px) {
  .pristabell table, .pristabell tbody, .pristabell tr, .pristabell th, .pristabell td { display: block; }
  .pristabell thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
  .pristabell tr { padding: 1rem 0; border-top: 1px solid var(--strek); }
  .pristabell tbody tr:last-child { border-bottom: 1px solid var(--strek); }
  .pristabell tbody th, .pristabell td { border: 0; padding: .2rem 0; }
  .pristabell tbody th { padding-bottom: .5rem; font-size: 1rem; }
  /* Etiketten står i en fast kolonne til venstre; verdien (også lenker inni den) flyter ved siden av */
  .pristabell td { position: relative; padding-left: 8.75rem; min-height: 1.5em; }
  .pristabell td::before { content: attr(data-etikett); position: absolute; left: 0; top: .3rem; width: 8rem; font-size: .8125rem; line-height: 1.4; color: var(--svak); }
}
/* På PC får tabellen mer plass enn lesespalten (midtstilt), så lange celler ikke blir smale tårn */
@media (min-width: 761px) {
  .artikkel-tekst .pristabell { --tabellbredde: min(64rem, calc(100vw - 4rem)); width: var(--tabellbredde); margin-left: calc((100% - var(--tabellbredde)) / 2); }
}