/* =====================================================================
   OM OSS · utkast 3
   Sidehode med Kaspers ingress, vårt standpunkt i sidens ene mørke bånd,
   seks arbeidsprinsipper, samarbeidet i fire steg og fakta i et hvitt kort.
   Ingen prosjekter (de står på Aktuelt) og ingen kontaktdel nederst:
   «Ta kontakt» i toppen går til kontaktsiden.
   ===================================================================== */

/* Ord som skal holde sammen, så «3D-» ikke blir stående alene på linja */
.hel { white-space: nowrap; }

/* Stegene i en rolig spalte på midten */
.om-spalte { max-width: 820px; margin-inline: auto; }

/* Overskrifter med id lander litt lenger ned, så etiketten over også vises */
.seksjonshode > [id] { scroll-margin-top: 3rem; }

/* ---------- Vårt standpunkt: sidens ene mørke, avrundede bånd ---------- */
.om-mork { margin-inline: clamp(8px, 1.2vw, 16px); border-radius: 24px; }

/* Problemet og løsningen side om side, med en tynn strek over hver */
.om-tese { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(2rem, 1rem + 3vw, 4rem); max-width: 1000px; margin-inline: auto; }
.om-tese > div { display: grid; gap: 1rem; align-content: start; padding-top: 1.5rem; border-top: 1px solid var(--strek-sterk); }
.om-tese p:not(.etikett) { font-size: var(--t-ingress); line-height: 1.6; color: var(--svak); }
.om-tese .om-losning p:not(.etikett) { color: var(--tekst); }
@media (max-width: 720px) { .om-tese { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Arbeidsprinsipper: seks hvite kort ----------
   Tre og tre, to og to på nettbrett, ett og ett på mobil
   (aldri en rad med ett kort alene). */
.grunner.om-prinsipper { max-width: 1040px; margin-inline: auto; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grunner.om-prinsipper a { color: var(--tekst); font-weight: 500; }
@media (max-width: 900px) { .grunner.om-prinsipper { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 820px; } }
@media (max-width: 600px) { .grunner.om-prinsipper { grid-template-columns: minmax(0, 1fr); } }

/* ---------- Fakta i et hvitt kort ---------- */
.om-faktakort { max-width: 820px; margin-inline: auto; padding: .5rem clamp(1.5rem, 1.1rem + 1.2vw, 2.25rem); background: var(--flate); border: 1px solid var(--strek); border-radius: var(--radius); }
.om-faktakort .faktaboks { border-top: 0; }
.om-faktakort .faktaboks > div:last-child { border-bottom: 0; }
/* Én liten linje under kortet: vi er ikke nordvo.com */
.om-merknad { max-width: 820px; margin: 1.25rem auto 0; font-size: .875rem; color: var(--svak); text-align: center; text-wrap: balance; }
