/* EU Studierum — Broadsheet-inspireret typografi og trykfarver.
   Alle farver og mål ligger i :root. Skift dem her, ikke længere nede. */

:root{
  --font-ui:"Segoe UI",Arial,Helvetica,sans-serif;
  --bg:#f3f2f2;          /* papir */
  --paper:#ffffff;
  --ink:#201e1d;
  --muted:#605d5d;
  --line:rgba(32,30,29,.14);
  --line-strong:rgba(32,30,29,.24);
  --accent:#004961;      /* dyb petroleumsblå (3a) */
  --accent-hover:#0a303e;
  --wash:#e9f8ff;
  --radius:2px;
  font-family:"Source Serif 4",Georgia,"Times New Roman",serif;
  color:var(--ink);
  background:var(--bg);
  font-synthesis:none;
}
*{box-sizing:border-box}
body{margin:0}
a{color:var(--accent);text-decoration:none;text-underline-offset:3px}
a:hover{color:var(--accent-hover)}
button,input,select{font:inherit}
button,input,select,.headrow,.dateline,.weeks-drawer,.eyebrow,.search-field>span,
.session-meta,.session-mats,.part-head,.list-note,.breadcrumb,.primary,
.lesson-toolbar,.reader-settings,.document-label,.note-meta,.note-toc,
.reading-group h3,.reading a,.reading .missing,.mobile-note,.page-footer,.filetype{
  font-family:var(--font-ui);
}
button,a,input{-webkit-tap-highlight-color:transparent}
button{cursor:pointer}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
::selection{background:var(--wash)}

/* ——— masthead ——— */
.masthead{padding:30px 58px 0;max-width:1400px;margin:0 auto}
.dateline{display:flex;justify-content:space-between;gap:20px;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-bottom:12px}
.rule-thick{height:4px;background:var(--ink)}
.rule-thin{height:1px;background:var(--ink)}
.headrow{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:9px 0;font-size:12px}
.headrow-left,.headrow-right{display:flex;align-items:center;gap:11px}
.mark{color:var(--accent);flex:none}
.coursename{color:var(--ink);text-align:center}
.toplink{font-size:12px}
.toplink.active{color:var(--ink)}
.textbutton{background:none;border:0;color:var(--accent);padding:0;font-size:12px;white-space:nowrap}
.textbutton:hover{color:var(--accent-hover)}
.weeks-drawer{max-width:1400px;margin:0 auto;font-size:12px}
.weeks-drawer summary{padding:10px 0;color:var(--muted);cursor:pointer;letter-spacing:.1em;text-transform:uppercase;font-size:10.5px}
.weeks-drawer summary:hover{color:var(--accent)}
.weeks-drawer[open] summary{color:var(--ink)}
.weeks-drawer nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 46px;padding:4px 0 18px}
.weeklink{display:grid;grid-template-columns:34px 1fr 8px;gap:10px;padding:9px 2px;align-items:baseline;font-size:13px;line-height:1.4;color:var(--ink);border-top:1px solid var(--line)}
.weeklink:hover{background:var(--paper)}
.weeklink.active{color:var(--accent)}
.weeknum{color:var(--muted);font-variant-numeric:tabular-nums;font-size:12px}
.dot{width:5px;height:5px;border-radius:50%;background:var(--accent)}
body[data-view=overview] .weeks-drawer{display:none}

/* ——— hoveddel ——— */
main{max-width:1400px;padding:34px 58px 20px;margin:auto;min-height:80vh}
.page-footer{max-width:1400px;margin:auto;padding:34px 58px;color:var(--muted);font-size:11px}
.eyebrow{font-size:11px;font-weight:400;letter-spacing:.16em;color:var(--accent);text-transform:uppercase;margin:0 0 12px}
h1{font-size:clamp(34px,5vw,56px);line-height:1.02;letter-spacing:-.03em;font-weight:600;margin:0 0 16px}
h2{font-size:24px;font-weight:600;letter-spacing:-.01em;margin:0}
h3{font-size:15px;font-weight:600;margin:0}
.intro{max-width:34em;font-size:13.5px;line-height:1.7;color:var(--muted);margin:0}
.muted{color:var(--muted);font-size:12px}

/* forside: ordmærke + søgefelt */
.hero{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;padding:26px 0 34px;flex-wrap:wrap}
.wordmark{font-size:clamp(54px,7vw,92px);line-height:.98;letter-spacing:-.03em;margin:0}
.search-field{display:block;flex:none;width:250px;padding-bottom:6px}
.search-field span{display:block;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-bottom:7px}
.search{width:100%;font-size:14px;padding:9px 11px;background:var(--paper);border:1px solid var(--line-strong);border-radius:var(--radius);color:var(--ink);caret-color:var(--accent)}
.search::placeholder{color:var(--muted)}

