/* Religioner og livssyn. Eget uttrykk, samme struktur som KRLE-håndboka. */
@font-face{font-family:"Hanken";src:url(hanken.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken";src:url(hanken-i.woff2) format("woff2");font-weight:100 900;font-style:italic;font-display:swap}
@font-face{font-family:"Newsreader";src:url(newsreader-i.woff2) format("woff2");font-weight:200 800;font-style:italic;font-display:swap}

:root{
  --grunn:#ECEDF1; --flate:#FFFFFF; --blekk:#14161D; --dempet:#5A5F6B; --strek:#DCDEE4;
  --kap:#4B2E83; --kap-lys:#EFEAF8; --kap-mid:#8C74BF; --to:#2F6B48; --to-lys:#E7F1EA;
  --sans:"Hanken",system-ui,-apple-system,"Segoe UI",sans-serif; --serif:"Newsreader",Georgia,serif;
  --topp:3.25rem; --r:6px;
  font-size:clamp(15px,14.2px + .18vw,17px);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:var(--sans);color:var(--blekk);background:var(--grunn);line-height:1.6;-webkit-font-smoothing:antialiased}
a{color:var(--kap)}
:focus-visible{outline:3px solid var(--kap-mid);outline-offset:2px;border-radius:3px}
.skjult{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.hopp{position:absolute;left:-999px;top:0;background:var(--blekk);color:#fff;padding:.5rem 1rem;z-index:50}
.hopp:focus{left:1rem}
@media (prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}}

/* Toppstripe */
.topp{position:sticky;top:0;z-index:30;height:var(--topp);display:flex;align-items:center;gap:1rem;padding:0 1.25rem;background:var(--blekk);color:#fff}
.topp a{color:#fff;text-decoration:none}
.merke{white-space:nowrap;font-weight:800;letter-spacing:-.01em;font-size:1rem;display:flex;align-items:center;gap:.6rem}
.merke i{width:1rem;height:1rem;border-radius:50%;border:2px solid #fff;background:conic-gradient(#22466F 0 16.67%,#1F6E91 0 33.33%,#227A72 0 50.00%,#3F7550 0 66.67%,#345C99 0 83.33%,#4B4789 0)}
.topp .hvor{color:#b9bcc8;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topp nav{margin-left:auto;display:flex;gap:.25rem}
.topp nav a{font-size:.88rem;font-weight:600;padding:.35rem .7rem;border-radius:999px}
.topp nav a:hover,.topp nav a[aria-current]{background:rgba(255,255,255,.12)}
.fremdrift{position:absolute;left:0;bottom:0;height:3px;width:0;background:var(--kap-mid)}

/* Leser: tre kolonner på store skjermer */
.leser{display:grid;grid-template-columns:minmax(15rem,18rem) minmax(0,1fr) minmax(16rem,19rem);gap:0;max-width:96rem;margin:0 auto;height:calc(100dvh - var(--topp))}
.rail,.notat{overflow-y:auto;padding:2rem 1.5rem}
.tekstrute{overflow-y:auto;background:var(--flate);border-left:1px solid var(--strek);border-right:1px solid var(--strek);scroll-behavior:smooth;overscroll-behavior:contain}
.tekst{max-width:42rem;margin:0 auto;padding:3rem clamp(1.25rem,4vw,3.5rem) 4rem}

/* Venstre: delene som en tidslinje */
.rail .kap-merke{font-size:.8rem;font-weight:700;color:var(--kap);margin:0 0 .35rem}
.rail h1{font-size:2.4rem;line-height:1;letter-spacing:-.03em;margin:0 0 .6rem}
.rail .under{color:var(--dempet);font-size:.92rem;margin:0 0 2rem;line-height:1.4}
.deler{list-style:none;margin:0;padding:0;position:relative}
.deler::before{content:"";position:absolute;left:.62rem;top:.6rem;bottom:.6rem;width:2px;background:var(--strek)}
.deler li{position:relative}
.deler a{display:grid;grid-template-columns:1.25rem 1fr;gap:.75rem;align-items:start;padding:.45rem 0;text-decoration:none;color:var(--dempet);font-size:.93rem;line-height:1.35}
.deler a span.p{width:1.25rem;height:1.25rem;border-radius:50%;background:var(--grunn);border:2px solid var(--strek);position:relative;z-index:1;margin-top:.05rem}
.deler a:hover{color:var(--blekk)}
.deler a.lest span.p{background:var(--kap-mid);border-color:var(--kap-mid)}
.deler a[aria-current="true"]{color:var(--blekk);font-weight:700}
.deler a[aria-current="true"] span.p{background:var(--kap);border-color:var(--kap);box-shadow:0 0 0 4px var(--kap-lys)}
.deler li.arb a span.p{border-radius:4px}
.rail .verkt{margin-top:2rem;padding-top:1rem;border-top:1px solid var(--strek);display:flex;flex-direction:column;gap:.35rem;font-size:.9rem}
.rail .verkt a{text-decoration:none;font-weight:600}

/* Høyre: notater for delen du leser */
.notat .etikett{font-size:.8rem;font-weight:700;color:var(--dempet);margin:0 0 .75rem}
.notat .del-side{display:block}
.del-side{border-top:3px solid var(--kap);padding-top:1rem}
.side-kort b{display:block;font-size:.8rem;font-weight:700;color:var(--kap);margin-bottom:.4rem}
.side-kort ul{margin:0 0 1rem;padding:0;list-style:none}
.side-kort li{font-size:.95rem;line-height:1.45;padding:.45rem 0;border-bottom:1px solid var(--strek)}
.side-meta{font-size:.82rem;color:var(--dempet);margin:.25rem 0 1rem}
.side-ord b{display:block;font-size:.8rem;font-weight:700;color:var(--dempet);margin-bottom:.5rem}
.side-ord div{display:flex;flex-wrap:wrap;gap:.35rem}
.side-ord .ord{border:1px solid var(--strek);background:var(--flate);border-radius:999px;padding:.25rem .65rem;font-size:.85rem;text-decoration:none}
.notat .tom{color:var(--dempet);font-size:.9rem}

/* Kapittelåpning */
.aapning{margin-bottom:3rem}
.aapning .stor{font-family:var(--serif);font-style:italic;font-size:1.65rem;line-height:1.3;color:var(--kap);margin:0 0 1.75rem;font-weight:400}
.maal{background:var(--kap-lys);border-radius:var(--r);padding:1.25rem 1.5rem}
.maal h2{font-size:1rem;margin:0 0 .6rem}
.maal ul{margin:0;padding:0;list-style:none}
.maal li{position:relative;padding:.3rem 0 .3rem 1.4rem;font-size:.97rem;line-height:1.45}
.maal li::before{content:"";position:absolute;left:0;top:.75rem;width:.55rem;height:.55rem;background:var(--kap);border-radius:2px}

/* Delene */
.del{padding-top:1rem;margin-bottom:3.5rem;scroll-margin-top:1rem}
.del-hode{display:flex;align-items:baseline;gap:1rem;border-bottom:2px solid var(--blekk);padding-bottom:.6rem;margin-bottom:1.5rem}
.del-hode .tall{font-size:3.2rem;font-weight:800;line-height:.8;color:var(--kap);letter-spacing:-.04em}
.del-hode small{display:block;font-size:.8rem;color:var(--dempet);font-weight:600}
.del-hode h2{margin:0;font-size:1.75rem;line-height:1.15;letter-spacing:-.02em}
.tekst p{margin:0 0 1.05rem;font-size:1.06rem}
.tekst h3{font-size:1.25rem;margin:2.25rem 0 .5rem;letter-spacing:-.01em;padding-top:.75rem;border-top:1px solid var(--strek)}
.tekst h4{font-size:.85rem;font-weight:800;color:var(--kap);margin:1.1rem 0 .3rem}
.tabell-ramme{overflow-x:auto}
table.sammenlign{border-collapse:collapse;width:100%;font-size:.8rem;line-height:1.4;background:var(--flate)}
table.sammenlign th,table.sammenlign td{padding:.5rem .45rem;text-align:left;vertical-align:top;border-bottom:1px solid var(--strek)}
table.sammenlign thead th{background:var(--kap);color:#fff;font-weight:700}
table.sammenlign tbody th{font-weight:700;color:var(--kap);width:6.5rem}
@media (max-width:700px){table.sammenlign{min-width:38rem}}
table.sammenlign tbody tr:nth-child(even) td,table.sammenlign tbody tr:nth-child(even) th{background:color-mix(in srgb,var(--kap) 5%,#fff)}
.tekst .del-side{display:none}
p.loft{font-family:var(--serif);font-style:italic;font-size:1.55rem;line-height:1.3;color:var(--kap);margin:2rem 0;padding-left:1.25rem;border-left:4px solid var(--kap)}
.eksempel{background:var(--to-lys);border-radius:var(--r);padding:1.1rem 1.35rem;margin:1.75rem 0}
.eksempel b{color:var(--to);font-size:.85rem;display:block;margin-bottom:.35rem}
.eksempel p{margin:0;font-size:1rem}
.tenk{border:2px dashed var(--kap-mid);border-radius:var(--r);padding:1rem 1.35rem;margin:1.75rem 0}
.tenk b{color:var(--kap);font-size:.85rem;display:block;margin-bottom:.35rem}
.tenk p{margin:0;font-size:1rem}
.videre{margin-top:1.5rem}
.knapp{display:inline-flex;align-items:center;gap:.5rem;font:inherit;font-weight:700;font-size:.92rem;padding:.6rem 1.05rem;border-radius:999px;border:2px solid var(--blekk);background:transparent;color:var(--blekk);text-decoration:none;cursor:pointer}
.knapp:hover{background:var(--blekk);color:#fff}
.knapp.fylt{background:var(--kap);border-color:var(--kap);color:#fff}
.knapp.fylt:hover{background:var(--blekk);border-color:var(--blekk)}

/* Ordknapper i teksten */
button.ord{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:help;text-decoration:underline;text-decoration-color:var(--kap-mid);text-decoration-thickness:2px;text-underline-offset:.2em}
.ordboble{position:fixed;z-index:60;max-width:20rem;background:var(--blekk);color:#fff;border-radius:var(--r);padding:.75rem .9rem;font-size:.9rem;line-height:1.45;box-shadow:0 12px 30px -10px rgba(0,0,0,.4);pointer-events:none}
.ordboble[hidden]{display:none}
.ordboble b{display:block;margin-bottom:.2rem;color:#fff;font-size:.95rem}
.ordboble b::before{content:"";display:inline-block;width:.55rem;height:.55rem;border-radius:50%;background:var(--kap-mid);margin-right:.45rem;vertical-align:.05em}
.ordboble .f{display:block}
.ordboble .e{display:block;margin-top:.45rem;padding-top:.45rem;border-top:1px solid rgba(255,255,255,.2);color:rgba(255,255,255,.82);font-size:.85rem}
.ordboble::after{content:"";position:absolute;left:var(--pil,50%);bottom:-6px;width:12px;height:12px;background:var(--blekk);transform:translateX(-50%) rotate(45deg)}
.ordboble.under::after{bottom:auto;top:-6px}

/* Figurer */
.figur{margin:2.25rem 0;border:1px solid var(--strek);border-radius:var(--r);overflow:hidden}
.figur-ramme{padding:1.1rem 1.25rem .75rem;background:#FBFBFC}
.fig-tittel{border-top:0!important;padding-top:0!important}
.fig-nr{display:block;font-size:.78rem;font-weight:800;color:var(--kap)}
.fig-tittel{margin:.1rem 0 .75rem;font-size:1.1rem}
.orig-svg{overflow-x:auto}
.orig-svg svg{display:block;width:100%;height:auto;min-width:32rem}
.figur figcaption{font-size:.88rem;color:var(--dempet);padding:.75rem 1.25rem;border-top:1px solid var(--strek);background:var(--flate)}

/* Arbeid med kapitlet */
.arbeid{border-top:2px solid var(--blekk);padding-top:1.5rem;margin-top:1rem;scroll-margin-top:1rem}
.arbeid h2{font-size:1.75rem;letter-spacing:-.02em;margin:0 0 .5rem}
.faner{display:flex;flex-wrap:wrap;gap:0 1.25rem;border-bottom:1px solid var(--strek);margin:1.25rem 0 1.25rem}
.faner button{font:inherit;font-weight:700;font-size:.93rem;background:none;border:0;border-bottom:3px solid transparent;padding:.55rem 0;color:var(--dempet);cursor:pointer}
.faner button[aria-selected="true"]{color:var(--blekk);border-color:var(--kap)}
.fanepanel h3{margin-top:0}
.ramme{font-size:.85rem;color:var(--kap);font-weight:700;margin:-.25rem 0 .75rem!important}
.fanepanel ol{padding-left:1.25rem}
.fanepanel li{margin-bottom:.4rem}
.provestein{background:var(--kap-lys);padding:.9rem 1.1rem;border-radius:var(--r)}
.sporsmal{list-style:none;padding:0;margin:0}
.sporsmal li{padding:.7rem 0;border-bottom:1px solid var(--strek)}
.sporsmal b{display:block}
.liten{font-size:.88rem;color:var(--dempet)}
.quiz-kort{border:1px solid var(--strek);border-radius:var(--r);padding:1rem 1.1rem;margin-bottom:.75rem}
.quiz-kort p{margin:0 0 .65rem!important;font-size:1rem!important}
.quiz-valg{display:flex;flex-wrap:wrap;gap:.4rem}
.quiz-valg button{font:inherit;font-size:.9rem;border:1px solid var(--strek);background:var(--flate);border-radius:999px;padding:.35rem .8rem;cursor:pointer}
.quiz-valg button.rett{background:var(--to);border-color:var(--to);color:#fff}
.quiz-valg button.feil{background:#fbe9e7;border-color:#e4b2ab}
.quiz-svar{font-size:.88rem;margin-top:.5rem;color:var(--dempet)}
.kilder{margin:3rem 0 1rem;border-top:1px solid var(--strek);padding-top:1rem}
.kilder summary{cursor:pointer;font-weight:700}
.kildeliste{padding-left:0;list-style:none;font-size:.88rem}
.kildeliste li{padding:.35rem 0 .35rem 1.5rem;text-indent:-1.5rem;word-break:break-word}
.fot{font-size:.82rem;color:var(--dempet);border-top:1px solid var(--strek);margin-top:2rem;padding-top:1rem}

/* Enkle sider: forside, ordliste, fagsamtale */
.enkel{max-width:52rem;margin:0 auto;padding:3rem 1.5rem 4rem}
.enkel h1{font-size:clamp(2.2rem,5vw,3.6rem);line-height:1;letter-spacing:-.035em;margin:0 0 .75rem}
.enkel .stor{font-family:var(--serif);font-style:italic;font-size:1.45rem;line-height:1.35;color:var(--kap);margin:0 0 2rem}
.kort-lenke{display:grid;grid-template-columns:auto 1fr;gap:1.25rem;align-items:center;background:var(--flate);border:1px solid var(--strek);border-left:6px solid var(--kap);border-radius:var(--r);padding:1.25rem 1.5rem;text-decoration:none;color:var(--blekk);margin-bottom:.75rem}
.kort-lenke .n{font-size:2.6rem;font-weight:800;color:var(--kap);line-height:1}
.kort-lenke b{font-size:1.3rem;display:block}
.kort-lenke span{color:var(--dempet)}
.kort-lenke.kommer{border-left-color:var(--strek);opacity:.6;pointer-events:none}
.sok input{font:inherit;width:100%;padding:.75rem 1rem;border:2px solid var(--strek);border-radius:var(--r);background:var(--flate)}
.filter{display:flex;flex-wrap:wrap;gap:.4rem;margin:1rem 0 1.25rem}
.filter button{font:inherit;font-weight:700;font-size:.88rem;border:1px solid var(--strek);background:var(--flate);border-radius:999px;padding:.35rem .85rem;cursor:pointer}
.filter button[aria-pressed="true"]{background:var(--blekk);border-color:var(--blekk);color:#fff}
.filter button.kap[aria-pressed="true"]{background:var(--kap);border-color:var(--kap)}
.sok{display:flex;gap:.75rem;align-items:center;flex-wrap:wrap}
.sok input{flex:1 1 17rem;width:auto}
button.begrep{font:inherit;text-align:left;color:var(--blekk);cursor:pointer;display:flex;flex-direction:column;gap:.35rem}
button.begrep:hover{border-color:var(--blekk)}
.begrep span.forkl{font-size:.93rem;line-height:1.5;color:var(--dempet)}
.chips{display:flex;gap:.25rem;flex-wrap:wrap}
.chip{font-size:.75rem;font-weight:700;border-radius:999px;padding:.1rem .55rem;background:var(--kap-lys);color:var(--kap)}
dialog.ordkort{border:0;border-radius:var(--r);padding:0;max-width:min(34rem,calc(100vw - 2rem));width:100%;box-shadow:0 24px 60px -20px rgba(0,0,0,.45);color:var(--blekk);border-top:6px solid var(--kap)}
dialog.ordkort::backdrop{background:rgba(20,22,29,.45)}
.ordkort-indre{padding:1.5rem 1.6rem 1.4rem}
.ordkort h2{margin:0 0 .25rem;font-size:1.6rem;letter-spacing:-.02em}
.ordkort .kapitler{margin:0 0 .9rem;font-size:.85rem;font-weight:700;color:var(--kap)}
.ordkort .faglig{margin:0 0 .9rem;font-size:1.02rem;line-height:1.55}
.ordkort .enkelt{margin:0 0 .9rem;background:var(--to-lys);border-radius:var(--r);padding:.75rem .9rem;font-size:.97rem}
.ordkort-knapper{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:.5rem}
.begreper{display:grid;grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.6rem;margin-top:1.25rem}
.begrep{background:var(--flate);border:1px solid var(--strek);border-radius:var(--r);padding:1rem 1.1rem}
.begrep b{display:block;font-size:1.05rem;margin-bottom:.25rem}
.begrep p{margin:0 0 .4rem;font-size:.93rem}
.begrep .enkel-f{color:var(--dempet);font-size:.88rem}
.samtale{background:var(--flate);border:1px solid var(--strek);border-radius:var(--r);padding:1.25rem}
.forslag{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:1rem}
.forslag button{font:inherit;font-size:.88rem;border:1px solid var(--strek);background:var(--grunn);border-radius:999px;padding:.35rem .8rem;cursor:pointer}
.meldinger{display:flex;flex-direction:column;gap:.6rem;margin-bottom:1rem;max-height:55vh;overflow-y:auto}
.melding{padding:.75rem 1rem;border-radius:var(--r);white-space:pre-wrap;max-width:90%}
.melding.du{align-self:flex-end;background:var(--kap);color:#fff}
.melding.svar{background:var(--grunn)}
.skriv{display:flex;gap:.5rem}
.skriv textarea{flex:1;font:inherit;padding:.65rem .8rem;border:2px solid var(--strek);border-radius:var(--r);resize:vertical}

/* Mellomstore og små skjermer: vanlig sideskroll */
@media (max-width:1100px){
  .leser{display:block;height:auto}
  .notat{display:none}
  .tekst .del-side{display:block;margin:0 0 1.5rem;background:var(--kap-lys);border-top:0;border-radius:var(--r);padding:1rem 1.1rem}
  .rail{position:sticky;top:var(--topp);z-index:20;background:var(--grunn);padding:.6rem 1rem;border-bottom:1px solid var(--strek);overflow-x:auto;overflow-y:hidden}
  .rail .kap-merke,.rail h1,.rail .under,.rail .verkt{display:none}
  .deler{display:flex;gap:.4rem;white-space:nowrap}
  .deler::before{display:none}
  .deler a{display:flex;align-items:center;gap:.45rem;padding:.3rem .7rem .3rem .35rem;border:1px solid var(--strek);border-radius:999px;background:var(--flate);font-size:.85rem}
  .deler a span.p{width:.9rem;height:.9rem}
  .tekstrute{border:0;overflow:visible}
  .tekst{padding-top:2rem}
  .aapning-tittel{display:block!important}
}
.aapning-tittel{display:none}
.aapning-tittel .kap-merke{font-size:.8rem;font-weight:700;color:var(--kap);margin:0}
.aapning-tittel h1{font-size:clamp(2.4rem,9vw,3.4rem);line-height:1;letter-spacing:-.035em;margin:.25rem 0 .75rem}
@media (max-width:600px){
  .topp .hvor{display:none}
  .topp{padding:0 .75rem;gap:.5rem}
  .topp nav a{padding:.35rem .5rem;font-size:.82rem}
  .topp nav a:first-child,.topp nav a:last-child{display:none}
  .del-hode .tall{font-size:2.4rem}
  .del-hode h2{font-size:1.45rem}
  p.loft{font-size:1.35rem}
  .orig-svg svg{min-width:30rem}
}

/* Analysemodellen og lister i brødtekst */
.tekst ul.liste{margin:0 0 1.2rem;padding-left:1.2rem}
.tekst ul.liste li{margin:.35rem 0;padding-left:.2rem}
.tekst ul.liste li::marker{color:var(--kap)}
table.analyse th[scope="row"]{color:var(--kap);white-space:nowrap}
table.analyse tfoot td{background:color-mix(in srgb,var(--kap) 8%,transparent);border-top:2px solid var(--kap);font-size:.92em}
table.analyse tfoot b{display:block;color:var(--kap);margin-bottom:.15rem}

/* Merknad om avgrensning */
.merknad{background:color-mix(in srgb,var(--kap) 7%,transparent);border-left:5px solid var(--kap);border-radius:0 var(--r) var(--r) 0;padding:1rem 1.35rem;margin:0 0 1.75rem}
.merknad b{color:var(--kap);display:block;font-size:1.02rem;margin-bottom:.35rem}
.merknad p{margin:0}

/* Navigasjon mellom kapitler */
.kapnav{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.75rem;margin:2.5rem 0 1rem;padding-top:1.5rem;border-top:1px solid var(--linje, #ddd)}

/* Kildeliste og henvisninger */
section.kilder{margin:3.5rem 0 1rem;padding-top:1.5rem;border-top:2px solid var(--kap)}
section.kilder h2{margin:0 0 .5rem}
section.kilder .kildeliste{font-size:.92rem}
.kildeliste li:target{background:color-mix(in srgb,var(--kap) 10%,transparent);border-radius:4px}
a.ref{color:inherit;text-decoration:underline dotted color-mix(in srgb,var(--kap) 60%,transparent);text-underline-offset:3px}
a.ref:hover,a.ref:focus-visible{color:var(--kap)}
@media (max-width:1100px){.kildeliste li,section.kilder,.del{scroll-margin-top:8rem}}


/* ===== Glass og lys: kapittelfarger, glassmalerier og forside ===== */
/* Fargene er inspirert av de liturgiske fargene. --kap er mørk nok til tekst. */
[data-kap="1"]{--kap:#22466F;--kap-lys:#E9ECF1;--kap-mid:#6F87A1}
[data-kap="2"]{--kap:#1C6484;--kap-lys:#E9F0F4;--kap-mid:#6DA1B8}
[data-kap="3"]{--kap:#1F6E67;--kap-lys:#E9F2F1;--kap-mid:#6FA9A3}
[data-kap="4"]{--kap:#3A6B49;--kap-lys:#ECF1EE;--kap-mid:#82A58D}
[data-kap="5"]{--kap:#345C99;--kap-lys:#EBEFF5;--kap-mid:#7B95BD}
[data-kap="6"]{--kap:#4B4789;--kap-lys:#EDEDF3;--kap-mid:#8A87B2}
:root{--bly:#1c1a22}
svg.glass{display:block;width:100%;height:auto}

/* Kapittelbanner */
.kap-glass{position:relative;margin:0 0 2.75rem;border-radius:4px;filter:drop-shadow(0 18px 28px rgba(28,26,34,.18))}
.kap-glass .kap-nr{position:absolute;left:1.5rem;bottom:-1.5rem;width:3.6rem;height:3.6rem;border-radius:50%;background:var(--kap);color:#fff;border:5px solid var(--bly);display:grid;place-items:center;font-weight:800;font-size:1.65rem;line-height:1;box-shadow:0 0 0 3px #fff}
.aapning .stor{margin-top:.5rem}
@media (min-width:1101px){.rail .kap-merke{display:flex;align-items:center;gap:.5rem}}
.rute{display:inline-block;width:.7rem;height:.7rem;background:var(--kap);transform:rotate(45deg);outline:2px solid var(--bly);outline-offset:-1px}
.rail h1{color:var(--blekk)}
.rail{background:linear-gradient(180deg,color-mix(in srgb,var(--kap) 7%,var(--grunn)) 0,var(--grunn) 22rem)}

/* Delene: nummer i en glassrute */
.del-hode{border-bottom-color:var(--kap)}
.del-hode .tall{flex:0 0 auto;width:3.1rem;height:3.1rem;display:grid;place-items:center;font-size:1.35rem;line-height:1;color:#fff;background:var(--kap);clip-path:polygon(50% 0,100% 50%,50% 100%,0 50%);align-self:center}
.tekst h3{border-top-color:color-mix(in srgb,var(--kap) 22%,var(--strek))}
p.loft{border-left-color:var(--kap-mid)}
.maal{border-left:5px solid var(--kap)}
.kildeliste li:target{background:var(--kap-lys)}

/* Forside */
.forside{max-width:80rem;margin:0 auto;padding:2.5rem clamp(1.25rem,4vw,3rem) 4rem}
.helt{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:clamp(2rem,5vw,5rem);align-items:center;min-height:min(46rem,calc(100dvh - var(--topp) - 4rem))}
.overtittel{font-weight:700;color:var(--dempet);font-size:.95rem;margin:0 0 1rem}
.helt h1{font-size:clamp(2.9rem,6.2vw,5.6rem);line-height:.93;letter-spacing:-.045em;margin:0 0 1.5rem;max-width:12ch}
.helt .stor{font-family:var(--serif);font-style:italic;font-size:clamp(1.3rem,1.1rem + .8vw,1.75rem);line-height:1.32;color:#3d3550;margin:0 0 2rem;max-width:30rem}
.helt-knapper{display:flex;flex-wrap:wrap;gap:.6rem;margin-bottom:2rem}
.helt .knapp.fylt{background:var(--bly);border-color:var(--bly)}
.helt .knapp.fylt:hover{background:#5B2A86;border-color:#5B2A86}
.farge-note{font-size:.9rem;color:var(--dempet);max-width:26rem;margin:0;padding-left:.9rem;border-left:3px solid var(--strek)}
.helt-rose{display:flex;justify-content:center}
.helt-rose svg.rose{width:100%;max-width:36rem;height:auto;filter:drop-shadow(0 30px 40px rgba(28,26,34,.22))}
.rose-felt{cursor:pointer;outline:none}
.rose-felt .rose-glass{transition:filter .25s}
.rose-felt:hover .rose-glass,.rose-felt:focus-visible .rose-glass{filter:brightness(1.18) saturate(1.15)}
.rose-felt:focus-visible .rose-glass path:last-child{stroke:#fff;stroke-width:7}
@media (prefers-reduced-motion:no-preference){
 .rose-felt .rose-glass{animation:tenn .7s ease-out both;animation-delay:calc(var(--i) * 110ms + 150ms)}
 @keyframes tenn{from{opacity:0;filter:brightness(.35)}to{opacity:1;filter:none}}
}
.kapitler{margin-top:3rem}
.kapitler h2{font-size:1.6rem;letter-spacing:-.02em;margin:0 0 1.25rem}
.kap-rutenett{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:1.1rem}
.kap-kort{grid-column:span 4}
.kap-kort:nth-child(n+4){grid-column:span 4}
.kap-kort:nth-child(n+4) .kort-tekst b{font-size:1.08rem}
@media (max-width:1100px){.kap-kort,.kap-kort:nth-child(n+4){grid-column:span 6}}
@media (max-width:640px){.kap-kort,.kap-kort:nth-child(n+4){grid-column:1/-1}}
.kap-kort{display:flex;flex-direction:column;background:var(--flate);border:1px solid var(--strek);border-radius:6px;overflow:hidden;text-decoration:none;color:var(--blekk)}
.kap-kort:hover{border-color:var(--kap)}
.kap-kort:hover b{color:var(--kap)}
.kort-glass{line-height:0}
.kort-tekst{padding:1rem 1.2rem 1.25rem;display:flex;flex-direction:column;gap:.25rem}
.kort-tekst .n{font-size:.85rem;font-weight:800;color:var(--kap)}
.kort-tekst b{font-size:1.2rem;line-height:1.2;letter-spacing:-.01em}
.kort-tekst .u{color:var(--dempet);font-size:.95rem;line-height:1.4}
.enkel-fot{max-width:52rem;margin-top:3rem}
@media (max-width:900px){
 .helt{grid-template-columns:1fr;min-height:0;gap:2rem}
 .helt-rose{order:-1}
 .helt-rose svg.rose{max-width:22rem}
 .helt h1{max-width:none}
}
@media (max-width:600px){
 .kap-glass{margin-bottom:2.25rem}
 .kap-glass .kap-nr{width:2.8rem;height:2.8rem;font-size:1.3rem;bottom:-1.2rem;left:1rem;border-width:4px}
 .del-hode .tall{width:2.6rem;height:2.6rem;font-size:1.15rem}
}
@media print{.kap-glass,.helt-rose{filter:none}}

@media (max-width:600px){.merke{font-size:0;gap:0}.merke i{width:1.25rem;height:1.25rem}}
/* nøytralt kartuttrykk for Å studere religion */
.kap-glass{border-radius:10px;overflow:visible;filter:drop-shadow(0 12px 22px rgba(34,70,111,.14))}
.kap-glass svg.kart{border-radius:10px;display:block;width:100%;height:auto}
.kap-glass .kap-nr{border:4px solid #fff;box-shadow:0 4px 12px rgba(34,70,111,.25)}
.kort-glass svg.kart{display:block;width:100%;height:auto}
.helt-rose svg.rose.hex{filter:drop-shadow(0 18px 28px rgba(34,70,111,.18))}
.rose-felt:focus-visible .rose-glass path:last-child{stroke:#111;stroke-width:6}
.merke i{border-radius:3px;transform:rotate(30deg)}
/* definisjonskort i kapittel 1 */
.def-rutenett{display:grid;grid-template-columns:repeat(auto-fill,minmax(16rem,1fr));gap:1rem;margin:1.5rem 0 2rem}
.def-kort{--d:#22466F;background:#fff;border:1px solid rgba(34,70,111,.16);border-top:5px solid var(--d);border-radius:10px;padding:1rem 1.15rem 1.1rem;display:flex;flex-direction:column}
.def-fun{--d:#227A72}.def-fam{--d:#4B4789}
.def-type{align-self:flex-start;background:var(--d);color:#fff;font-size:.78rem;font-weight:800;border-radius:999px;padding:.15rem .65rem;margin-bottom:.6rem}
.def-kort h4{margin:0 0 .5rem;font-size:1rem;line-height:1.3}
.def-tekst{font-family:var(--serif);font-style:italic;font-size:1.08rem;line-height:1.45;margin:0 0 .7rem;color:#1f1d1a}
.def-kommentar{font-size:.9rem;line-height:1.5;margin:0;color:#4a453c}
.sammenlign tr.def-sub th[scope=row]{box-shadow:inset 5px 0 0 #22466F}
.sammenlign tr.def-fun th[scope=row]{box-shadow:inset 5px 0 0 #227A72}
.sammenlign tr.def-fam th[scope=row]{box-shadow:inset 5px 0 0 #4B4789}
.sammenlign .def-spor{display:block;font-weight:400;font-style:italic;color:#4a453c;margin-top:.3rem;font-size:.9em}
.sammenlign tr[class^="def-"] th[scope=row]{min-width:8.5rem}
/* illustrasjoner til modellene */
.fig-hode{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.5rem}
.fig-hode .fig-tittel{margin-bottom:0}
.fig-illu{width:128px;height:auto;flex:0 0 auto}
@media (max-width:560px){.fig-illu{width:92px}}
.fig-hode .fig-tittel{margin-top:.25rem}
.eks{background:var(--kap-lys,#F2F5F8);border-left:4px solid var(--kap-mid);border-radius:var(--r);padding:1rem 1.35rem;margin:1.5rem 0}
.eks b{color:var(--kap);font-size:.85rem;display:block;margin-bottom:.35rem}
.eks p{margin:0;font-size:1rem}
/* innholdsmeny i toppen og innholdsliste på forsiden */
.kapmeny{position:relative;margin-left:auto}
.kapmeny+nav{margin-left:0}
.kapmeny summary{list-style:none;cursor:pointer;font-size:.88rem;font-weight:700;padding:.35rem .8rem;border-radius:999px;background:rgba(255,255,255,.14);color:#fff}
.kapmeny summary::-webkit-details-marker{display:none}
.kapmeny summary::after{content:" ▾";font-weight:400}
.kapmeny[open] summary{background:rgba(255,255,255,.24)}
.kapmeny-panel{position:absolute;right:0;top:calc(100% + .5rem);width:min(24rem,92vw);max-height:75vh;overflow:auto;background:#fff;color:#14161D;border-radius:14px;box-shadow:0 12px 32px rgba(0,0,0,.25);padding:.75rem .9rem;z-index:40}
.kapmeny-panel a{color:#14161D;text-decoration:none}
.kapmeny-panel .toc-forside{display:block;font-weight:700;padding:.35rem .4rem;border-radius:8px}
.toc{list-style:none;margin:.25rem 0 0;padding:0}
.toc>li{margin:.15rem 0}
.toc-kap{display:flex;gap:.6rem;align-items:baseline;font-weight:700;padding:.4rem .4rem;border-radius:8px}
.toc-kap[aria-current]{background:#EAF2F1}
.kapmeny-panel a:hover,.toc-kap:hover{background:#F2F5F8}
.toc-n{display:inline-block;min-width:1.4rem;color:#2E6F6A;font-variant-numeric:tabular-nums}
.toc-deler{list-style:none;margin:0 0 .35rem 2rem;padding:0;font-size:.9rem}
.toc-deler a{display:block;padding:.2rem .4rem;border-radius:6px;color:#4a453c}
.forside-toc{margin-top:1.5rem}
.forside-toc h2{font-size:1.1rem;margin:0 0 .25rem}
.forside-toc .toc-kap{font-size:1.05rem}
.forside-toc .toc a{color:inherit;text-decoration:none}
.forside-toc .toc-kap:hover{background:rgba(46,111,106,.1)}
@media (max-width:700px){.kapmeny summary{padding:.35rem .6rem}.kapmeny-panel{position:fixed;left:4vw;right:4vw;top:calc(var(--topp) + .4rem);width:auto}}
.topp nav.kapmeny-panel{display:block;margin:0;gap:0}
.topp .kapmeny-panel a{font-size:inherit;padding:.4rem .4rem;border-radius:8px;display:block}
.topp .kapmeny-panel .toc-kap{display:flex}
.topp .kapmeny-panel .toc-deler a{padding:.2rem .4rem;font-weight:400;font-size:.9rem}
.topp .kapmeny-panel .toc-kap[aria-current]{background:#EAF2F1}
.topp .kapmeny-panel a:hover{background:#F2F5F8}
.topp .kapmeny-panel .toc-forside{border-bottom:1px solid #e3e6ea;border-radius:0;margin-bottom:.3rem;padding-bottom:.5rem}
@media (max-width:700px){.topp .kapmeny-panel a:first-child,.topp .kapmeny-panel a:last-child{display:block}.topp .kapmeny-panel .toc-kap:first-child,.topp .kapmeny-panel .toc-kap:last-child{display:flex}}
/* sekskantmodellen på forsiden: halv størrelse og skalerer med vinduet */
.helt-rose svg.rose,.helt-rose svg.rose.hex{width:clamp(9rem,24vw,18rem);max-width:18rem;height:auto}
@media (max-width:900px){.helt-rose svg.rose,.helt-rose svg.rose.hex{width:clamp(8rem,40vw,11rem);max-width:11rem}}
.helt{min-height:0}
/* kompakt forside: tittel, figur og innhold på omtrent en halv skjerm */
.forside .helt{grid-template-columns:minmax(0,1fr) auto;gap:clamp(1rem,3vw,2.5rem);align-items:start;min-height:0;padding-top:clamp(1rem,2.5vw,2rem);padding-bottom:1rem}
.forside .overtittel{margin:0 0 .35rem;font-size:.85rem}
.forside .helt h1{font-size:clamp(2rem,3.6vw,3.1rem);line-height:1;letter-spacing:-.03em;margin:0 0 .5rem;max-width:none}
.forside .helt .stor{font-size:clamp(1rem,.95rem + .35vw,1.2rem);margin:0 0 .9rem;max-width:40rem}
.forside .helt-knapper{margin-bottom:.9rem}
.forside .helt-knapper .knapp{padding:.45rem 1rem;font-size:.9rem}
.forside .farge-note{display:none}
.forside .forside-toc{margin-top:0}
.forside .forside-toc h2{font-size:.95rem;margin:0 0 .2rem;color:var(--dempet)}
.forside .forside-toc .toc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 1.25rem}
.forside .forside-toc .toc>li{margin:0}
.forside .forside-toc .toc-kap{font-size:.98rem;padding:.25rem .35rem}
.forside .helt-rose{align-self:center}
.forside .helt-rose svg.rose,.forside .helt-rose svg.rose.hex{width:clamp(8rem,18vw,14rem);max-width:14rem}
@media (max-width:900px){
 .forside .helt{grid-template-columns:1fr auto}
 .forside .helt-rose{order:0}
 .forside .helt-rose svg.rose,.forside .helt-rose svg.rose.hex{width:clamp(5.5rem,22vw,8rem)}
}
@media (max-width:560px){
 .forside .helt{grid-template-columns:1fr}
 .forside .helt-rose{display:none}
 .forside .forside-toc .toc{grid-template-columns:1fr}
}
main.forside{padding-top:1rem}
.forside .helt{padding-top:.5rem;padding-bottom:.5rem}
.forside .forside-toc .toc{grid-template-rows:repeat(3,auto);grid-auto-flow:column}
.forside .kapitler{margin-top:1.5rem}
@media (max-width:560px){.forside .forside-toc .toc{grid-template-rows:none;grid-auto-flow:row}.forside .helt .stor{font-size:1rem}}
@media (max-width:560px){.forside .forside-toc .toc-kap{padding:.12rem .35rem;font-size:.95rem}.forside .forside-toc h2{margin-bottom:.1rem}}
/* kompakte kapittelkort, 13. november */
.forside .kap-rutenett{grid-template-columns:repeat(3,minmax(0,1fr));gap:.75rem}
.forside .kap-kort,.forside .kap-kort:nth-child(n+4){grid-column:auto;display:grid;grid-template-columns:5rem minmax(0,1fr);flex-direction:row}
.forside .kort-glass{display:flex;justify-content:center;overflow:hidden;min-height:5rem;border-right:1px solid var(--strek)}
.forside .kort-glass svg.kart{width:auto;height:100%;max-width:none;flex:0 0 auto}
.forside .kort-tekst{padding:.65rem .85rem;gap:.1rem;justify-content:center}
.forside .kort-tekst .n{font-size:.75rem}
.forside .kort-tekst b,.forside .kap-kort:nth-child(n+4) .kort-tekst b{font-size:1rem;line-height:1.25}
.forside .kort-tekst .u{font-size:.84rem;line-height:1.35}
.forside .kapitler h2{font-size:1.25rem;margin-bottom:.75rem}
@media (max-width:1000px){.forside .kap-rutenett{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:620px){.forside .kap-rutenett{grid-template-columns:1fr}.forside .kort-tekst .u{display:none}.forside .kap-kort,.forside .kap-kort:nth-child(n+4){grid-template-columns:3.75rem minmax(0,1fr)}.forside .kort-glass{min-height:3.75rem}}
