/* Luniat Magazine — /sv/magazine, /en/magazine. Bygger på home.css (nav,
   sidfot, knappar). HTML genereras av scripts/magazine/build.mjs.

   Redaktionell essä: en serif byggd för skärmläsning (Newsreader) för
   rubriker och text, Luniats grotesk (Space Grotesk, samma som nav och
   sidfot) för etiketter och metadata. Ett rutnät, en accentfärg och ingen
   dekor. Planscherna står som figurer, inte som ornament. */

.mx{background:#fff}
.mx main{
  --paper:#fff;
  --ink:#16140F;--ink-2:#36322B;--muted:#7A7367;
  --rule:rgba(22,20,15,.12);--rule-2:rgba(22,20,15,.07);
  --accent:#9A6B2C;--tint:#F6F4EF;
  --serif:'Newsreader',Georgia,'Times New Roman',serif;
  --sans:'Space Grotesk',ui-sans-serif,system-ui,sans-serif;
  --max:1200px;
  color:var(--ink-2);
}
body.mx::after{content:none}
.mx .nav.solid,.mx .foot{background:#fff}
.mx main{padding-top:var(--nav-h)}
.mx main>:not(.mx-player){max-width:var(--max);margin-left:auto;margin-right:auto;padding-left:var(--px);padding-right:var(--px);box-sizing:content-box}
mark.ph{background:#FFF1C9;color:var(--ink);padding:0 .2em;border-radius:3px}

/* ── Gemensamma byggstenar ─────────────────────────── */
.mx-label{display:flex;flex-wrap:wrap;gap:4px 10px;font-family:var(--sans);font-size:13px;line-height:1.5;color:var(--muted)}
.mx-label a{transition:color .2s}
.mx-label a:hover{color:var(--ink)}
.mx-label [aria-hidden]{color:var(--rule)}
.mx-dek{max-width:34em;margin-top:22px;font-family:var(--serif);font-size:clamp(19px,1.6vw,22px);line-height:1.45;color:var(--ink-2)}
.mx-hstats{margin-top:20px;font-family:var(--sans);font-size:13.5px;color:var(--muted)}
.mx-start{margin-top:26px;text-decoration:none}
.mx-soon{font-family:var(--serif);font-style:italic;color:var(--muted)}
.mx-empty{max-width:40em;margin-top:20px;font-family:var(--sans);font-size:14px;color:var(--muted)}
.mx-empty a{color:var(--ink);text-decoration:underline}
.mx-avatar{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:50%;background:var(--ink);color:var(--paper);font-family:var(--sans);font-size:14px;font-weight:500}
.mx a:focus-visible,.mx button:focus-visible,.mx summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:2px}

/* Sidhuvud: text till vänster, planschen som figur till höger, på en baslinje */
.mx-ahead{display:grid;grid-template-columns:minmax(0,1fr) clamp(200px,24vw,300px);gap:clamp(32px,5vw,72px);align-items:end;padding-top:clamp(48px,8vh,88px);padding-bottom:clamp(32px,5vh,44px);background:linear-gradient(var(--rule),var(--rule)) center bottom/calc(100% - 2 * var(--px)) 1px no-repeat}
.mx-ahead h1{max-width:17ch;margin-top:22px;font-family:var(--serif);font-weight:500;font-size:clamp(38px,5vw,66px);line-height:1.03;letter-spacing:-.022em;color:var(--ink);font-variation-settings:"opsz" 72;text-wrap:balance}
.mx-ahead h1 em{font-style:italic;font-weight:400}
.mx-ahead-plain{grid-template-columns:1fr}
.mx-article .mx-ahead{background-size:100% 1px}
.mx-afig{margin:0;justify-self:end;width:100%}
.mx-afig img{display:block;width:100%;height:auto}

/* Byline */
.mx-byline{display:flex;flex-wrap:wrap;align-items:center;gap:12px 14px;margin-top:30px;font-family:var(--sans);font-size:13.5px;line-height:1.4;color:var(--ink)}
.mx-by{display:flex;flex-direction:column}
.mx-by span{color:var(--muted)}
.mx-by strong{font-weight:500}
.mx-by-sep{width:1px;height:30px;margin:0 4px;background:var(--rule)}
.mx-listen-btn{display:inline-flex;align-items:center;gap:10px;margin-left:auto;padding:8px 16px 8px 9px;border:1px solid var(--rule);border-radius:999px;background:transparent;font:500 13.5px var(--sans);color:var(--ink);cursor:pointer;transition:border-color .2s}
.mx-listen-btn:hover{border-color:var(--ink)}
.mx-listen-ico{position:relative;display:inline-block;flex:none;width:24px;height:24px;border-radius:50%;background:var(--accent)}
.mx-listen-ico::before{content:"";position:absolute;left:9px;top:7px;border-style:solid;border-width:5px 0 5px 7px;border-color:transparent transparent transparent #fff}

/* ── Artikeln: avsnittslista i marginalen och en läsbar spalt ── */
.mx-agrid{display:grid;grid-template-columns:220px minmax(0,680px);gap:clamp(40px,6vw,88px);padding-top:clamp(40px,6vh,56px);padding-bottom:clamp(72px,10vh,110px)}
.mx-index{position:sticky;top:calc(var(--nav-h) + 32px);align-self:start;max-height:calc(100vh - var(--nav-h) - 64px);overflow:auto;font-family:var(--sans)}
.mx-index-title{font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mx-index ol{list-style:none;margin-top:14px;border-left:1px solid var(--rule)}
.mx-index a{display:flex;gap:10px;margin-left:-1px;padding:6px 0 6px 16px;border-left:1px solid transparent;font-size:13.5px;line-height:1.35;color:var(--muted);transition:color .2s,border-color .2s}
.mx-index a span{flex:none;font-variant-numeric:tabular-nums;color:rgba(22,20,15,.28)}
.mx-index a:hover{color:var(--ink)}
.mx-index a.is-active{color:var(--ink);border-left-color:var(--accent)}
.mx-index a.is-active span{color:var(--accent)}
.mx-index-m{display:none}

/* Kort sagt: kapitlets kärna innan man börjar läsa */
.mx-short{padding:24px 28px 26px;background:var(--tint);border-radius:4px}
.mx-short h2{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.mx-short ul{list-style:none;margin-top:12px}
.mx-short li{position:relative;padding-left:22px;font-family:var(--serif);font-size:18px;line-height:1.5;color:var(--ink)}
.mx-short li+li{margin-top:8px}
.mx-short li::before{content:"";position:absolute;left:2px;top:.72em;width:9px;height:1.5px;background:var(--accent)}
.mx-short p{margin-top:12px;font-family:var(--serif);font-size:18px;line-height:1.55;color:var(--ink)}
.mx-short a{color:inherit;text-decoration:underline;text-decoration-color:rgba(154,107,44,.5);text-underline-offset:3px}

/* Brödtext */
.mx-text{margin-top:44px;counter-reset:sec;font-family:var(--serif);font-size:clamp(19px,1.35vw,20.5px);line-height:1.66;color:var(--ink-2);font-variation-settings:"opsz" 16}
.mx-text>*+*{margin-top:1.05em}
.mx-text h2{counter-increment:sec;margin-top:2.4em;padding-top:26px;border-top:1px solid var(--rule);font-weight:500;font-size:clamp(26px,2.2vw,30px);line-height:1.18;letter-spacing:-.012em;color:var(--ink);font-variation-settings:"opsz" 48;scroll-margin-top:calc(var(--nav-h) + 24px)}
.mx-text h2::before{content:counter(sec,decimal-leading-zero);display:block;margin-bottom:10px;font-family:var(--sans);font-size:13px;font-weight:500;letter-spacing:.04em;color:var(--accent)}
.mx-text h3{margin-top:1.8em;font-weight:500;font-size:22px;line-height:1.25;color:var(--ink)}
.mx-text h2+*,.mx-text h3+*{margin-top:.6em}
.mx-text strong{font-weight:500;color:var(--ink)}
.mx-text em{font-style:italic}
.mx-text a{color:var(--ink);text-decoration:underline;text-decoration-color:rgba(154,107,44,.5);text-decoration-thickness:1px;text-underline-offset:3px;transition:text-decoration-color .2s}
.mx-text a:hover{text-decoration-color:var(--ink)}
.mx-text ul,.mx-text ol{list-style:none}
.mx-text ul>li{position:relative;padding-left:26px}
.mx-text ul>li::before{content:"";position:absolute;left:4px;top:.82em;width:10px;height:1.5px;background:var(--muted)}
.mx-text ol{counter-reset:li}
.mx-text ol>li{position:relative;padding-left:30px;counter-increment:li}
.mx-text ol>li::before{content:counter(li);position:absolute;left:0;top:.2em;font-family:var(--sans);font-size:14px;font-weight:500;color:var(--accent)}
.mx-text li+li{margin-top:.55em}
.mx-text blockquote{padding-left:22px;border-left:2px solid var(--accent);font-style:italic}
.mx-text table{width:100%;border-collapse:collapse;font-family:var(--sans);font-size:14.5px}
.mx-text th,.mx-text td{padding:10px 12px;border-bottom:1px solid var(--rule);text-align:left;vertical-align:top}
/* Stycket som läses upp */
.mx .is-reading{background:linear-gradient(transparent 4%,rgba(154,107,44,.13) 4%,rgba(154,107,44,.13) 96%,transparent 96%);box-shadow:-10px 0 0 rgba(154,107,44,.13),10px 0 0 rgba(154,107,44,.13);border-radius:2px}
.mx-listening .mx-text p,.mx-listening .mx-text li{cursor:pointer}

/* Efter texten: skribent, nästa kapitel, frågor, CTA */
.mx-afoot{margin-top:64px}
.mx-author{display:flex;gap:16px;align-items:flex-start;padding:24px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font-family:var(--sans);font-size:14.5px;line-height:1.55;color:var(--muted)}
.mx-author strong{font-weight:500;color:var(--ink)}
.mx-author p+p{margin-top:4px}
.mx-next-up{display:flex;flex-direction:column;gap:6px;margin-top:40px;padding:28px 30px;border:1px solid var(--rule);border-radius:4px;text-decoration:none;transition:border-color .2s,background .2s}
.mx-next-up:hover{border-color:var(--ink);background:var(--tint)}
.mx-next-label{font-family:var(--sans);font-size:12.5px;font-weight:500;letter-spacing:.04em;color:var(--accent)}
.mx-next-title{font-family:var(--serif);font-weight:500;font-size:clamp(22px,2vw,27px);line-height:1.2;color:var(--ink)}
.mx-next-meta{font-family:var(--sans);font-size:13px;color:var(--muted)}
.mx-faq{margin-top:56px}
.mx-faq h2{font-family:var(--serif);font-weight:500;font-size:clamp(24px,2vw,28px);color:var(--ink)}
.mx-faq-item{border-bottom:1px solid var(--rule)}
.mx-faq-item:first-of-type{margin-top:14px;border-top:1px solid var(--rule)}
.mx-faq-item summary{position:relative;padding:18px 40px 18px 0;cursor:pointer;list-style:none;font-family:var(--serif);font-size:19px;line-height:1.4;color:var(--ink)}
.mx-faq-item summary::-webkit-details-marker{display:none}
.mx-faq-item summary::after{content:"+";position:absolute;right:4px;top:14px;font-family:var(--sans);font-size:22px;font-weight:300;color:var(--accent);transition:transform .25s}
.mx-faq-item[open] summary::after{transform:rotate(45deg)}
.mx-faq-item div{padding:0 0 20px;font-family:var(--serif);font-size:18px;line-height:1.6;color:var(--ink-2)}
.mx-afoot>.mx-cta:first-child{margin-top:0}
.mx-cta{margin-top:56px;padding:30px 32px 32px;background:#fff;border:1px solid var(--rule);border-top:2px solid var(--ink);border-radius:2px 2px 6px 6px}
.mx-cta-who{display:flex;align-items:flex-start;gap:12px;font-family:var(--sans);font-size:13.5px;line-height:1.4;color:var(--ink)}
.mx-cta-label{margin-top:26px;font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.mx-cta h2{margin-top:8px;font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.4vw,32px);line-height:1.15;letter-spacing:-.012em;color:var(--ink);font-variation-settings:"opsz" 48}
.mx-cta-text{max-width:34em;margin-top:12px;font-family:var(--serif);font-size:18.5px;line-height:1.55;color:var(--ink-2)}
.mx-cta-points{display:flex;flex-wrap:wrap;gap:8px 22px;list-style:none;margin-top:18px;font-family:var(--sans);font-size:14px;color:var(--ink)}
.mx-cta-points li{display:flex;align-items:center;gap:8px}
.mx-cta-points li::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent)}
.mx-cta-actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:26px;padding-top:22px;border-top:1px solid var(--rule-2)}
.mx-cta-btn{display:inline-flex;align-items:center;gap:12px;padding:13px 22px;border-radius:999px;background:var(--ink);color:#FBFAF7;font:500 15px var(--sans);text-decoration:none;transition:background .2s,gap .2s}
.mx-cta-btn:hover{background:var(--accent);gap:16px}
.mx-cta-alt{font-family:var(--sans);font-size:14px;color:var(--muted)}
.mx-cta-alt a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px}
.mx-cta-alt a:hover{text-decoration-color:var(--ink)}
.mx-cta-nl .mx-cta-actions{display:block}
.mx-cta-nl .mx-nl-form{margin-top:0}
.mx-cta-nl .mx-nl-form input[type=email]{padding:13px 18px;font-size:16px}
.mx-cta-nl .mx-nl-form .btn{display:inline-flex;align-items:center;gap:12px;padding:13px 22px;border:0;border-radius:999px;background:var(--ink);color:#FBFAF7;font:500 15px var(--sans);box-shadow:none;cursor:pointer;transition:background .2s}
.mx-cta-nl .mx-nl-status{min-height:0}
.mx-cta-nl .mx-nl-status:not(:empty){margin-top:4px}
.mx-cta-nl .mx-nl-form .btn:hover{background:var(--accent)}
.mx-cta-nl>.mx-cta-alt{margin-top:18px}

/* Relaterat och artikelkort */
.mx-related{padding-top:clamp(48px,7vh,72px);padding-bottom:clamp(80px,12vh,130px)}
.mx-related h2,.mx-sechead h2{font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.4vw,34px);letter-spacing:-.01em;color:var(--ink)}
.mx-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;list-style:none;margin-top:24px}
.mx-card a{display:flex;flex-direction:column;gap:10px;height:100%;padding:24px 24px 26px;border:1px solid var(--rule);border-radius:4px;text-decoration:none;transition:border-color .2s,background .2s}
.mx-card a:hover{border-color:var(--ink);background:var(--tint)}
.mx-card-meta{font-family:var(--sans);font-size:12.5px;color:var(--muted)}
.mx-card-title{font-family:var(--serif);font-weight:500;font-size:22px;line-height:1.22;color:var(--ink)}
.mx-card-desc{font-family:var(--serif);font-size:16.5px;line-height:1.5;color:var(--ink-2)}

/* ── Startsidan och delsidor ───────────────────────── */
.mx-section{padding-top:clamp(56px,8vh,88px);padding-bottom:clamp(56px,8vh,88px)}
.mx-section+.mx-section,.mx-related{background:linear-gradient(var(--rule),var(--rule)) center top/calc(100% - 2 * var(--px)) 1px no-repeat}
.mx-sechead{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 72px;align-items:baseline;margin-bottom:clamp(28px,4vh,44px)}
.mx-sechead p{font-family:var(--serif);font-size:19px;line-height:1.5;color:var(--muted)}

/* Innehållet: en rad per del, kapitlen till höger */
.mx-parts{list-style:none;border-top:1px solid var(--ink)}
.mx-part{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:24px 72px;padding:32px 0 36px;border-bottom:1px solid var(--rule)}
.mx-part-head{display:grid;grid-template-columns:72px minmax(0,1fr);column-gap:22px;align-content:start}
.mx-part-fig{grid-row:1/4;align-self:start;display:block;transition:opacity .2s}
.mx-part-fig:hover{opacity:.8}
.mx-part-fig img{display:block;width:100%;height:auto}
.mx-part-no{font-family:var(--sans);font-size:12.5px;font-weight:500;letter-spacing:.04em;color:var(--accent)}
.mx-part h3{margin-top:4px;font-family:var(--serif);font-weight:500;font-size:clamp(26px,2.3vw,32px);line-height:1.1;letter-spacing:-.012em;color:var(--ink)}
.mx-part h3 a:hover{color:var(--accent)}
.mx-part-lead{margin-top:8px;font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--muted)}

/* Kapitellista */
.mx-chapters{list-style:none}
.mx-chapters li+li{border-top:1px solid var(--rule-2)}
.mx-chapters a{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:4px 16px;align-items:baseline;padding:14px 0;text-decoration:none}
.mx-ch-no{font-family:var(--sans);font-size:13px;font-weight:500;font-variant-numeric:tabular-nums;color:var(--accent)}
.mx-ch-text{display:flex;flex-direction:column;gap:6px;min-width:0}
.mx-ch-title{font-family:var(--serif);font-weight:500;font-size:19.5px;line-height:1.3;color:var(--ink);transition:color .2s}
.mx-ch-desc{font-family:var(--serif);font-size:17px;line-height:1.5;color:var(--muted)}
.mx-ch-min{font-family:var(--sans);font-size:13px;color:var(--muted);white-space:nowrap}
.mx-chapters a:hover .mx-ch-title{color:var(--accent)}
.mx-chapters:not(.is-compact) a{padding:22px 0}
.mx-chapters:not(.is-compact) .mx-ch-title{font-size:clamp(22px,1.9vw,26px)}
.mx-pbody{max-width:880px}
.mx-section.mx-pbody{padding-top:clamp(12px,2vh,24px)}

/* Handboken */
.mx-industries{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px 56px}
.mx-industry h3{padding-bottom:12px;border-bottom:1px solid var(--ink);font-family:var(--sans);font-size:14px;font-weight:500;color:var(--ink)}
.mx-industry h3 a:hover{color:var(--accent)}
.mx-industry ol{list-style:none}
.mx-industry li+li{border-top:1px solid var(--rule-2)}
.mx-industry li a{display:flex;justify-content:space-between;gap:16px;padding:13px 0;font-family:var(--serif);font-size:18px;line-height:1.35;color:var(--ink);text-decoration:none}
.mx-industry li a:hover{color:var(--accent)}

/* Föregående/nästa del */
.mx-partnav{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:56px}
.mx-partnav a{display:flex;flex-direction:column;gap:6px;padding:22px 24px;border:1px solid var(--rule);border-radius:4px;text-decoration:none;transition:border-color .2s}
.mx-partnav a:hover{border-color:var(--ink)}
.mx-partnav a.is-next{text-align:right;align-items:flex-end}
.mx-partnav span{font-family:var(--sans);font-size:12.5px;color:var(--muted)}
.mx-partnav strong{font-family:var(--serif);font-weight:500;font-size:21px;color:var(--ink)}

/* ── Uppläsningsspelaren ───────────────────────────── */
.mx-player{position:fixed;left:50%;bottom:clamp(14px,2.4vw,28px);z-index:90;display:flex;align-items:center;gap:12px;width:min(560px,calc(100% - 24px));max-width:none;padding:10px 12px 12px;border:1px solid var(--rule);border-radius:12px;background:#fff;box-shadow:0 18px 40px -22px rgba(22,20,15,.35);transform:translateX(-50%);overflow:hidden;box-sizing:border-box}
.mx-player[hidden]{display:none}
.mx-player button{flex:none;border:0;background:none;cursor:pointer;color:var(--ink)}
.mx-player-toggle .mx-listen-ico{width:38px;height:38px;background:var(--ink)}
.mx-player-toggle .mx-listen-ico::before{left:12px;top:11px;width:4px;height:16px;border:0;background:#fff;box-shadow:9px 0 0 #fff}
.mx-player.is-paused .mx-listen-ico::before{left:15px;top:12px;width:0;height:0;border-style:solid;border-width:7px 0 7px 11px;border-color:transparent transparent transparent #fff;background:none;box-shadow:none}
.mx-player.is-loading .mx-listen-ico{background:none;border:2px solid var(--rule);border-top-color:var(--ink);animation:mxspin .9s linear infinite}
.mx-player.is-loading .mx-listen-ico::before{display:none}
.mx-player-text{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.mx-player-label{font-family:var(--sans);font-size:11.5px;font-weight:500;letter-spacing:.04em;color:var(--accent)}
.mx-player.is-error .mx-player-label{color:#9E2B25}
.mx-player-where{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:var(--serif);font-size:16px;color:var(--ink)}
.mx-player-rate{min-width:48px;padding:6px 8px;border:1px solid var(--rule) !important;border-radius:999px;font:500 13px var(--sans)}
.mx-player-close{width:34px;height:34px;border-radius:50%;font-size:14px;color:var(--muted) !important}
.mx-player-close:hover{background:var(--tint) !important}
.mx-player-bar{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--rule-2)}
.mx-player-bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .6s linear}
.mx-listening .foot{padding-bottom:110px}
@keyframes mxspin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.mx-player.is-loading .mx-listen-ico{animation-duration:2.4s}}

/* ── Nyhetsbrev (av tills vidare, se docs/magazine.md) ── */
.mx-nl{max-width:none;margin-top:56px;padding:28px 30px;border:1px solid var(--rule);border-radius:4px}
.mx-nl-art{display:none}
.mx-nl-eyebrow{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.06em;color:var(--accent)}
.mx-nl h2{margin-top:8px;font-family:var(--serif);font-weight:500;font-size:clamp(24px,2.2vw,28px);color:var(--ink)}
.mx-nl h2 em{font-style:italic;font-weight:400}
.mx-nl-text{margin-top:10px;max-width:40em;font-family:var(--serif);font-size:17.5px;line-height:1.55;color:var(--ink-2)}
.mx-nl-promises{display:flex;flex-wrap:wrap;gap:6px 18px;list-style:none;margin-top:14px;font-family:var(--sans);font-size:12.5px;color:var(--muted)}
.mx-nl-form{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.mx-nl-form input[type=email]{flex:1 1 220px;min-width:0;padding:11px 14px;border:1px solid var(--rule);border-radius:999px;background:#fff;font:16px var(--sans);color:var(--ink)}
.mx-nl-form input[type=email]:focus{outline:2px solid var(--accent);outline-offset:1px}
.mx-nl-form .btn{text-decoration:none}
.mx-nl-form .btn:disabled{opacity:.6;cursor:progress}
.mx-nl-form.is-error input[type=email]{border-color:#9E2B25}
.mx-nl-status{flex-basis:100%;min-height:1.4em;margin:0;font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--ink-2)}
.mx-nl-form.is-error .mx-nl-status{color:#9E2B25}
.mx-nl-consent{margin-top:8px;font-family:var(--sans);font-size:12.5px;line-height:1.5;color:var(--muted)}
.mx-nl-consent a{color:inherit;text-decoration:underline}
/* Honeypot: utanför skärmen, inte display:none (vissa bottar hoppar över dolda fält) */
.mx-hp{position:absolute !important;left:-10000px;width:1px;height:1px;overflow:hidden}
.mx-nl-page{padding-top:clamp(56px,10vh,110px);padding-bottom:clamp(56px,10vh,110px);text-align:center}
.mx-tp{max-width:640px;margin:0 auto}
.mx-tp-top{font-family:var(--sans);font-size:13px;color:var(--muted)}
.mx-tp h1{margin-top:18px;font-family:var(--serif);font-weight:500;font-size:clamp(36px,4.6vw,56px);line-height:1.05;color:var(--ink)}
.mx-tp h1 .h1-b{font-style:italic;font-weight:400}
.mx-hero-lead{margin:18px auto 0;max-width:34em;font-family:var(--serif);font-size:19px;line-height:1.5;color:var(--ink-2)}
.mx-nl-page .btn{margin-top:24px}
.mx-nl-page .mx-nl-promises{justify-content:center}
.mx-nl-standalone{max-width:480px;margin:24px auto 0;text-align:left}
.mx-tp-plate{width:110px;margin:40px auto 0}
.mx-tp-plate img{width:100%;height:auto}
.mx-tp-imprint{margin-top:14px;font-family:var(--sans);font-size:12.5px;color:var(--muted)}

/* ── Mobil ─────────────────────────────────────────── */
@media(max-width:980px){
  .mx-agrid{grid-template-columns:minmax(0,1fr);gap:0}
  .mx-index{display:none}
  .mx-index-m{display:block;margin-top:28px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);font-family:var(--sans)}
  .mx-index-m summary{padding:14px 0;cursor:pointer;list-style:none;font-size:14px;color:var(--ink)}
  .mx-index-m summary::-webkit-details-marker{display:none}
  .mx-index-m summary::after{content:" +";color:var(--accent)}
  .mx-index-m ol{list-style:none;padding-bottom:12px}
  .mx-index-m a{display:flex;gap:10px;padding:6px 0;font-size:14.5px;color:var(--ink-2)}
  .mx-index-m a span{color:var(--accent)}
}
@media(max-width:820px){
  .mx-ahead{grid-template-columns:minmax(0,1fr);gap:24px;padding-top:32px}
  .mx-afig{order:-1;justify-self:start;width:132px}
  .mx-listen-btn{margin-left:0}
  .mx-by-sep{display:none}
  .mx-sechead{grid-template-columns:minmax(0,1fr);gap:8px}
  .mx-part{grid-template-columns:minmax(0,1fr);gap:16px;padding:26px 0 28px}
  .mx-part-head{grid-template-columns:56px minmax(0,1fr);column-gap:16px}
  .mx-chapters a{grid-template-columns:32px minmax(0,1fr)}
  .mx-ch-min{grid-column:2}
  .mx-text{margin-top:32px}
  .mx-partnav{grid-template-columns:1fr}
  .mx-partnav a.is-next{text-align:left;align-items:flex-start}
  .mx-player{gap:8px;padding:8px 8px 10px}
}
@media print{.mx-player,.mx-listen-btn,.mx-index{display:none !important}.mx-agrid{display:block}}
@media(max-width:600px){.mx-text table{font-size:13.5px}.mx-text th,.mx-text td{padding:9px 6px;overflow-wrap:break-word;hyphens:auto}}

/* ── Luniat Engineering: kod, rutor, diagram och teknisk faktaruta ──
   Kodblocken är mörka (Shiki, temat vitesse-dark, färgat vid bygget) och
   bryter ut lite utanför textspalten på breda skärmar. */
.mx main{--mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--code-bg:#16140F;--code-line:rgba(255,255,255,.08)}
.mx-text :not(pre)>code{padding:.1em .35em;border-radius:4px;background:var(--tint);font-family:var(--mono);font-size:.82em;color:var(--ink)}
.mx-text h2 code,.mx-text h3 code{font-size:.8em}
.mx-code{position:relative;margin:1.6em 0 1.8em;border-radius:10px;background:var(--code-bg);overflow:hidden}
@media(min-width:1101px){.mx-engineering .mx-code{margin-left:-28px;margin-right:-28px}}
.mx-code figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:0 10px 0 18px;border-bottom:1px solid var(--code-line);font:500 12.5px var(--mono);color:rgba(255,255,255,.62)}
.mx-code pre.shiki{margin:0;padding:18px 20px 20px;background:transparent !important;overflow-x:auto;font:400 13.5px/1.65 var(--mono);tab-size:2;-webkit-text-size-adjust:100%}
.mx-code pre.shiki code{font:inherit}
.mx-code-copy{flex:none;padding:5px 10px;border:1px solid var(--code-line);border-radius:6px;background:transparent;font:500 12px var(--sans);color:rgba(255,255,255,.75);cursor:pointer;transition:background .2s,color .2s}
.mx-code-copy:hover{background:rgba(255,255,255,.08);color:#fff}
.mx-code:not(:has(figcaption)) .mx-code-copy{position:absolute;top:8px;right:8px}
.mx-callout{margin:1.6em 0;padding:18px 22px 20px;border:1px solid var(--rule);border-left:3px solid var(--accent);border-radius:2px 6px 6px 2px;background:#fff;font-size:.9em}
.mx-callout>*+*{margin-top:.6em}
.mx-callout-label{font-family:var(--sans);font-size:12px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--accent)}
.mx-callout.is-warning{border-left-color:#9E2B25}.mx-callout.is-warning .mx-callout-label{color:#9E2B25}
.mx-callout.is-production{border-left-color:var(--ink)}.mx-callout.is-production .mx-callout-label{color:var(--ink)}
.mx-spec{display:flex;flex-wrap:wrap;gap:14px 36px;margin-top:26px;padding-top:20px;border-top:1px solid var(--rule-2);font-family:var(--sans)}
.mx-spec dt{font-size:11.5px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.mx-spec dd{margin:4px 0 0;font-size:14px;color:var(--ink)}
.mx-engineering .mx-text table{font-size:14px}
.mx-engineering .mx-text td code{white-space:nowrap}
@media(max-width:600px){.mx-code{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);border-radius:0}.mx-code pre.shiki{font-size:12.5px;padding:16px 20px}}
@media(max-width:600px){.mx-engineering .mx-text table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}.mx-engineering .mx-text td code{white-space:normal;overflow-wrap:anywhere}}
.mx-spec dd a,.mx-hstats a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--rule);text-underline-offset:3px}
.mx-spec dd a:hover,.mx-hstats a:hover{text-decoration-color:var(--ink)}

/* ── Våga hela vägen: varmare, lättare att skumma ─────────────────────
   Inledningen får en anfang. "Känner du igen dig?" är en checklista,
   "Om du bara läser en sak" ett stort citat, "Gör det här på måndag"
   tre numrerade steg, och Före/Efter står sida vid sida. */
.mx-courage .mx-text>p:first-child::first-letter{float:left;margin:.08em .1em 0 0;font-family:var(--serif);font-size:3.6em;line-height:.82;font-weight:500;color:var(--accent)}
.mx-callout.is-recognise{border:0;border-radius:10px;background:var(--tint);padding:22px 26px 24px}
.mx-callout.is-recognise ul{list-style:none;padding:0;margin-top:.4em}
.mx-callout.is-recognise li{position:relative;padding-left:34px}
.mx-callout.is-recognise li::before{content:"";position:absolute;left:2px;top:.32em;width:16px;height:16px;border:1.5px solid var(--accent);border-radius:4px;background:#fff}
.mx-callout.is-recognise li+li{margin-top:.5em}
.mx-callout.is-onething{margin:2em 0;padding:6px 0 6px 26px;border:0;border-left:3px solid var(--accent);border-radius:0;background:none;font-size:1em}
.mx-callout.is-onething p:not(.mx-callout-label){font-family:var(--serif);font-size:clamp(22px,2.2vw,27px);line-height:1.35;font-style:italic;color:var(--ink)}
.mx-callout.is-monday{border:1px solid var(--ink);border-left-width:1px;border-radius:12px;padding:22px 26px 24px;background:#fff}
.mx-callout.is-monday .mx-callout-label{color:var(--ink)}
.mx-callout.is-monday ol{list-style:none;counter-reset:mon;padding:0;margin-top:.6em}
.mx-callout.is-monday li{position:relative;padding-left:44px;counter-increment:mon;min-height:30px}
.mx-callout.is-monday li::before{content:counter(mon);position:absolute;left:0;top:.05em;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--accent);color:#fff;font:600 14px var(--sans)}
.mx-callout.is-monday li+li{margin-top:.75em}
.mx-ba{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:1.6em 0}
.mx-ba .mx-callout{margin:0;font-size:.88em;border-radius:10px}
.mx-callout.is-before{border:1px dashed var(--rule);border-left:1px dashed var(--rule);background:#fff}
.mx-callout.is-before .mx-callout-label{color:var(--muted)}
.mx-callout.is-after{border:1px solid var(--accent);border-left:1px solid var(--accent);background:#fff}
@media(max-width:700px){.mx-ba{grid-template-columns:1fr}}
.mx-courage-hub .mx-sechead h2 a,.mx-section .mx-sechead h2 a{color:inherit;text-decoration:none}