/* Manufacturing Equity: site styles. Tokens are the deck's own; no new colours or fonts. */
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-600-normal.woff2) format("woff2");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"Hanken Grotesk";src:url(fonts/hanken-grotesk-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url(fonts/spectral-latin-400-normal.woff2) format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url(fonts/spectral-latin-400-italic.woff2) format("woff2");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"Spectral";src:url(fonts/spectral-latin-600-normal.woff2) format("woff2");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"Spectral";src:url(fonts/spectral-latin-700-normal.woff2) format("woff2");font-weight:700;font-style:normal;font-display:swap}

:root{
  --ink:#22262e;--muted:#5a606c;--paper:#ffffff;--card:#f7f9fc;--rule:#d7dce4;--band:#eef2f7;
  --night:#12233d;--night-deep:#0b1a2e;--accent:#1d4e89;--accent-light:#8fb3e6;
  --sans:"Hanken Grotesk",Arial,sans-serif;--serif:"Spectral",Georgia,serif;
  --s:.5; /* stage scale in read mode, set by app.js */
}
*,*::before,*::after{box-sizing:border-box}
html{background:var(--paper);scroll-padding-top:16px}
body{margin:0;color:var(--ink);font:400 17px/1.55 var(--sans);-webkit-text-size-adjust:100%}
a{color:var(--accent)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.vh{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--paper);padding:8px 12px;z-index:10}
.skip:focus{left:12px;top:12px}

/* ---------- Site chrome ---------- */
.masthead,#deck,.site-foot{max-width:1120px;margin:0 auto;padding-left:20px;padding-right:20px}
.masthead{padding-top:48px;padding-bottom:16px;border-bottom:1px solid var(--rule)}
.kicker{margin:0 0 8px;font-size:14px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--accent)}
.masthead h1{margin:0;font:600 clamp(36px,7vw,64px)/1.05 var(--serif)}
.subtitle{margin:10px 0 0;font-size:clamp(18px,2.6vw,24px);line-height:1.3;color:var(--muted)}
.byline{margin:14px 0 0;font-weight:600}
.context{margin:6px 0 0;color:var(--muted);font-size:15px}
.actions{display:flex;flex-wrap:wrap;align-items:center;gap:12px 24px;margin:22px 0 4px}
.btn-present{display:inline-block;padding:10px 22px;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:600;border:1.5px solid var(--ink)}
.btn-present:hover{background:var(--paper);color:var(--ink)}
.handout{font-size:15px}
.sections ol{list-style:none;margin:20px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 22px;font-size:15px}
.sections a{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--rule)}
.sections a:hover{border-color:var(--accent)}
.site-foot{padding-top:24px;padding-bottom:48px;border-top:1px solid var(--rule);color:var(--muted);font-size:15px}
.site-foot p{margin:0 0 6px}

/* ---------- Read mode ---------- */
#deck{padding-top:8px;padding-bottom:32px;outline:none}
.section-head{margin:48px 0 8px;font:600 clamp(24px,4vw,34px)/1.2 var(--serif)}
.slide{position:relative;margin:40px 0;scroll-margin-top:40px}
.slide-num{position:absolute;left:0;top:-30px;min-width:24px;min-height:26px;padding:4px 0;font-size:13px;color:var(--muted);text-decoration:none}
.enlarge{position:absolute;left:40px;top:-30px;min-height:26px;padding:4px 0;font:inherit;font-size:13px;color:var(--muted);background:none;border:0;cursor:pointer}
.enlarge:hover{color:var(--accent);text-decoration:underline}
.slide-num:hover{color:var(--accent)}
.present-here{position:absolute;right:0;top:-30px;min-height:26px;padding:4px 0;font-size:13px;color:var(--muted);background:none;border:0;padding:0;cursor:pointer;font-family:inherit}
.present-here:hover{color:var(--accent);text-decoration:underline}
.frame{position:relative;width:100%;aspect-ratio:16/9;overflow:hidden;background:var(--paper);border:1px solid var(--rule)}
.stage{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0;transform:scale(var(--s))}
.figure .frame{cursor:zoom-in}

/* The authored slide: a fixed 1920 x 1080 page with absolutely positioned content. */
.stage section{position:relative;width:1920px;height:1080px;overflow:hidden;margin:0}
.stage section *{margin:0}
.stage section h2,.stage section h1{font-family:var(--serif)}
.stage section ul,.stage section ol{padding:0;list-style:none}
.stage section img{display:block}
.stage svg.connectors{position:absolute;left:0;top:0;width:1920px;height:1080px;pointer-events:none;overflow:visible}

/* Reflow slides: same text and emphasis, re-laid out as one column at reading size. */
.slide.reflow .frame{aspect-ratio:auto;overflow:visible;border:0;cursor:auto;background:none}
.slide.reflow .stage{position:static;width:auto;height:auto;transform:none;zoom:var(--rz,.5)}
.slide.reflow .stage section{width:auto!important;height:auto!important;min-height:0!important;overflow:visible;padding:64px 56px!important;display:flex!important;flex-direction:column!important;gap:28px!important;border:1px solid var(--rule)}
.slide.reflow .stage section *:not([data-logo]):not([data-logo-text]){position:static!important;left:auto!important;top:auto!important;right:auto!important;bottom:auto!important;width:auto!important;max-width:100%!important;height:auto!important;min-height:0!important;transform:none!important}
.slide.reflow .stage section div{flex-wrap:wrap}
.slide.reflow .stage section div > *{min-width:0}
.stage img[data-logo]{display:block;max-width:100%}
.slide.reflow .stage section p:has(> img[data-logo]){padding:30px 24px!important;min-height:140px!important}
@media (max-width:720px){
  .slide.reflow .stage section div{flex-direction:column!important;align-items:stretch!important}
  .slide.reflow .stage section *{grid-template-columns:1fr!important;grid-column:auto!important;grid-row:auto!important}
  .slide.reflow .stage section .inline-arrow{transform:rotate(90deg)!important;align-self:flex-start!important;margin:4px 0 4px 24px}
}
.slide.reflow .stage section h2,.slide.reflow .stage section h3,.slide.reflow .stage section p{overflow-wrap:break-word}
/* Display type above 90px on the stage is capped in read mode (present mode keeps the authored size). */
.slide.reflow .stage .big,.slide.divider .stage .big{font-size:84px!important;line-height:1.08!important}
@media (max-width:480px){.slide.reflow .stage .big,.slide.divider .stage .big{font-size:60px!important}}
.slide.reflow .stage section svg.connectors{display:none}
.slide.reflow .table-scroll{overflow-x:auto;max-width:100%}
.slide.reflow .table-scroll table{width:max-content!important;max-width:none!important}

