/* ==========================================================================
   SwissAnon keynote theme for reveal.js 6
   Statistiktage 2026, Wien -- Matthias Templ, FHNW
   Tokens taken verbatim from swissanon-website/src/styles/tokens.css
   ========================================================================== */

/* ---------- fonts (self-hosted, no external request) ---------------------- */
@font-face{font-family:'Poppins';src:url('fonts/poppins-600.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Poppins';src:url('fonts/poppins-700.woff2') format('woff2');
  font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/inter-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/inter-500.woff2') format('woff2');
  font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('fonts/inter-600.woff2') format('woff2');
  font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'JetBrains Mono';src:url('fonts/jetbrains-mono-400.woff2') format('woff2');
  font-weight:400;font-style:normal;font-display:swap}

/* ---------- tokens -------------------------------------------------------- */
:root{
  --navy:#041E3E; --navy-900:#03152C; --navy-700:#0C2A4F; --navy-600:#16395F;
  --red:#F70000; --red-ink:#C70000; --red-press:#A80000;
  --ink:#0C1A2E; --page:#F7F9FC; --surface:#FFFFFF; --alt:#EEF2F7;
  --hairline:#DCE3ED; --hairline-strong:#C4CFDD;
  --muted:#5B6B82; --muted-light:#8A98AC;
  --red-wash:#FEE2E2; --red-wash-line:#F7B5B5;
  --safe:#1A7F5A; --safe-wash:#E2F2EB;
  --amber:#B25E00; --amber-wash:#FBEEDC;

  --font-display:'Poppins',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-sans:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;

  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-standard:cubic-bezier(0.2,0,0.1,1);

  --r-main-font-size:25px;
}

/* ---------- reveal base overrides ---------------------------------------- */
.reveal-viewport{background:var(--page);}
.reveal{font-family:var(--font-sans);font-size:25px;font-weight:400;color:var(--ink);
  line-height:1.5;-webkit-font-smoothing:antialiased;}
.reveal ::selection{background:var(--navy);color:#fff;}

.reveal .slides{text-align:left;}
.reveal .slides section{
  height:100%;padding:40px 68px 62px;box-sizing:border-box;
}
/* reveal writes display:block inline on the visible slide, so the column layout
   has to be forced -- but only on slides that are actually shown, otherwise the
   hidden ones (display:none inline) would all become visible. */
.reveal .slides section.present,
.reveal .slides section.past,
.reveal .slides section.future,
.reveal.print-pdf .slides section{
  display:flex !important;flex-direction:column;justify-content:flex-start;
}
.reveal .slides section.center-v{justify-content:center;}

/* headings -------------------------------------------------------------- */
.reveal h1,.reveal h2,.reveal h3,.reveal h4{
  font-family:var(--font-display);color:var(--navy);
  text-transform:none;letter-spacing:-0.02em;margin:0;text-shadow:none;
}
.reveal h1{font-weight:700;font-size:2.45em;line-height:1.03;}
.reveal h2{font-weight:700;font-size:1.62em;line-height:1.1;margin:0 0 6px;}
.reveal h3{font-weight:600;font-size:1.06em;line-height:1.2;letter-spacing:-0.01em;}
.reveal h4{font-weight:600;font-size:0.86em;line-height:1.25;}

/* the red rule under every content headline */
.reveal h2.rule::after{
  content:"";display:block;width:72px;height:3px;background:var(--red);
  margin:12px 0 0;border-radius:2px;
}

.reveal p{margin:0 0 11px;}
.reveal strong,.reveal b{font-weight:600;color:var(--navy);}
.reveal em{font-style:italic;}
.reveal a{color:var(--navy);text-decoration:none;border-bottom:1px solid var(--hairline-strong);}
.reveal a:hover{color:var(--red-ink);border-color:var(--red);}

/* lists ------------------------------------------------------------------ */
.reveal ul{list-style:none;margin:0;padding:0;}
.reveal ul li{
  position:relative;padding-left:24px;margin:0 0 11px;line-height:1.42;
}
.reveal ul li::before{
  content:"";position:absolute;left:2px;top:0.6em;width:8px;height:8px;
  background:var(--red);border-radius:999px;
}
.reveal ul.plain li{padding-left:0;}
.reveal ul.plain li::before{display:none;}
.reveal ol{margin:0 0 0 1.1em;padding:0;}
.reveal ol li{margin:0 0 12px;line-height:1.42;padding-left:6px;}
.reveal li ul{margin-top:10px;}
.reveal li ul li{font-size:0.86em;color:var(--muted);margin-bottom:8px;}
.reveal li ul li::before{background:var(--hairline-strong);width:6px;height:6px;top:0.62em;}

/* eyebrow / kicker ------------------------------------------------------- */
.eyebrow{
  font-family:var(--font-mono);font-size:0.53em;text-transform:uppercase;
  letter-spacing:.08em;color:var(--red-ink);margin:0 0 12px;display:block;
}
section.dark .eyebrow{color:var(--red);}

/* mono / numbers --------------------------------------------------------- */
.reveal .num,.reveal code,.reveal kbd,.reveal pre{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;letter-spacing:.01em;
}
.reveal .num{font-weight:400;}
.reveal code{background:var(--alt);border:1px solid var(--hairline);border-radius:3px;
  padding:1px 6px;font-size:0.88em;color:var(--navy);}
section.dark .reveal code,.reveal section.dark code{background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.16);color:#fff;}

/* ---------- dark (navy) slides ------------------------------------------ */
.reveal section.dark{background:var(--navy);color:#fff;}
.reveal section.dark h1,.reveal section.dark h2,
.reveal section.dark h3,.reveal section.dark h4,
.reveal section.title h1,.reveal section.title h2,
.reveal section.title h3,.reveal section.title h4,
.reveal section.divider h1,.reveal section.divider h2,
.reveal section.divider h3,.reveal section.divider h4{color:#fff;}
.reveal section.title p,.reveal section.divider p{color:rgba(255,255,255,.82);}
.reveal section.title .card,.reveal section.divider .card{
  background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);
  color:#fff;box-shadow:none;}
.reveal section.title .card h3,.reveal section.divider .card h3{color:#fff;}
.reveal section.divider .card p{color:rgba(255,255,255,.82);}
.reveal section.dark strong{color:#fff;}
/* <strong> takes its colour from a class rule, which beats an inline style on the
   parent -- so every dark context has to name it explicitly, or bold text turns
   navy-on-navy and disappears. */
.reveal .card.navy strong,.reveal .card.navy b,
.reveal section.title .card strong,.reveal section.title .card b,
.reveal section.divider .card strong,.reveal section.divider .card b,
.reveal section.dark .card strong,.reveal section.dark .card b,
.reveal section.title strong,.reveal section.divider strong{color:#fff;}
.reveal .card.navy em,.reveal section.divider .card em{color:rgba(255,255,255,.92);}
.reveal section.dark p{color:rgba(255,255,255,.82);}
.reveal section.dark ul li{color:rgba(255,255,255,.86);}
.reveal section.dark .note,.reveal section.dark .src{color:rgba(255,255,255,.55);}
.reveal section.dark a{color:#fff;border-color:rgba(255,255,255,.35);}

/* red full stop like swissanon.com */
.dot{color:var(--red);}

/* ---------- layout helpers ---------------------------------------------- */
.grid{display:grid;gap:24px;align-items:stretch;}
.grid.top{align-items:start;}
.grid.g2{grid-template-columns:1fr 1fr;}
.grid.g2-wide{grid-template-columns:1.12fr 0.88fr;}
.grid.g2-narrow{grid-template-columns:0.72fr 1.28fr;}
.grid.g3{grid-template-columns:repeat(3,1fr);}
.grid.g4{grid-template-columns:repeat(4,1fr);}
.grid.tight{gap:14px;}
.body{margin-top:20px;margin-bottom:10px;flex:1 0 auto;min-height:0;}
/* flex:1 0 auto -- the body must never be shrunk below its content, otherwise
   its children spill over the source line underneath it. */
.body.tight{margin-top:14px;}
.center{text-align:center;}
.vcenter{display:flex;flex-direction:column;justify-content:center;height:100%;}
.fill{flex:1 1 auto;display:flex;flex-direction:column;justify-content:center;min-height:0;}

/* ---------- cards -------------------------------------------------------- */
.card{
  background:var(--surface);border:1px solid var(--hairline);border-radius:6px;
  border-left:3px solid var(--red);padding:16px 18px;
  box-shadow:0 1px 2px rgba(4,30,62,.06),0 8px 24px rgba(4,30,62,.06);
}
.card{display:flex;flex-direction:column;}
.card h3{margin:0 0 8px;}
.card p:last-child,.card ul:last-child li:last-child{margin-bottom:0;}
.card.navy{background:var(--navy);border-color:var(--navy);border-left-color:var(--red);color:#fff;}
.card.navy h3{color:#fff;}
.card.navy p{color:rgba(255,255,255,.8);}
.card.flat{border-left-width:1px;border-left-color:var(--hairline);box-shadow:none;}
.card.alt{background:var(--alt);box-shadow:none;}
.card.risk{border-left-color:var(--red);background:var(--red-wash);border-color:var(--red-wash-line);}
.card.safe{border-left-color:var(--safe);background:var(--safe-wash);border-color:#BFE3D3;}
section.dark .card{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.14);
  color:#fff;box-shadow:none;}
section.dark .card h3{color:#fff;}
section.dark .card p,section.dark .card li{color:rgba(255,255,255,.82);}

/* ---------- stat tiles --------------------------------------------------- */
.stat{text-align:left;}
.stat .v{
  font-family:var(--font-mono);font-variant-numeric:tabular-nums;
  font-size:2.35em;line-height:1;letter-spacing:-0.02em;color:var(--navy);display:block;
  white-space:nowrap;
}
.stat .v .u{font-size:.46em;color:var(--muted);margin-left:.12em;}
.stat .l{
  font-family:var(--font-mono);font-size:.44em;text-transform:uppercase;
  letter-spacing:.05em;color:var(--muted);margin-top:8px;display:block;line-height:1.35;
}
.stat.accent .v{color:var(--red);}
section.dark .stat .v{color:#fff;}
section.dark .stat.accent .v{color:var(--red);}
section.dark .stat .l{color:rgba(255,255,255,.6);}
section.dark .stat .v .u{color:rgba(255,255,255,.55);}
.stat.big .v{font-size:3.1em;}

/* ---------- quiz cards (Einstiegsfolie) ---------------------------------- */
.quizcard{
  background:var(--surface);border:1px solid var(--hairline);border-radius:6px;
  overflow:hidden;display:flex;flex-direction:column;
  box-shadow:0 1px 2px rgba(4,30,62,.06),0 8px 24px rgba(4,30,62,.06);
}
.quizcard img{display:block;width:100%;height:236px;object-fit:cover;}
.quizcard .qc-body{padding:14px 16px 16px;border-top:3px solid var(--red);flex:1 1 auto;}
.quizcard .qc-n{
  font-family:var(--font-mono);font-size:.4em;text-transform:uppercase;letter-spacing:.06em;
  color:var(--muted);display:block;margin-bottom:5px;
}
.quizcard p{margin:0;font-size:.86em;line-height:1.38;}

/* ---------- badges ------------------------------------------------------- */
.badge{
  display:inline-block;font-family:var(--font-mono);font-size:.42em;
  text-transform:uppercase;letter-spacing:.04em;padding:5px 9px;border-radius:999px;
  background:var(--alt);color:var(--muted);border:1px solid var(--hairline);
  vertical-align:middle;
}
.badge.red{background:var(--red-wash);color:var(--red-ink);border-color:var(--red-wash-line);}
.badge.navy{background:var(--navy);color:#fff;border-color:var(--navy);}
.badge.safe{background:var(--safe-wash);color:#0d6644;border-color:#BFE3D3;}
.badge.amber{background:var(--amber-wash);color:#9a5000;border-color:#f0d3a8;}

/* ---------- notes, sources ---------------------------------------------- */
.note{font-size:.63em;color:var(--muted);line-height:1.45;}
.src{
  font-family:var(--font-mono);font-size:.4em;color:var(--muted-light);
  letter-spacing:.01em;line-height:1.45;margin-top:auto;padding-top:10px;
}
.lead{font-size:1.12em;line-height:1.45;color:var(--muted);max-width:44ch;}
section.dark .lead{color:rgba(255,255,255,.78);}

/* ---------- pull quote --------------------------------------------------- */
.pull{
  font-family:var(--font-display);font-weight:700;font-size:1.5em;line-height:1.22;
  letter-spacing:-0.02em;color:var(--navy);max-width:22ch;
}
section.dark .pull{color:#fff;}
.pull .hl{color:var(--red);}
.pull-src{font-family:var(--font-mono);font-size:.42em;color:var(--muted);margin-top:22px;
  text-transform:uppercase;letter-spacing:.05em;}

/* ---------- tables ------------------------------------------------------- */
.reveal table{
  border-collapse:collapse;width:100%;font-size:.72em;margin:0;
  font-variant-numeric:tabular-nums;
}
.reveal table th{
  font-family:var(--font-mono);font-size:.82em;font-weight:400;text-transform:uppercase;
  letter-spacing:.05em;color:var(--muted);text-align:left;padding:6px 11px;
  border-bottom:1px solid var(--hairline-strong);white-space:nowrap;
}
.reveal table td{
  padding:7px 11px;border-bottom:1px solid var(--hairline);color:var(--ink);
}
.reveal table td.n,.reveal table th.n{font-family:var(--font-mono);text-align:right;}
.reveal table tr.hit td{background:var(--red-wash);color:var(--red-ink);font-weight:600;}
.reveal table tr.hit td:first-child{box-shadow:inset 3px 0 0 var(--red);}
.reveal table tr.dim td{color:var(--muted-light);}
.reveal table td.mark{background:var(--red-wash);color:var(--red-ink);font-weight:600;
  box-shadow:inset 0 0 0 2px var(--red-wash-line);}
.reveal table .sep{border-right:2px solid var(--hairline-strong);}
.reveal table tr.grouphdr th{
  padding-bottom:2px;border-bottom:none;font-size:.9em;letter-spacing:.06em;}
.reveal table tr.grouphdr th.grp-r{color:var(--red-ink);text-align:center;}
.reveal table tr.grouphdr th.grp-u{color:var(--navy-600);text-align:center;}
.reveal table td.mark-safe{background:var(--safe-wash);color:#0d6644;font-weight:600;}
.reveal table caption{
  caption-side:bottom;font-family:var(--font-mono);font-size:.62em;color:var(--muted-light);
  text-align:left;padding-top:10px;letter-spacing:.01em;
}
table.compact td,table.compact th{padding:6px 10px;}
table.heat td,table.heat th{padding:4px 8px;}
section.dark table th{color:rgba(255,255,255,.6);border-color:rgba(255,255,255,.24);}
section.dark table td{color:rgba(255,255,255,.88);border-color:rgba(255,255,255,.12);}

/* ---------- code block --------------------------------------------------- */
pre.code{
  background:var(--navy);color:#E8EEF6;border-radius:6px;padding:20px 24px;margin:0;
  font-family:var(--font-mono);font-size:.62em;line-height:1.65;overflow:visible;
  box-shadow:0 8px 24px rgba(4,30,62,.1);
}
pre.code .fn{color:#8FD3FF;}
pre.code .str{color:#FFC48F;}
pre.code .cm{color:#7E93AD;}
pre.code .kw{color:#FF9C9C;}
pre.code .out{color:#9FB4CC;}

/* ---------- title slide -------------------------------------------------- */
section.title{
  background:var(--navy);color:#fff;padding:0;overflow:hidden;position:relative;
  justify-content:center;
}
section.title .bg-pattern{
  position:absolute;inset:0;background-image:url('brand/pattern-red.svg');
  background-size:cover;background-position:center;opacity:.07;pointer-events:none;
}
section.title .bg-ridge{
  position:absolute;right:-30px;bottom:26px;width:430px;opacity:.30;pointer-events:none;
}
section.title .inner{position:relative;z-index:2;padding:0 76px;}
section.title h1{font-size:2.2em;max-width:19ch;margin:0 0 22px;}
section.title .sub{
  font-family:var(--font-display);font-weight:600;font-size:.94em;color:rgba(255,255,255,.72);
  letter-spacing:-0.01em;margin:0 0 34px;max-width:34ch;line-height:1.3;
}
section.title .who{font-size:.72em;color:rgba(255,255,255,.9);line-height:1.6;}
section.title .who .name{font-weight:600;color:#fff;}
section.title .when{
  font-family:var(--font-mono);font-size:.5em;color:rgba(255,255,255,.6);
  text-transform:uppercase;letter-spacing:.06em;margin-top:26px;
}
section.title .mark{position:absolute;right:76px;top:52px;width:132px;z-index:2;opacity:.95;}

/* ---------- section divider ---------------------------------------------- */
section.divider{
  background:var(--navy);color:#fff;justify-content:center;position:relative;overflow:hidden;
}
section.divider .bg-ridge{position:absolute;right:-24px;bottom:30px;width:380px;opacity:.22;
  pointer-events:none;}
section.divider .k{
  font-family:var(--font-mono);font-size:.62em;color:var(--red);letter-spacing:.1em;
  text-transform:uppercase;margin-bottom:18px;position:relative;z-index:2;
}
section.divider h2{font-size:2.1em;max-width:17ch;position:relative;z-index:2;}
section.divider .sub{
  color:rgba(255,255,255,.7);font-size:.86em;margin-top:20px;max-width:38ch;
  position:relative;z-index:2;
}

/* ---------- running footer ----------------------------------------------- */
.deck-footer{
  position:fixed;left:0;right:0;bottom:0;height:38px;z-index:30;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 30px 4px;pointer-events:none;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted-light);
  background:linear-gradient(to top,var(--page) 55%,rgba(247,249,252,0));
  transition:background .2s var(--ease-standard),color .2s var(--ease-standard);
}
body.on-dark .deck-footer{
  background:linear-gradient(to top,var(--navy) 55%,rgba(4,30,62,0));
}
.deck-footer .l{display:flex;align-items:center;gap:10px;}
.deck-footer .mk{height:15px;opacity:.75;}
.deck-footer .no{color:var(--muted);}
body.on-dark .deck-footer{color:rgba(255,255,255,.42);}
body.on-dark .deck-footer .no{color:rgba(255,255,255,.6);}
body.on-dark .deck-footer .mk{filter:brightness(0) invert(1);opacity:.6;}

.reveal .progress{height:3px;color:var(--red);}
.reveal .controls{color:var(--muted-light);}
body.on-dark .reveal .controls{color:rgba(255,255,255,.45);}

/* ---------- fragments (SwissAnon motion: fast, no bounce) ---------------- */
.reveal .slides section .fragment.fade-in-then-semi-out.visible{opacity:1;}
.reveal .fragment.rise{opacity:0;transform:translateY(14px);
  transition:all .42s var(--ease-out);}
.reveal .fragment.rise.visible{opacity:1;transform:none;}
.reveal .fragment.grow-bar{transform:scaleX(0);transform-origin:left center;
  transition:transform .5s var(--ease-out);opacity:1;}
.reveal .fragment.grow-bar.visible{transform:scaleX(1);}

/* ---------- SVG figure defaults ------------------------------------------ */
.fig{width:100%;height:auto;display:block;}
.fig text{font-family:var(--font-sans);fill:var(--ink);}
.fig .mono{font-family:var(--font-mono);}
.fig .lbl{font-size:15px;fill:var(--muted);}
.fig .lbl-s{font-size:13px;fill:var(--muted-light);}
.fig .ttl{font-family:var(--font-display);font-weight:600;font-size:17px;fill:var(--navy);}
.fig .ttl[font-size='14']{letter-spacing:-0.3px;}
.fig .ax{stroke:var(--hairline-strong);stroke-width:1.5;fill:none;}
.fig .grid-l{stroke:var(--hairline);stroke-width:1;stroke-dasharray:4 4;fill:none;}
.fig .dot-n{fill:var(--navy);}
.fig .dot-r{fill:var(--red);}
.fig .box{fill:var(--surface);stroke:var(--hairline-strong);stroke-width:1.5;rx:5;}
.fig .box-n{fill:var(--navy);stroke:none;rx:5;}
.fig .box-r{fill:var(--red-wash);stroke:var(--red-wash-line);stroke-width:1.5;rx:5;}
.fig .arrow{stroke:var(--muted);stroke-width:2;fill:none;marker-end:url(#ah);}
.fig .arrow-r{stroke:var(--red);stroke-width:2.5;fill:none;marker-end:url(#ahr);}
section.dark .fig text{fill:#fff;}
section.dark .fig .lbl{fill:rgba(255,255,255,.7);}

/* ---------- misc --------------------------------------------------------- */
.kv{display:flex;gap:12px;align-items:baseline;margin-bottom:10px;}
.kv .k{font-family:var(--font-mono);font-size:.62em;text-transform:uppercase;
  letter-spacing:.05em;color:var(--muted);min-width:120px;}
.rulebar{height:3px;background:var(--red);width:76px;border-radius:2px;margin:14px 0 0;}
.hr{height:1px;background:var(--hairline);border:0;margin:16px 0;}
section.dark .hr{background:rgba(255,255,255,.16);}

/* speaker-notes readability */
.reveal aside.notes{display:none;}

@media print{
  .deck-footer{position:absolute;}
}
@media (prefers-reduced-motion:reduce){
  .reveal .fragment{transition:none !important;}
}

/* ---------- Literaturliste ------------------------------------------------ */
.refs{font-size:.46em;line-height:1.4;color:var(--muted);margin:0;}
.reveal .refs li{padding-left:1.1em;text-indent:-1.1em;margin-bottom:6px;}
.refs strong{font-weight:600;color:var(--ink);}
.refs em{font-style:italic;}