/* ============================================================
   IMPACTER deck.css — shared foundation for every deck page.
   Tokens + base + slide surfaces + reveal + type + chrome +
   reusable components. Page-specific styles go in each page's
   own <style> block — never in this file.
   Visual language: pitch.impacterpathway.com.
   ============================================================ */
@font-face{
  font-family:'Hanken Grotesk';
  src:url('/assets/fonts/hanken-grotesk-latin-var.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:'Hanken Grotesk';
  src:url('/assets/fonts/hanken-grotesk-latin-ext-var.woff2') format('woff2');
  font-weight:100 900;font-style:normal;font-display:swap;
  unicode-range:U+0100-02AF,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:'JetBrains Mono';
  src:url('/assets/fonts/jetbrains-mono-latin-var.woff2') format('woff2');
  font-weight:100 800;font-style:normal;font-display:swap;
}
:root{
  --blue:#638EC5; --blue-deep:#3F6BA3; --blue-lt:#A8C8F0;
  --coral:#F37163; --coral-deep:#D94040;
  --navy:#0A1A32; --navy-deep:#050E1E; --navy-2:#162235;
  --paper:#F1F0EE; --cream:#F0EBE3;
  --ink:#0A1A32;
  --t2:rgba(29,27,28,.62); --t3:rgba(29,27,28,.4);
  --d1:rgba(219,232,255,.95); --d2:rgba(219,232,255,.62); --d3:rgba(219,232,255,.36);
  --border:rgba(29,27,28,.09); --border-strong:rgba(29,27,28,.16);
  --d-border:rgba(99,142,197,.16);
  --font-display:'Hanken Grotesk',system-ui,sans-serif;
  --font-mono:'JetBrains Mono','SF Mono',monospace;
  --ease:cubic-bezier(.22,.61,.36,1);
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{
  background:var(--navy-deep);color:var(--ink);
  font-family:var(--font-display);line-height:1.5;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer}

/* ---------- deck ---------- */
#deck{position:fixed;inset:0}
.slide{
  position:absolute;inset:0;overflow:hidden;
  display:flex;align-items:center;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .55s var(--ease),visibility 0s linear .55s;
}
.slide.active{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .55s var(--ease)}
.slide-inner{width:100%;max-width:1280px;margin:0 auto;padding:110px 72px 120px}

/* dark / light slide surfaces */
.slide.dark{background:radial-gradient(120% 140% at 78% 12%,#12294a 0%,var(--navy) 44%,var(--navy-deep) 100%);color:var(--d1)}
.slide.dark::before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:linear-gradient(rgba(99,142,197,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(99,142,197,.07) 1px,transparent 1px);
  background-size:56px 56px;
}
.slide.light{background:var(--paper);color:var(--ink)}

/* reveal choreography */
.rev{opacity:0;transform:translateY(18px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.slide.active .rev{opacity:1;transform:none}
.slide.active .rev.d1{transition-delay:.08s}
.slide.active .rev.d2{transition-delay:.18s}
.slide.active .rev.d3{transition-delay:.3s}
.slide.active .rev.d4{transition-delay:.42s}
.slide.active .rev.d5{transition-delay:.54s}

/* ---------- type ---------- */
.eyebrow{
  font-family:var(--font-mono);font-size:11px;font-weight:700;
  letter-spacing:.22em;text-transform:uppercase;color:var(--coral);
  display:inline-flex;align-items:center;gap:12px;margin-bottom:22px;
}
.slide.dark .eyebrow{color:var(--blue-lt)}
.chip{
  font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--coral);
  border:1px solid rgba(243,113,99,.45);background:rgba(243,113,99,.12);
  border-radius:6px;padding:4px 10px;
}
.hd{
  font-size:clamp(34px,4.6vw,62px);font-weight:800;letter-spacing:-.03em;line-height:1.04;
  max-width:20ch;text-wrap:balance;
}
.hd.hd-sm{font-size:clamp(28px,3.6vw,48px);max-width:26ch}
.hd .acc{
  background:linear-gradient(100deg,var(--coral) 10%,#c98db8 55%,var(--blue-lt) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.slide.light .hd .acc{background:linear-gradient(100deg,var(--coral-deep),var(--coral) 60%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:clamp(15px,1.4vw,19px);line-height:1.6;color:var(--t2);max-width:58ch;margin-top:20px}
.slide.dark .lead{color:var(--d2)}
.footnote{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.08em;color:var(--t3);margin-top:26px}
.slide.dark .footnote{color:var(--d3)}

/* ---------- chrome (counter · dots · arrows · brand) ---------- */
#chrome{position:fixed;left:0;right:0;bottom:0;padding:0 28px 24px;display:flex;align-items:center;justify-content:space-between;z-index:40;pointer-events:none}
#counter{
  pointer-events:auto;font-family:var(--font-mono);font-size:12px;font-weight:700;letter-spacing:.08em;
  background:#fff;color:var(--ink);border-radius:999px;padding:9px 16px;
  box-shadow:0 4px 18px rgba(5,14,30,.18);
}
#dots{pointer-events:auto;display:flex;gap:9px;align-items:center}
#dots button{
  width:9px;height:9px;border-radius:999px;border:0;background:rgba(120,140,175,.4);
  transition:all .35s var(--ease);padding:0;
}
#dots button.on{width:30px;background:var(--coral)}
#arrows{pointer-events:auto;display:flex;gap:10px}
#arrows button{
  width:44px;height:44px;border-radius:999px;border:0;background:#fff;color:var(--ink);
  box-shadow:0 4px 18px rgba(5,14,30,.18);display:flex;align-items:center;justify-content:center;
  transition:transform .16s,opacity .16s;
}
#arrows button:hover{transform:translateY(-1px)}
#arrows button:disabled{opacity:.35;cursor:default;transform:none}
#arrows svg{width:16px;height:16px}
#brand{position:fixed;top:24px;left:28px;z-index:40;height:26px;transition:opacity .5s}
#brand img{height:100%;width:auto}
#brand.hide{opacity:0;pointer-events:none}

/* ---------- reusable components ---------- */
/* white card on light slides */
.card{background:#fff;border:1px solid var(--border);border-radius:16px}
/* translucent card on dark slides */
.card-dark{background:rgba(255,255,255,.04);border:1px solid var(--d-border);border-radius:18px}
/* mono word/tag pill (dark surfaces) */
.pill{
  font-family:var(--font-mono);font-size:12px;color:var(--blue-lt);
  border:1px solid var(--d-border);border-radius:999px;padding:5px 13px;
}
@keyframes pop{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.35}}

/* ---------- interactive rubric (rubric.js) ---------- */
.rubric{
  display:grid;gap:10px;
  max-height:min(54vh,520px);overflow-y:auto;overscroll-behavior:contain;
  padding-right:6px;scrollbar-width:thin;scrollbar-color:rgba(120,140,175,.5) transparent;
}
.rubric::-webkit-scrollbar{width:6px}
.rubric::-webkit-scrollbar-thumb{background:rgba(120,140,175,.5);border-radius:99px}
.rub-row{background:#fff;border:1px solid var(--border);border-radius:14px;padding:12px 16px}
.slide.dark .rub-row{background:rgba(255,255,255,.04);border-color:var(--d-border)}
.rub-row-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.rub-name{font-size:14.5px;font-weight:800;letter-spacing:-.01em}
.slide.dark .rub-name{color:var(--d1)}
.rub-pills{display:flex;gap:6px;flex-wrap:wrap}
.rub-pill{
  display:inline-flex;align-items:baseline;gap:6px;border:1px solid var(--border-strong);
  background:transparent;color:inherit;border-radius:999px;padding:5px 12px;
  transition:all .18s var(--ease);
}
.rub-pill-key{font-family:var(--font-mono);font-size:10px;font-weight:700}
.rub-pill-lbl{font-size:12px;font-weight:700;letter-spacing:-.01em}
.slide.dark .rub-pill{border-color:var(--d-border);color:var(--d2)}
.rub-pill:hover{border-color:var(--blue)}
.rub-pill.on{background:var(--navy);border-color:var(--navy);color:#fff}
.slide.dark .rub-pill.on{background:var(--coral);border-color:var(--coral);color:#fff}
.rub-panel{margin-top:12px;border-top:1px dashed var(--border-strong);padding-top:12px}
.slide.dark .rub-panel{border-color:var(--d-border)}
.rub-panel-meta{display:flex;gap:14px;align-items:baseline;flex-wrap:wrap;margin-bottom:6px}
.rub-panel-level{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--coral)}
.rub-panel-anchor{font-family:var(--font-mono);font-size:10px;letter-spacing:.06em;color:var(--t3)}
.slide.dark .rub-panel-anchor{color:var(--d3)}
.rub-panel-text{font-size:13.5px;line-height:1.6;color:var(--t2);max-width:88ch}
.slide.dark .rub-panel-text{color:var(--d2)}
.rub-footnote{font-family:var(--font-mono);font-size:10px;letter-spacing:.04em;color:var(--t3);padding:2px 4px}
.slide.dark .rub-footnote{color:var(--d3)}

/* ---------- student response card (shared demo layout) ---------- */
.resp-card{background:var(--navy);color:var(--d1);border:1px solid rgba(99,142,197,.25);border-radius:18px;padding:24px 26px}
.resp-head{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.resp-who b{font-size:15px;font-weight:800;letter-spacing:-.01em;display:block}
.resp-who span{font-family:var(--font-mono);font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--d3)}
.resp-play{margin-left:auto;display:flex;align-items:center;gap:10px}
.resp-card audio{width:100%;margin:6px 0 12px;border-radius:10px}
.resp-card video{width:100%;border-radius:12px;margin:6px 0 12px;background:#000}
.resp-card blockquote{font-size:14.5px;line-height:1.75;color:var(--d1);font-weight:500}
.resp-card blockquote mark{background:rgba(243,113,99,.22);color:#ffd9d3;border-radius:4px;padding:1px 5px;font-weight:700}
.resp-sigs{margin-top:14px;border-top:1px solid rgba(99,142,197,.25);padding-top:12px;display:flex;gap:8px;flex-wrap:wrap}
.resp-sigs span{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-lt);border:1px solid var(--d-border);border-radius:999px;padding:4px 11px}
.media-todo{border:2px dashed rgba(120,140,175,.5);border-radius:12px;padding:26px;text-align:center;font-family:var(--font-mono);font-size:11px;letter-spacing:.08em;color:var(--t3)}
.slide.dark .media-todo{color:var(--d3)}

/* student response layout: vertical video + verbatim transcript */
.resp-grid{display:grid;grid-template-columns:minmax(220px,300px) 1fr;gap:26px;align-items:start;margin-top:26px}
.resp-vid{position:relative}
.resp-vid video{width:100%;aspect-ratio:9/16;object-fit:cover;border-radius:16px;background:#0A1A32;box-shadow:0 18px 44px rgba(10,26,50,.22)}
.resp-vid .rv-cap{margin-top:10px;font-family:var(--font-mono);font-size:10px;letter-spacing:.08em;color:var(--t3);text-align:center}
.slide.dark .resp-vid .rv-cap{color:var(--d3)}
.resp-body{background:var(--navy);color:var(--d1);border:1px solid rgba(99,142,197,.25);border-radius:18px;padding:24px 26px}
.resp-body .rb-head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.resp-body .rb-head b{font-size:15px;font-weight:800;letter-spacing:-.01em}
.resp-body .rb-head span{font-family:var(--font-mono);font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--d3)}
.resp-body .rb-prompt{font-family:var(--font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-lt);margin-bottom:12px}
.resp-body blockquote{font-size:13.5px;line-height:1.75;color:var(--d1);font-weight:500;max-height:38vh;overflow-y:auto;padding-right:6px;scrollbar-width:thin}
.resp-body blockquote mark{background:rgba(243,113,99,.22);color:#ffd9d3;border-radius:4px;padding:1px 5px;font-weight:700}
.resp-body .rb-sigs{margin-top:14px;border-top:1px solid rgba(99,142,197,.25);padding-top:12px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.resp-body .rb-sigs .lbl{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--d3);margin-right:4px}
.resp-body .rb-sigs span:not(.lbl){font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--blue-lt);border:1px solid var(--d-border);border-radius:999px;padding:4px 11px}
@media (max-width:980px){.resp-grid{grid-template-columns:1fr}.resp-vid video{max-width:260px;margin:0 auto;display:block}}

/* ---------- report showcase (screenshot card + click-out) ---------- */
.reports{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:34px}
.report-card{display:block;text-decoration:none;background:#fff;border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:all .25s var(--ease)}
.slide.dark .report-card{background:rgba(255,255,255,.04);border-color:var(--d-border)}
.report-card:hover{transform:translateY(-4px);box-shadow:0 16px 38px rgba(10,26,50,.14)}
.report-card img{width:100%;aspect-ratio:16/10;object-fit:cover;object-position:top;border-bottom:1px solid var(--border)}
.report-card .rc-body{padding:14px 18px 16px}
.report-card .rc-tag{font-family:var(--font-mono);font-size:9.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--coral);margin-bottom:6px}
.report-card b{font-size:14.5px;font-weight:800;letter-spacing:-.01em;display:block}
.slide.dark .report-card b{color:var(--d1)}
.report-card .rc-open{margin-top:8px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;color:var(--blue-deep);display:inline-block}
.slide.dark .report-card .rc-open{color:var(--blue-lt)}

/* ---------- shared-demo slides (partials/shared-demo.html) ---------- */
.cols2{display:grid;grid-template-columns:1fr .95fr;gap:56px;align-items:center}
/* ---- flex player mock (the real answer flow, driven by prompt.js) ----
   Mirrors flex.impacterpathway.com: portrait film on the left, answer panel
   on the right. The mock's height drives the film's width (2:3 native, so
   width = height × .667) — the frame is never cropped, and the panel takes
   whatever width is left. AUDIO and TEXT are live: they switch panes the
   same way the product does. */
.flexmock{
  display:flex;margin:28px 0 0;width:100%;height:min(38vh,470px);
  background:#fff;border-radius:16px;overflow:hidden;box-shadow:0 20px 50px rgba(10,26,50,.2);
}
.flexmock .fm-media{flex:0 0 auto;height:100%;aspect-ratio:2/3;position:relative;background:#000}
.flexmock .fm-media video{width:100%;height:100%;object-fit:contain;display:block}
.flexmock .fm-panel{
  flex:1;min-width:0;background:#DCE4EA;position:relative;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:26px 22px;text-align:center;
}
.flexmock .fm-x{
  position:absolute;top:12px;right:12px;width:26px;height:26px;border:0;border-radius:999px;
  background:rgba(29,27,28,.28);color:#fff;display:flex;align-items:center;justify-content:center;
  transition:background .18s;
}
.flexmock .fm-x:hover{background:rgba(29,27,28,.45)}
.flexmock .fm-x svg{width:11px;height:11px}
/* panes — one visible at a time */
.flexmock .fm-pane{display:none;width:100%;flex-direction:column;align-items:center}
.flexmock .fm-pane.on{display:flex;animation:pop .3s var(--ease) both}
.flexmock .fm-q{font-size:clamp(15px,1.4vw,19px);font-weight:700;letter-spacing:-.01em;color:var(--ink)}
.flexmock .fm-opts{display:flex;gap:12px;margin-top:20px}
.flexmock .fm-opt{
  width:clamp(64px,6vw,80px);aspect-ratio:1;border:0;border-radius:10px;
  background:var(--blue);color:#fff;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:7px;
  transition:transform .16s var(--ease),background .16s;
}
.flexmock .fm-opt:hover{background:var(--blue-deep);transform:translateY(-2px)}
.flexmock .fm-opt svg{width:19px;height:19px}
.flexmock .fm-opt span{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.12em}
.flexmock .fm-note{margin-top:18px;font-size:11.5px;color:var(--t2)}
/* recording pane */
.flexmock .fm-live{display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--coral-deep)}
.flexmock .fm-live::before{content:"";width:8px;height:8px;border-radius:999px;background:var(--coral-deep);animation:pulse 1.4s infinite}
.flexmock .fm-wave{display:flex;align-items:flex-end;gap:3px;height:38px;margin-top:16px}
.flexmock .fm-wave i{width:4px;border-radius:2px;background:var(--blue-deep);animation:wv2 1s ease-in-out infinite}
@keyframes wv2{0%,100%{transform:scaleY(.28)}50%{transform:scaleY(1)}}
.flexmock .fm-timer{margin-top:12px;font-family:var(--font-mono);font-size:19px;font-weight:700;color:var(--ink)}
.flexmock .fm-cap{margin-top:6px;font-size:11.5px;color:var(--t2);max-width:26ch}
.flexmock .fm-cap-wide{margin-top:26px;font-size:clamp(11px,1vw,13px);line-height:1.6;max-width:34ch}
/* "Firing up..." orb — black disc with a sweeping violet arc, as on
   impacterpathway.com/voice-prompts while the mic spins up */
.flexmock .fm-orb{
  position:relative;width:clamp(112px,15vh,180px);aspect-ratio:1;border-radius:999px;
  background:#0C0C0D;color:#fff;display:flex;align-items:center;justify-content:center;
  box-shadow:0 12px 30px rgba(10,26,50,.28);
}
.flexmock .fm-orb span{font-size:clamp(13px,1.3vw,17px);font-weight:500;letter-spacing:-.01em}
.flexmock .fm-orb::after{
  content:"";position:absolute;inset:-5px;border-radius:999px;
  border:3px solid transparent;border-right-color:#7C4DFF;border-top-color:#7C4DFF;
  animation:orbspin 1.1s linear infinite;
}
@keyframes orbspin{to{transform:rotate(360deg)}}
/* text pane */
.flexmock .fm-pane[data-pane="text"]{position:absolute;inset:0;padding:30px 30px 24px}
.flexmock .fm-pane[data-pane="text"].on{display:flex;align-items:stretch}
.flexmock textarea{
  flex:1;width:100%;resize:none;border:0;background:none;color:var(--ink);
  font-family:var(--font-display);font-size:clamp(16px,1.7vw,22px);line-height:1.4;padding:0;
}
.flexmock textarea::placeholder{color:rgba(29,27,28,.38)}
.flexmock textarea:focus{outline:none}
.flexmock .fm-actions{display:flex;justify-content:flex-end;align-items:center;gap:12px}
.flexmock .fm-circle{
  width:clamp(38px,4.4vh,50px);aspect-ratio:1;border:0;border-radius:999px;
  display:flex;align-items:center;justify-content:center;transition:opacity .18s,transform .16s,background .18s;
}
.flexmock .fm-circle svg{width:45%;height:45%}
.flexmock .fm-go{background:#EDF1F4;color:#5B6B7C}
.flexmock .fm-go:not(:disabled){background:#fff;color:var(--ink)}
.flexmock .fm-go:not(:disabled):hover{transform:translateY(-1px)}
.flexmock .fm-go:disabled{opacity:.55;cursor:default}
.flexmock .fm-cancel{background:#8C99A5;color:#fff}
.flexmock .fm-cancel:hover{background:#75818C}
/* shared buttons */
.flexmock .fm-btn{
  margin-top:14px;border:0;border-radius:999px;background:var(--navy);color:#fff;
  font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;padding:10px 20px;transition:opacity .18s,transform .16s;
}
.flexmock .fm-btn:hover{transform:translateY(-1px)}
.flexmock .fm-btn:disabled{opacity:.4;cursor:default;transform:none}
.flexmock .fm-back{
  margin-top:12px;border:0;background:none;color:var(--t2);font-family:var(--font-mono);
  font-size:9.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
}
.flexmock .fm-back:hover{color:var(--ink)}
/* sent pane */
.flexmock .fm-check{
  width:38px;height:38px;border-radius:999px;background:var(--blue);color:#fff;
  display:flex;align-items:center;justify-content:center;
}
.flexmock .fm-check svg{width:17px;height:17px}
.flexmock .fm-sent{margin-top:12px;font-size:15px;font-weight:800;letter-spacing:-.01em;color:var(--ink)}
@media (max-width:980px){
  .cols2{grid-template-columns:1fr;gap:30px}
  .flexmock{height:auto;aspect-ratio:auto;flex-direction:column;max-width:340px;margin:26px auto 0}
  .flexmock .fm-media{width:100%;height:auto;aspect-ratio:2/3}
  .flexmock .fm-panel{padding:22px 18px 26px}
}
@media (prefers-reduced-motion:reduce){
  .flexmock .fm-wave i,.flexmock .fm-live::before,.flexmock .fm-orb::after{animation:none}
}

/* ---------- back-to-selector pill (path pages) ---------- */
.backlink{
  position:fixed;top:24px;right:28px;z-index:40;
  font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;text-decoration:none;color:var(--d2);
  border:1px solid var(--d-border);border-radius:999px;padding:8px 14px;
  background:rgba(10,26,50,.5);backdrop-filter:blur(6px);
}
.backlink:hover{color:#fff}

/* ---------- responsive ---------- */
@media (max-width:640px){
  #dots{display:none}
  #chrome{padding:0 18px 18px}
}
@media (max-width:980px){
  .slide-inner{padding:76px 30px 150px}
  .slide{overflow-y:auto;display:block}
  .slide-inner{min-height:100%}
  html,body{overflow:hidden}
}
@media (prefers-reduced-motion:reduce){
  .rev,.slide{transition:none!important}
}