@font-face{font-family:"Familjen";src:url(/assets/fonts/familjen-grotesk-latin-ext-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Familjen";src:url(/assets/fonts/familjen-grotesk-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson";src:url(/assets/fonts/atkinson-hyperlegible-latin-ext-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson";src:url(/assets/fonts/atkinson-hyperlegible-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Atkinson";src:url(/assets/fonts/atkinson-hyperlegible-latin-ext-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Atkinson";src:url(/assets/fonts/atkinson-hyperlegible-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Courier P";src:url(/assets/fonts/courier-prime-latin-ext-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0100-02AF,U+0304,U+0308,U+0329,U+1E00-1E9F,U+20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Courier P";src:url(/assets/fonts/courier-prime-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Courier P";src:url(/assets/fonts/courier-prime-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+2000-206F,U+20AC}
@font-face{font-family:"Courier P";src:url(/assets/fonts/courier-prime-latin-ext-700-normal.woff2) format("woff2");font-weight:700;font-display:swap;unicode-range:U+0100-02AF}


:root{
 --bg:#FAFBF9;--mint:#EAF4EF;--warm:#FFF3DF;--ink:#18302A;--deep:#1F5446;--muted:#5A6B66;--rule:#D9E3DF;
 --ok:#2F7D5B;--amber:#E89A2C;--amber-d:#A9620A;--cost:#C2553A;--slip:#FFFFFC;--card:#FFFFFF;
 --head:"Familjen",system-ui,sans-serif;--body:"Atkinson",system-ui,sans-serif;--mono:"Courier P","Courier New",monospace;
 --r:16px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 1.0625rem/1.6 var(--body);font-variant-numeric:tabular-nums}
a{color:var(--deep);text-underline-offset:.18em;text-decoration-thickness:1px}
a:hover{color:var(--ok)}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px;border-radius:4px}
h1,h2,h3{font-family:var(--head);font-weight:700;line-height:1.12;letter-spacing:-.01em;margin:1.6em 0 .5em}
h1{font-size:clamp(2rem,5vw,3.3rem);margin-top:.3em;max-width:18ch}
h2{font-size:1.55rem}
h3{font-size:1.15rem}
.wrap{max-width:1120px;margin:0 auto;padding:0 1.25rem}
.narrow{max-width:46rem}
.wrap.narrow{max-width:calc(46rem + 2.5rem)}
.lead{font-size:1.2rem;max-width:40rem}
.small{font-size:.92rem;color:var(--muted)}
.note{display:inline-block;font-size:.78rem;color:var(--amber-d);background:var(--warm);border-radius:99px;padding:.05rem .5rem;margin-left:.4rem;white-space:nowrap}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-9999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:9}
.ic{width:1.4em;height:1.4em;flex:none}

.top{background:var(--deep);color:#fff}
.top-in{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem 2rem;padding-top:.9rem;padding-bottom:.9rem}
.logo{font-family:var(--head);font-weight:700;font-size:1.2rem;color:#fff;text-decoration:none;display:flex;align-items:center;gap:.55rem}
.logo:hover{color:#fff}
.logo-mark{display:inline-grid;place-items:center;width:2rem;height:2rem;background:var(--amber);color:var(--ink);border-radius:9px;font-size:.95rem}
.top nav{display:flex;flex-wrap:wrap;gap:.3rem 1.3rem}
.top nav a{color:#fff;text-decoration:none;font-size:.98rem;opacity:.88}
.top nav a:hover{opacity:1;color:#fff;text-decoration:underline}

.stamp{display:inline-flex;align-items:center;gap:.4rem;font-size:.9rem;color:var(--deep);background:#fff;border:1px solid var(--rule);border-radius:99px;padding:.25rem .75rem;margin:0}
.stamp .ic{width:1.1em;height:1.1em;color:var(--ok)}
.btn{display:inline-block;background:var(--deep);color:#fff;text-decoration:none;font-weight:700;padding:.85rem 1.3rem;border-radius:12px;border:2px solid var(--deep)}
.btn:hover{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.ghost{background:transparent;color:var(--deep)}
.btn.ghost:hover{background:#fff;color:var(--deep)}
.btn.sm{padding:.55rem .9rem;font-size:.95rem;border-radius:10px}
.cta{display:flex;flex-wrap:wrap;gap:.75rem}

.hero-band{background:var(--mint)}
.hero{display:grid;grid-template-columns:1.25fr 1fr;gap:3rem;align-items:center;padding-top:3rem;padding-bottom:3.5rem}
.hero h1{margin-top:.6em}

.receipt{margin:0;background:var(--slip);font-family:var(--mono);font-size:1rem;padding:1.6rem 1.5rem 2.2rem;
 box-shadow:0 18px 40px -24px rgba(24,48,42,.45);transform:rotate(1.4deg);
 -webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/14px 100%;
 mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) 50%/14px 100%}
.r-head{text-align:center;font-weight:700;font-size:1.15rem;border-bottom:1.5px dashed var(--muted);padding-bottom:.8rem;margin-bottom:.8rem}
.r-head small{font-weight:400;font-size:.85rem;color:var(--muted)}
.receipt dl{margin:0}
.receipt dl div{display:flex;justify-content:space-between;gap:1rem;padding:.3rem 0}
.receipt dt{color:var(--muted)}.receipt dd{margin:0;white-space:nowrap}
.receipt .r-sum{border-top:1.5px dashed var(--muted);margin-top:.5rem;padding-top:.7rem;font-weight:700;font-size:1.2rem}
.receipt .r-sum dt{color:var(--ink)}.receipt .r-sum dd{color:var(--cost)}
.r-foot{font-size:.8rem;color:var(--muted);margin:.9rem 0 0;line-height:1.45}

.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:-1.75rem;position:relative}
.kpi{background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:1.2rem 1.25rem}
.kpi .ic{color:var(--ok);width:1.7rem;height:1.7rem}
.kpi.warm{background:var(--warm);border-color:#F3D9AE}
.kpi.warm .ic,.kpi.warm .k{color:var(--amber-d)}
.kpi p{margin:0;color:var(--muted)}
.kpi .k{font-family:var(--head);font-weight:700;font-size:2rem;color:var(--ink);margin:.35rem 0 .1rem}

.mono{display:inline-grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--c);color:#fff;font:700 .78rem/1 var(--head);letter-spacing:.02em;flex:none}
.nm{display:inline-flex;align-items:center;gap:.6rem}

.podium{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:1.25rem 0 1rem}
.pod{position:relative;background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:1.3rem 1.25rem 1.25rem;display:flex;flex-direction:column;align-items:flex-start}
.pod.p1{border:2px solid var(--amber);background:linear-gradient(var(--warm),#fff 55%)}
.pod .place{position:absolute;top:1rem;right:1.1rem;font:700 1.6rem/1 var(--head);color:var(--rule)}
.pod.p1 .place{color:var(--amber)}
.pod .mono{width:2.6rem;height:2.6rem;font-size:.95rem}
.pod h3{margin:.8rem 0 .2rem;font-size:1.1rem}
.pod h3 a{text-decoration:none;color:var(--ink)}
.pod .big{font:700 2rem/1.1 var(--head);margin:.2rem 0;color:var(--deep)}
.pod.p1 .big{color:var(--amber-d)}
.pod .sub{margin:0 0 1rem;color:var(--muted);font-size:.95rem}
.pod .btn{margin-top:auto}

.band{background:var(--mint);margin:2.5rem 0;padding:2.5rem 0}
.charts2{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem}
.chart{margin:1.5rem 0;background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:1.25rem 1.25rem 1rem}
.charts2 .chart{margin:0}
.chart figcaption{display:flex;gap:.7rem;align-items:flex-start;color:var(--muted);font-size:.9rem;margin-bottom:1rem}
.chart figcaption .ic{color:var(--ok);margin-top:.15rem}
.chart figcaption b{display:block;color:var(--ink);font-family:var(--head);font-size:1.1rem;margin-bottom:.15rem}
.bars{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.bars li{display:grid;grid-template-columns:minmax(7.5rem,10rem) 1fr auto;gap:.75rem;align-items:center;font-size:.92rem}
.bl{display:flex;align-items:center;gap:.5rem;min-width:0}
.bl a{color:var(--ink);text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bl .mono{width:1.6rem;height:1.6rem;font-size:.65rem}
.bt{height:.9rem;background:#EEF2F0;border-radius:99px;overflow:hidden}
.bf{display:block;height:100%;background:var(--amber);border-radius:99px}
.bf.only{background:repeating-linear-gradient(-45deg,var(--amber) 0 5px,#F6C77F 5px 10px)}
.bf.cost{background:var(--ok)}
.bf.cost.long{background:var(--cost)}
.bv{white-space:nowrap;color:var(--muted)}
.bv b{color:var(--ink)}
.bv em{font-style:normal;margin-left:.4rem;font-size:.75rem;color:var(--amber-d)}

.two{display:grid;grid-template-columns:1fr 1fr;gap:3rem;padding-bottom:3rem}
details{border-bottom:1px solid var(--rule);padding:.85rem 0}
summary{cursor:pointer;font-weight:700}
details p{margin:.6rem 0 0}
.cards{list-style:none;padding:0;margin:1rem 0;display:grid;gap:.75rem}
.cards li{display:flex;gap:.9rem;align-items:flex-start;background:var(--card);border:1px solid var(--rule);border-radius:var(--r);padding:1rem 1.1rem}
.cards li .ic{color:var(--amber-d);background:var(--warm);border-radius:10px;padding:.4rem;width:2.2rem;height:2.2rem}
.cards a{font-family:var(--head);font-weight:700;font-size:1.08rem;color:var(--ink);text-decoration:none}
.cards a:hover{color:var(--ok)}
.cards p{margin:.25rem 0 0;color:var(--muted);font-size:.95rem}

.crumb{margin:2rem 0 0;font-size:.95rem}
.rlist{list-style:none;padding:0}.rlist li{border-top:1px solid var(--rule);padding:1rem 0}
.rlist a{font-family:var(--head);font-weight:700;font-size:1.25rem}.rlist p{margin:.3rem 0 0;color:var(--muted)}

.tscroll{overflow-x:auto;margin:1.5rem 0;border:1px solid var(--rule);border-radius:var(--r);background:#fff}
table{border-collapse:collapse;width:100%;min-width:560px}
caption{text-align:left;padding:.9rem 1rem;font-weight:700;color:var(--muted);font-size:.95rem}
th,td{text-align:left;padding:.75rem 1rem;border-top:1px solid var(--rule);vertical-align:middle}
thead th{font-size:.88rem;color:var(--muted);font-weight:400;background:#F6F9F7}
tbody tr:hover{background:#FBFDFC}
tbody th{font-weight:700}
td.pos{font-family:var(--head);font-weight:700;color:var(--muted);width:3.5rem}
tbody tr:first-child td.pos{color:var(--amber-d)}
.go{white-space:nowrap;font-size:.95rem;font-weight:700}

.facts{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin:1.5rem 0}
.facts div{padding:.9rem 1rem;border:1px solid var(--rule);border-radius:12px;background:#fff}
.facts dt{font-size:.88rem;color:var(--muted)}.facts dd{margin:0;font-weight:700;font-size:1.1rem}

.prose table{min-width:0}
.prose td,.prose th{padding:.6rem .9rem}
.prose li{margin:.35rem 0}
.prose h2{margin-top:1.8em}
article ul li{margin:.4rem 0}
.foot{background:var(--ink);color:#C9D6D1;margin-top:3rem;padding:2.25rem 0 3rem;font-size:.92rem}
.foot a{color:#fff}
.foot .warn{color:#fff;font-weight:700;max-width:46rem;background:rgba(232,154,44,.14);border-left:4px solid var(--amber);padding:.75rem 1rem;border-radius:0 10px 10px 0}

@media (max-width:860px){
 .hero,.two,.charts2{grid-template-columns:1fr;gap:2rem}
 .receipt{transform:none;max-width:24rem}
 .kpis,.podium{grid-template-columns:1fr}
 .kpis{margin-top:-1.25rem}
 .facts{grid-template-columns:1fr}
 .bars li{grid-template-columns:1fr auto;grid-template-areas:"l v" "t t";row-gap:.3rem}
 .bl{grid-area:l}.bv{grid-area:v}.bt{grid-area:t}
}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
