/* =====================================================================
   FJELLUFT — LYS PALETT «NORDISK IS» + ARTIKKEL- OG KALKULATORKOMPONENTER
   Lastes etter fjelluft-site.css. Se claude/fjelluft-arbeidsinstruks.md.

   Om spesifisitet: hver side har foreløpig en duplisert <style>-blokk i
   post_content som lastes etter denne fila. Variablene er derfor satt på
   html:root (0,1,1) og komponentreglene prefikset med `body ` (0,1,1),
   slik at de vinner over blokkens :root og klassevelgere. Når inline-
   blokkene er fjernet fra sidene kan begge deler forenkles.
   ===================================================================== */

html:root{
  --base:        #FFFFFF;   /* hovedbakgrunn                          */
  --surface:     #F3F9FA;   /* isflate, seksjoner                     */
  --surface-2:   #E4F1F4;   /* dypere isflate, kort og CTA-felt       */
  --surface-3:   #D3E8ED;   /* rammer og diagramflater                */

  --contrast:    #0C1E27;   /* tekst og overskrifter (17,1:1 på hvit) */
  --accent-1:    #0E5A6B;   /* petrol: lenker, tabellhode  (7,8:1)    */
  --accent-2:    #17A2BC;   /* isblå: KUN grafikk og store flater     */
  --accent-3:    #0A6E80;   /* signal og CTA               (5,9:1)    */
  --accent-4:    #55707A;   /* sekundærtekst               (5,3:1)    */
  --accent-5:    #F3F9FA;   /* bakgrunnsflate                         */
  --accent-soft: #A9DEE9;   /* dekor, diagramfyll                     */
  --cta-dark:    #08525F;   /* hover på CTA                (8,8:1)    */
  --ink-2:       #3C565F;   /* sekundærtekst på tonede flater (7,8:1) */

  --line:        rgba(12,30,39,0.12);
  --line-strong: rgba(12,30,39,0.22);
}

/* ---------- FLATER SOM TIDLIGERE VAR MØRKE ---------- */
body .bg-contrast{
  background:var(--surface-2);
  color:var(--contrast);
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
}
body .bg-contrast h2,
body .bg-contrast h3,
body .bg-contrast h4{color:var(--accent-1);}
body .bg-contrast p,
body .bg-contrast .section-head p,
body .cta-band p.lead2,
body .home-tool p{color:var(--ink-2);}
body .bg-accent5{background:var(--surface);}
body .marquee-strip{background:var(--surface);border-color:var(--line);}
body .marquee-track span{color:var(--accent-1);}

body .cta-direct{color:var(--accent-4);}
body .cta-direct a{color:var(--accent-1);border-bottom-color:var(--line-strong);}
body .cta-direct a:hover{color:var(--accent-3);border-bottom-color:var(--accent-3);}