/* Dividers: a section heading band in the words of the slide. */
.slide.divider .frame{aspect-ratio:auto;overflow:visible;border:0;cursor:auto}
.slide.divider .stage{position:static;width:auto;height:auto;transform:none;zoom:var(--rz,.5)}
.slide.divider .stage section{width:auto!important;height:auto!important;padding:72px 64px!important;display:flex!important;flex-direction:column!important;gap:24px!important}
.slide.divider .stage section *{position:static!important;width:auto!important;max-width:100%!important;height:auto!important;transform:none!important}
.slide.divider .stage section svg.connectors{display:none}

/* ---------- Zoom viewer ---------- */
#zoom{position:fixed;inset:0;z-index:50;background:rgba(15,22,29,.96);touch-action:none}
#zoom[hidden]{display:none}
.zoom-canvas{position:absolute;inset:0;overflow:hidden}
.zoom-canvas .stage{transform-origin:0 0}
.zoom-close{position:absolute;top:12px;right:12px;padding:8px 14px;font:600 15px var(--sans);color:var(--paper);background:var(--night);border:1px solid var(--muted);cursor:pointer}

/* ---------- Present mode ---------- */
#present{position:fixed;inset:0;z-index:40;background:var(--night-deep);overflow:hidden;user-select:none;-webkit-user-select:none;touch-action:pan-y}
#present[hidden]{display:none}
#present .viewport{position:absolute;inset:0}
#present .layer{position:absolute;left:0;top:0;width:1920px;height:1080px;transform-origin:0 0}
#present .layer.enter{opacity:0}
#present .hud{position:absolute;left:0;right:0;bottom:0;transition:opacity .4s}
#present.idle .hud,#present.idle .exit{opacity:0}
#present .progress{height:3px;background:rgba(255,255,255,.08)}
#present .progress span{display:block;height:100%;width:0;background:var(--accent-light);transition:width .3s}
#present .counter{position:absolute;right:16px;bottom:10px;margin:0;font:600 14px var(--sans);color:#c9d2db;letter-spacing:.04em}
#present .exit{position:absolute;top:12px;right:12px;padding:6px 12px;font:600 14px var(--sans);color:#c9d2db;background:transparent;border:1px solid #3a4652;cursor:pointer;transition:opacity .4s}
body.presenting{overflow:hidden}

/* Builds (present mode only). */
#present [data-step-hidden]{opacity:0;visibility:hidden}
#present [data-step-dim]{opacity:.35}
#present .b-anim{transition:opacity .2s,visibility .2s,color .4s,border-color .4s,background-color .4s,fill .4s,stroke .4s}
#present .b-pop{animation:bpop .25s ease-out}
@keyframes bpop{from{transform:scale(.92)}to{transform:none}}
#present [data-build-in^="grow-x"]{transform-origin:left center}
#present [data-build-in^="grow-y"]{transform-origin:center bottom}
/* State classes used by builds (present mode only). */
#present .b-strike{text-decoration:line-through;text-decoration-thickness:3px;text-decoration-color:currentColor}
#present .b-ink{color:var(--ink)!important}
#present .b-muted{color:var(--muted)!important}
/* Slide 3: the non-equity tiles are authored at 0.55 opacity; hold them at full strength until their step. */
#present .b-undim:not([data-step-hidden]){opacity:1!important}
/* Slide 20: emphasis in the deck's own highlight style (orange bar, light text), as on slide 31. */
#present .b-highlight{background:var(--accent);color:var(--card)!important;box-shadow:0 0 0 4px var(--accent)}
/* Ladder markers (slides 64 to 65): earlier states before they turn grey or amber. */
#present .b-red{background:#a8323a!important;color:#f7f9fc!important}
#present .b-red-soft{background:#d98a91!important;color:#f7f9fc!important}

/* Morphs (View Transitions). */
::view-transition-group(*){animation-duration:.5s;animation-timing-function:ease-in-out}
::view-transition-old(root),::view-transition-new(root){animation-duration:.3s}

@media (prefers-reduced-motion:reduce){
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  #present .b-anim,#present .progress span,#present .hud{transition:none!important}
  #present .b-pop{animation:none}
}

/* ---------- Print: read mode, one slide per block ---------- */
@media print{
  .actions,.sections,.slide-num,.present-here,.enlarge,#present,#zoom,.skip{display:none!important}
  body{font-size:11pt}
  .slide{break-inside:avoid;page-break-inside:avoid;margin:12px 0}
  .frame{border:0}
  a{color:inherit;text-decoration:none}
}
/* Read mode shows the fully built state, so anything that builds out is gone there. */
#deck [data-build-out]{display:none}
/* Opening straight into present mode: keep the reading page out of sight until it is asked for. */
.boot-present body > :not(#present){visibility:hidden}