@font-face{font-family:Poppins;src:url(fonts/poppins-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:Poppins;src:url(fonts/poppins-500.woff2) format('woff2');font-weight:500;font-display:swap}
@font-face{font-family:Poppins;src:url(fonts/poppins-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:Poppins;src:url(fonts/poppins-700.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:Poppins;src:url(fonts/poppins-800.woff2) format('woff2');font-weight:800;font-display:swap}

/* Palette = DNAF Indonesia logo: blue, cyan, graphite, navy. Nothing else. */
:root{
  --navy:#0A1E3C; --navy-2:#10294D; --navy-3:#1B3866;
  --blue:#1A7CE4; --cyan:#28B8E8; --graphite:#383838;
  --paper:#FFFFFF; --paper-2:#EEF4FA; --paper-3:#DCE7F3;
  --ink:var(--graphite); --ink-2:#5C6470; --ink-3:#8A929C;
  --line:rgba(56,56,56,.16);
  --shadow:0 18px 50px -22px rgba(10,30,60,.45);
}

*{box-sizing:border-box}
figure,figcaption{margin:0}
html,body{height:100%}
body{
  margin:0;background:#061224;color:var(--ink);
  font-family:Poppins,"Segoe UI",system-ui,sans-serif;
  overflow:hidden;-webkit-font-smoothing:antialiased;
}

/* ---------- viewport + fixed 1920x1080 stage ---------- */
#viewport{position:fixed;inset:0;overflow:hidden}
#stage{
  position:absolute;left:50%;top:50%;width:1920px;height:1080px;
  transform:translate(-50%,-50%) scale(var(--scale,1));transform-origin:center center;
  background:var(--paper);box-shadow:0 40px 120px -40px rgba(0,0,0,.8);
}
.slide{
  position:absolute;inset:0;background:var(--paper);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .42s ease,transform .42s cubic-bezier(.22,.61,.36,1);
  transform:translateX(28px);overflow:hidden;
}
.slide.is-active{opacity:1;visibility:visible;pointer-events:auto;transform:none;z-index:2}
.slide.is-leaving{opacity:0;transform:translateX(-28px);z-index:1}

/* ---------- shared type ---------- */
.eyebrow{font-size:19px;letter-spacing:.22em;text-transform:uppercase;color:var(--blue);font-weight:700}
.h2{font-size:72px;line-height:1;font-weight:800;letter-spacing:-.025em;margin:0}
.lede{font-size:26px;line-height:1.6;color:var(--ink-2);font-weight:400;margin:0}
.body{font-size:22px;line-height:1.6;color:var(--ink-2);margin:0}
.rule{height:4px;width:96px;background:var(--cyan);border:0;margin:0;border-radius:2px}
.dark{background:var(--navy);color:#fff}
.dark .lede,.dark .body{color:rgba(255,255,255,.76)}
.dark .eyebrow{color:var(--cyan)}
.mark{position:absolute;right:72px;top:56px;height:52px;z-index:3}
.slidehead{display:flex;flex-direction:column;gap:16px}
.slidehead .h2{max-width:1300px}

/* ---------- cover ---------- */
.s-cover{background:var(--navy)}
.s-cover .plate{position:absolute;inset:0;background:url(img/cover-plant.jpg) center/cover no-repeat}
.s-cover .plate::after{content:"";position:absolute;inset:0;
  background:linear-gradient(100deg,rgba(6,18,36,.95) 0%,rgba(6,18,36,.78) 46%,rgba(6,18,36,.35) 100%)}
.s-cover .inner{position:absolute;inset:0;padding:110px 132px;display:flex;flex-direction:column;justify-content:space-between;color:#fff}
.s-cover .logo{width:300px;display:block}
.s-cover .co{margin-top:14px;font-size:17px;letter-spacing:.3em;text-transform:uppercase;color:rgba(255,255,255,.66);font-weight:600}
.s-cover .year{font-size:19px;letter-spacing:.34em;text-transform:uppercase;color:var(--cyan);font-weight:700}
.s-cover h1{font-size:112px;line-height:.94;font-weight:800;letter-spacing:-.035em;margin:20px 0 0;max-width:1240px}
.s-cover .sub{font-size:28px;color:rgba(255,255,255,.78);margin:26px 0 0;max-width:1000px;line-height:1.5}
.s-cover .grade{display:inline-flex;align-items:center;gap:14px;margin-top:34px;
  border:1px solid rgba(255,255,255,.28);border-radius:999px;padding:12px 26px;font-size:20px;font-weight:600}
.s-cover .grade i{width:10px;height:10px;border-radius:50%;background:var(--cyan);display:block;font-style:normal}
.s-cover .startline{display:flex;align-items:center;gap:14px;font-size:19px;color:rgba(255,255,255,.62)}
.kbd{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 10px;border:1px solid rgba(255,255,255,.34);
  border-radius:7px;font-size:16px;font-weight:600;color:#fff;background:rgba(255,255,255,.07)}

/* ---------- split (text | photo) ---------- */
.s-split{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
.s-split .pane{padding:110px 92px 110px 132px;display:flex;flex-direction:column;justify-content:center;gap:30px}
.s-split .art{background-size:cover;background-position:center;position:relative}
.s-split .art .cap{position:absolute;left:0;right:0;bottom:0;padding:26px 40px;font-size:16px;
  color:rgba(255,255,255,.8);background:linear-gradient(0deg,rgba(6,18,36,.85),rgba(6,18,36,0))}
.s-split.dark .pane{padding-right:100px}
.facts{display:flex;flex-wrap:wrap;gap:12px;margin-top:4px}
.facts span{font-size:18px;font-weight:600;border:1px solid var(--line);border-radius:999px;padding:9px 20px;color:var(--ink)}
.dark .facts span{border-color:rgba(255,255,255,.26);color:#fff}
.facts span b{color:var(--blue);font-weight:700}
.dark .facts span b{color:var(--cyan)}
.roles{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 32px;margin:8px 0 0;padding:0;list-style:none}
.roles li{font-size:21px;font-weight:600;color:#fff;padding-left:26px;position:relative;line-height:1.35}
.roles li::before{content:"";position:absolute;left:0;top:12px;width:10px;height:10px;border-radius:50%;background:var(--cyan)}
.roles li em{display:block;font-style:normal;font-weight:400;font-size:17px;color:rgba(255,255,255,.62)}

/* ---------- numbered list beside photo ---------- */
.s-why{padding:92px 132px 96px;display:grid;grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);gap:72px;align-items:start}
.s-why .photo{border-radius:16px;overflow:hidden;box-shadow:var(--shadow);height:100%;background:var(--paper-2);cursor:zoom-in}
.s-why .photo img{width:100%;height:100%;object-fit:cover;display:block}
.s-why .list{display:flex;flex-direction:column;gap:26px}
.pt{display:grid;grid-template-columns:72px 1fr;gap:26px;align-items:start}
.pt .n{width:72px;height:72px;border-radius:50%;background:var(--navy);color:#fff;display:grid;place-items:center;
  font-size:26px;font-weight:800;letter-spacing:-.02em}
.pt:nth-child(even) .n{background:var(--blue)}
.pt h4{font-size:28px;font-weight:700;margin:6px 0 8px;letter-spacing:-.015em;line-height:1.15}
.pt p{font-size:20px;line-height:1.52;color:var(--ink-2);margin:0}

/* ---------- process ---------- */
.s-proc{padding:92px 132px 88px;display:flex;flex-direction:column;justify-content:center;gap:48px}
.proc-top{display:grid;grid-template-columns:1fr 60px 1fr 60px 1fr;align-items:center;gap:20px}
.pstep{display:flex;flex-direction:column;gap:14px}
.pstep .box{border-radius:16px;overflow:hidden;box-shadow:var(--shadow);height:290px;background:var(--paper-2)}
.pstep .box img{width:100%;height:100%;object-fit:cover;display:block}
.pstep .lbl{font-size:21px;font-weight:700;color:var(--ink)}
.pstep .lbl em{display:block;font-style:normal;font-weight:400;font-size:17px;color:var(--ink-3);margin-top:2px}
.arrow{width:60px;height:60px;color:var(--blue)}
.arrow svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.proc-out{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px;position:relative;padding-top:34px}
.proc-out::before{content:"";position:absolute;left:12%;right:12%;top:0;height:3px;background:var(--paper-3);border-radius:2px}
.out{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px}
.out .im{width:150px;height:150px;border-radius:12px;overflow:hidden;background:var(--paper-2)}
.out .im img{width:100%;height:100%;object-fit:cover;display:block}
.out .im.gas{display:grid;place-items:center;background:var(--navy);color:var(--cyan)}
.out .im.gas svg{width:76px;height:76px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.out b{display:block;font-size:44px;font-weight:800;letter-spacing:-.03em;line-height:1;color:var(--navy)}
.out.hero b{color:var(--blue)}
.out span{display:block;font-size:19px;font-weight:600;margin-top:8px;color:var(--ink)}
.out em{display:block;font-style:normal;font-size:15px;color:var(--ink-3);margin-top:4px;line-height:1.35}

/* ---------- three-column cards ---------- */
.s-pad{padding:96px 132px;display:flex;flex-direction:column;justify-content:center;gap:60px}
.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.card{background:#fff;border:1px solid var(--line);border-radius:20px;padding:40px 36px 38px;display:flex;flex-direction:column;gap:18px;
  position:relative;overflow:hidden}
.card::after{content:"";position:absolute;left:0;right:0;bottom:0;height:5px;background:var(--blue);
  transform:scaleX(0);transform-origin:left;transition:transform .55s ease}
.slide.is-active .card::after{transform:scaleX(1)}
.slide.is-active .card:nth-child(2)::after{transition-delay:.12s}
.slide.is-active .card:nth-child(3)::after{transition-delay:.24s}
.card .ic{width:76px;height:76px;border-radius:18px;background:var(--paper-2);color:var(--blue);display:grid;place-items:center}
.card .ic svg{width:40px;height:40px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.card h4{font-size:29px;font-weight:700;margin:0;letter-spacing:-.015em;line-height:1.15}
.card p{font-size:20px;line-height:1.55;color:var(--ink-2);margin:0}
.dark .card{background:var(--navy-2);border-color:rgba(255,255,255,.12)}
.dark .card .ic{background:rgba(255,255,255,.08);color:var(--cyan)}
.dark .card p{color:rgba(255,255,255,.72)}
.dark .card::after{background:var(--cyan)}

/* ---------- specs ---------- */
.s-spec{padding:88px 132px 84px;display:grid;grid-template-rows:auto auto auto;align-content:center;gap:42px}
.kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px}
.kpi{background:var(--navy);color:#fff;border-radius:18px;padding:26px 28px 24px}
.kpi:nth-child(1){background:var(--blue)}
.kpi b{display:block;font-size:56px;font-weight:800;letter-spacing:-.03em;line-height:1}
.kpi b small{font-size:26px;font-weight:600;margin-left:2px}
.kpi span{display:block;font-size:17px;color:rgba(255,255,255,.72);margin-top:8px;font-weight:500;letter-spacing:.02em}
.spec-grid{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:56px;align-items:start;min-height:0}
table.spec{width:100%;border-collapse:collapse;font-size:19px}
table.spec th{font-size:15px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3);text-align:left;padding:0 18px 12px;font-weight:700;border-bottom:2px solid var(--navy)}
table.spec td{padding:12px 18px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.35}
table.spec td:first-child{font-weight:600;color:var(--ink)}
table.spec td.v{font-weight:700;color:var(--blue);white-space:nowrap}
table.spec td.r{color:var(--ink-2);white-space:nowrap}
table.spec td.m{color:var(--ink-3);font-size:16px}
.spec-notes{display:flex;flex-direction:column;gap:18px}
.spec-notes h4{font-size:15px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-3);margin:0;font-weight:700}
.spec-notes dl{margin:0;display:grid;gap:12px}
.spec-notes dt{font-size:20px;font-weight:700;color:var(--ink)}
.spec-notes dd{margin:2px 0 0;font-size:17px;line-height:1.5;color:var(--ink-2)}
.srcnote{font-size:15px;line-height:1.5;color:var(--ink-3);border-left:3px solid var(--cyan);padding-left:16px}

/* ---------- certification ---------- */
.s-cert{padding:88px 132px;display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:80px;align-items:center}
.s-cert .doc{border-radius:12px;overflow:hidden;box-shadow:0 30px 70px -30px rgba(10,30,60,.55);background:#fff;cursor:zoom-in;width:100%;aspect-ratio:1400/1981;max-height:900px;border:1px solid var(--line)}
.s-cert .doc img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.s-cert .info{display:flex;flex-direction:column;gap:34px}
.checks{margin:0;padding:0;list-style:none;display:grid;gap:20px}
.checks li{display:grid;grid-template-columns:44px 1fr;gap:18px;align-items:start;font-size:21px;line-height:1.45;color:var(--ink-2)}
.checks li b{color:var(--ink);font-weight:700}
.checks .ck{width:44px;height:44px;border-radius:50%;background:var(--blue);color:#fff;display:grid;place-items:center;margin-top:2px}
.checks .ck svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.docbtns{display:flex;gap:14px;flex-wrap:wrap}
.docbtn{display:inline-flex;align-items:center;gap:12px;border-radius:12px;padding:16px 24px;font-size:18px;font-weight:600;text-decoration:none;
  background:var(--navy);color:#fff;transition:background .2s}
.docbtn:hover{background:var(--blue)}
.docbtn.alt{background:#fff;color:var(--navy);border:1px solid var(--line)}
.docbtn.alt:hover{background:var(--paper-2)}
.docbtn svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* ---------- applications ---------- */
.apps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.app{border-radius:20px;padding:36px 32px;background:var(--navy-2);border:1px solid rgba(255,255,255,.12);display:flex;flex-direction:column;gap:16px;min-height:430px}
.app .ic{width:70px;height:70px;border-radius:16px;background:rgba(40,184,232,.14);color:var(--cyan);display:grid;place-items:center}
.app .ic svg{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.app h4{font-size:27px;font-weight:700;margin:6px 0 0;letter-spacing:-.015em;line-height:1.15;color:#fff}
.app ul{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.app li{font-size:18px;line-height:1.4;color:rgba(255,255,255,.72);padding-left:18px;position:relative}
.app li::before{content:"";position:absolute;left:0;top:11px;width:7px;height:7px;border-radius:50%;background:var(--cyan)}
.app .hs{margin-top:auto;font-size:14px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.5);font-weight:700}

/* ---------- packaging ---------- */
.s-pack{padding:88px 132px;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:72px;align-items:center}
.s-pack .photos{display:grid;grid-template-columns:1fr 1fr;gap:18px;height:880px}
.s-pack .photos .shot:first-child{grid-row:span 2}
.shot{position:relative;overflow:hidden;border-radius:16px;background:var(--paper-2);box-shadow:var(--shadow);cursor:zoom-in;min-height:0}
.shot img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,.61,.36,1)}
.shot:hover img{transform:scale(1.035)}
.s-pack .info{display:flex;flex-direction:column;gap:30px}
.packs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pack{background:#fff;border:1px solid var(--line);border-radius:16px;padding:22px 22px 20px}
.pack b{display:block;font-size:40px;font-weight:800;letter-spacing:-.03em;color:var(--navy);line-height:1}
.pack b small{font-size:20px;font-weight:600;margin-left:3px}
.pack span{display:block;font-size:16px;color:var(--ink-2);margin-top:8px;line-height:1.4}
.feat{margin:0;padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 28px}
.feat li{font-size:19px;line-height:1.45;color:var(--ink-2);padding-left:24px;position:relative}
.feat li::before{content:"";position:absolute;left:0;top:11px;width:9px;height:9px;border-radius:50%;background:var(--blue)}
.feat li b{color:var(--ink)}

/* ---------- export & compliance ---------- */
.s-exp{padding:96px 132px}
.exp{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.exp .cell{border-top:3px solid var(--cyan);padding-top:26px;display:flex;flex-direction:column;gap:14px}
.exp .cell h4{font-size:26px;font-weight:700;margin:0;line-height:1.15;letter-spacing:-.015em}
.exp .cell p{font-size:19px;line-height:1.5;color:rgba(255,255,255,.72);margin:0}
.exp .cell .big{font-size:46px;font-weight:800;letter-spacing:-.03em;color:var(--cyan);line-height:1}
.exp .cell .big small{font-size:18px;font-weight:600;color:rgba(255,255,255,.6);display:block;margin-top:6px;letter-spacing:.06em}

/* ---------- closing ---------- */
.s-close{background:var(--navy);color:#fff}
.s-close .plate{position:absolute;inset:0;background:url(img/skyline.jpg) center/cover no-repeat}
.s-close .plate::after{content:"";position:absolute;inset:0;background:linear-gradient(75deg,rgba(6,18,36,.95) 20%,rgba(6,18,36,.55) 100%)}
.s-close .inner{position:absolute;inset:0;padding:132px;display:grid;grid-template-columns:1.1fr .9fr;align-items:end;gap:60px}
.s-close h2{font-size:104px;font-weight:800;letter-spacing:-.035em;margin:0;line-height:.95}
.s-close .logo{width:280px;display:block;margin-bottom:40px}
.s-close .contact{font-size:22px;line-height:1.7;color:rgba(255,255,255,.8)}
.s-close .contact b{color:#fff;font-weight:700;font-size:26px}
.s-close .contact a{color:var(--cyan);text-decoration:none}
.s-close hr{border:0;border-top:1px solid rgba(255,255,255,.28);margin:22px 0}
.s-close .tiny{font-size:16px;color:rgba(255,255,255,.55);line-height:1.5}

/* ================= deck chrome ================= */
#chrome{position:fixed;inset:0;pointer-events:none;z-index:40;font-size:14px;opacity:1;transition:opacity .5s ease}
#chrome.idle{opacity:0}
#chrome > *{pointer-events:auto}
#bar{position:fixed;left:0;right:0;top:0;height:3px;background:rgba(255,255,255,.1)}
#bar i{display:block;height:100%;width:0;background:var(--cyan);transition:width .42s ease}
.navbtn{position:fixed;top:50%;transform:translateY(-50%);width:52px;height:52px;border-radius:50%;
  border:1px solid rgba(255,255,255,.16);background:rgba(6,18,36,.55);color:#fff;cursor:pointer;
  display:grid;place-items:center;transition:background .2s,opacity .2s;opacity:.35;backdrop-filter:blur(6px)}
.navbtn:hover{background:rgba(6,18,36,.9);opacity:1}
.navbtn svg{width:18px;height:18px;stroke:#fff;stroke-width:2.2;fill:none}
#prev{left:22px}
#next{right:22px}
#hud{position:fixed;right:22px;bottom:20px;display:flex;align-items:center;gap:10px;color:rgba(255,255,255,.72)}
#hud button,#hud a{border:1px solid rgba(255,255,255,.16);background:rgba(6,18,36,.55);color:rgba(255,255,255,.8);
  border-radius:9px;height:34px;padding:0 12px;cursor:pointer;font:600 13px/1 Poppins,sans-serif;
  backdrop-filter:blur(6px);display:inline-flex;align-items:center;text-decoration:none}
#hud button:hover,#hud a:hover{background:rgba(6,18,36,.9);color:#fff}
#hud #pdfbtn{border-color:rgba(40,184,232,.55);color:var(--cyan)}
#hud #pdfbtn:hover{background:var(--blue);border-color:var(--blue);color:#fff}
#count{font-variant-numeric:tabular-nums;font-weight:600;letter-spacing:.04em;
  background:rgba(6,18,36,.55);backdrop-filter:blur(6px);border-radius:8px;padding:8px 12px}
#seclabel{position:fixed;left:22px;bottom:20px;color:rgba(255,255,255,.72);font-weight:600;letter-spacing:.16em;
  text-transform:uppercase;font-size:12px;background:rgba(6,18,36,.55);backdrop-filter:blur(6px);border-radius:8px;padding:9px 12px}

/* contents panel */
#toc{position:fixed;inset:0;background:rgba(6,18,36,.94);backdrop-filter:blur(10px);z-index:60;padding:64px 72px;overflow:auto;display:none}
#toc.open{display:block}
#toc h3{color:#fff;font-size:15px;letter-spacing:.24em;text-transform:uppercase;margin:0 0 30px;font-weight:700}
#toc .cols{columns:3;column-gap:44px}
#toc section{break-inside:avoid;margin-bottom:30px}
#toc h4{color:var(--cyan);font-size:13px;letter-spacing:.2em;text-transform:uppercase;margin:0 0 12px;font-weight:700}
#toc a{display:flex;gap:12px;color:rgba(255,255,255,.72);text-decoration:none;font-size:15px;line-height:1.4;padding:5px 0;cursor:pointer}
#toc a:hover{color:#fff}
#toc a.cur{color:var(--cyan)}
#toc a em{font-style:normal;color:rgba(255,255,255,.32);font-variant-numeric:tabular-nums;min-width:26px}

/* lightbox */
#lb{position:fixed;inset:0;background:rgba(6,18,36,.95);z-index:70;display:none;place-items:center;padding:48px}
#lb.open{display:grid}
#lb img{max-width:94vw;max-height:90vh;object-fit:contain;box-shadow:0 30px 90px -30px #000;border-radius:8px;background:#fff}
#lb video{max-width:min(94vw,520px);max-height:90vh;border-radius:14px;background:#000}
#lb .close{position:fixed;top:22px;right:26px;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.08);color:#fff;font-size:22px;cursor:pointer;line-height:1}
#lb .lbcap{position:fixed;left:0;right:0;bottom:26px;text-align:center;color:rgba(255,255,255,.7);font-size:15px}
#help{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:80;background:rgba(8,22,44,.97);
  border:1px solid rgba(255,255,255,.14);border-radius:16px;padding:32px 36px;color:#fff;display:none;min-width:380px}
#help.open{display:block}
#help h3{margin:0 0 18px;font-size:15px;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan)}
#help dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:10px 20px;align-items:center}
#help dt{margin:0}
#help dd{margin:0;color:rgba(255,255,255,.7);font-size:14px}

/* ================= print / PDF =================
   One 1920x1080 page per slide; colours forced on or the navy slides print white. */
@media print{
  @page{size:1920px 1080px;margin:0}
  *,*::before,*::after{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  html,body{height:auto;overflow:visible;background:#fff}
  #viewport{position:static;display:block;overflow:visible}
  #stage{position:static;transform:none;width:1920px;height:auto;box-shadow:none;background:none}
  .slide{position:relative;inset:auto;width:1920px;height:1080px;
    opacity:1 !important;visibility:visible !important;transform:none !important;transition:none !important;
    overflow:hidden;box-shadow:none;break-after:page;page-break-after:always;break-inside:avoid}
  .slide:last-child{break-after:auto;page-break-after:auto}
  .card::after{transform:scaleX(1) !important;transition:none !important}
  #chrome,#toc,#lb,#help{display:none !important}
  .s-cover .startline{visibility:hidden}
  .shot img{transform:none !important}
}