/* mobile.css — phone portrait reflow layer for the Dealport deck.
   Active only at (max-width: 820px); hidden otherwise. All classes are
   namespaced .m-* so they never collide with the desktop deck CSS. */

:root {
  --m-blue: #2347d9; --m-ink: #15171c; --m-mute: #565b69;
  --m-hair: #e2e5ec; --m-hair2: #cdd2dd; --m-pad: 30px;
}

/* Border-box across the whole mobile layer. width:100vw must INCLUDE the
   padding — with the default content-box, each slide is 100vw + padding,
   i.e. wider than the screen, which pushes content off the right edge and
   scrolls the left padding off-screen. */
.m-deck, .m-deck * { box-sizing: border-box; }

/* Toggle: hidden on desktop, shown on phones.
   Scoped to `screen` so print/PDF always uses the desktop <deck-stage> canvas
   (headless print runs at a narrow viewport that would otherwise trip this). */
.m-deck, .m-dots, .m-hint { display: none; }
@media screen and (max-width: 820px) {
  deck-stage { display: none !important; }
  .m-deck { display: flex; }
  .m-dots { display: flex; }
  .m-hint { display: block; }
}

/* Swipe container. */
.m-deck {
  position: fixed; inset: 0;
  width: 100vw; height: 100dvh;
  overflow-x: auto; overflow-y: hidden;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  background: #fff;
  font-family: 'Instrument Sans', -apple-system, system-ui, sans-serif;
  color: var(--m-ink); -webkit-font-smoothing: antialiased;
}
.m-deck::-webkit-scrollbar { display: none; }

/* Each slide fills the screen. Horizontal padding respects the side safe-areas
   (and the rounded-corner inset); vertical chrome is kept lean so content fits
   the visible viewport without needing to scroll down. */
.m-slide {
  flex: 0 0 100vw; width: 100vw; height: 100dvh;
  scroll-snap-align: center; scroll-snap-stop: always;
  overflow-y: auto; overflow-x: hidden; -webkit-overflow-scrolling: touch;
  display: flex; flex-direction: column;
  padding: calc(env(safe-area-inset-top) + 22px) var(--m-pad) calc(env(safe-area-inset-bottom) + 42px);
}

/* Shared text. */
.m-deck b, .m-deck strong { font-weight: 600; color: var(--m-ink); }
.m-deck em { font-style: normal; color: var(--m-blue); }
.m-eyebrow { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11.5px; letter-spacing:.14em; text-transform:uppercase; color:var(--m-mute); display:flex; align-items:center; gap:9px; }
.m-eyebrow .idx { color: var(--m-blue); font-weight: 500; }
.m-h { font-size: 27px; line-height: 1.13; letter-spacing: -.016em; font-weight: 400; margin: 12px 0 0; }
.m-lead { font-size: 16px; line-height: 1.45; color: var(--m-mute); margin: 11px 0 0; letter-spacing: -.006em; }
.m-body { font-size: 14.5px; line-height: 1.5; color: var(--m-mute); }
.m-brand { height: 26px; width: auto; display: block; }
.m-foot { margin-top: 18px; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:#8b909e; }
.m-band { margin-top: 14px; font-size: 15px; line-height: 1.4; color: var(--m-ink); font-weight: 500; letter-spacing: -.008em; }
.m-tag { display:inline-block; align-self:flex-start; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--m-mute); border:1px solid var(--m-hair2); border-radius:999px; padding:5px 10px; margin-bottom:10px; }
.m-tag b { color: var(--m-blue); }

