/* v4 «rolig»: v1s uttrykk oppå v3-strukturen. Lastes etter styles.css. */
:root{--papir:#FFFFFF;--papir2:#F4F5F7;--blekk:#0F1420;--blekk2:#454B5A;--blekk3:#7A8090;--linje:#DCDFE5;
  --display:"Source Serif 4","Iowan Old Style",Georgia,serif;--sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;--ease:cubic-bezier(.2,.7,.2,1)}
h1{letter-spacing:-.02em;line-height:1.02}
/* skarpe former: 2px */
.knapp,.pille,.faner,.faner button,.piler button,.rad .pluss,.inngang .valg a{border-radius:2px}
/* hero: fullt bilde som v3, under hvit navlinje */
.hero h1{max-width:17ch}
.inngang{border-radius:0}
.inngang .valg a{border-radius:2px}
/* seksjoner og flater */
.tillit .wrap{padding-block:1.8rem}
.panel{background:var(--navy-lys)}
.bransjer{background:var(--navy)}
.rad .pluss{border-radius:2px}
.fremhevet{background:var(--navy)}
.band::after{background:linear-gradient(90deg,rgba(32,51,109,.94),rgba(32,51,109,.7))}
footer{background:var(--navy-dyp)}
.stikk::before{width:14px;height:14px}
@media (max-width:900px){.hero .wrap{grid-template-columns:1fr}.hero{padding-top:clamp(40px,8vw,80px)}}
.band .knapp.glass,.kontaktband .knapp.glass{color:#fff;border-color:rgba(255,255,255,.45)}
.band .knapp.glass:hover{border-color:#fff}

/* v5: om oss og pris fra v1 */
.omoss{background:var(--papir2)}
.om{display:grid;grid-template-columns:5fr 6fr;gap:clamp(2rem,6vw,6rem);align-items:center}
.om figure{margin:0}
.om figure img{aspect-ratio:4/5;object-fit:cover;object-position:35% center;width:100%}
.om figcaption{font-size:.8rem;color:var(--blekk3);margin-top:.8rem}
.sitat{font-family:var(--display);font-size:clamp(1.6rem,2.6vw,2.4rem);line-height:1.22;letter-spacing:-.01em;margin:0 0 1.6rem;text-wrap:balance}
.steder{font-size:.9rem;color:var(--blekk3);line-height:1.7;margin-top:1.6rem;padding-top:1.2rem;border-top:1px solid var(--linje)}
.steder b{color:var(--blekk2);font-weight:500}
@media (max-width:860px){.om{grid-template-columns:1fr}.om figure{order:-1}}
.pris{align-items:start}
.satser{border-top:1px solid var(--linje);margin-top:1.4rem}
.satser div{display:flex;justify-content:space-between;gap:1rem;padding:1rem 0;border-top:0;border-bottom:1px solid var(--linje);align-items:baseline}
.satser b{font-family:var(--display);font-weight:400;font-size:1.35rem;white-space:nowrap;text-align:right}
.satser small{display:block;font-size:.8rem;color:var(--blekk3);margin-top:.15rem;font-family:var(--sans)}
.medlem{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;align-items:center;margin-top:2rem;padding-top:2rem;border-top:1px solid var(--linje)}
.medlem img{max-height:52px;width:auto;margin:0 auto;filter:grayscale(1);opacity:.75;transition:.3s}
.medlem img:hover{filter:none;opacity:1}
@media (max-width:860px){.medlem{grid-template-columns:repeat(2,1fr)}}
.band .praktisk-band{list-style:none;margin:1.6rem 0 0;padding:0;color:rgba(255,255,255,.78);font-size:.95rem}
.band .praktisk-band li{padding:.5rem 0;border-top:1px solid rgba(255,255,255,.15)}
.band .wrap{align-items:start}

/* tillitsstripe: én linje */
.tellere{grid-template-columns:repeat(4,auto);gap:clamp(1.2rem,4vw,3.5rem)}
.tellere span{white-space:nowrap}
@media (max-width:900px){.tellere{grid-template-columns:repeat(2,1fr)}}
/* 5) panelkort */
.panel{padding:0;gap:0;grid-template-rows:auto 1fr auto auto;background:var(--navy-lys)}
.panel .foto{width:100%;margin:0;aspect-ratio:16/10}
.panel .inner{padding:1.8rem clamp(1.4rem,2.6vw,2.2rem) 0}
.panel h3{margin-bottom:.35rem}
.panel .kort{font-size:1rem;margin:0 0 1rem}
.panel ul{margin:0;border-top:1px solid rgba(32,51,109,.15);grid-template-columns:1fr 1fr;gap:0 1.5rem}
.panel ul li{padding:.55rem 0;border-bottom:1px solid rgba(32,51,109,.12);font-size:.92rem}
.panel ul li::before{display:none}
.panel .adv{padding:1.4rem clamp(1.4rem,2.6vw,2.2rem) 0;gap:.9rem}
.panel .adv img{width:44px;height:56px;border:0;margin-right:6px;background:transparent}
.panel .adv span{font-size:.85rem}
.panel > div:last-child{padding:1.2rem clamp(1.4rem,2.6vw,2.2rem) clamp(1.4rem,2.6vw,2.2rem)}
/* 6) filter på fagområdesiden */
.fagfilter{display:flex;gap:.5rem;flex-wrap:wrap;margin:0 0 2rem;position:sticky;top:96px;z-index:5;background:var(--papir);padding:.8rem 0}
.fagfilter button{font:inherit;font-size:.9rem;font-weight:500;padding:.55em 1.1em;border:1px solid var(--linje);background:#fff;color:var(--blekk2);cursor:pointer;border-radius:2px;transition:.2s}
.fagfilter button:hover{border-color:var(--blekk)}
.fagfilter button[aria-pressed=true]{background:var(--blekk);color:#fff;border-color:var(--blekk)}
.grid3 > a[hidden]{display:none}
.grid3 .gr{font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--blekk3)}
/* nav: samme hjørner som knappene, og komprimerer seg mot midten ved scroll */
.nav{transition:width .6s var(--ease)}
.nav.skrollet{width:min(1000px,calc(100% - 28px))}
.nav .pill,.meny,.meny a,.nav .knapp,.burger,.nav .tlf{border-radius:2px}
.nav .pill{padding:0 8px 0 18px}
.nav.skrollet .pill{box-shadow:inset 0 1px 0 rgba(255,255,255,.7),0 14px 40px rgba(12,21,51,.16)}
.nav.skrollet .meny{gap:0}

/* polish-runde */
@media (max-width:700px){
  .hero .strek{opacity:.5}
  .hero .wrap{padding-top:110px}
  .inngang{margin-top:.4rem}
}
.fagfilter button,.faner button{min-height:44px}
.filter .pille{min-height:44px}
.piler button{width:48px;height:48px}
.logoer{flex-wrap:wrap;row-gap:1rem}
/* bevegelse: heroen driver sakte med scroll, kun der nettleseren støtter scroll-drevne animasjoner */
@supports (animation-timeline: scroll()){
  .hero .bilde img{animation:heroZoom 9s var(--ease) forwards, heroDrift linear both;animation-timeline:auto,scroll(root);animation-range:normal,0 100vh}
  .hero > .wrap{animation:heroFade linear both;animation-timeline:scroll(root);animation-range:0 70vh}
}
@keyframes heroDrift{to{translate:0 14%}}
@keyframes heroFade{to{opacity:.15;translate:0 -6%}}
@media (prefers-reduced-motion:reduce){.hero .bilde img,.hero > .wrap{animation:none !important;translate:none;opacity:1}}
.still .hero .bilde img,.still .hero > .wrap{animation:none !important;translate:none;opacity:1}
/* fokus synlig på mørk flate */
.hero :focus-visible,.band :focus-visible,.bransjer :focus-visible{outline-color:#fff}

/* referanse */
.referanse{background:var(--navy-lys);padding-block:clamp(64px,8vw,110px)}
.referanse blockquote{margin:0;max-width:52rem}
.referanse blockquote p{font-family:var(--display);font-size:clamp(1.35rem,2.2vw,1.95rem);line-height:1.35;letter-spacing:-.01em;color:var(--blekk);margin:0 0 1.4rem;text-wrap:pretty}
.referanse .hvem{display:flex;gap:.6rem;align-items:baseline;font-size:.95rem}
.referanse cite{font-style:normal;font-weight:600;color:var(--blekk)}
.referanse .hvem span{color:var(--blekk3)}
.ref-adv{display:inline-grid;grid-template-columns:44px 1fr;gap:.8rem;align-items:center;margin-top:2rem;padding-top:1.4rem;border-top:1px solid rgba(32,51,109,.18);font-size:.85rem;color:var(--blekk3)}
.ref-adv img{width:44px;height:56px;object-fit:cover;object-position:top;filter:grayscale(1)}
.ref-adv b{display:block;font-weight:500;color:var(--blekk);font-size:.95rem}
.ref-adv:hover b{color:var(--navy)}