/* Forside 4 – rolig og redaksjonell: ekte bilder, tydelig typografi, tynne linjer, få effekter */
@font-face{font-family:"Aderian Sans Display";font-weight:400 700;font-display:swap;src:url("fonts/Aderian-Sans-Display.ttf?v=1") format("truetype")}
:root{
  --blue:#081FF0; --blue-700:#0515B0; --head:#0B1B66; --text:#22283A; --muted:#5C6172;
  --line:#E2E0DA; --paper:#F5F3EE; --white:#fff; --accent:#3385FF;
  --display:"Aderian Sans Display","Inter Tight",Inter,system-ui,sans-serif;
  --body:Inter,system-ui,sans-serif; --max:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:96px}
body{font-family:var(--body);color:var(--text);background:var(--paper);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:inherit}
img,svg{display:block;max-width:100%}
button,input,textarea{font:inherit;color:inherit}
.w{max-width:var(--max);margin:0 auto;padding:0 40px}
h1,h2,h3{font-family:var(--display);color:var(--head);font-weight:600;letter-spacing:-.025em;line-height:1.1}
h2{font-size:clamp(30px,3.4vw,44px)}
h3{font-size:22px;letter-spacing:-.015em}
.lenke{color:var(--blue);font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
.lenke:hover{text-decoration-thickness:2px}
.knapp{display:inline-block;background:var(--blue);color:#fff;font-weight:600;font-size:16px;padding:14px 22px;border-radius:6px;text-decoration:none}
.knapp:hover{background:var(--blue-700)}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px}

/* topp */
.hd{position:sticky;top:0;z-index:20;background:#fff;border-bottom:1px solid var(--line)}
.hd-in{display:flex;align-items:center;gap:40px;height:80px}
.hd .logo{color:var(--blue)}
.hd .logo svg{height:36px;width:auto}
.hd-nav{display:flex;gap:28px;margin-left:auto}
.hd-nav a{text-decoration:none;font-size:15.5px;color:var(--text);padding:6px 0;border-bottom:2px solid transparent}
.hd-nav a:hover{color:var(--head);border-bottom-color:var(--head)}
.hd-cta{font-size:15px;padding:11px 18px}
.hd-meny{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:6px;padding:8px 14px;font-size:15px;cursor:pointer}
.hd-skuff{display:none}

/* hero */
.h4{background:#fff;padding:88px 0 0}
.h4-grid{display:grid;grid-template-columns:1.15fr 1fr;gap:64px;align-items:end}
.h4 h1{font-size:clamp(44px,6vw,80px);letter-spacing:-.04em;line-height:1}
.h4-side p{font-size:19px;color:var(--text);max-width:460px}
.h4-handling{display:flex;align-items:center;gap:28px;margin-top:28px;flex-wrap:wrap}
.h4-foto{margin-top:64px}
.h4-foto img{width:100%;aspect-ratio:2/1;object-fit:cover;border-radius:4px}
.h4-foto figcaption,.foto figcaption{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-size:14px;color:var(--muted);padding:14px 0 0}

/* seksjoner */
.sek{padding:112px 0}
.hvit{background:#fff}
.h4 + .sek{padding-top:112px}
.sek-hode{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:end;margin-bottom:56px}
.sek-hode p{color:var(--muted);max-width:480px}
.sek-hode.rad{display:flex;justify-content:space-between;align-items:baseline}

/* intro */
.intro4{display:grid;grid-template-columns:1.1fr 1fr;gap:64px}
.intro4 h2{font-size:clamp(28px,3vw,40px);line-height:1.2;letter-spacing:-.02em}
.intro4 .ingress{font-size:19px;color:var(--text)}
.tall{display:grid;grid-template-columns:repeat(4,1fr);margin-top:72px;border-top:1px solid var(--head)}
.tall div{padding:22px 20px 0 0}
.tall dt{font-family:var(--display);font-size:clamp(36px,4vw,52px);font-weight:600;color:var(--head);letter-spacing:-.03em;line-height:1}
.tall dd{color:var(--muted);font-size:15px;margin-top:8px}

/* tjenester */
.tj{list-style:none;border-top:1px solid var(--line)}
.tj li{display:grid;grid-template-columns:72px 1fr 1.4fr 1fr;gap:32px;padding:32px 0;border-bottom:1px solid var(--line)}
.tj .nr{font-family:var(--display);font-weight:600;color:var(--accent);font-size:18px;padding-top:2px}
.tj p{color:var(--text)}
.tj .tek{color:var(--muted);font-size:15px}
.tj .tek b{display:block;font-weight:600;color:var(--head);font-size:13px;letter-spacing:.02em;margin-bottom:4px}

/* metode */
.steg{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
.steg li{border-top:2px solid var(--head);padding-top:20px}
.steg .nar{font-size:14px;color:var(--muted)}
.steg h3{margin:6px 0 10px}
.steg p{font-size:16px}
.former{margin-top:56px;padding-top:28px;border-top:1px solid var(--line);color:var(--text);max-width:760px}

/* folk */
.folk-topp{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;margin-bottom:72px}
.folk-topp h2{margin-bottom:22px}
.folk-topp p{margin-bottom:14px}
.folk-topp .foto img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.folk{display:grid;grid-template-columns:repeat(7,1fr);gap:20px 16px}
.person .av{position:relative;aspect-ratio:1;border-radius:4px;overflow:hidden;display:grid;place-items:center;color:#fff;font-family:var(--display);font-weight:600;font-size:24px;margin-bottom:10px}
.person .av img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.person b{display:block;font-size:14.5px;line-height:1.3;color:var(--head);font-weight:600}
.person small{display:block;font-size:13px;color:var(--muted);line-height:1.35;margin-top:2px}
.bli{margin-top:40px}

/* sitater */
.sitat-stor blockquote{font-family:var(--display);font-size:clamp(26px,2.8vw,38px);line-height:1.25;letter-spacing:-.02em;color:var(--head);font-weight:500;max-width:980px}
.hvem{margin-top:18px;color:var(--muted);font-size:15.5px}
.hvem b{color:var(--head);font-weight:600}
.sitater{display:grid;grid-template-columns:1fr 1fr;gap:48px;margin-top:64px;padding-top:40px;border-top:1px solid var(--line)}
.sitater blockquote{font-size:17px}

/* aderian */
.ad4{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center}
.ad4 .foto img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px}
.ad4 h2{margin-bottom:20px}
.ad4 p{margin-bottom:16px}
.ad4 .liten{color:var(--muted);font-size:15.5px}

/* nyheter */
.nyh{list-style:none;border-top:1px solid var(--line)}
.nyh a{display:grid;grid-template-columns:180px 160px 1fr 24px;gap:24px;align-items:baseline;padding:24px 0;border-bottom:1px solid var(--line);text-decoration:none}
.nyh time,.nyh .kat{font-size:14.5px;color:var(--muted)}
.nyh .t{font-family:var(--display);font-size:21px;font-weight:600;color:var(--head);letter-spacing:-.015em;line-height:1.25}
.nyh .pil{color:var(--blue)}
.nyh a:hover .t{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.nyh .tom{padding:24px 0;color:var(--muted)}

/* kontakt */
.kontakt4{display:grid;grid-template-columns:1fr 1fr;gap:80px}
.kontakt4 h2{font-size:clamp(34px,4vw,56px);margin-bottom:20px}
.direkte{margin-top:36px;display:grid;gap:6px}
.direkte a{font-family:var(--display);font-size:26px;font-weight:600;color:var(--head);text-decoration:none;letter-spacing:-.015em}
.direkte a:hover{color:var(--blue)}
.adr{margin-top:20px;color:var(--muted);font-size:15.5px}
form{display:grid;gap:18px}
.to-kol{display:grid;grid-template-columns:1fr 1fr;gap:18px}
label{display:grid;gap:6px;font-size:14.5px;font-weight:600;color:var(--head)}
input[type=text],input[type=email],textarea{border:1px solid #CFCBC2;border-radius:6px;padding:13px 14px;background:#fff;font-size:16px;font-weight:400;color:var(--text)}
input:focus,textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(8,31,240,.12)}
textarea{min-height:130px;resize:vertical}
fieldset{border:0}
legend{font-size:14.5px;font-weight:600;color:var(--head);margin-bottom:8px}
.valg{display:flex;flex-wrap:wrap;gap:8px 22px}
.valg label{display:flex;align-items:center;gap:8px;font-weight:400;color:var(--text);font-size:15.5px}
.valg input{width:17px;height:17px;accent-color:var(--blue)}
.skjema-fot{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.skjema-fot small{color:var(--muted);font-size:13.5px;max-width:280px}
.skjema-fot button{border:0;cursor:pointer}
.hp{position:absolute;left:-9999px}
.sent{display:none;padding:12px 14px;border-radius:6px;background:#EAF0FF;color:var(--blue-700);font-size:15px}

/* bunn */
.ft{border-top:1px solid var(--line);padding:48px 0 40px;font-size:14.5px;color:var(--muted)}
.ft-in{display:flex;justify-content:space-between;gap:32px;flex-wrap:wrap;align-items:flex-start}
.ft .logo{color:var(--head)}
.ft .logo svg{height:44px;width:auto}
.ft ul{list-style:none;display:grid;gap:6px}
.ft a{text-decoration:none}
.ft a:hover{color:var(--head);text-decoration:underline}

/* passordside */
.laast body{overflow:hidden}
.laas{visibility:visible;position:fixed;inset:0;z-index:999;display:grid;place-items:center;padding:24px;background:#fff}
.laas form{width:100%;max-width:380px;display:grid;gap:16px}
.laas-logo{height:40px;width:auto;color:var(--blue);margin-bottom:12px}
.laas h1{font-size:32px}
.laas p{color:var(--muted)}
.laas input{border:1px solid #CFCBC2;border-radius:6px;padding:13px 14px;font-size:16px}
.laas .btn{display:inline-block;background:var(--blue);color:#fff;border:0;border-radius:6px;padding:14px 22px;font-weight:600;cursor:pointer;text-align:left}
.laas .btn .i{float:right}
.laas small{color:#B3261E;min-height:1.3em;font-size:14px}

/* mindre skjermer */
@media (max-width:1000px){
  .hd-nav,.hd-cta{display:none}
  .hd-meny{display:block}
  .hd-skuff{display:none;border-top:1px solid var(--line);padding:8px 40px 20px;background:#fff}
  .hd.open .hd-skuff{display:grid}
  .hd-skuff a{padding:12px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:18px;color:var(--head)}
  .h4-grid,.sek-hode,.intro4,.folk-topp,.ad4,.kontakt4{grid-template-columns:1fr;gap:32px}
  .tj li{grid-template-columns:56px 1fr;gap:12px 20px}
  .tj li p{grid-column:2}
  .steg{grid-template-columns:1fr 1fr}
  .folk{grid-template-columns:repeat(4,1fr)}
  .sitater{grid-template-columns:1fr}
  .nyh a{grid-template-columns:1fr 24px;gap:4px 16px}
  .nyh time{grid-column:1}
  .nyh .kat{display:none}
  .nyh .t{grid-column:1}
  .nyh .pil{grid-row:1 / span 2;grid-column:2;align-self:center}
}
@media (max-width:640px){
  .w{padding:0 18px}
  .hd-skuff{padding:8px 18px 20px}
  .hd-in{height:68px}
  .hd .logo svg{height:30px}
  .h4{padding-top:48px}
  .h4-foto{margin-top:40px}
  .h4-foto img{aspect-ratio:4/3}
  .sek,.h4 + .sek{padding:72px 0}
  .tall{grid-template-columns:1fr 1fr;row-gap:24px}
  .steg{grid-template-columns:1fr}
  .folk{grid-template-columns:repeat(2,1fr)}
  .to-kol{grid-template-columns:1fr}
  .direkte a{font-size:22px}
}

/* tjenester med illustrasjonene fra v6 */
.tj{display:grid;grid-template-columns:1fr 1fr;gap:56px 48px;border-top:0}
.tj li{display:block;padding:0;border:0}
.tj .ill{background:#0A0E29;border-radius:6px;padding:28px 36px;display:flex;align-items:center;justify-content:center;aspect-ratio:16/10;margin-bottom:24px}
.tj .ill svg{width:100%;height:100%;max-height:260px}
.tj .nr{display:inline-block;margin-right:10px}
.tj h3{display:inline;font-size:24px}
.tj p{margin-top:10px}
.tj .tek{margin-top:14px}
.dash path{animation:dash 2.2s linear infinite}
.dash path:nth-child(2){animation-delay:.4s}.dash path:nth-child(3){animation-delay:.8s}.dash path:nth-child(4){animation-delay:1.2s}.dash path:nth-child(5){animation-delay:1.6s}
@keyframes dash{from{stroke-dashoffset:0}to{stroke-dashoffset:-206}}
@media (max-width:1000px){.tj{grid-template-columns:1fr;gap:48px}.tj li{display:block}.tj li p{grid-column:auto}}
@media (prefers-reduced-motion:reduce){.dash path{animation:none}}

/* bildene skal foelge aspect-ratio, ikke height-attributtet */
.h4-foto img,.foto img{height:auto}

/* ---- Versjon 4.1: hero og løsningsområder fra versjon 3, roligere; mindre bilder ---- */
.h5{background:#fff;padding:40px 0 0}
.stage{position:relative;border:1px solid #DFE3F0;border-radius:6px;background:linear-gradient(180deg,#F3F5FB,#F9FAFD);overflow:hidden}
.st-in{padding:40px 48px 0}
.st-top{display:flex;justify-content:space-between;align-items:center;gap:16px}
.kick{font-size:14px;color:var(--muted)}
.st-tr{display:flex;align-items:center;gap:14px}
.hx-news{font-size:14.5px;color:var(--text);text-decoration:none}
.hx-news:hover{color:var(--blue);text-decoration:underline;text-underline-offset:4px}
.hx-pause{width:32px;height:32px;border-radius:50%;border:1px solid #DFE3F0;background:#fff;color:var(--head);display:grid;place-items:center;cursor:pointer}
.hx-pause:hover{border-color:var(--head)}
.hx-pause .pl{display:none}
.paused .hx-pause .pa{display:none}.paused .hx-pause .pl{display:block}
.hx-h{font-size:clamp(44px,6vw,84px);letter-spacing:-.04em;line-height:.98;margin:40px 0 0}
.hx-h > span{display:block}
.hx-h .b{color:var(--blue)}
.st-row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:32px;flex-wrap:wrap}
.st-row p{font-size:18.5px;max-width:480px}
.hero-cta{display:flex;align-items:center;gap:24px;flex-wrap:wrap}
.st-chart{position:relative;height:220px;margin-top:20px}
.hx-chart{position:absolute;inset:0;width:100%;height:100%}
.hx-grid path{stroke:rgba(11,27,102,.07)}
.hx-cols path{stroke:rgba(11,27,102,.1);stroke-dasharray:2 6}
.hx-line{stroke:var(--blue);stroke-dasharray:1600;stroke-dashoffset:1600;animation:hxdraw 2.4s .4s cubic-bezier(.6,0,.2,1) forwards}
.hx-area{fill:rgba(8,31,240,.06);opacity:0;animation:hxfade 1.6s 1.2s ease forwards}
@keyframes hxdraw{to{stroke-dashoffset:0}}
@keyframes hxfade{to{opacity:1}}
.hx-dots{position:absolute;inset:0;pointer-events:none}
.hx-dots i{position:absolute;width:12px;height:12px;margin:-6px 0 0 -6px;border-radius:50%;background:#fff;border:2px solid var(--blue);opacity:0;animation:hxfade .5s forwards;transition:background .3s,box-shadow .3s}
.hx-dots i:nth-child(1){animation-delay:.9s}.hx-dots i:nth-child(2){animation-delay:1.4s}.hx-dots i:nth-child(3){animation-delay:1.9s}.hx-dots i:nth-child(4){animation-delay:2.4s}
.hx-dots i.on{background:var(--accent);border-color:#fff;box-shadow:0 0 0 6px rgba(51,133,255,.18)}
.hx-read{position:absolute;left:48px;top:0;width:320px;padding:14px 18px;background:#fff;border:1px solid #DFE3F0;border-radius:4px;z-index:2;display:flex;flex-direction:column;gap:2px}
.hx-read .mono{font-size:12.5px;color:var(--accent);font-weight:600}
.hx-read b{font-family:var(--display);font-size:21px;color:var(--head);letter-spacing:-.02em;line-height:1.2}
.hx-read span:last-child{font-size:15px;color:var(--muted)}
.hx-read.sw b,.hx-read.sw span:last-child{animation:hxsw .5s ease}
@keyframes hxsw{from{opacity:0;transform:translateY(6px)}}
.hx-steps{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #DFE3F0;background:#fff}
.hx-steps button{all:unset;cursor:pointer;position:relative;display:flex;align-items:center;justify-content:center;gap:8px;height:58px;font-size:15px;color:var(--muted)}
.hx-steps button + button{border-left:1px solid #DFE3F0}
.hx-steps button .mono{font-size:12px;color:var(--muted)}
.hx-steps button:hover,.hx-steps button.on{color:var(--head)}
.hx-steps button.on .mono{color:var(--accent)}
.hx-steps button::after{content:"";position:absolute;left:0;right:0;top:-1px;height:2px;background:var(--blue);transform:scaleX(0);transform-origin:left}
.hx-steps button.on::after{animation:hxbar 4s linear forwards}
@keyframes hxbar{to{transform:scaleX(1)}}
.paused .hx-steps button.on::after,.stage.held .hx-steps button.on::after{animation:none;transform:scaleX(1)}
.hx-steps button:focus-visible{outline:2px solid var(--blue);outline-offset:-4px}

/* løsningsområdene som faner */
.tabbar{display:grid;grid-template-columns:repeat(4,1fr);gap:24px;border-top:1px solid var(--line)}
.tab{all:unset;cursor:pointer;display:block;padding:20px 8px 22px 0;position:relative;box-sizing:border-box}
.tab .prog{position:absolute;left:0;top:-1px;height:2px;width:0;background:var(--blue)}
.tab.on .prog{animation:prog 8s linear forwards}
.manual .tab.on .prog{animation:none;width:100%}
@keyframes prog{to{width:100%}}
.tabs:hover .tab.on .prog,.paused .tab.on .prog{animation-play-state:paused}
.tab .n{font-size:13px;color:var(--muted);font-weight:600}
.tab .t{display:block;font-family:var(--display);font-size:23px;font-weight:600;letter-spacing:-.02em;margin-top:6px;color:var(--text)}
.tab .s{display:block;font-size:14px;color:var(--muted);margin-top:2px}
.tab:hover .t{color:var(--head)}
.tab.on .t{color:var(--blue)}
.tab.on .n{color:var(--accent)}
.tab:focus-visible{outline:2px solid var(--blue);outline-offset:4px}
.panel-wrap{position:relative;margin-top:20px;border-radius:6px;background:#1C2244;color:#fff;min-height:500px;overflow:hidden}
.panel{position:absolute;inset:0;padding:44px;display:grid;grid-template-columns:1fr 1.05fr;gap:44px;opacity:0;visibility:hidden;transform:translateY(8px);transition:opacity .45s,transform .45s,visibility .45s}
.panel.on{opacity:1;visibility:visible;transform:none}
.panel .mono{font-size:13px;color:#9CC7FF;font-weight:600}
.panel h3{font-size:36px;margin:10px 0 14px;color:#fff}
.panel p{color:#C5CADF;font-size:16.5px}
.panel ul{list-style:none;margin-top:22px;display:grid;gap:8px}
.panel li{display:flex;gap:10px;font-size:15.5px;color:#E2E5F2}
.panel li::before{content:"–";color:#9CC7FF}
.tech{margin-top:24px}
.tech .mono{display:block;color:#9298B6;margin-bottom:8px;font-size:13px}
.tech div{display:flex;flex-wrap:wrap;gap:6px}
.tech div span{font-size:13.5px;padding:5px 10px;border-radius:3px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12)}
.vis{border-radius:4px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;padding:20px}
.vis svg{width:100%;height:auto;max-height:100%}

/* mindre bilder */
.intro4{grid-template-columns:1.35fr .65fr;align-items:center}
.intro4 .ingress{margin-top:20px}
.intro4 .foto img,.folk-topp .foto img,.ad4 .foto img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:4px;height:auto}
.intro4 .foto figcaption{display:block;font-size:13.5px;color:var(--muted);padding-top:10px}
.folk-topp{grid-template-columns:1.35fr .65fr}
.ad4{grid-template-columns:.65fr 1.35fr}

@media (max-width:1000px){
  .tabbar{display:flex;overflow-x:auto;scrollbar-width:none;gap:24px}
  .tab{min-width:210px}
  .panel-wrap{min-height:0}
  .panel{grid-template-columns:1fr;padding:32px;position:relative;display:none;inset:auto}
  .panel.on{display:grid}
  .vis{min-height:200px}
  .intro4,.folk-topp,.ad4{grid-template-columns:1fr}
  .intro4 .foto,.folk-topp .foto,.ad4 .foto{max-width:460px}
}
@media (max-width:820px){
  .st-row{flex-direction:column;align-items:flex-start;gap:20px}
  .hx-read{position:relative;left:auto;top:auto;width:auto;margin:0 20px}
  .st-chart{height:auto;min-height:250px}
  .hx-chart,.hx-dots{top:120px}
  .hx-steps{grid-template-columns:1fr 1fr}
  .hx-steps button{height:52px;font-size:14px}
  .hx-steps button:nth-child(3){border-left:0}
  .hx-steps button:nth-child(n+3){border-top:1px solid #DFE3F0}
}
@media (max-width:640px){
  .h5{padding-top:20px}
  .st-in{padding:24px 20px 0}
  .kick{display:none}
  .st-top{justify-content:flex-end}
  .hx-h{font-size:clamp(40px,11vw,56px);margin-top:28px}
  .panel{padding:22px}
  .panel h3{font-size:28px}
}
@media (prefers-reduced-motion:reduce){.hx-line{animation:none;stroke-dashoffset:0}.hx-area,.hx-dots i{animation:none;opacity:1}.tab.on .prog,.hx-steps button.on::after{animation:none}}

/* ---- Versjon 4.2: storre logo, bilder i flukt med teksten, luft etter heroen ---- */
.hd-in{height:88px}
.hd .logo svg{height:46px}
.ft .logo svg{height:56px}
.h5{padding-bottom:88px}
.h5 + .sek{padding-top:104px}
.intro4,.folk-topp{grid-template-columns:7fr 5fr;gap:72px;align-items:stretch}
.ad4{grid-template-columns:5fr 7fr;gap:72px;align-items:stretch}
.intro4 .foto,.folk-topp .foto,.ad4 .foto{display:flex;flex-direction:column;margin:0}
.intro4 .foto img,.folk-topp .foto img,.ad4 .foto img{flex:1;height:100%;min-height:300px;aspect-ratio:auto}
.foto figcaption{display:block;font-size:13.5px;color:var(--muted);padding-top:10px}
.folk-topp{margin-bottom:80px}
.ad4 > div{align-self:center}
@media (max-width:1000px){
  .intro4,.folk-topp,.ad4{grid-template-columns:1fr;gap:28px}
  .intro4 .foto img,.folk-topp .foto img,.ad4 .foto img{flex:none;height:auto;min-height:0;aspect-ratio:3/2}
  .intro4 .foto,.folk-topp .foto,.ad4 .foto{max-width:none}
}
@media (max-width:640px){
  .hd-in{height:72px}
  .hd .logo svg{height:36px}
  .h5{padding-bottom:56px}
  .h5 + .sek{padding-top:72px}
}

/* ---- Versjon 4.3: spraakvalg, kundelogoer ved sitatene, merknad om norske nyheter ---- */
.sprak{display:flex;gap:2px;margin-left:8px}
.sprak a{font-size:13px;font-weight:600;letter-spacing:.03em;color:var(--muted);text-decoration:none;padding:5px 7px;border-radius:4px}
.sprak a:hover{color:var(--head);background:#F0F2F7}
.sprak a[aria-current]{color:var(--head);background:#E9ECF5}
.kundelogo{display:block;height:26px;width:auto;margin-bottom:20px;filter:brightness(0);opacity:.72}
.sitat-stor .kundelogo{height:34px;margin-bottom:24px}
.nyh-merk{color:var(--muted);font-size:15px;margin:-36px 0 28px}
@media (max-width:1000px){.sprak{margin-left:auto}.hd-meny{margin-left:10px}}

/* Hero: en sekundaerknapp i stedet for "Book en prat" + tekstlenke */
.knapp-ramme{display:inline-flex;align-items:center;gap:12px;padding:13px 20px;border:1.5px solid var(--head);border-radius:6px;background:#fff;color:var(--head);font-weight:600;font-size:16px;text-decoration:none}
.knapp-ramme:hover{background:var(--head);color:#fff}
.knapp-ramme .pil{font-size:15px;line-height:1}

/* ---- Versjon 4.4: trapp i heroen, infoboks til hoyre for introteksten ---- */
.trapp .st-row{align-items:flex-start;gap:48px}
.trapp .st-row > p{max-width:500px}
.trapp .hx-read{position:static;width:440px;max-width:100%;min-height:172px;padding:20px 24px;gap:6px;flex:none}
.trapp .hx-read b{font-size:24px}
.trapp .hx-read span:last-child{font-size:16px;line-height:1.55;color:var(--text)}
.trapp .st-chart{height:230px;margin-top:40px}
.trapp .hx-line{stroke-dasharray:2000;stroke-dashoffset:2000}
.trinn rect{fill:rgba(8,31,240,.045);stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke;transition:fill .45s}
.trapp:has(.hx-steps button:nth-child(1).on) .trinn rect:nth-child(1),
.trapp:has(.hx-steps button:nth-child(2).on) .trinn rect:nth-child(2),
.trapp:has(.hx-steps button:nth-child(3).on) .trinn rect:nth-child(3),
.trapp:has(.hx-steps button:nth-child(4).on) .trinn rect:nth-child(4){fill:rgba(8,31,240,.13)}
@media (max-width:820px){
  .trapp .st-row{gap:24px}
  .trapp .hx-read{width:auto;margin:0;min-height:0}
  .trapp .st-chart{height:180px;min-height:0;margin-top:28px}
  .trapp .hx-chart,.trapp .hx-dots{top:0}
}
@media (prefers-reduced-motion:reduce){.trapp .hx-line{stroke-dashoffset:0}}

/* ---- Versjon 4.5: trinnene fylles opp etter hvert, hvert med sin dempede blaatone ---- */
.trinn rect{fill:rgba(8,31,240,.035)}
.trapp:has(.hx-steps button.on) .trinn rect{fill:rgba(8,31,240,.035)}
.fyll rect{transform-box:fill-box;transform-origin:50% 100%;transform:scaleY(0);transition:transform .9s cubic-bezier(.3,.7,.2,1);stroke:#fff;stroke-width:2;vector-effect:non-scaling-stroke}
.fyll rect:nth-child(1){fill:#CFE0FF}
.fyll rect:nth-child(2){fill:#AFC3FF}
.fyll rect:nth-child(3){fill:#8EA0F6}
.fyll rect:nth-child(4){fill:#6C7CEB}
.trapp:has(.hx-steps button:nth-child(1).on) .fyll rect:nth-child(-n+1),
.trapp:has(.hx-steps button:nth-child(2).on) .fyll rect:nth-child(-n+2),
.trapp:has(.hx-steps button:nth-child(3).on) .fyll rect:nth-child(-n+3),
.trapp:has(.hx-steps button:nth-child(4).on) .fyll rect:nth-child(-n+4){transform:scaleY(1)}
@media (prefers-reduced-motion:reduce){.fyll rect{transition:none}}

/* ---- Versjon 4.6: figur som gaar trappen og blir gladere for hvert trinn ---- */
.figur{position:absolute;z-index:3;width:52px;height:74px;margin-left:-26px;left:12.5%;bottom:19.4%;pointer-events:none;transform-origin:50% 100%;
  transition:left 1.1s cubic-bezier(.45,.05,.3,1),bottom 1.1s cubic-bezier(.45,.05,.3,1);animation:figur-inn 2.4s .6s cubic-bezier(.3,.6,.3,1) both}
.figur svg{display:block;overflow:visible}
.figur.hopp{transition:none}
@keyframes figur-inn{from{transform:translateX(-40vw)}to{transform:none}}
.trapp:has(.hx-steps button:nth-child(2).on) .figur{left:37.5%;bottom:38.9%}
.trapp:has(.hx-steps button:nth-child(3).on) .figur{left:62.5%;bottom:58.3%}
.trapp:has(.hx-steps button:nth-child(4).on) .figur{left:87.5%;bottom:77.8%}
.figur .ben{transform-box:view-box;transform-origin:22px 44px}
.figur.gaar .ben-v{animation:fig-ben .3s ease-in-out infinite alternate}
.figur.gaar .ben-h{animation:fig-ben .3s ease-in-out infinite alternate-reverse}
.figur.gaar svg{animation:fig-bob .3s ease-in-out infinite alternate}
@keyframes fig-ben{from{transform:rotate(-20deg)}to{transform:rotate(20deg)}}
@keyframes fig-bob{to{transform:translateY(-2px)}}
.figur .munn,.figur .kinn,.figur .glede,.figur .armer-opp{opacity:0;transition:opacity .45s}
.figur .armer-ned{transition:opacity .45s}
.trapp:has(.hx-steps button:nth-child(1).on) .figur .m1,
.trapp:has(.hx-steps button:nth-child(2).on) .figur .m2,
.trapp:has(.hx-steps button:nth-child(3).on) .figur .m3,
.trapp:has(.hx-steps button:nth-child(3).on) .figur .kinn,
.trapp:has(.hx-steps button:nth-child(4).on) .figur .m4,
.trapp:has(.hx-steps button:nth-child(4).on) .figur .kinn,
.trapp:has(.hx-steps button:nth-child(4).on) .figur .glede,
.trapp:has(.hx-steps button:nth-child(4).on) .figur .armer-opp{opacity:1}
.trapp:has(.hx-steps button:nth-child(4).on) .figur .armer-ned{opacity:0}
.trapp:has(.hx-steps button:nth-child(4).on) .figur:not(.gaar) svg{animation:fig-jubel .55s ease-in-out 3}
@keyframes fig-jubel{50%{transform:translateY(-9px)}}
.paused .figur,.paused .figur *{animation-play-state:paused}
@media (max-width:820px){.figur{scale:.8}}
@media (prefers-reduced-motion:reduce){.figur,.figur *{animation:none!important;transition:none!important}}

/* figuren viser posisjonen, punktene trengs ikke */
.trapp .hx-dots{display:none}

/* ---- Versjon 4.7: trinnet blinker inn naar figuren lander paa det (ingen fylling nedenfra, ingen prikker) ---- */
.trapp .hx-dots{display:none}
.trapp .trinn rect{fill:rgba(8,31,240,.035)!important}
.fyll rect{transform:none!important;transition:none;opacity:0}
.trapp:has(.hx-steps button:nth-child(1).on) .fyll rect:nth-child(-n+1),
.trapp:has(.hx-steps button:nth-child(2).on) .fyll rect:nth-child(-n+2),
.trapp:has(.hx-steps button:nth-child(3).on) .fyll rect:nth-child(-n+3),
.trapp:has(.hx-steps button:nth-child(4).on) .fyll rect:nth-child(-n+4){opacity:1}
.trapp:has(.hx-steps button:nth-child(1).on) .fyll rect:nth-child(1){animation:trinn-blink .7s 2.8s both}
.trapp:has(.hx-steps button:nth-child(2).on) .fyll rect:nth-child(2),
.trapp:has(.hx-steps button:nth-child(3).on) .fyll rect:nth-child(3),
.trapp:has(.hx-steps button:nth-child(4).on) .fyll rect:nth-child(4){animation:trinn-blink .7s .95s both}
@keyframes trinn-blink{0%{opacity:0}30%{opacity:1}55%{opacity:.45}100%{opacity:1}}
.paused .fyll rect{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.fyll rect{animation:none!important}}

/* ---- Versjon 4.8: tegneseriefigur uten kroppsanimasjon; venter synlig ved siden av heroen ---- */
.trapp{overflow:visible}
.figur{width:56px;height:84px;margin-left:-28px}
.figur,.figur *{animation:none!important}
.figur.ute{left:-62px!important;bottom:0!important}
@media (max-width:1360px){.figur.ute{left:-6px!important}}
@media (max-width:640px){.figur.ute{left:14px!important}}
.figur .arm,.figur .munn,.figur .kinn,.figur .glede{transition:opacity .35s}
.figur .arm-v-opp,.figur .arm-h-opp{opacity:0}
.trapp:has(.hx-steps button:nth-child(3).on) .figur:not(.ute) .arm-h-ned,
.trapp:has(.hx-steps button:nth-child(4).on) .figur:not(.ute) .arm-v-ned,
.trapp:has(.hx-steps button:nth-child(4).on) .figur:not(.ute) .arm-h-ned{opacity:0}
.trapp:has(.hx-steps button:nth-child(3).on) .figur:not(.ute) .arm-h-opp,
.trapp:has(.hx-steps button:nth-child(4).on) .figur:not(.ute) .arm-v-opp,
.trapp:has(.hx-steps button:nth-child(4).on) .figur:not(.ute) .arm-h-opp{opacity:1}
.figur .kinn{opacity:0}
.trapp:has(.hx-steps button:nth-child(2).on) .figur .kinn,
.trapp:has(.hx-steps button:nth-child(3).on) .figur .kinn,
.trapp:has(.hx-steps button:nth-child(4).on) .figur .kinn{opacity:.75}
/* trinn 1 blinker naar figuren gaar inn fra siden */
.trapp:has(.figur.ute) .fyll rect:nth-child(1){opacity:0!important;animation:none!important}
.trapp .hx-chart{border-radius:0 0 5px 5px}
/* illustrasjonene i fanene: hold dem innenfor panelet og sentrert vertikalt */
.panel{grid-template-rows:minmax(0,1fr)}
.panel .vis{min-height:0}
.panel .vis svg{max-height:100%}
.trapp:has(.hx-steps button:nth-child(1).on):has(.figur:not(.ute)) .fyll rect:nth-child(1){animation:trinn-blink .7s 1s both}

/* ---- Versjon 4.9: trappen bygget som lag - trinn 1 i full bredde, hvert neste trinn oppaa med 25 % innrykk, teksten inne i trinnet ---- */
.trapp{--trh:50px}
.trapp .st-chart{height:calc(4 * var(--trh) + 92px);margin-top:24px}
.trapp .hx-chart{display:none}
.trapp .hx-steps{position:absolute;left:0;right:0;bottom:0;height:calc(4 * var(--trh));display:block;border:0;background:none;z-index:1}
.trapp .hx-steps button{position:absolute;right:0;height:var(--trh);box-sizing:border-box;padding:0 18px;justify-content:flex-start;gap:10px;border:0;border-top:2px solid #fff;
  background:rgba(8,31,240,.045);color:var(--muted);font-size:15px;font-weight:500;isolation:isolate;transition:color .3s}
.trapp .hx-steps button + button{border-left:2px solid #fff}
.trapp .hx-steps button:nth-child(1){left:0;bottom:0;border-radius:0 0 5px 5px}
.trapp .hx-steps button:nth-child(2){left:25%;bottom:var(--trh)}
.trapp .hx-steps button:nth-child(3){left:50%;bottom:calc(2 * var(--trh))}
.trapp .hx-steps button:nth-child(4){left:75%;bottom:calc(3 * var(--trh))}
.trapp .hx-steps button::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--c);opacity:0;border-radius:inherit}
.trapp .hx-steps button:nth-child(1){--c:#CFE0FF}
.trapp .hx-steps button:nth-child(2){--c:#AFC3FF}
.trapp .hx-steps button:nth-child(3){--c:#8EA0F6}
.trapp .hx-steps button:nth-child(4){--c:#5B6BE6}
.trapp .hx-steps button.on::before,.trapp .hx-steps button:has(~ .on)::before{opacity:1}
.trapp .hx-steps button.on::before{animation:trinn-blink .7s .95s both}
.trapp .hx-steps button.on,.trapp .hx-steps button:has(~ .on){color:var(--head)}
.trapp .hx-steps button.on{font-weight:600}
.trapp .hx-steps button .mono{color:inherit;opacity:.7}
.trapp .hx-steps button:nth-child(4).on{color:#fff}
.trapp .hx-steps button::after{top:-2px;background:var(--head)}
.trapp .hx-steps button:nth-child(4)::after{background:#fff}
.trapp:has(.figur.ute) .hx-steps button:first-child::before{opacity:0;animation:none}
.paused .hx-steps button::before{animation-play-state:paused}
/* figuren staar paa toppen av trinnet sitt */
.trapp:has(.hx-steps button:nth-child(1).on) .figur{left:12.5%;bottom:var(--trh)}
.trapp:has(.hx-steps button:nth-child(2).on) .figur{left:37.5%;bottom:calc(2 * var(--trh))}
.trapp:has(.hx-steps button:nth-child(3).on) .figur{left:62.5%;bottom:calc(3 * var(--trh))}
.trapp:has(.hx-steps button:nth-child(4).on) .figur{left:87.5%;bottom:calc(4 * var(--trh))}
/* naar figuren venter ved kanten av trinn 1, skal den ikke dekke teksten */
@media (max-width:1360px){.trapp .hx-steps button:nth-child(1){padding-left:36px}}
@media (max-width:820px){
  .trapp{--trh:44px}
  .trapp .hx-steps button:nth-child(1){padding-left:44px}
  .trapp .st-chart{height:calc(4 * var(--trh) + 76px);margin-top:20px}
  .trapp .hx-steps button{padding:0 8px;font-size:12.5px;line-height:1.2;gap:6px}
  .trapp .hx-steps button .mono{display:none}
}
@media (prefers-reduced-motion:reduce){.trapp .hx-steps button::before{animation:none!important}}

/* ---- Versjon 4.10: uten figur, hoyere trinn, trinnet blinker inn med en gang ---- */
.trapp{--trh:66px}
.trapp .st-chart{height:calc(4 * var(--trh));margin-top:40px}
.trapp .hx-steps button{font-size:16px;padding:0 22px}
.trapp .hx-steps button:nth-child(1){padding-left:22px}
.trapp .hx-steps button.on::before{animation:trinn-blink .7s both}
@media (max-width:820px){
  .trapp{--trh:54px}
  .trapp .st-chart{height:calc(4 * var(--trh));margin-top:28px}
  .trapp .hx-steps button,.trapp .hx-steps button:nth-child(1){padding:0 8px;font-size:13px}
}

/* ---- Versjon 4.11: kundelogoene i samme moerkeblaa som teksten i seksjonen ---- */
.kundelogo{filter:url(#tm-moerkeblaa);opacity:1}

/* ---- Versjon 4.12: beskrivelsen ligger inne i trinnet (ingen egen boks paa desktop), dobbelt saa hoye trinn ---- */
@media (min-width:821px){
  .trapp{--trh:132px}
  .trapp .hx-read{display:none}
  .trapp .st-chart{height:calc(4 * var(--trh) + 28px);margin-top:28px}
  /* trinnet vokser oppover hvis teksten trenger mer plass (trinn 4 er smalest) */
  .trapp .hx-steps button{height:auto;min-height:var(--trh);display:grid;grid-template-columns:auto 1fr;align-content:start;align-items:baseline;column-gap:10px;row-gap:6px;padding:16px 18px;text-align:left;white-space:normal}
  .trapp .hx-steps button:nth-child(1){padding-left:18px}
  .trapp .hx-steps button b{font-size:19px;font-weight:700;letter-spacing:-.01em;line-height:1.2}
  .trapp .hx-steps button .tt{grid-column:1 / -1;font-size:14px;line-height:1.42;font-weight:400;max-width:520px;opacity:0;visibility:hidden;transition:opacity .4s}
  .trapp .hx-steps button.on .tt{opacity:1;visibility:visible;transition-delay:.15s}
}
@media (max-width:820px){.trapp .hx-steps button .tt{display:none}}

/* ---- Versjon 4.13: 10 % innrykk per trinn, lavere trinn, trinnene bygges opp ett for ett ---- */
.trapp .hx-steps button:nth-child(2){left:10%}
.trapp .hx-steps button:nth-child(3){left:20%}
.trapp .hx-steps button:nth-child(4){left:30%}
/* kommende trinn er skjult; det aktive glir inn fra hoyre og legger seg paa toppen */
.trapp .hx-steps button{transition:opacity .35s,visibility .35s,transform .35s,color .3s}
.trapp .hx-steps button.on ~ button{opacity:0;visibility:hidden;transform:translateY(-14px)}
.trapp .hx-steps button.on{animation:trinn-inn .7s cubic-bezier(.2,.75,.25,1) both;box-shadow:0 -10px 28px -14px rgba(11,27,102,.35);z-index:1}
.trapp .hx-steps button.on::before{animation:none}
@keyframes trinn-inn{from{opacity:0;transform:translateX(64px)}to{opacity:1;transform:none}}
.trapp .st-chart{overflow:hidden}
.paused .trapp .hx-steps button.on{animation-play-state:paused}
@media (min-width:821px){
  .trapp{--trh:100px}
  .trapp .st-chart{height:calc(4 * var(--trh) + 28px);margin-top:28px;overflow:hidden;border-radius:0 0 5px 5px}
  .trapp .hx-steps button{grid-template-columns:auto 210px minmax(0,1fr);align-items:baseline;column-gap:12px;padding:18px 22px}
  .trapp .hx-steps button:nth-child(1){padding-left:22px}
  .trapp .hx-steps button .tt{grid-column:auto;max-width:600px;transform:translateX(10px);transition:opacity .45s,transform .45s}
  .trapp .hx-steps button.on .tt{transform:none;transition-delay:.35s}
}
@media (prefers-reduced-motion:reduce){.trapp .hx-steps button,.trapp .hx-steps button .tt{animation:none!important;transition:none!important;transform:none!important}}

/* ---- Versjon 4.14: ingen strek under headeren; trinnet flasher inn i stedet for fremdriftslinje og innglidning ---- */
.hd{border-bottom:0}
.trapp .hx-steps button::after{display:none}
.trapp .hx-steps button.on{animation:trinn-flash .8s ease-out both}
@keyframes trinn-flash{0%{opacity:0;filter:brightness(1.35)}22%{opacity:1;filter:brightness(1.35)}45%{opacity:.5;filter:brightness(1.15)}70%{opacity:1;filter:brightness(1.08)}100%{opacity:1;filter:none}}
.trapp .hx-steps button.on ~ button{transform:none}

/* ---- Versjon 4.15: svak skygge under headeren ved scrolling; trappen til hoyre for teksten (lavere hero) ---- */
.hd{transition:box-shadow .2s}
.hd.skygge{box-shadow:0 1px 0 rgba(11,27,102,.04),0 8px 20px -12px rgba(11,27,102,.28)}
@media (min-width:1000px){
  .trapp{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:stretch}
  .trapp .st-in{padding:40px 48px 48px}
  .trapp .hx-h{font-size:clamp(48px,4.6vw,68px)}
  .trapp .st-row > p{max-width:460px}
  .trapp .st-tr{position:absolute;top:40px;right:48px}
  /* trinnene stables nedenfra; kun det aktive viser beskrivelsen */
  .trapp .st-chart{height:auto;margin:0;display:flex;align-items:flex-end;padding-top:84px}
  .trapp .hx-steps{position:static;height:auto;width:100%;display:flex;flex-direction:column-reverse}
  .trapp .hx-steps button{position:relative;left:auto!important;bottom:auto!important;right:auto;height:auto;min-height:56px;grid-template-columns:auto 1fr;align-content:center;padding:14px 20px}
  .trapp .hx-steps button:nth-child(1){padding-left:20px;border-radius:0 0 5px 0}
  .trapp .hx-steps button:nth-child(2){margin-left:10%}
  .trapp .hx-steps button:nth-child(3){margin-left:20%}
  .trapp .hx-steps button:nth-child(4){margin-left:30%}
  .trapp .hx-steps button .tt{grid-column:1 / -1;display:none;max-width:none;transform:none}
  .trapp .hx-steps button.on .tt{display:block}
}

/* ---- Versjon 4.16: mer visuell hero - hoyere, storre trinn med ikon, prikkmoenster bak trappen ---- */
.trapp .hx-steps .ik{display:none}
@media (min-width:1000px){
  .trapp{min-height:600px}
  .trapp .st-in{padding:56px 56px 64px;display:flex;flex-direction:column;justify-content:center}
  .trapp .hx-h{font-size:clamp(56px,5.6vw,84px)}
  .trapp .st-row > p{font-size:18px;max-width:480px}
  .trapp .st-chart{padding-top:96px}
  .trapp .st-chart::before{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(rgba(11,27,102,.2) 1.4px,transparent 1.8px);background-size:22px 22px;
    -webkit-mask-image:linear-gradient(to top,#000 40%,transparent);mask-image:linear-gradient(to top,#000 40%,transparent)}
  .trapp .hx-steps button{min-height:100px;padding:20px 84px 20px 24px;row-gap:10px}
  .trapp .hx-steps button:nth-child(1){padding-left:24px}
  .trapp .hx-steps button b{font-size:21px}
  .trapp .hx-steps button .tt{font-size:15px;line-height:1.5}
  .trapp .hx-steps .ik{display:block;position:absolute;right:24px;top:22px;width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;opacity:.5;transition:opacity .3s,transform .3s}
  .trapp .hx-steps button.on .ik{opacity:1;transform:scale(1.25);transform-origin:100% 0}
}

/* ---- Versjon 4.17: trinnet fader inn fra uskarpt til skarpt og loefter seg litt; ikon og tekst foelger etter ---- */
.trapp .hx-steps button.on{animation:trinn-fade .9s cubic-bezier(.2,.7,.2,1) both}
@keyframes trinn-fade{0%{opacity:0;filter:blur(10px);transform:translateY(18px) scale(.97)}60%{opacity:1;filter:blur(0)}100%{opacity:1;filter:none;transform:none}}
.trapp .hx-steps button.on .ik{animation:ik-inn .6s .45s cubic-bezier(.3,1.6,.5,1) both}
@keyframes ik-inn{from{opacity:0;transform:scale(.6) rotate(-12deg)}to{opacity:1;transform:scale(1.25)}}
.trapp .hx-steps button.on .tt{animation:tt-inn .6s .4s ease-out both}
@keyframes tt-inn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.paused .trapp .hx-steps button.on .ik,.paused .trapp .hx-steps button.on .tt{animation-play-state:paused}
@media (prefers-reduced-motion:reduce){.trapp .hx-steps button.on,.trapp .hx-steps button.on .ik,.trapp .hx-steps button.on .tt{animation:none!important}}

/* ---- Versjon 4.18: rutenett i heroen som paa den gamle siden (erstatter prikkmoensteret), svakere bak teksten ---- */
.trapp .st-chart::before{display:none}
.trapp{background:linear-gradient(to right,rgba(246,248,252,.85),rgba(246,248,252,.2) 50%,rgba(246,248,252,0)),
  linear-gradient(rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 36px 36px,
  linear-gradient(90deg,rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 36px 36px,#FAFBFE}

/* ---- Versjon 4.19: rutenettet fader ut raskere; trinnene uten tall med ikonet foerst; samme ikoner i fanene for de fire omraadene ---- */
.trapp{background:linear-gradient(to right,#FAFBFE,#FAFBFE 28%,rgba(250,251,254,0) 62%),
  linear-gradient(rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 36px 36px,
  linear-gradient(90deg,rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 36px 36px,#FAFBFE}
.trapp .hx-steps .ik{display:block;position:static;flex:none;width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:.75;transform:none}
.trapp .hx-steps button.on .ik{opacity:1;transform:none;animation:ik-inn2 .6s .4s cubic-bezier(.3,1.6,.5,1) both}
@keyframes ik-inn2{from{opacity:0;transform:scale(.6) rotate(-12deg)}to{opacity:1;transform:none}}
@media (min-width:821px){
  .trapp .hx-steps button{grid-template-columns:auto 1fr;align-items:center;column-gap:12px}
  .trapp .hx-steps button .tt{grid-column:2}
  .trapp .hx-steps .ik{width:24px;height:24px}
}
@media (min-width:1000px){
  .trapp .hx-steps button,.trapp .hx-steps button:nth-child(1){column-gap:14px;padding:20px 24px}
  .trapp .hx-steps .ik{width:30px;height:30px}
}
.tab .tab-ik{display:block;width:30px;height:30px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;color:var(--muted);transition:color .2s}
.tab:hover .tab-ik{color:var(--head)}
.tab.on .tab-ik{color:var(--blue)}
.tab .tab-ik + .t{margin-top:10px}
@media (prefers-reduced-motion:reduce){.trapp .hx-steps button.on .ik{animation:none!important}}

/* ---- Versjon 4.20: stikkordene i heroen som tagbokser under teksten ---- */
.hx-tags{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 0;padding:0}
.hx-tags li{display:inline-flex;align-items:center;gap:8px;padding:7px 13px;border:1px solid #D5DCF3;border-radius:4px;background:#fff;font-size:13.5px;font-weight:500;color:var(--head);line-height:1.2}
.hx-tags li::before{content:"";width:6px;height:6px;border-radius:1px;background:var(--blue)}
@media (max-width:820px){.hx-tags{margin-top:20px}}

/* ---- Versjon 4.21: storre ruter i rutenettet (54 px) ---- */
.trapp{background-size:auto,54px 54px,54px 54px,auto}

/* ---- Versjon 4.22: avrundet oevre venstre hjoerne paa trinnene ---- */
.trapp .hx-steps button{border-radius:10px 0 0 0}
.trapp .hx-steps button:nth-child(1){border-radius:10px 0 5px 0}

/* ---- Versjon 4.23: panelene i loesningsomraadene viser bare navnet ---- */
.panel h3:first-child{margin-top:0}

/* ---- Versjon 4.24: rutenettet vises fra hoyre og bunn og fader ut mot topp venstre ---- */
.trapp{background:linear-gradient(to bottom right,#FAFBFE,#FAFBFE 22%,rgba(250,251,254,.6) 45%,rgba(250,251,254,0) 72%),
  linear-gradient(rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 54px 54px,
  linear-gradient(90deg,rgba(8,31,240,.16) 1.5px,transparent 1.5px) -1px -1px / 54px 54px,#FAFBFE}

/* ---- Versjon 4.25: mer luft over innholdet i headeren ---- */
.hd{padding-top:16px}
@media (max-width:820px){.hd{padding-top:8px}}

/* ---- Versjon 4.26: forrige trinn krymper rolig (teksten fader ut), det nye trinnet vokser opp fra null hoyde ---- */
@media (min-width:1000px){
  .trapp .hx-steps button{row-gap:0;overflow:hidden}
  .trapp .hx-steps button .tt{display:block;max-height:0;margin-top:0;opacity:0;animation:none!important;transform:none;
    transition:max-height .7s cubic-bezier(.4,0,.2,1),margin-top .7s cubic-bezier(.4,0,.2,1),opacity .3s}
  .trapp .hx-steps button.on .tt{max-height:140px;margin-top:8px;opacity:1;transition:max-height .7s cubic-bezier(.4,0,.2,1) .15s,margin-top .7s cubic-bezier(.4,0,.2,1) .15s,opacity .45s .45s}
  .trapp .hx-steps button.on{animation:trinn-opp .8s cubic-bezier(.3,.7,.2,1) both}
  @keyframes trinn-opp{from{opacity:0;min-height:0;max-height:0;padding-top:0;padding-bottom:0}55%{opacity:1}to{opacity:1;max-height:260px}}
}

/* ---- Versjon 4.27: ingen pauseknapp i heroen (et klikk paa et trinn stopper fortsatt rotasjonen) ---- */
.trapp .hx-pause{display:none}

/* ---- Versjon 4.28: forrige trinn krymper foerst, saa vokser det nye opp - mot maalte hoyder (--tt, --h fra forside4.js) ---- */
@media (min-width:1000px){
  .trapp .hx-steps button .tt{max-height:0;transition:max-height .42s cubic-bezier(.4,0,.2,1),margin-top .42s cubic-bezier(.4,0,.2,1),opacity .22s}
  .trapp .hx-steps button.on .tt{max-height:var(--tt,140px);margin-top:8px;opacity:1}
  /* fremover: teksten er paa plass naar trinnet vokser, og fader inn til slutt */
  .trapp .hx-steps:not(.tilbake) button.on .tt{transition:opacity .35s .7s}
  .trapp .hx-steps:not(.tilbake) button.on{animation:trinn-opp2 .55s cubic-bezier(.25,.8,.25,1) .28s both}
  .trapp .hx-steps:not(.tilbake) button.on .ik{animation-delay:.65s}
  @keyframes trinn-opp2{from{opacity:0;min-height:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;min-height:var(--h,148px);max-height:var(--h,148px)}}
  /* tilbake til start: trinn 1 er allerede synlig og aapner bare teksten igjen */
  .trapp .hx-steps.tilbake button.on{animation:none}
  .trapp .hx-steps.tilbake button.on .tt{transition:max-height .45s cubic-bezier(.4,0,.2,1) .3s,margin-top .45s cubic-bezier(.4,0,.2,1) .3s,opacity .35s .6s}
}

/* ---- Versjon 4.29: tynn skillelinje i innholdsbredden mellom heroen og seksjonen under ---- */
.h5 + .sek{padding-top:0}
.h5 + .sek > .w:first-child::before{content:"";display:block;height:1px;background:var(--line);margin-bottom:96px}
@media (max-width:820px){.h5 + .sek > .w:first-child::before{margin-bottom:64px}}

/* ---- Versjon 4.30: storre bilder av de ansatte (faerre per rad); hero-taggene med samme form som teknologi-taggene ---- */
.folk{grid-template-columns:repeat(5,1fr);gap:32px 24px}
.person b{font-size:16px}
.person small{font-size:14px}
@media (max-width:1100px){.folk{grid-template-columns:repeat(4,1fr)}}
@media (max-width:820px){.folk{grid-template-columns:repeat(3,1fr);gap:24px 16px}}
@media (max-width:560px){.folk{grid-template-columns:repeat(2,1fr)}}
.hx-tags{gap:6px}
.hx-tags li{gap:0;padding:5px 10px;border-radius:3px;background:rgba(11,27,102,.04);border:1px solid rgba(11,27,102,.14);font-size:13.5px;font-weight:400;color:var(--head)}
.hx-tags li::before{content:none}

/* ---- Versjon 4.31: hero-taggene med lys blaa bakgrunn saa de skiller seg fra rutenettet ---- */
.hx-tags li{background:#E8EDFF;border-color:#C7D2FB;color:var(--head)}

/* ---- Versjon 4.32: svensk overskrift litt mindre, saa "Reell foerandring." faar plass paa en linje ---- */
@media (min-width:1000px){html[lang="sv"] .trapp .hx-h{font-size:clamp(50px,5vw,74px)}}

/* ---- Versjon 4.33: svensk overskrift alltid paa to linjer - storrelsen foelger spaltebredden, linjene brytes ikke ---- */
.trapp .st-in{container-type:inline-size}
html[lang="sv"] .trapp .hx-h{font-size:min(78px,14.2cqi)}
html[lang="sv"] .trapp .hx-h span{white-space:nowrap}

/* ---- Versjon 4.34: nyhetssidene (Aktuelt og enkeltsak) i samme stil som forsiden ---- */
.side-tittel{font-size:clamp(40px,5vw,64px);letter-spacing:-.03em;line-height:1.05;margin-bottom:48px}
.mer-wrap{margin-top:40px}
.mer-wrap button{font:inherit;cursor:pointer;background:none}
.sak4 .w{max-width:860px}
.sak4 .meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:baseline;font-size:14.5px;color:var(--muted);margin-bottom:18px}
.sak4 .meta .c{color:var(--blue);font-weight:600}
.sak4 h1.d{font-size:clamp(34px,4.4vw,56px);line-height:1.08;letter-spacing:-.025em;margin-bottom:32px}
.sak4 .hero-img img{display:block;width:100%;height:auto;border-radius:4px;margin-bottom:40px}
.sak4 .prose{font-size:18px;line-height:1.7;color:var(--text)}
.sak4 .prose > * + *{margin-top:1.1em}
.sak4 .prose h2{font-size:28px;line-height:1.2;margin-top:1.8em}
.sak4 .prose h3{font-size:21px;line-height:1.3;margin-top:1.5em}
.sak4 .prose a{color:var(--blue)}
.sak4 .prose img{max-width:100%;height:auto;border-radius:4px}
.sak4 .prose ul,.sak4 .prose ol{padding-left:1.3em}
.sak4 .prose li + li{margin-top:.4em}
.sak4 .prose blockquote{border-left:3px solid var(--blue);padding-left:20px;color:var(--head)}
.sak4 .lede{color:var(--muted);font-size:18px}
.sak4 .tilbake{margin-top:56px}
@media (max-width:820px){.side-tittel{margin-bottom:32px}.sak4 .prose{font-size:17px}}

/* ---- Versjon 4.35: mer diskret spraakvalg - mindre og lysere, aktivt spraak uten boks ---- */
.sprak{gap:0;margin-left:4px}
.sprak a{font-size:12px;font-weight:500;letter-spacing:.04em;color:#9A9FB3;padding:3px 5px;background:none}
.sprak a:hover{color:var(--head);background:none}
.sprak a[aria-current]{color:var(--head);background:none;font-weight:600}

/* ---- Versjon 4.36: nyhetslistene viser tittel og en tag med kategorien, uten dato og pil ---- */
.nyh a{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;grid-template-columns:none}
.nyh .tag{font-size:13px;line-height:1.2;padding:4px 10px;border-radius:3px;background:#E8EDFF;border:1px solid #C7D2FB;color:var(--head);white-space:nowrap}
.mer-wrap [hidden]{display:none}

/* ---- Versjon 4.37: kort seksjon om Qlik-utvidelsene (Tm Visualization Suite) ---- */
.ext4{display:grid;grid-template-columns:5fr 6fr;gap:72px;align-items:center}
.ext4 h2{margin-bottom:22px}
.ext4 p{margin-bottom:14px}
.ext4 .liten{color:var(--muted);font-size:15.5px;margin-bottom:22px}
.ext4 .foto{margin:0}
.ext4 .foto img{display:block;width:100%;height:auto;border-radius:4px;border:1px solid var(--line)}
@media (max-width:900px){.ext4{grid-template-columns:1fr;gap:32px}}

/* ---- Versjon 4.38: like mye luft under logoen i headeren som over ---- */
.hd{padding-bottom:16px}
@media (max-width:820px){.hd{padding-bottom:8px}}

/* ---- Versjon 4.39: Aktuelt paa forsiden som kort med artikkelbilde, maks fire, to per rad ---- */
.nyh-kort{list-style:none;display:grid;grid-template-columns:repeat(2,1fr);gap:48px 32px}
.nyh-kort a{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;text-decoration:none}
.nyh-kort .bilde{display:block;flex:0 0 100%;aspect-ratio:16/9;border-radius:4px;overflow:hidden;background:linear-gradient(135deg,#E8EDFF,#C7D2FB);margin-bottom:8px}
.nyh-kort .bilde img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s}
.nyh-kort a:hover .bilde img{transform:scale(1.03)}
.nyh-kort .t{font-family:var(--display);font-size:22px;font-weight:600;color:var(--head);letter-spacing:-.015em;line-height:1.25}
.nyh-kort a:hover .t{text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
.nyh-kort .tag{font-size:13px;line-height:1.2;padding:4px 10px;border-radius:3px;background:#E8EDFF;border:1px solid #C7D2FB;color:var(--head);white-space:nowrap}
.nyh-kort .tom{color:var(--muted)}
@media (max-width:820px){.nyh-kort{grid-template-columns:1fr;gap:36px}.nyh-kort .t{font-size:20px}}

/* ---- Versjon 4.41: trappen i Aderians blaafarger, ikke ton-i-ton - lys blaa, himmelblaa, Aderian-blaa, marineblaa (forrige: #CFE0FF #AFC3FF #8EA0F6 #5B6BE6) ---- */
.trapp .hx-steps button:nth-child(1){--c:#DCE3FF}
.trapp .hx-steps button:nth-child(2){--c:#3385FF}
.trapp .hx-steps button:nth-child(3){--c:#081FF0}
.trapp .hx-steps button:nth-child(4){--c:#041078}
.trapp .hx-steps button:nth-child(n+2).on,.trapp .hx-steps button:nth-child(n+2):has(~ .on){color:#fff}

/* ---- Versjon 4.42: diskret lenke til personvernerklaeringen i footeren ---- */
.ft .ft-liten{font-size:13px;margin-top:4px}
.ft .ft-liten a{color:#9A9FB3}
.ft .ft-liten a:hover{color:var(--head)}

/* ---- Versjon 4.43: merke i headeren paa testnettstedet (settes av js/testmerke.js, bare paa testadressen) ---- */
.testmerke{align-self:center;margin-left:-24px;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:#CC3366;padding:4px 8px;border-radius:3px;white-space:nowrap}
@media (max-width:820px){.testmerke{margin-left:-28px;font-size:10px;padding:3px 6px}}
.hd .logo{flex:none}
.testmerke .tm-kort{display:none}
@media (max-width:820px){.testmerke{margin-left:-30px}.testmerke .tm-lang{display:none}.testmerke .tm-kort{display:inline}}
@media (max-width:820px){.hd-in:has(.testmerke){gap:12px}.testmerke{margin-left:0}}

/* ---- Versjon 4.44: logoen i footeren i Aderian-blaa, som i headeren (marineblaa finnes ikke som logofarge) ---- */
.ft .logo{color:var(--blue)}

/* ---- Versjon 4.45: test - laptop fra den gamle siden i stedet for trappen (klassen "laptop" paa heroen; fjern den for aa faa trappen tilbake) ---- */
.trapp.laptop .st-chart,.trapp.laptop .hx-read{display:none}
.hx-laptop{display:none}
.trapp.laptop .hx-laptop{display:flex;align-items:center;justify-content:center;margin:0;padding:24px 24px 40px}
.trapp.laptop .hx-laptop img{display:block;width:100%;max-width:640px;height:auto}
@media (min-width:1000px){.trapp.laptop .hx-laptop{padding:48px 48px 48px 0}.trapp.laptop .hx-laptop img{max-width:none}}

/* ---- Versjon 4.47: hvit bakgrunn paa footeren ---- */
.ft{background:#fff}

/* ---- Versjon 4.48: footer uten logo, med papirfarge ---- */
.ft{background:var(--paper)}

/* ---- Versjon 4.49: footer i to rader - meny og kontakt oeverst, firmainfo og personvern i en linje under ---- */
.ft{padding:40px 0 32px}
.ft-in{display:grid;grid-template-columns:1fr;gap:20px}
.ft-in>ul:nth-of-type(3){grid-row:1;display:flex;flex-wrap:wrap;gap:8px 28px}
.ft-in>ul:nth-of-type(3) a{color:var(--head);font-weight:500}
.ft-in>ul:nth-of-type(2){grid-row:2;display:flex;flex-wrap:wrap;gap:8px 28px}
.ft-in>ul:nth-of-type(1){grid-row:3;display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 0;margin-top:8px;padding-top:20px;border-top:1px solid var(--line);font-size:13.5px}
.ft-in>ul:nth-of-type(1) li+li::before{content:"\00B7";margin:0 10px;color:#9A9FB3}
.ft .ft-in .ft-liten{margin:0 0 0 auto;font-size:13px}
.ft .ft-in .ft-liten::before{content:none}
@media (min-width:821px){
  .ft-in{grid-template-columns:1fr auto;gap:24px 40px;align-items:center}
  .ft-in>ul:nth-of-type(3){grid-column:1}
  .ft-in>ul:nth-of-type(2){grid-row:1;grid-column:2}
  .ft-in>ul:nth-of-type(1){grid-row:2;grid-column:1/-1}
}
@media (max-width:560px){.ft-in>ul:nth-of-type(1){display:grid;gap:4px}.ft-in>ul:nth-of-type(1) li+li::before{content:none}.ft .ft-in .ft-liten{margin:6px 0 0}}

/* ---- Versjon 4.50: rutenettet i heroen starter nede til hoeyre, saa rutene der blir hele (kanten lukker dem) ---- */
.trapp{background-position:0 0,right bottom,right bottom,0 0}

/* ---- Versjon 4.51: feilmelding i kontaktskjemaet ---- */
.sent.feil{background:#FDECEF;color:#A1203F}

/* ---- Versjon 4.52: test - noeytral lysegraa papirfarge i stedet for den varme (#F5F3EE) ---- */
:root{--paper:#F5F5F5}

/* ---- Versjon 4.53: rutene i heroen litt stoerre, og hoeyden deles i hele ruter (--rute settes i forside4.js) ---- */
.trapp{background-size:auto,var(--rute,64px) var(--rute,64px),var(--rute,64px) var(--rute,64px),auto}

/* ---- Versjon 4.54: leverandoerene nederst i seksjonen om loesningsomraadene ---- */
.lev4{margin-top:72px;padding-top:48px;border-top:1px solid var(--line)}
.lev4 h3{font-size:clamp(22px,2.2vw,28px)}
.lev4 p{color:var(--muted);margin-top:8px}
.lev4 ul{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:28px 0 0;padding:0}
.lev4 li{display:flex;flex-direction:column;gap:2px;padding:18px 20px;background:#fff;border:1px solid var(--line);border-radius:6px}
.lev4 b{font-family:var(--display);font-size:20px;font-weight:600;color:var(--head);letter-spacing:-.015em;line-height:1.2}
.lev4 span{font-size:14px;color:var(--muted)}
@media (max-width:820px){.lev4{margin-top:56px;padding-top:40px}.lev4 ul{grid-template-columns:repeat(2,1fr)}}
@media (max-width:420px){.lev4 ul{grid-template-columns:1fr}}

/* ---- Versjon 4.55: leverandoerene som lenkede logoer i moerkeblaatt, uten tekst ---- */
.lev4 ul{grid-template-columns:repeat(4,1fr)}
.lev4 li{display:block;padding:0;background:none;border:0}
.lev4 a{display:flex;align-items:center;justify-content:center;height:112px;padding:24px 28px;background:#fff;border:1px solid var(--line);border-radius:6px;transition:border-color .2s,box-shadow .2s}
.lev4 a:hover{border-color:#C9D0FF;box-shadow:0 4px 16px rgba(11,27,102,.08)}
.lev4 img{display:block;width:auto;height:auto;max-width:100%;max-height:38px;filter:url(#tm-moerkeblaa)}
.lev4 img.hoy{max-height:60px}
@media (max-width:820px){.lev4 ul{grid-template-columns:repeat(2,1fr)}.lev4 a{height:96px;padding:20px 24px}}
@media (max-width:420px){.lev4 ul{grid-template-columns:repeat(2,1fr)}}

/* ---- Versjon 4.56: leverandoerlogoene uten hvite bokser ---- */
.lev4 ul{gap:8px 40px}
.lev4 a{height:88px;padding:16px 8px;background:none;border:0;border-radius:0;box-shadow:none;transition:opacity .2s}
.lev4 a:hover{background:none;border:0;box-shadow:none;opacity:.7}
@media (max-width:820px){.lev4 ul{gap:4px 24px}.lev4 a{height:76px;padding:12px 4px}}

/* ---- Versjon 4.57: seks leverandoerlogoer i tre kolonner ---- */
.lev4 ul{grid-template-columns:repeat(3,1fr)}
.lev4 h3{max-width:none}
@media (max-width:820px){.lev4 ul{grid-template-columns:repeat(2,1fr)}}

/* ---- Versjon 4.58: leverandoerlogoene i originalfarger ved hover og tastaturfokus ---- */
.lev4 a:hover,.lev4 a:focus-visible{opacity:1}
.lev4 a:hover img,.lev4 a:focus-visible img{filter:none}

/* ---- Versjon 4.59: ingen strek over leverandoerlogoene, mindre luft over ---- */
.lev4{margin-top:48px;padding-top:0;border-top:0}
.lev4 ul{margin-top:0}
@media (max-width:820px){.lev4{margin-top:36px;padding-top:0}}

/* ---- Versjon 4.60: litt mindre luft under leverandoerlogoene ---- */
.lev4{margin-bottom:-32px}
@media (max-width:820px){.lev4{margin-bottom:-20px}}

/* ---- Versjon 4.61: fanene i loesningsomraadene toppjustert, saa overskriftene staar paa linje ---- */
.tabbar{align-items:start}
.tab{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start}