body .btn-outline.on-dark{border-color:var(--line-strong);color:var(--contrast);}
body .btn-outline.on-dark:hover{background:var(--accent-1);border-color:var(--accent-1);color:#fff;}
body .btn-primary{background:var(--accent-3);color:#fff;}
body .btn-primary:hover{background:var(--cta-dark);box-shadow:0 10px 24px rgba(10,110,128,.28);}
body .btn-outline:hover{background:var(--accent-1);border-color:var(--accent-1);color:#fff;}

/* ---------- HERO ---------- */
body .hero{background:linear-gradient(178deg,#FFFFFF 0%,var(--surface) 52%,#EAF5F8 100%);}
body .hero-glow{background:radial-gradient(circle,rgba(23,162,188,0.16) 0%,rgba(243,249,250,0) 66%);}
body .airflow{opacity:.65;}
body .airflow path{stroke:var(--accent-2);}
body .airflow path:nth-child(2){stroke:var(--accent-soft);}
body .airflow path:nth-child(3){stroke:var(--accent-1);opacity:.5;}
body .hero-eyebrow{color:var(--accent-3);}
body .hud{color:var(--accent-1);opacity:.75;}
body .hero p.lead{color:var(--accent-4);}
body .scroll-cue{color:var(--accent-4);}
body .scroll-cue .dash{background:var(--accent-3);}

/* ---------- PINNET DIAGRAM ---------- */
body .diagram-stage{background:var(--surface-2);}
body .diagram-stage::before{
  background-image:repeating-linear-gradient(0deg,rgba(12,30,39,0.05) 0 1px,transparent 1px 60px),
    repeating-linear-gradient(90deg,rgba(12,30,39,0.05) 0 1px,transparent 1px 60px);
}
body .diagram-copy{color:var(--contrast);}
body .diagram-copy h2{color:var(--accent-1);}
body .diagram-copy p{color:var(--accent-4);}
body .diagram-frame{border-color:var(--line-strong);}
body .diagram-frame::before,
body .diagram-frame::after{color:var(--accent-4);}
body .duct{stroke:var(--accent-1);}
body .duct-fill{fill:var(--accent-soft);stroke:var(--accent-1);}
body .duct-accent{stroke:var(--accent-3);}
body .dim-line{stroke:rgba(12,30,39,0.3);}
body .callout text{fill:var(--contrast);}
body .callout .lbl-sub{fill:var(--accent-4);}
body .callout .lbl-line{stroke:var(--accent-3);}
body .callout .lbl-dot{fill:var(--accent-3);}

/* ---------- KORT, TABELLER, LISTER ---------- */
body .case:hover,body .card:hover,body .post-card:hover{background:var(--surface);}
body .case .case-num{-webkit-text-stroke:1.4px var(--accent-2);}
body .case h3,body .card h3,body .post-card h3{color:var(--accent-1);}
body .card .num,body .eyebrow{color:var(--accent-3);}
body .why-list li::before{background:var(--accent-3);}
body .stat{background:var(--surface);}
body .stat .stat-num{color:var(--accent-1);}
body .stat .stat-num .suffix{color:var(--accent-3);}
body .t-num{background:var(--base);border-color:var(--accent-3);color:var(--accent-1);}
body .timeline-track-fill{background:var(--accent-3);}
body footer.site{background:var(--surface);}

/* ---------- HEADER ---------- */
body header.site{background:rgba(255,255,255,0.88);border-bottom-color:var(--line);}
body nav.main a::after{background:var(--accent-3);}
body nav.main a.active{color:var(--accent-3);}
body a:focus-visible,body button:focus-visible{outline-color:var(--accent-3);}
body ::selection{background:var(--accent-soft);color:var(--contrast);}


/* =====================================================================
   ARTIKKEL, KALKULATOR OG INTERAKSJON
   ===================================================================== */

/* ---------- LESEPROGRESJON ---------- */
.fj-progress{position:fixed;top:0;left:0;height:3px;width:100%;z-index:80;background:transparent;pointer-events:none;}
.fj-progress i{display:block;height:100%;width:0;background:var(--accent-3);transition:width .08s linear;}

/* ---------- ARTIKKELOPPSETT ---------- */
.fj-article{max-width:1120px;margin:0 auto;padding:0 40px 40px;display:grid;grid-template-columns:1fr;gap:48px;}
@media(min-width:1040px){.fj-article{grid-template-columns:minmax(0,1fr) 262px;align-items:start;}}
.fj-prose{max-width:70ch;font-size:1.05rem;color:var(--contrast);}
.fj-prose > *:first-child{margin-top:0;}
.fj-prose p{margin:0 0 1.15em;line-height:1.72;}
.fj-prose h2{font-size:clamp(1.42rem,2.5vw,1.85rem);color:var(--accent-1);margin:2.4em 0 .6em;scroll-margin-top:110px;position:relative;}
.fj-prose h2::before{content:"";position:absolute;left:-22px;top:.52em;width:11px;height:2px;background:var(--accent-3);}
@media(max-width:820px){.fj-prose h2::before{display:none;}}
.fj-prose h3{font-size:1.14rem;color:var(--accent-1);margin:1.9em 0 .5em;scroll-margin-top:110px;}
.fj-prose ul,.fj-prose ol{margin:0 0 1.3em;padding-left:1.25em;}
.fj-prose li{margin-bottom:.55em;line-height:1.66;}
.fj-prose ul li::marker{color:var(--accent-3);}
.fj-prose a{color:var(--accent-1);text-decoration:underline;text-underline-offset:.18em;text-decoration-thickness:1px;text-decoration-color:rgba(14,90,107,.4);}
.fj-prose a:hover{color:var(--accent-3);text-decoration-color:var(--accent-3);}
.fj-prose strong{font-weight:600;color:var(--contrast);}
.fj-prose > p:first-of-type{font-size:1.12rem;color:var(--accent-1);}

/* ---------- KORT SVAR ---------- */
.fj-quickanswer{border-left:3px solid var(--accent-3);background:var(--surface-2);padding:22px 26px;margin:0 0 2em;border-radius:0 3px 3px 0;}
.fj-quickanswer p{margin:0;font-size:1.04rem;line-height:1.65;color:var(--contrast);}
.fj-quickanswer p strong{display:block;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-3);margin-bottom:8px;font-weight:500;}

/* ---------- TABELL ---------- */
.fj-table-wrap{overflow-x:auto;margin:0 0 1.8em;-webkit-overflow-scrolling:touch;}
.fj-table{width:100%;border-collapse:collapse;font-size:.95rem;border:1px solid var(--line);background:var(--base);}
.fj-table caption{caption-side:bottom;text-align:left;font-size:.82rem;color:var(--accent-4);padding-top:10px;font-family:var(--font-mono);}
.fj-table th,.fj-table td{padding:13px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.5;}
.fj-table thead th{background:var(--accent-1);color:#fff;font-weight:600;font-size:.82rem;letter-spacing:.05em;text-transform:uppercase;font-family:var(--font-body);}
.fj-table tbody tr:last-child td{border-bottom:none;}
.fj-table tbody tr:nth-child(even){background:var(--surface);}
.fj-table td{font-variant-numeric:tabular-nums;}
.fj-table td:first-child{font-weight:500;color:var(--accent-1);}
@media(max-width:640px){.fj-table{font-size:.88rem;min-width:520px;}.fj-table th,.fj-table td{padding:11px 13px;}}

/* ---------- FIGUR ---------- */
.fj-figure{margin:2em 0;}
.fj-figure img{width:100%;height:auto;border:1px solid var(--line);border-radius:3px;background:var(--surface);}
.fj-figure figcaption{font-family:var(--font-mono);font-size:.78rem;color:var(--accent-4);margin-top:10px;line-height:1.5;}

/* ---------- FAQ-TREKKSPILL ---------- */
.fj-faq{border-top:1px solid var(--line-strong);margin:1.4em 0 2em;}
.fj-faq-item{border-bottom:1px solid var(--line);}
.fj-faq-item summary{list-style:none;cursor:pointer;padding:19px 44px 19px 0;position:relative;font-family:var(--font-head);font-size:1.06rem;font-weight:600;color:var(--accent-1);line-height:1.35;transition:color .2s var(--ease);}
.fj-faq-item summary::-webkit-details-marker{display:none;}
.fj-faq-item summary:hover{color:var(--accent-3);}
.fj-faq-item summary:focus-visible{outline:2px solid var(--accent-3);outline-offset:3px;}
.fj-faq-item summary::after{content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;border-right:2px solid var(--accent-3);border-bottom:2px solid var(--accent-3);transform:translateY(-70%) rotate(45deg);transition:transform .25s var(--ease);}
.fj-faq-item[open] summary::after{transform:translateY(-20%) rotate(-135deg);}
.fj-faq-item > div{padding:0 44px 22px 0;animation:fjFade .28s var(--ease);}
.fj-faq-item > div p{margin:0 0 .8em;color:var(--contrast);line-height:1.68;}
.fj-faq-item > div p:last-child{margin-bottom:0;}
@keyframes fjFade{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion: reduce){.fj-faq-item > div{animation:none;}}

/* ---------- INNHOLDSFORTEGNELSE ---------- */
.fj-toc{position:sticky;top:104px;border:1px solid var(--line);border-radius:3px;padding:22px 22px 18px;background:var(--surface);font-size:.9rem;}
.fj-toc h2{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-4);margin:0 0 14px;font-weight:500;}
.fj-toc ol{list-style:none;margin:0;padding:0;counter-reset:fjtoc;}
.fj-toc li{counter-increment:fjtoc;margin-bottom:2px;}
.fj-toc a{display:block;padding:7px 0 7px 30px;text-decoration:none;color:var(--accent-4);line-height:1.4;position:relative;border-left:2px solid transparent;transition:color .2s,border-color .2s;}
.fj-toc a::before{content:counter(fjtoc,decimal-leading-zero);position:absolute;left:12px;font-family:var(--font-mono);font-size:.68rem;color:var(--line-strong);top:9px;}
.fj-toc a:hover{color:var(--accent-1);}
.fj-toc a.is-current{color:var(--accent-1);font-weight:600;border-left-color:var(--accent-3);}
.fj-toc a.is-current::before{color:var(--accent-3);}
@media(max-width:1039px){.fj-toc{position:static;margin-bottom:34px;}.fj-toc ol{columns:2;column-gap:24px;}.fj-toc li{break-inside:avoid;}}
@media(max-width:600px){.fj-toc ol{columns:1;}}

/* ---------- CTA I ARTIKKEL ---------- */
.fj-cta{background:var(--surface-2);color:var(--contrast);padding:38px 40px;border-radius:3px;border:1px solid var(--line);border-left:4px solid var(--accent-3);margin:2.6em 0 0;position:relative;overflow:hidden;}
.fj-cta::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(0deg,rgba(12,30,39,.045) 0 1px,transparent 1px 44px),repeating-linear-gradient(90deg,rgba(12,30,39,.045) 0 1px,transparent 1px 44px);}
.fj-cta > *{position:relative;z-index:1;}
.fj-cta h2{color:var(--accent-1);margin:0 0 12px;font-size:1.42rem;}
.fj-cta h2::before{display:none;}
.fj-cta p{color:var(--accent-4);margin:0 0 22px;max-width:56ch;}
.fj-btn{display:inline-flex;align-items:center;gap:9px;padding:14px 28px;border-radius:3px;background:var(--accent-3);color:#fff;font-weight:600;font-size:.94rem;text-decoration:none;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease);}
.fj-btn::after{content:"→";font-size:1.05em;line-height:1;}
.fj-btn:hover{transform:translateY(-2px);background:var(--cta-dark);box-shadow:0 10px 26px rgba(10,110,128,.3);color:#fff;}
.fj-cta .fj-btn{text-decoration:none;}

/* ---------- RELATERTE ---------- */
.fj-related{border-top:1px solid var(--line-strong);margin-top:3em;padding-top:28px;}
.fj-related h2{font-size:.72rem;font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--accent-4);margin:0 0 18px;}
.fj-related h2::before{display:none;}
.fj-related ul{list-style:none;margin:0;padding:0;display:grid;gap:1px;background:var(--line);border:1px solid var(--line);}
.fj-related li{background:var(--base);}
.fj-related a{display:block;padding:16px 20px;text-decoration:none;color:var(--accent-1);font-weight:600;font-size:.97rem;transition:background .25s;}
.fj-related a:hover{background:var(--surface);color:var(--accent-3);}

/* ---------- KLEBRIG CTA PÅ MOBIL ---------- */
.fj-sticky-cta{position:fixed;left:0;right:0;bottom:0;z-index:70;display:none;gap:1px;background:var(--line-strong);transform:translateY(102%);transition:transform .3s var(--ease);box-shadow:0 -6px 24px rgba(12,30,39,.12);}
.fj-sticky-cta.is-visible{transform:none;}
.fj-sticky-cta a{flex:1;display:flex;align-items:center;justify-content:center;gap:8px;padding:16px 10px;text-decoration:none;font-weight:600;font-size:.94rem;background:var(--base);color:var(--contrast);}
.fj-sticky-cta a.primary{background:var(--accent-3);color:#fff;}
@media(max-width:760px){.fj-sticky-cta{display:flex;}}

/* ---------- LUFTMENGDEKALKULATOR ---------- */
.fj-calc{border:1px solid var(--line-strong);border-radius:4px;background:var(--base);overflow:hidden;margin:0 0 2em;}
.fj-calc-head{background:var(--accent-1);color:#fff;padding:22px 28px;position:relative;overflow:hidden;}
.fj-calc-head::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:repeating-linear-gradient(0deg,rgba(255,255,255,.06) 0 1px,transparent 1px 40px),repeating-linear-gradient(90deg,rgba(255,255,255,.06) 0 1px,transparent 1px 40px);}
.fj-calc-head > *{position:relative;z-index:1;}
.fj-calc-head h2{color:#fff;margin:0 0 5px;font-size:1.3rem;}
.fj-calc-head h2::before{display:none;}
.fj-calc-head p{margin:0;color:#CFE6EC;font-size:.9rem;}
.fj-calc-body{padding:28px;}
.fj-calc-tabs{display:flex;gap:1px;background:var(--line-strong);border:1px solid var(--line-strong);border-radius:3px;overflow:hidden;margin-bottom:26px;}
.fj-calc-tabs button{flex:1;padding:14px 12px;border:none;cursor:pointer;background:var(--base);font-family:var(--font-body);font-size:.92rem;font-weight:600;color:var(--accent-4);transition:background .2s,color .2s;}
.fj-calc-tabs button[aria-selected="true"]{background:var(--accent-1);color:#fff;}
.fj-calc-tabs button:hover:not([aria-selected="true"]){background:var(--surface);color:var(--accent-1);}
.fj-calc-grid{display:grid;grid-template-columns:1fr;gap:18px;}
@media(min-width:620px){.fj-calc-grid{grid-template-columns:1fr 1fr;}}
.fj-calc-field label{display:block;font-size:.86rem;font-weight:600;color:var(--contrast);margin:0 0 6px;}
.fj-calc-field .hint{display:block;font-weight:400;font-size:.78rem;color:var(--accent-4);margin-top:3px;}
.fj-calc-field input,.fj-calc-field select{width:100%;padding:12px 14px;border:1px solid var(--line-strong);border-radius:4px;font-family:var(--font-body);font-size:1rem;background:var(--base);color:var(--contrast);}
.fj-calc-field input:focus,.fj-calc-field select:focus{outline:2px solid var(--accent-3);outline-offset:1px;}
.fj-calc-result{border-top:1px solid var(--line-strong);margin-top:28px;padding-top:26px;}
.fj-calc-total{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap;padding:22px 26px;background:var(--surface-2);border-left:3px solid var(--accent-3);border-radius:0 3px 3px 0;}
.fj-calc-total .num{font-family:var(--font-head);font-size:2.6rem;font-weight:700;color:var(--accent-1);line-height:1;}
.fj-calc-total .unit{font-family:var(--font-mono);font-size:1rem;color:var(--accent-4);}
.fj-calc-total .lbl{font-size:.9rem;color:var(--accent-4);width:100%;margin-top:2px;}
.fj-calc-break{width:100%;margin-top:18px;}
.fj-calc-note{font-size:.85rem;color:var(--accent-4);margin-top:18px;line-height:1.6;padding-left:18px;border-left:2px solid var(--line-strong);}
.fj-calc-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px;}

/* ---------- TJENESTE-LANDINGSSIDE ---------- */
.fj-svc-grid{display:grid;grid-template-columns:1fr;gap:1px;background:var(--line);border:1px solid var(--line);margin:1.6em 0 2em;}
@media(min-width:700px){.fj-svc-grid{grid-template-columns:1fr 1fr;}}
.fj-svc-item{background:var(--base);padding:26px 28px;}
.fj-svc-item h3{margin:0 0 8px;font-size:1.06rem;color:var(--accent-1);}
.fj-svc-item p{margin:0;color:var(--accent-4);font-size:.95rem;line-height:1.6;}
.fj-steps{counter-reset:fjstep;list-style:none;margin:1.4em 0 2em;padding:0;}
.fj-steps li{counter-increment:fjstep;position:relative;padding:0 0 22px 58px;border-left:2px solid var(--line);margin-left:16px;}
.fj-steps li:last-child{border-left-color:transparent;padding-bottom:0;}
.fj-steps li::before{content:counter(fjstep,decimal-leading-zero);position:absolute;left:-17px;top:-2px;width:32px;height:32px;border-radius:50%;background:var(--base);border:2px solid var(--accent-3);color:var(--accent-1);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:.74rem;font-weight:500;}
.fj-steps li strong{display:block;color:var(--accent-1);font-size:1.04rem;margin-bottom:5px;}
.fj-steps li span{color:var(--accent-4);line-height:1.6;}

/* ---------- SKJEMAVALIDERING ---------- */
.fj-form .fj-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden;}
.fj-form .field-error{display:block;font-size:.8rem;color:#A4442A;margin-top:5px;font-weight:500;}
.fj-form input[aria-invalid="true"],.fj-form textarea[aria-invalid="true"],.fj-form select[aria-invalid="true"]{border-color:#A4442A;}
.fj-form-status[data-state="ok"]{color:#1F7A3F;}
.fj-form-status[data-state="err"]{color:#A4442A;}
.fj-form button[disabled]{opacity:.6;cursor:not-allowed;}

/* ---------- FORSIDE: TJENESTEKORT SOM LENKE ---------- */
a.card{text-decoration:none;color:inherit;display:block;}
a.card:hover h3{color:var(--accent-3);}
a.card::after{content:"→";position:absolute;right:28px;bottom:30px;color:var(--accent-3);opacity:0;transform:translateX(-6px);transition:opacity .25s var(--ease),transform .25s var(--ease);}
a.card:hover::after,a.card:focus-visible::after{opacity:1;transform:none;}

/* ---------- FORSIDE: KALKULATORBLOKK ---------- */
.home-tool{display:grid;grid-template-columns:1fr;gap:44px;align-items:center;}
@media(min-width:900px){.home-tool{grid-template-columns:1.1fr .9fr;gap:64px;}}
.home-tool h2{font-size:clamp(1.7rem,3.4vw,2.3rem);margin-bottom:16px;}
.home-tool-specs{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--line);border:1px solid var(--line);}
.home-tool-specs li{background:var(--base);padding:24px 22px;}
.home-tool-specs strong{display:block;font-family:var(--font-head);font-size:1.55rem;font-weight:600;color:var(--accent-1);line-height:1.1;margin-bottom:7px;}
.home-tool-specs span{font-size:.84rem;color:var(--accent-4);font-family:var(--font-mono);line-height:1.45;display:block;}
@media(max-width:480px){.home-tool-specs{grid-template-columns:1fr;}}

/* ---------- UTSKRIFT ---------- */
@media print{
  header.site,footer.site,.fj-sticky-cta,.fj-toc,.fj-progress,.fj-cta{display:none !important;}
  .fj-article{display:block;padding:0;}
  .fj-prose{max-width:none;font-size:11pt;}
  .fj-faq-item > div{display:block !important;}
}