/* Cover. */
.m-pill { display:inline-block; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.14em; color:var(--m-blue); border:1px solid rgba(35, 71, 217,.30); border-radius:999px; padding:7px 13px; text-transform:uppercase; }
.m-h--xl { font-size: 33px; line-height: 1.06; letter-spacing: -.022em; font-weight: 400; margin: 16px 0 0; }
.m-sub { font-size: 16.5px; line-height: 1.45; color: var(--m-mute); margin: 14px 0 0; letter-spacing: -.006em; }
.m-media { margin-top: 18px; border-radius: 16px; overflow: hidden; aspect-ratio: 4/3; position: relative; }
.m-media video { width: 100%; height: 100%; object-fit: cover; display: block; }
.m-chip { position:absolute; left:12px; bottom:12px; display:flex; align-items:center; gap:9px; background:#fff; border-radius:12px; padding:8px 12px 8px 8px; box-shadow:0 6px 20px rgba(0,0,0,.12); }
.m-chip img { width:30px; height:30px; border-radius:8px; display:block; }
.m-chip .t { font-size:13px; line-height:1.2; }
.m-chip .t b { display:block; }
.m-chip .t span { color:var(--m-mute); font-size:11.5px; }
.m-contact { margin-top:auto; padding-top:16px; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.08em; color:var(--m-mute); display:flex; flex-wrap:wrap; gap:6px 18px; }

/* Mega stat. */
.m-mega { font-size: 76px; line-height: .95; letter-spacing: -.03em; font-weight: 400; margin: 12px 0 0; }
.m-mega-cap { font-size: 16px; line-height: 1.4; color: var(--m-ink); font-weight: 500; margin: 12px 0 0; letter-spacing: -.008em; }
.m-substats { display:flex; gap:14px; margin-top:18px; }
.m-substats .ss { flex:1; border-top:1px solid var(--m-ink); padding-top:10px; }
.m-substats .ss b { display:block; font-size:19px; letter-spacing:-.02em; }
.m-substats .ss span { font-size:11px; color:var(--m-mute); line-height:1.35; display:block; margin-top:4px; }

/* Stacked cards (problem / solution / vault / gtm / traction / raise). */
.m-stack { margin-top: 16px; display: flex; flex-direction: column; }
.m-card { border-top: 1px solid var(--m-hair); padding: 13px 0; }
.m-card:first-child { border-top: 1px solid var(--m-ink); }
.m-card .ci { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:12.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--m-blue); font-weight:500; }
.m-card .cn { font-size: 17px; font-weight: 600; margin-top: 5px; line-height: 1.25; letter-spacing: -.01em; }
.m-card .cd { font-size: 14.5px; color: var(--m-mute); line-height: 1.45; margin-top: 6px; }
.m-card ul { margin: 7px 0 0; padding-left: 18px; }
.m-card li { font-size: 14.5px; color: var(--m-mute); line-height: 1.45; margin-top: 4px; }
.m-card .n { font-size: 32px; font-weight: 600; letter-spacing: -.02em; }

/* Steps (scout / ledger). */
.m-steps { margin-top: 16px; display: flex; flex-direction: column; gap: 12px; }
.m-step .sh { font-size: 16px; font-weight: 600; letter-spacing: -.01em; }
.m-step .sd { font-size: 14px; color: var(--m-mute); line-height: 1.45; margin-top: 4px; }

