.about-main{padding-top:108px}
.about-intro{background:var(--pine);color:var(--paper);padding:86px max(32px,calc((100vw - 1216px)/2)) 88px;display:grid;grid-template-columns:1.2fr 1fr;gap:72px;align-items:end}
.about-intro .eyebrow{margin-bottom:30px}
.about-intro h1{font-size:clamp(3rem,5.3vw,5.5rem);line-height:1.07;letter-spacing:-.035em}
.about-intro h1 span{color:#b5233a}
.about-intro-copy>p{font-size:1.2rem;line-height:1.65}
.about-intro-copy .button,.home-about .button{background:var(--yellow);color:var(--pine);margin-top:32px}
.about-intro-copy .button:hover,.home-about .button:hover{background:var(--paper)}
.about-intro-copy .button{background:var(--paper);color:var(--pine)}
.about-intro-copy .button:hover{background:#edf2f5;color:var(--pine)}
.about-expertise,.about-approach{padding:88px max(32px,calc((100vw - 1216px)/2));display:grid;grid-template-columns:1fr 1.3fr;gap:80px}
.about-section-heading h2{font-size:clamp(2.2rem,3.5vw,3.5rem);line-height:1.12}
.about-section-heading>p:last-child:not(.eyebrow){margin-top:24px;max-width:380px;line-height:1.65}
.expertise-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 32px}
.expertise-list li{display:flex;gap:14px;padding:24px 0;border-top:1px solid #bfd2c8}
.expertise-list li>span{color:#b70810;font-size:.875rem;padding-top:5px}
.expertise-list h3{font-family:var(--sans);font-size:1.125rem;line-height:1.4;letter-spacing:-.02em}
.expertise-list p{color:#496358;font-size:.875rem;margin-top:8px}
.about-models{padding:80px max(32px,calc((100vw - 1216px)/2));background:var(--mint)}
.about-model-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px}
.about-model-grid article{padding:40px;background:var(--paper);border-radius:22px}
.about-model-grid article:nth-child(2){background:var(--pine);color:var(--paper)}
.model-label{font-size:.875rem;border-left:3px solid #f10f19;padding-left:12px;margin-bottom:40px}
.about-model-grid h3{font-size:2.5rem;line-height:1.12}
.about-model-grid article>p:last-child{margin-top:24px;max-width:440px;line-height:1.7}
.about-mission-values,.about-values-section{padding:88px 0;background:var(--paper)}
.about-mission{padding:0;color:var(--ink);display:grid;grid-template-columns:.45fr 1.55fr;gap:64px;align-items:start}
.about-mission .eyebrow{justify-self:start;margin-top:8px}
.about-mission h2{max-width:900px;font-size:clamp(2rem,3vw,3.25rem);line-height:1.2;letter-spacing:-.035em}
.about-mission-key{text-decoration:underline;text-decoration-color:var(--red);text-decoration-thickness:.09em;text-underline-offset:.16em;text-decoration-skip-ink:none}
@media(min-width:701px){.about-mission-key{white-space:nowrap}}
.about-values>h2{font-size:clamp(2.4rem,4vw,4rem);line-height:1.08;letter-spacing:-.035em}
.about-values-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 64px;margin-top:42px}
.about-value{display:grid;grid-template-columns:42px minmax(0,1fr);column-gap:18px;padding:28px 0;border-top:1px solid #bfd2c8}
.about-value-number{grid-row:1/3;color:#f10f19;font-size:.875rem;padding-top:5px}
.about-value h3{font-family:var(--sans);font-size:1.3rem;line-height:1.35;letter-spacing:-.02em}
.about-value p{margin-top:12px;color:#496358;line-height:1.7}
.about-prose{font-size:1.125rem;line-height:1.8}
.about-prose p+p{margin-top:24px}
/* Closing block: one question for both audiences, a way forward for each. */
/* the eyebrow carries the red underline the other intros have */
.about-intro .eyebrow{width:fit-content;padding-bottom:8px;border-bottom:2px solid var(--red)}
.about-purpose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:48px;align-items:center;margin:0 var(--page-gutter) 80px;padding:52px clamp(28px,5vw,64px);border:1px solid #e2e7ed;border-radius:var(--card-radius);background:var(--mint);color:var(--ink)}
.about-purpose h2{max-width:760px;margin:0;color:var(--ink);text-wrap:balance}
.about-purpose-copy>p{margin:18px 0 0;color:var(--muted);font-size:1rem;line-height:1.6}
.about-purpose-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px}
.about-purpose .button{margin:0;background:var(--pine);color:#fff;white-space:nowrap}
.about-purpose .button:hover,.about-purpose .button:focus-visible{background:#213852;color:#fff;box-shadow:none}
.about-purpose .about-purpose-secondary{background:transparent;color:var(--pine);box-shadow:inset 0 0 0 1.5px var(--pine)}
.about-purpose .about-purpose-secondary:hover,.about-purpose .about-purpose-secondary:focus-visible{background:var(--pine);color:#fff;box-shadow:inset 0 0 0 1.5px var(--pine)}
@media(max-width:700px){.about-purpose{grid-template-columns:1fr;gap:24px;margin-bottom:48px;padding:32px 24px}.about-purpose-actions{justify-content:flex-start}}
.home-about{padding:88px 32px;background:var(--pine);color:var(--paper);display:grid;grid-template-columns:1fr 1fr;gap:64px}
.home-about h2{font-size:clamp(2.5rem,4vw,4rem);line-height:1.12}
.home-about>div:last-child{max-width:620px}
.home-about>div>p:not(.eyebrow){font-size:1.2rem;line-height:1.7}
@media(min-width:1700px){.home-about{padding-left:calc((100vw - 1536px)/2);padding-right:calc((100vw - 1536px)/2)}}
@media(max-width:1000px){.about-intro{gap:40px}.about-expertise,.about-approach{gap:40px;grid-template-columns:1fr 1fr}.expertise-list{grid-template-columns:1fr}.about-model-grid article{padding:32px}.about-mission{grid-template-columns:1fr;gap:24px}.about-values-grid{gap:0 40px}}
@media(max-width:700px){.about-main{padding-top:94px}.about-intro{padding:52px 20px;grid-template-columns:1fr;gap:40px}.about-intro h1{font-size:2.9rem}.about-intro-copy>p{font-size:1.0625rem}.about-expertise,.about-approach{padding:52px 20px;grid-template-columns:1fr;gap:32px}.expertise-list{grid-template-columns:1fr}.expertise-list li{padding:20px 0}.about-models{padding:52px 20px}.about-model-grid{grid-template-columns:1fr;margin-top:32px;gap:16px}.about-model-grid article{padding:28px}.about-model-grid h3{font-size:2.1rem}.model-label{margin-bottom:28px}.about-mission-values,.about-values-section{padding-top:56px;padding-bottom:56px}.about-mission .eyebrow{margin-top:0}.about-mission h2{font-size:1.8rem}.about-values-grid{grid-template-columns:1fr;margin-top:28px}.about-value{padding:24px 0}.about-prose{font-size:1.0625rem}.home-about{padding:52px 20px;grid-template-columns:1fr;gap:28px}.home-about>div>p:not(.eyebrow){font-size:1.0625rem}}

/* "Hva vi gjør": short links instead of repeating the home page sections. */
.about-overview{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:56px;align-items:start;padding:88px 0;background:#fff;color:var(--pine)}
.about-overview-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.about-overview-card{position:relative;display:flex;flex-direction:column;gap:12px;padding:28px;border:1px solid var(--line);border-radius:var(--card-radius);background:#fff;transition:border-color .2s ease,background-color .2s ease,transform .2s ease}
.about-overview-card:hover,.about-overview-card:focus-visible{border-color:var(--pine);transform:translateY(-3px)}
.about-overview-label{color:#a21d2c;font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.about-overview-card strong{font:700 1.5rem/1.2 var(--serif);letter-spacing:-.03em}
.about-overview-card>span:not(.about-overview-label){color:var(--muted);font-size:.9375rem;line-height:1.65}
/* the IT areas card stands out in the brand navy */
.about-overview-card[href$="it-omrader.html"]{background:var(--pine);border-color:var(--pine);color:#fff}
.about-overview-card[href$="it-omrader.html"]:hover,.about-overview-card[href$="it-omrader.html"]:focus-visible{background:var(--pine-light);border-color:var(--pine-light)}
.about-overview-card[href$="it-omrader.html"] .about-overview-label{color:#ff7a80}
.about-overview-card[href$="it-omrader.html"]>span:not(.about-overview-label){color:#c5d0dc}

@media(max-width:1100px){.about-overview{gap:36px;grid-template-columns:1fr}}
@media(max-width:700px){.about-overview{padding-top:56px;padding-bottom:56px;gap:28px}.about-overview-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.about-overview-card{transition:none}.about-overview-card:hover{transform:none}}

/* On the English pages the heading already is the English name. */
html[lang="en"] .expertise-list li div>p{display:none}

/* Facts under the intro: where, who, and the team behind. */
.about-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));padding-top:28px;padding-bottom:28px;border-bottom:1px solid var(--line);background:#fff;color:var(--ink)}
.about-facts>div{display:grid;gap:6px;align-content:start;padding:0 28px;border-left:1px solid var(--line)}
.about-facts>div:first-child{padding-left:0;border-left:0}
.about-facts>div>span{color:var(--muted);font-size:.6875rem;letter-spacing:.14em;text-transform:uppercase}
.about-facts strong,.about-facts a{width:fit-content;color:var(--ink);font:500 1rem/1.4 var(--sans)}
.about-facts a{text-decoration:underline;text-decoration-color:currentColor;text-decoration-thickness:1px;text-underline-offset:5px;transition:color .2s ease}
.about-facts a:hover,.about-facts a:focus-visible{color:var(--red)}
@media(max-width:700px){.about-facts{grid-template-columns:1fr;gap:12px;padding-top:24px;padding-bottom:24px}.about-facts>div{grid-template-columns:96px minmax(0,1fr);align-items:baseline;padding:0;border-left:0}}

/* Only the mission label carries a short red line, like the footer headings. */
.about-mission .eyebrow{width:fit-content;padding-bottom:8px;border-bottom:2px solid var(--red)}

/* One left edge for every section: the site gutter, and on wide screens the
   footer's 1536px column. Overrides the older per-section paddings. */
.about-main{--about-gutter:max(var(--page-gutter),calc((100vw - 1536px)/2))}
.about-main>section:not(.about-purpose){padding-left:var(--about-gutter);padding-right:var(--about-gutter)}
.about-main>.about-purpose{margin-left:var(--about-gutter);margin-right:var(--about-gutter)}
/* the history follows the values: a hairline on the column above it */
.about-history{background:linear-gradient(var(--line),var(--line)) center top/calc(100% - 2 * var(--about-gutter)) 1px no-repeat #fff}
.about-history-link{display:inline-flex;gap:8px;color:var(--ink);font-size:1rem;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px;transition:color .2s ease}
.about-history-link:hover,.about-history-link:focus-visible{color:var(--red)}
@media(max-width:1000px){.about-facts{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:20px}.about-facts>div:nth-child(3){padding-left:0;border-left:0}}
@media(max-width:700px){.about-facts{grid-template-columns:1fr;row-gap:12px}}

/* Values: a navy panel with the heading on the left and four white cards
   on the right (18.10.2026) */
.about-main>.about-values-section{background:var(--pine);color:#fff}
.about-values{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,2fr);gap:clamp(32px,5vw,72px);align-items:start}
.about-values-kicker{margin-bottom:14px;color:#ff7a80;font-size:.7rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.about-values-head h2{color:#fff}
.about-values-lead{max-width:30ch;margin-top:16px;color:#c5d0dc;line-height:1.7}
.about-values-section .about-values-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:0}
.about-values-section .about-value{grid-template-columns:minmax(0,1fr) auto;column-gap:16px;align-items:baseline;padding:26px 26px 28px;border:0;border-radius:var(--card-radius);background:#fff;color:var(--ink);transition:transform .3s ease}
.about-values-section .about-value:hover{transform:translateY(-4px)}
.about-values-section .about-value-number{grid-row:1;grid-column:2;padding:0;color:var(--red);font-size:.8125rem;font-weight:600}
.about-values-section .about-value h3{grid-row:1;grid-column:1;color:var(--ink)}
.about-values-section .about-value p{grid-column:1/-1;color:var(--muted)}
@media(max-width:1000px){.about-values{grid-template-columns:1fr;gap:28px}.about-values-lead{max-width:none}}
@media(max-width:600px){.about-values-section .about-values-grid{grid-template-columns:1fr;gap:12px}.about-values-section .about-value{padding:22px 20px 24px}}
@media(prefers-reduced-motion:reduce){.about-values-section .about-value{transition:none}.about-values-section .about-value:hover{transform:none}}

/* "Det som skiller oss" and "Historien": a paragraph comes alive under the
   pointer – a thin grey line on its left fills red from the top and the
   text darkens (as next to the headings on Hvorfor Leie Folk) */
.about-prose p:not(:has(.about-history-link)){position:relative;padding-left:20px;transition:color .3s ease}
.about-prose p:not(:has(.about-history-link))::before,.about-prose p:not(:has(.about-history-link))::after{content:"";position:absolute;top:6px;bottom:6px;left:0;width:2px;border-radius:2px;background:var(--line)}
.about-prose p:not(:has(.about-history-link))::after{background:var(--red);transform:scaleY(0);transform-origin:50% 0;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.about-prose:has(.about-history-link) .about-history-link{margin-left:20px}
@media(hover:hover){
 .about-prose p:hover{color:var(--ink)}
 .about-prose p:hover::after{transform:scaleY(1)}
}
@media(prefers-reduced-motion:reduce){.about-prose p,.about-prose p::after{transition:none}}