/* forside: listen i to spalter, delt i to dele */
.session-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 46px}
.part-head{grid-column:1/-1;display:flex;align-items:baseline;gap:14px;padding:16px 0 6px}
.part-head .kicker{font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.part-head .rule{flex:1;height:1px;background:var(--line-strong)}
.part-head .range{font-size:11.5px;color:var(--muted)}
.session{display:grid;grid-template-columns:62px 1fr;gap:18px;align-items:start;padding:17px 6px 17px 0;border-bottom:1px solid var(--line);color:inherit}
.session:hover{background:var(--paper);color:inherit}
.session-body{min-width:0}
.weekbadge{font-size:34px;line-height:.95;font-variant-numeric:tabular-nums;letter-spacing:-.02em;color:var(--ink)}
.session-title{display:block;font-size:18.5px;line-height:1.3;letter-spacing:-.01em}
.session-meta{display:block;font-size:12px;color:var(--muted);margin-top:5px}
.session-mats{display:flex;flex-wrap:wrap;gap:6px 12px;margin-top:9px;font-size:11.5px;color:var(--accent)}
.session-mats span{display:inline-flex;align-items:center;gap:5px}
.session-mats i{font-size:15px}
.list-note{font-size:12px;color:var(--muted);margin:18px 0 0}

/* ——— forelæsningsside ——— */
.breadcrumb{font-size:12px;color:var(--muted);margin-bottom:26px}
.lesson-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-start;margin-bottom:30px}
.lesson-heading>div:first-child{flex:1;min-width:0}
.lesson-heading h1{font-size:clamp(30px,4vw,46px);max-width:none}
.primary{display:inline-block;background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:var(--radius);padding:11px 16px;font-size:13px;white-space:nowrap}
.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:#fff}
.primary:active{transform:translateY(1px)}
.deck-options{display:flex;gap:10px;flex-wrap:wrap}
.material-section{margin-bottom:46px}
.section-header{display:flex;justify-content:space-between;gap:20px;align-items:baseline;margin-bottom:16px}
.section-header a{font-size:12.5px}
video{display:block;width:100%;max-height:540px;background:var(--ink);border-radius:var(--radius);aspect-ratio:16/9}
.video-embed{position:relative;width:100%;aspect-ratio:16/9;max-height:540px;background:var(--ink);border-radius:var(--radius);overflow:hidden}
.video-embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.mobile-note{font-size:11.5px;color:var(--muted);margin-top:10px}
.empty{border:1px solid var(--line-strong);border-radius:var(--radius);padding:26px;background:var(--paper);color:var(--muted);font-size:13.5px;line-height:1.7}
.empty strong{color:var(--ink);display:block;font-size:16px;font-weight:600;margin-bottom:4px}
.notes-frame{width:100%;height:800px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--paper)}
.readings{padding:0;list-style:none}
.reading{padding:16px 0;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.7}
.reading a{display:block;font-size:12.5px;margin-top:7px}
.reading .missing{display:block;color:var(--muted);font-size:11.5px;margin-top:5px}
.reading-group{margin:30px 0}
.reading-group h3{color:var(--muted);font-weight:400;font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.lesson-nav{display:flex;justify-content:space-between;border-top:1px solid var(--line-strong);padding:24px 0;font-size:13px;gap:20px}

/* ——— pensumbibliotek ——— */
.sectionbar{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;padding:24px 0 14px}
.library-row{display:grid;grid-template-columns:44px 1fr 20px;gap:18px;align-items:baseline;padding:16px 4px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.5;color:inherit}
.library-row:hover{background:var(--paper);color:inherit}
.library-row .filetype{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.library-row .arrow{color:var(--muted);font-size:13px;justify-self:end}
.arrow{color:var(--muted)}

/* ——— øvrigt ——— */
.skip{position:fixed;top:-100px;left:15px;z-index:6;background:var(--paper);padding:12px}
.skip:focus{top:10px}
.skeleton{height:96px;background:rgba(32,30,29,.06);margin-bottom:24px;border-radius:var(--radius)}

/* læsevisning: masthead træder af, når noterne læses */
.reading-mode .masthead{display:none}
.reading-mode main{padding-top:24px}
.note-prose{color:#2d2b2b}
.note-prose strong{color:var(--ink)}

@media(max-width:1100px){
  .masthead,main,.page-footer{padding-left:34px;padding-right:34px}
  .session-list,.weeks-drawer nav{grid-template-columns:minmax(0,1fr)}
  .coursename{display:none}
}
@media(max-width:700px){
  .masthead,main,.page-footer{padding-left:22px;padding-right:22px}
  .headrow{flex-wrap:wrap;gap:12px}
  .hero{align-items:flex-start;gap:22px}
  .search-field{width:100%}
  .lesson-heading{display:block}
  .deck-options{margin-top:18px}
  .notes-frame{height:560px}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