/* Media block (product visual / screenshot). */
.m-shot { margin-top: 16px; border-radius: 12px; overflow: hidden; }
.m-shot img { width: 100%; display: block; }
.m-shot.tinted { background: #f3d9bc; aspect-ratio: 16/10; }
.m-shot.tinted video { width: 100%; height: 100%; object-fit: cover; display: block; }

/* Ledger readout. */
.m-readout { margin-top: 15px; border:1px solid var(--m-hair2); border-radius:12px; overflow:hidden; box-shadow:0 10px 30px rgba(17,24,39,.10); }
.m-readout .rh { display:flex; justify-content:space-between; align-items:center; padding:10px 13px; border-bottom:1px solid var(--m-hair); }
.m-readout .rh .t { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10.5px; letter-spacing:.08em; text-transform:uppercase; color:var(--m-mute); }
.m-readout .rh .st { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10px; letter-spacing:.06em; color:var(--m-blue); }
.m-readout .rb { padding:11px 13px; border-bottom:1px solid var(--m-hair); }
.m-readout .rb .nm { font-size:15.5px; font-weight:600; }
.m-readout .rb .sb { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10.5px; color:var(--m-mute); margin-top:4px; letter-spacing:.02em; }
.m-readout .rs { padding:11px 13px; border-bottom:1px solid var(--m-hair); }
.m-readout .rk { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:9.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--m-mute); margin-bottom:7px; }
.m-readout .rr { display:flex; justify-content:space-between; font-size:13px; padding:3px 0; }
.m-readout .rr .chk { color:#0f9d58; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; }
.m-readout .rbox { display:flex; gap:10px; }
.m-readout .rbox .lb { flex:1; }
.m-readout .rbox .lbk { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:9px; letter-spacing:.08em; text-transform:uppercase; color:var(--m-mute); }
.m-readout .rbox .lbv { font-size:18px; font-weight:600; margin-top:3px; letter-spacing:-.02em; }
.m-readout .rbox .lbv.ok { color:var(--m-blue); }
.m-readout .rv { display:flex; justify-content:space-between; align-items:center; gap:10px; padding:10px 13px; background:#eef1fd; }
.m-readout .rv .vv { font-size:12px; line-height:1.4; }
.m-readout .rv .vtag { flex:0 0 auto; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10px; letter-spacing:.06em; text-transform:uppercase; color:#fff; background:var(--m-blue); border-radius:6px; padding:5px 9px; }

/* Opportunity bars. */
.m-bars { margin-top: 16px; display: flex; flex-direction: column; gap: 15px; }
.m-bar .bk { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--m-mute); }
.m-bar .bv { font-size: 30px; font-weight: 600; letter-spacing:-.02em; margin-top:4px; }
.m-bar .bv span { font-size:15px; color:var(--m-mute); font-weight:500; }
.m-bar .bn { font-size: 13.5px; color: var(--m-mute); line-height:1.4; margin-top:5px; }
.m-bar .btrack { height:8px; background:#eef0f4; border-radius:999px; margin-top:8px; overflow:hidden; }
.m-bar .bfill { height:100%; background:var(--m-blue); border-radius:999px; }

/* Team — compact (densest slide; smaller headline + tighter rows so it fits).
   The "Built across" logo strip is hidden on phones to keep the 6-person roster
   on one screen — the bios already name those firms (Arcade, BCG, Deutsche
   Bank, Marathon, Industry Ventures, …). */
.m-slide[data-m="12"] .m-h { font-size: 23px; line-height: 1.12; }
.m-slide[data-m="12"] .m-logos { display: none; }
.m-people { margin-top: 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 11px 12px; }
.m-person.full { grid-column: 1 / -1; display:flex; gap:11px; align-items:flex-start; }
.m-person .pf { width:46px; height:46px; border-radius:10px; object-fit:cover; flex:0 0 auto; background:#eee; }
.m-person.full .pf { width:50px; height:50px; }
.m-person .role { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10px; letter-spacing:.08em; text-transform:uppercase; color:var(--m-blue); margin-top:6px; }
.m-person.full .role { margin-top:2px; }
.m-person .nm { font-size:14.5px; font-weight:600; margin-top:2px; }
.m-person .bio { font-size:11px; color:var(--m-mute); line-height:1.38; margin-top:3px; }
.m-logos { margin-top:13px; border-top:1px solid var(--m-hair); padding-top:10px; }
.m-logos .lt { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--m-mute); }
.m-logos .lr { display:flex; flex-wrap:wrap; align-items:center; gap:9px 18px; margin-top:8px; }
.m-logos .lr img { height:16px; width:auto; object-fit:contain; opacity:.85; }

/* Compounding chart. */
.m-chart { margin-top: 16px; }
.m-chart svg { width: 100%; height: auto; display: block; }
.m-cfstat { margin-top: 12px; }
.m-cfstat .v { font-size: 30px; font-weight: 600; letter-spacing:-.02em; }
.m-cfstat .k { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.08em; text-transform:uppercase; color:var(--m-mute); margin-top:4px; line-height:1.4; }

/* GTM token. */
.m-token { margin: 16px auto 0; width: 132px; height: 132px; border-radius: 999px; background: var(--m-blue); color:#fff; display:flex; align-items:center; justify-content:center; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:24px; letter-spacing:.04em; box-shadow:0 16px 40px rgba(35, 71, 217,.32); }

/* Competition quadrants. */
.m-quads { margin-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.m-quad { border:1px solid var(--m-hair2); border-radius:12px; padding:13px; }
.m-quad.hero { border-color: var(--m-blue); background:#eef1fd; }
.m-quad .qn { font-size:15px; font-weight:600; }
.m-quad .chip { display:inline-block; font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.06em; color:var(--m-blue); margin-bottom:6px; }
.m-quad .qd { font-size:13.5px; color:var(--m-mute); line-height:1.45; margin-top:6px; }

/* Closing + raise. */
.m-close { margin-top: 8px; }
.m-close .cl { font-size: 36px; line-height: 1.1; letter-spacing: -.02em; font-weight: 400; }
.m-close .cl + .cl { margin-top: 6px; }
.m-cgrid { margin-top: 18px; border-top:1px solid var(--m-hair); padding-top:14px; display:grid; grid-template-columns:auto 1fr; gap:6px 14px; font-size:13px; }
.m-cgrid .k { font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--m-mute); }
.m-big { font-size: 56px; font-weight: 400; letter-spacing:-.03em; }
.m-big span { font-size: 26px; color: var(--m-mute); font-weight: 500; }

/* Dots + hint. */
.m-dots { position: fixed; left: 50%; transform: translateX(-50%); bottom: calc(env(safe-area-inset-bottom) + 14px); gap: 6px; z-index: 50; pointer-events: none; }
.m-dots i { width:6px; height:6px; border-radius:999px; background:rgba(17,24,39,.22); transition:background .25s,width .25s; }
.m-dots i.on { background: var(--m-blue); width: 16px; }
.m-hint { position: fixed; right: calc(env(safe-area-inset-right) + 16px); bottom: calc(env(safe-area-inset-bottom) + 11px); font-family:'Instrument Sans', -apple-system, system-ui, sans-serif; font-size:11px; letter-spacing:.08em; color:var(--m-mute); z-index:50; pointer-events:none; transition:opacity .4s; animation:m-nudge 1.8s ease-in-out infinite; }
.m-hint.gone { opacity: 0; }
@keyframes m-nudge { 0%,100%{transform:translateX(0)} 50%{transform:translateX(5px)} }

/* Hide the mobile layer in print (PDF export uses the desktop canvas). */
@media print { .m-deck, .m-dots, .m-hint { display: none !important; } }

/* Short/Full toggle on the mobile cover */
.m-toggle { display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 500; color: var(--m-blue); text-decoration: none; border-bottom: 1px solid var(--m-blue); padding-bottom: 1px; }
