/* Arctonia: /about, Arken i snit. Arken bygges på papir som en
   konstruktionstegning, mens man scroller; om natten tændes lyset i vinduerne.
   Mekanikken er portfolioens: scenen står fast, mens sektionen scroller, og
   teksten, skiltene og skinnen flyttes af løkken i Arken.tsx.

   Bygger på arctonia-ramme.css (tokens, .ar-cta) og arctonia-side.css
   (.ar-num, .ar-lab, .ar-bred, .ar-tekstknap, .ar-pil). Præfiks ar-om-. */

.ar-om{--ar-om-kant:clamp(20px, 4vw, 64px);--ar-om-is:#9fe4f2;--ar-om-lys:#ffb15c;--ar-om-glo:#e8611c;
  --ar-om-ease:cubic-bezier(.16,1,.3,1);color:var(--ar-ink)}

/* ── arken ─────────────────────────────────────────────────────────── */
.ar-om-arken{position:relative}
.ar-om-scene{position:sticky;top:0;height:100vh;height:100svh;min-height:560px;overflow:hidden;isolation:isolate}
.ar-om-reserve{position:absolute;inset:0;
  background:radial-gradient(60% 60% at 55% 45%, #fdfbf7, transparent 72%),
             linear-gradient(180deg, #e9e3d7 0%, #f1ece2 55%, #f4efe5 100%)}
.ar-om-laerred{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;transition:opacity 1.1s ease}
.ar-om-scene[data-klar] .ar-om-laerred{opacity:1}
.ar-om-hero,.ar-om-kapitel,.ar-om-etiket{will-change:transform, opacity}
.ar-om :is(.ar-om-etiket,.ar-om-skinne)[data-skjult]{visibility:hidden}
.ar-om-blocknum{display:flex;gap:calc(16*var(--ar-u));align-items:baseline}

/* the hero */
.ar-om-hero{position:absolute;inset:0;z-index:2;display:grid;grid-template-rows:auto 1fr auto;
  padding:clamp(128px, 20vh, 210px) var(--ar-om-kant) clamp(28px, 6vh, 64px);pointer-events:none}
.ar-om-hero a,.ar-om-hero button{pointer-events:auto}
.ar-om-hero-titel{font-family:var(--ar-display);font-weight:400;letter-spacing:-.04em;color:#080b0e;
  font-size:clamp(3rem, 6.2vw, 6.4rem);line-height:.95;max-width:5.6em;margin-top:clamp(16px, 2.4vh, 26px)}
.ar-om-hero-bund{grid-row:3;display:flex;flex-direction:column;gap:24px;max-width:460px}
.ar-om-hero-tekst{font-size:clamp(15px, 1.15vw, 17px);line-height:1.6;color:#4a4f55}
.ar-om-knapper{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.ar-om-knapper .ar-cta{height:52px;padding:0 32px;font-size:12px}
.ar-om-scroll{position:absolute;left:50%;bottom:clamp(26px, 5vh, 54px);display:flex;align-items:center;gap:12px;
  transform:translateX(-50%);background:none;border:0;cursor:pointer;padding:8px 0;
  font:400 11px/1 var(--ar-sans);letter-spacing:.19em;text-transform:uppercase;color:#595f66}
.ar-om-scroll-linje{position:relative;width:1px;height:34px;overflow:hidden;background:rgba(13,17,23,.15)}
.ar-om-scroll-linje::after{content:'';position:absolute;inset:0;background:#0d1117;transform:translateY(-100%);
  animation:ar-om-scroll 2.2s cubic-bezier(.65,0,.35,1) infinite}
@keyframes ar-om-scroll{0%{transform:translateY(-100%)}55%{transform:translateY(0)}100%{transform:translateY(100%)}}
.ar-om-ind{opacity:0;transform:translateY(14px);animation:ar-om-ind .9s var(--ar-om-ease) forwards}
@keyframes ar-om-ind{to{opacity:1;transform:none}}
.ar-om-maske{display:inline-block;overflow:hidden;vertical-align:top;padding-bottom:.08em}
.ar-om-maske-ind{display:inline-block;transform:translateY(105%);animation:ar-om-maske 1.1s var(--ar-om-ease) forwards}
@keyframes ar-om-maske{to{transform:none}}

/* the drawing's title block, bottom right of the hero */
.ar-om-hoved{position:absolute;right:var(--ar-om-kant);bottom:clamp(28px, 6vh, 64px);display:grid;
  border:1px solid rgba(13,17,23,.45);background:rgba(250,248,243,.7);min-width:250px}
.ar-om-hoved div{display:grid;grid-template-columns:88px 1fr;border-top:1px solid rgba(13,17,23,.25)}
.ar-om-hoved div:first-child{border-top:0}
.ar-om-hoved dt{padding:7px 10px;border-right:1px solid rgba(13,17,23,.25);
  font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:#5a6067}
.ar-om-hoved dd{margin:0;padding:7px 12px;font:400 13px/1.25 var(--ar-serif);color:#0d1117}

/* the chapters */
.ar-om-kapitel{position:absolute;top:0;bottom:0;z-index:2;display:flex;flex-direction:column;justify-content:center;
  width:min(460px, 36vw);pointer-events:none}
.ar-om-kapitel[data-side='venstre']{left:var(--ar-om-kant)}
.ar-om-kapitel[data-side='hoejre']{right:var(--ar-om-kant)}
.ar-om-kapitel-kort{display:flex;flex-direction:column;gap:16px}
.ar-om-kapitel-titel{font-family:var(--ar-display);font-weight:400;letter-spacing:-.032em;color:#080b0e;
  font-size:clamp(2rem, 3.3vw, 3.2rem);line-height:1.03;text-wrap:balance}
.ar-om-kapitel-tekst{font-size:clamp(15px, 1.1vw, 17px);line-height:1.6;color:#4a4f55;max-width:38ch;text-wrap:pretty}
.ar-om-punkter{display:grid;gap:14px;margin-top:6px;padding-top:16px;border-top:1px solid rgba(13,17,23,.14)}
.ar-om-punkter li{display:grid;grid-template-columns:34px 1fr;gap:6px;font-size:clamp(14px, 1vw, 15.5px);line-height:1.55;color:#2c3238}
.ar-om-link{align-self:flex-start;color:#141b22;border-bottom:1px solid rgba(13,17,23,.3);min-height:36px;margin-top:4px}
.ar-om-kapitel[data-kort] .ar-om-kapitel-kort{padding:clamp(24px, 2.2vw, 34px);
  background:rgba(252,251,248,.95);border:1px solid rgba(13,17,23,.16);box-shadow:0 18px 44px rgba(10,14,24,.28)}

/* the lit windows: the systems that run today */
.ar-om-cases{display:grid;margin-top:4px;border-top:1px solid rgba(13,17,23,.14)}
.ar-om-cases li{display:grid;grid-template-columns:14px 1fr auto;align-items:center;gap:12px;padding:12px 0;
  border-bottom:1px solid rgba(13,17,23,.1)}
.ar-om-lys{width:10px;height:12px;border-radius:1px;background:var(--ar-om-lys);box-shadow:0 0 0 3px rgba(255,177,92,.22), 0 0 14px rgba(255,177,92,.8)}
.ar-om-case-tekst{display:flex;flex-direction:column;gap:3px;min-width:0}
.ar-om-case-tekst b{font:400 16px/1.2 var(--ar-display);letter-spacing:-.01em;color:#0d1117}
.ar-om-case-tekst small{font-size:12.5px;color:#5a6067}
.ar-om-status{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:#5a6067;white-space:nowrap}
.ar-om-status[data-drift]{color:#1d6b3e}
.ar-om-status[data-drift]::before{content:'';display:inline-block;width:6px;height:6px;margin-right:6px;border-radius:50%;
  background:#2fa36b;vertical-align:1px}

/* signs that ride on the ark */
.ar-om-etiket{position:absolute;left:0;top:0;z-index:3;height:0;width:0}
.ar-om-etiket-indhold{position:absolute;left:0;top:0;display:flex;align-items:center;width:max-content;transform:translateY(-50%)}
.ar-om-etiket[data-vend] .ar-om-etiket-indhold{left:auto;right:0;flex-direction:row-reverse}
.ar-om-etiket-prik{width:9px;height:9px;margin-left:-4.5px;flex:none;border-radius:50%;background:var(--ar-om-glo);
  box-shadow:0 0 0 4px rgba(232,97,28,.25)}
.ar-om-etiket[data-navn='ai'] .ar-om-etiket-prik{background:#3fb6cf;box-shadow:0 0 0 4px rgba(63,182,207,.28)}
.ar-om-etiket[data-vend] .ar-om-etiket-prik{margin-left:0;margin-right:-4.5px}
.ar-om-etiket-streg{width:clamp(22px, 2.6vw, 40px);height:1px;flex:none;background:rgba(13,17,23,.45)}
.ar-om-etiket-tekst{display:flex;flex-direction:column;gap:3px;padding:9px 14px 10px;white-space:nowrap;
  background:rgba(252,251,248,.95);border:1px solid rgba(13,17,23,.16);box-shadow:0 10px 26px rgba(40,40,30,.12)}
.ar-om-etiket-tekst b{font-family:var(--ar-display);font-weight:400;font-size:15px;letter-spacing:-.01em;color:#0d1117}
.ar-om-etiket-tekst small{font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;color:#5a6067}

/* the rail */
.ar-om-skinne{position:absolute;left:50%;bottom:clamp(18px, 3.4vh, 34px);z-index:4;display:flex;align-items:center;gap:16px;
  padding:9px 12px 9px 18px;transform:translateX(-50%);
  background:rgba(252,251,248,.95);border:1px solid rgba(13,17,23,.16);box-shadow:0 10px 28px rgba(40,40,30,.12)}
.ar-om-skinne-tekst{display:flex;align-items:baseline;gap:12px;min-width:170px;white-space:nowrap;
  font-family:var(--ar-serif);font-size:13px;color:#5a6067;font-variant-numeric:tabular-nums}
.ar-om-skinne-tekst b{font:400 11px/1 var(--ar-sans);letter-spacing:.19em;text-transform:uppercase;color:#0d1117}
.ar-om-skinne ol{display:flex;align-items:center;gap:4px}
.ar-om-skinne button{display:grid;place-items:center;width:24px;height:24px;background:none;border:0;padding:0;cursor:pointer}
.ar-om-skinne-prik{width:6px;height:6px;border-radius:50%;background:rgba(13,17,23,.22);
  transition:background-color .4s ease,transform .5s var(--ar-om-ease),box-shadow .4s ease}
.ar-om-skinne button:hover .ar-om-skinne-prik{background:rgba(13,17,23,.5)}
.ar-om-skinne li[data-forbi] .ar-om-skinne-prik{background:#0d1117}
.ar-om-skinne li[data-aktiv] .ar-om-skinne-prik{background:var(--ar-om-glo);transform:scale(1.5);box-shadow:0 0 0 3px rgba(232,97,28,.3)}

/* at night the type on the sky turns light */
.ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-titel{color:#eef3f7}
.ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-tekst{color:#b8c6d2}

/* ── grundlæggeren ─────────────────────────────────────────────────── */
.ar-om-gl{position:relative;padding:calc(150*var(--ar-u)) calc(64*var(--ar-u)) calc(130*var(--ar-u));
  background:linear-gradient(180deg, #f4efe5 0%, #efe9de 100%);border-top:1px solid rgba(13,17,23,.08)}
.ar-om-gl::before{content:'';position:absolute;inset:0;pointer-events:none;
  background-image:var(--ar-grain, none);background-size:220px 220px;opacity:.45;mix-blend-mode:multiply}
.ar-om-gl > *{position:relative}
.ar-om-gl-gitter{display:grid;grid-template-columns:minmax(240px, 380px) 1fr;gap:calc(96*var(--ar-u));align-items:start}
.ar-om-gl-ramme{padding:12px;border:1px solid rgba(13,17,23,.28);background:#f7f3ea}
.ar-om-portraet{display:block;width:100%;height:auto;aspect-ratio:4/5;background:#f7f3ea}
.ar-om-gl-figur figcaption{display:flex;flex-direction:column;gap:6px;margin-top:16px}
.ar-om-gl-figur figcaption b{font:400 19px/1.2 var(--ar-serif);color:#0d1117}
.ar-om-gl-figur figcaption span{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:#5a6067}
.ar-om-gl-tekst{display:flex;flex-direction:column;gap:28px;padding-top:8px}
.ar-om-gl-titel{font-family:var(--ar-serif);font-weight:400;letter-spacing:-.01em;color:#0d1117;
  font-size:clamp(2rem, 3.4vw, 3.4rem);line-height:1.12;max-width:17em;text-wrap:balance}
.ar-om-gl-udkast{display:flex;flex-direction:column;gap:8px;max-width:46ch;padding:18px 20px;
  border:1px dashed rgba(13,17,23,.4);font-size:15px;line-height:1.55;color:#4a4f55}
.ar-om-gl-udkast span{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:#a24a14}
.ar-om-fakta{display:grid;grid-template-columns:repeat(5, 1fr);gap:calc(28*var(--ar-u));margin-top:calc(110*var(--ar-u))}
.ar-om-fakta > div{display:flex;flex-direction:column;gap:12px;padding-top:16px;border-top:1px solid rgba(13,17,23,.22)}
.ar-om-fakta dt{display:flex;flex-direction:column;gap:6px}
.ar-om-fakta-tal{font:400 clamp(1.6rem, 2.2vw, 2.2rem)/1 var(--ar-serif);color:#0d1117}
.ar-om-fakta dd{margin:0;font-size:14px;line-height:1.5;color:#4a4f55}

/* ── phone ─────────────────────────────────────────────────────────── */
@media (max-width:900px){
  .ar-om-hero{padding:104px 16px 16px}
  .ar-om-hero-titel{font-size:clamp(2.8rem, 13vw, 4.4rem)}
  .ar-om-hero-bund{max-width:none;padding:20px;gap:18px;
    background:rgba(252,251,248,.95);border:1px solid rgba(13,17,23,.16);box-shadow:0 14px 34px rgba(40,40,30,.12)}
  .ar-om-hero-tekst{font-size:15px;line-height:1.55}
  .ar-om-knapper{gap:20px}
  .ar-om-knapper .ar-cta{height:48px;padding:0 24px}
  .ar-om-scroll,.ar-om-hoved{display:none}
  .ar-om-kapitel,.ar-om-kapitel[data-side]{top:auto;bottom:16px;left:16px;right:16px;width:auto;padding:22px;
    background:rgba(252,251,248,.96);border:1px solid rgba(13,17,23,.16);box-shadow:0 14px 34px rgba(10,14,24,.18)}
  .ar-om-kapitel-titel{font-size:clamp(1.6rem, 7vw, 2.2rem)}
  .ar-om-kapitel-tekst{font-size:15px}
  .ar-om-kapitel[data-kort] .ar-om-kapitel-kort{padding:0;background:none;border:0;box-shadow:none}
  .ar-om-kapitel-kort{gap:12px}
  .ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-titel{color:#080b0e}
  .ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-tekst{color:#4a4f55}
  .ar-om-cases li{padding:9px 0}
  .ar-om-etiket-streg{display:none}
  .ar-om-etiket-tekst{margin-left:8px;padding:6px 10px 7px}
  .ar-om-etiket-tekst b{font-size:13.5px}
  .ar-om-etiket-tekst small{display:none}
  .ar-om-skinne{display:none}

  .ar-om-gl{padding:calc(84*var(--ar-u)) calc(20*var(--ar-u)) calc(80*var(--ar-u))}
  .ar-om-gl-gitter{grid-template-columns:1fr;gap:32px}
  .ar-om-gl-figur{max-width:300px}
  .ar-om-gl-titel{font-size:calc(30*var(--ar-u))}
  .ar-om-fakta{grid-template-columns:1fr 1fr;gap:22px 16px;margin-top:56px}
}
@media (prefers-reduced-motion:reduce){
  .ar-om-ind,.ar-om-maske-ind,.ar-om-scroll-linje::after{animation:none;opacity:1;transform:none}
}

/* ── the loading screen: laying the keel ──────────────────────────────
   Arctonia: a ship starts with its keel, and so does the page. The ark stands
   as a faint construction drawing seen from the side while the keel is laid
   along its bottom with the real loading; the rib stations light as it
   passes, and the measure counts the keel's length. Then the whole drawing
   glides onto the real keel in the hero and fades into it (Indlaesning.tsx). */
.ar-om-laes{position:fixed;inset:0;z-index:210;pointer-events:auto}
.ar-om-laes-grund{position:absolute;inset:0;transition:opacity .75s ease;
  background:radial-gradient(60% 60% at 55% 45%, #fdfbf7, transparent 72%),
             linear-gradient(180deg, #e9e3d7 0%, #f1ece2 55%, #f4efe5 100%)}
.ar-om-laes[data-aabner] .ar-om-laes-grund{opacity:0}
.ar-om-laes-tegning{position:absolute;inset:0;width:100%;height:100%;overflow:visible;--tegnet:0;transition:opacity .7s ease}
.ar-om-laes[data-aabner] .ar-om-laes-tegning{opacity:0}
.ar-om-laes[data-hurtig] :is(.ar-om-laes-grund,.ar-om-laes-tegning){transition-duration:.4s}
.ar-om-laes-tegning .profil{fill:none;stroke:#2b3a4a;stroke-width:1;stroke-dasharray:6 4;vector-effect:non-scaling-stroke;
  opacity:calc(var(--tegnet) * .55)}
.ar-om-laes-tegning .maallinje{fill:none;stroke:#2b3a4a;stroke-opacity:.45;stroke-width:1;vector-effect:non-scaling-stroke;opacity:var(--tegnet)}
.ar-om-laes-tegning .station{stroke:#2b3a4a;stroke-opacity:.18;stroke-width:1.4;vector-effect:non-scaling-stroke;transition:stroke-opacity .35s ease}
.ar-om-laes-tegning .station.lagt{stroke-opacity:.85}
.ar-om-laes-tegning .koel-skygge{stroke:#2b2721;stroke-opacity:.9;stroke-width:11.5;stroke-linecap:square}
.ar-om-laes-tegning .koel{stroke:#e9dfcf;stroke-width:8.5;stroke-linecap:square}
.ar-om-laes-tegning .koel-hoved{fill:#e8611c;filter:drop-shadow(0 0 6px rgba(232,97,28,.8));transition:opacity .3s ease}
.ar-om-laes-tekst{position:absolute;left:50%;bottom:clamp(40px, 9vh, 96px);transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:12px;width:max-content;max-width:calc(100vw - 32px);text-align:center;
  transition:opacity .45s ease, transform .6s cubic-bezier(.16,1,.3,1)}
.ar-om-laes[data-lander] .ar-om-laes-tekst{opacity:0;transform:translate(-50%, 10px)}
.ar-om-laes-hoved{display:flex;gap:14px;align-items:baseline}
.ar-om-laes-titel{margin:0;font:400 clamp(1.4rem, 2.2vw, 2rem)/1.1 var(--ar-display);letter-spacing:-.02em;color:#0d1117}
.ar-om-laes-maal{display:flex;gap:14px;align-items:baseline;margin:0;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:#5a6067}
.ar-om-laes-maal b{font:400 15px/1 var(--ar-serif);letter-spacing:.02em;text-transform:none;color:#0d1117;font-variant-numeric:tabular-nums;min-width:4.4em;text-align:left}
html[data-tema="nat"] .ar-om-laes-grund{background:radial-gradient(60% 60% at 55% 45%, #13213a, transparent 72%), linear-gradient(180deg, #0b1428 0%, #070d18 100%)}
html[data-tema="nat"] .ar-om-laes-tegning :is(.profil,.maallinje,.station){stroke:#7fc8da}
html[data-tema="nat"] .ar-om-laes-tegning .koel-skygge{stroke:#0a1220}
html[data-tema="nat"] :is(.ar-om-laes-titel,.ar-om-laes-maal b){color:#eef3f7}
html[data-tema="nat"] .ar-om-laes-maal{color:#9fb2c3}

/* ── night mode ("blåtryk") ───────────────────────────────────────────
   Arctonia: at night the ark is drawn under the stars from the first sheet
   (motor.ts holds the scene near night), so the type over it turns light,
   the cards and signs become night glass, and the founder's sheet and its
   engraving become a blueprint. */
html[data-tema="nat"] .ar-om-reserve{background:radial-gradient(60% 60% at 55% 45%, #13213a, transparent 72%), linear-gradient(180deg, #0b1428 0%, #070d18 100%)}
html[data-tema="nat"] :is(.ar-om-hero-titel,.ar-om-kapitel-titel){color:#eef3f7}
html[data-tema="nat"] :is(.ar-om-hero-tekst,.ar-om-kapitel-tekst){color:#b8c6d2}
html[data-tema="nat"] .ar-om-punkter{border-top-color:rgba(159,228,242,.18)}
html[data-tema="nat"] .ar-om-punkter li{color:#cfdbe4}
html[data-tema="nat"] .ar-om-scroll{color:#9fb2c3}
html[data-tema="nat"] .ar-om-scroll-linje{background:rgba(159,228,242,.2)}
html[data-tema="nat"] .ar-om-scroll-linje::after{background:#9fe4f2}
html[data-tema="nat"] .ar-om-hoved{border-color:rgba(159,228,242,.4);background:rgba(10,18,32,.7)}
html[data-tema="nat"] .ar-om-hoved div{border-top-color:rgba(159,228,242,.22)}
html[data-tema="nat"] .ar-om-hoved dt{border-right-color:rgba(159,228,242,.22);color:#8ea2b4}
html[data-tema="nat"] .ar-om-hoved dd{color:#e6edf3}
html[data-tema="nat"] .ar-om-link{color:#e3eaf0;border-bottom-color:rgba(227,234,240,.3)}
html[data-tema="nat"] :is(.ar-om-kapitel[data-kort] .ar-om-kapitel-kort,.ar-om-etiket-tekst,.ar-om-skinne){
  background:rgba(12,22,38,.9);border-color:rgba(159,228,242,.22);box-shadow:0 16px 40px rgba(0,0,0,.4)}
html[data-tema="nat"] :is(.ar-om-etiket-tekst b,.ar-om-case-tekst b,.ar-om-skinne-tekst b){color:#eef3f7}
html[data-tema="nat"] :is(.ar-om-etiket-tekst small,.ar-om-case-tekst small,.ar-om-status,.ar-om-skinne-tekst){color:#9fb2c3}
html[data-tema="nat"] .ar-om-etiket-streg{background:rgba(159,228,242,.45)}
html[data-tema="nat"] .ar-om-cases,html[data-tema="nat"] .ar-om-cases li{border-color:rgba(159,228,242,.16)}
html[data-tema="nat"] .ar-om-status[data-drift]{color:#7fd3a4}
html[data-tema="nat"] .ar-om-skinne-prik{background:rgba(159,228,242,.25)}
html[data-tema="nat"] .ar-om-skinne li[data-forbi] .ar-om-skinne-prik{background:#dfe8ef}
html[data-tema="nat"] .ar-om-gl{background:linear-gradient(180deg, #0b1428 0%, #08101d 100%);border-top-color:rgba(159,228,242,.12)}
html[data-tema="nat"] .ar-om-gl::before{opacity:.1}
html[data-tema="nat"] .ar-om-gl-ramme{border-color:rgba(159,228,242,.3);background:#0c1626}
html[data-tema="nat"] .ar-om-portraet{background:transparent;filter:invert(1) hue-rotate(180deg) brightness(.92)}
html[data-tema="nat"] :is(.ar-om-gl-figur figcaption b,.ar-om-gl-titel,.ar-om-fakta-tal){color:#eef3f7}
html[data-tema="nat"] :is(.ar-om-gl-figur figcaption span,.ar-om-fakta dd){color:#9fb2c3}
html[data-tema="nat"] .ar-om-gl-udkast{border-color:rgba(159,228,242,.35);color:#b8c6d2}
html[data-tema="nat"] .ar-om-fakta > div{border-top-color:rgba(159,228,242,.22)}
@media (max-width:900px){
  html[data-tema="nat"] .ar-om-hero-bund,html[data-tema="nat"] :is(.ar-om-kapitel,.ar-om-kapitel[data-side]){
    background:rgba(12,22,38,.92);border-color:rgba(159,228,242,.2);box-shadow:0 14px 34px rgba(0,0,0,.4)}
  html[data-tema="nat"] .ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-titel{color:#eef3f7}
  html[data-tema="nat"] .ar-om-arken[data-nat] .ar-om-kapitel:not([data-kort]) .ar-om-kapitel-tekst{color:#b8c6d2}
}