/* The talks kit deck (/commons/talks/slides). Slides are 16:9 cards sized in container units, so the same slide works
   in the page, presenting full screen and printed on a 13.33 x 7.5 inch landscape page. deck.js adds presenting mode. */
.deck-tools{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:2rem}
.deck-tools[hidden]{display:none}
.deck-keys{margin-top:1.4rem;font-size:.88rem;color:var(--on-night-3)}
.deck-keys kbd{font:500 .78rem/1 var(--f-mono);padding:.2rem .45rem;border-radius:6px;border:1px solid var(--line-night-2);color:var(--on-night-2)}
.deck-wrap{padding:clamp(2rem,4vw,4rem) var(--gutter)}
.deck{max-width:1180px;margin:0 auto;display:grid;gap:clamp(1.6rem,3vw,2.6rem)}
.deck:focus{outline:none}

.slide{position:relative;container-type:inline-size;display:flex;flex-direction:column;aspect-ratio:16/9;overflow:hidden;border-radius:22px;
  background:var(--paper-3);color:var(--text);border:1px solid var(--line);box-shadow:0 30px 60px -40px rgba(12,35,29,.35)}
.slide__inner{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;padding:6cqi 7cqi 3cqi;font-size:max(15px,1.75cqi);line-height:1.45}
.slide__foot{display:flex;justify-content:space-between;margin:0;padding:0 7cqi 3.2cqi;font:500 max(10px,1cqi)/1 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.slide--title,.slide--section,.slide--dark{background:var(--night);color:var(--on-night);border-color:var(--night)}
.slide--title .slide__foot,.slide--section .slide__foot,.slide--dark .slide__foot{color:var(--on-night-3)}
.slide--title::after{content:"";position:absolute;right:-12cqi;bottom:-30cqi;width:62cqi;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle at 50% 50%,#f2a33a 0 34%,transparent 34.5% 46%,rgba(242,163,58,.35) 46.3% 46.8%,transparent 47% 62%,rgba(242,163,58,.2) 62.2% 62.6%,transparent 63%);pointer-events:none}
.slide em{font-style:italic;color:var(--sun-ink)}
.slide--title em,.slide--section em,.slide--dark em{color:var(--sun-2)}
.sl-eyebrow{margin:0 0 1.1em;font:500 .62em/1 var(--f-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--sun-ink)}
.slide--title .sl-eyebrow,.slide--section .sl-eyebrow,.slide--dark .sl-eyebrow{color:var(--sun)}
.sl-display{position:relative;z-index:1;margin:0;max-width:15em;font:300 3.6em/1.02 var(--f-display);letter-spacing:-.02em}
.sl-h{margin:0 0 .9em;font:400 2.2em/1.08 var(--f-display);letter-spacing:-.015em;max-width:22em}
.sl-lede{position:relative;z-index:1;margin:1.1em 0 0;max-width:30em;font-size:1.1em;color:var(--on-night-2)}
.sl-meta{position:relative;z-index:1;margin:2.4em 0 0;font:500 .6em/1.5 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--on-night-3);max-width:40em}
.sl-stakes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2.2em}
.sl-stakes div{border-top:1px solid var(--line-night-2);padding-top:1em}
.sl-stakes p{margin:0;color:var(--on-night-2);font-size:.92em}
.sl-stakes .sl-k{margin-bottom:.6em;font:400 1.35em/1.1 var(--f-display);color:var(--on-night)}
.sl-foot{margin:1.6em 0 0;font-size:.85em;color:var(--muted)}
.slide--section .sl-foot,.slide--dark .sl-foot{color:var(--on-night-3)}
.sl-index{list-style:none;margin:0;padding:0;columns:2;column-gap:3em}
.sl-index li{display:flex;gap:.8em;break-inside:avoid;padding:.42em 0;border-bottom:1px solid var(--line);font-size:.92em}
.sl-index span{font:500 .8em/1.6 var(--f-mono);color:var(--sun-ink)}
.sl-measure{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:4em;align-items:start}
.sl-num{margin:0 0 .1em;font:300 6em/0.9 var(--f-display);color:var(--sun-ink);letter-spacing:-.04em}
.sl-measure .sl-h{font-size:1.95em;margin:0}
.sl-why{margin:0 0 1em;font:italic 400 1.3em/1.3 var(--f-display);color:var(--text)}
.sl-points{margin:0;padding-left:1.1em}
.sl-points li{margin:0 0 .55em;color:var(--body);font-size:.95em}
.sl-points li::marker{color:var(--sun)}
.sl-steps{margin:0;padding:0;list-style:none;counter-reset:st;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.9em 3em}
.sl-steps li{counter-increment:st;position:relative;padding-left:2.2em;font-size:.86em;color:var(--on-night-2)}
.sl-steps li::before{content:counter(st);position:absolute;left:0;top:-.05em;font:400 1.5em/1 var(--f-display);color:var(--sun)}
.sl-steps strong{display:block;color:var(--on-night);font-weight:600}
.sl-agencies,.sl-tools,.sl-links{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.2em 3em}
.sl-agencies li,.sl-links li{display:grid;gap:.15em;padding:.55em 0;border-bottom:1px solid var(--line)}
.sl-agencies span,.sl-links span{font:500 .62em/1.4 var(--f-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.sl-agencies small,.sl-tools small{font:500 .62em/1.4 var(--f-mono);color:var(--sun-ink)}
.sl-tools li{display:grid;gap:.2em;padding:.7em 0;border-bottom:1px solid var(--line);font-size:.92em;color:var(--body)}
.sl-tools strong{color:var(--text);font-size:1.1em}
.sl-links{position:relative;z-index:1;margin-top:2em;max-width:36em}
.sl-links li{border-color:var(--line-night-2);font-size:1.05em}
.sl-links span{color:var(--on-night-3)}

/* Speaker notes: <details> under each slide in the page */
.notes{margin:0;border-top:1px dashed var(--line-2);background:var(--paper);color:var(--body);font-size:.95rem}
.slide--title .notes,.slide--section .notes,.slide--dark .notes{background:var(--paper);color:var(--body)}
.notes summary{cursor:pointer;padding:.8rem 1.4rem;font:500 .74rem/1.2 var(--f-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.notes summary:focus-visible{outline:2px solid var(--sun);outline-offset:-2px}
.notes p{margin:0;padding:0 1.4rem 1.1rem;max-width:80ch}
.slide:has(.notes[open]){aspect-ratio:auto}
.slide:has(.notes[open]) .slide__inner{aspect-ratio:16/9.8}

/* Narrow screens: slides flow instead of keeping 16:9 */
@media (max-width:760px){
  .slide{aspect-ratio:auto;border-radius:18px}
  .slide__inner{padding:1.8rem 1.4rem 1.2rem}
  .slide__foot{padding:0 1.4rem 1.2rem}
  .slide:has(.notes[open]) .slide__inner{aspect-ratio:auto}
  .sl-display{font-size:2.3em}.sl-h{font-size:1.6em}.sl-num{font-size:3.6em}
  .sl-measure,.sl-stakes,.sl-steps,.sl-agencies,.sl-tools,.sl-links{grid-template-columns:1fr;gap:1em}
  .sl-measure{gap:1.2em}.sl-index{columns:1}
  .slide--title::after{display:none}
}

/* Presenting (deck.js): one slide, filling the screen */
html.presenting,html.presenting body{overflow:hidden}
html.presenting .deck{position:fixed;inset:0;z-index:1000;max-width:none;margin:0;display:grid;place-items:center;background:#05110d}
html.presenting .slide{display:none;width:min(100vw,177.78vh);height:min(56.25vw,100vh);aspect-ratio:auto;border-radius:0;border:0;box-shadow:none}
html.presenting .slide.is-current{display:flex}
html.presenting .slide .slide__inner{aspect-ratio:auto}
html.presenting .slide .notes{display:none}
html.presenting.notes-on .slide.is-current .notes{display:block;position:absolute;left:0;right:0;bottom:0;z-index:2;max-height:34%;overflow:auto;background:rgba(5,17,13,.94);color:#f7f2e8;border-top:1px solid rgba(242,163,58,.5)}
html.presenting.notes-on .notes summary{color:#f2a33a}
html.presenting.notes-on .notes p{font-size:max(15px,1.4cqi)}
.deck-bar{position:fixed;right:1rem;bottom:1rem;z-index:1001;display:flex;align-items:center;gap:.3rem;padding:.3rem;border-radius:999px;background:rgba(5,17,13,.82);color:#f7f2e8;opacity:.35;transition:opacity .25s}
.deck-bar:hover,.deck-bar:focus-within{opacity:1}
.deck-bar[hidden]{display:none}
.deck-bar button{height:38px;min-width:38px;padding:0 .9rem;border:0;border-radius:999px;background:transparent;color:inherit;font:500 .82rem/1 var(--f-sans);cursor:pointer}
.deck-bar button:hover{background:rgba(247,242,232,.12)}
.deck-bar button:focus-visible{outline:2px solid #f2a33a;outline-offset:1px}
.deck-bar button[aria-pressed=true]{background:rgba(242,163,58,.25)}
.deck-count{padding:0 .5rem;font:500 .78rem/1 var(--f-mono);letter-spacing:.06em}
@media (prefers-reduced-motion:reduce){.deck-bar{transition:none}}

/* Print: every slide on its own 16:9 landscape page, in its own colours; notes only when switched on */
@media print{
  @page{size:13.333in 7.5in;margin:0}
  html{font-size:12px}
  body{background:#fff!important}
  body::before,.site-header,.site-footer,.skip,.deck-hero,.deck-bar{display:none!important}
  .deck-wrap{padding:0}
  .deck{display:block;max-width:none}
  .slide,html.presenting .slide{display:flex!important;width:13.333in;height:7.5in;aspect-ratio:auto;margin:0;border:0;border-radius:0;box-shadow:none;
    break-after:page;page-break-after:always;break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .slide--title,.slide--section,.slide--dark{background:#0c231d!important;color:#f7f2e8!important}
  .slide .slide__inner{aspect-ratio:auto!important}
  .notes{display:none!important}
  html.notes-on .notes{display:block!important;flex:none;max-height:1.9in;overflow:hidden;background:#faf7f0!important;color:#2b3933!important;border-top:1px solid #cbbfa6}
  html.notes-on .notes summary{padding:.12in .5in .04in;color:#52615a}
  html.notes-on .notes p{padding:0 .5in .14in;font-size:10.5pt}
  html.notes-on .notes summary::marker{content:""}
}
