* { box-sizing: border-box; }
html, body { margin: 0; }
body { background: #101b2c; font-family: 'Geist', Arial, sans-serif; color: #17283c; }
button, a { -webkit-tap-highlight-color: transparent; }
button { font: inherit; }
a { color: inherit; text-underline-offset: 4px; }
button:focus-visible, a:focus-visible { outline: 3px solid #edb956; outline-offset: 5px; }
:root { --ink: #17283c; --muted: #596879; --blue: #1675db; --paper: #f5f4ef; --line: #d1d8df; --serif: 'EB Garamond', Georgia, serif; }
.stage { height: calc(100dvh - 64px); display: flex; align-items: center; justify-content: center; overflow: hidden; }
.deck { width: 1440px; height: 810px; position: relative; flex-shrink: 0; transform: scale(var(--scale, 1)); transform-origin: center; }
.slide { position: absolute; inset: 0; display: none; flex-direction: column; padding: 48px 76px 44px; background: var(--paper); overflow: hidden; }
.slide.active { display: flex; }
.slide.dark { background: #101b2c; color: #f5f4ef; --muted: #b3bfcd; --line: #354253; }
.slide.blue { background: #1558b3; color: #fff; --muted: #d6e4f8; --line: #5e89c2; }
.slide.paper-blue { background: #eaf1f8; }
.slide header { display: flex; align-items: center; justify-content: space-between; gap: 24px; font-size: 13px; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; min-height: 28px; color: var(--muted); }
.wordmark { height: 29px; width: auto; filter: brightness(0) saturate(100%); }
.dark .wordmark, .blue .wordmark { filter: none; }
.eyebrow { font-size: 13px; letter-spacing: .13em; text-transform: uppercase; color: var(--blue); font-weight: 600; margin: 0 0 15px; }
.dark .eyebrow { color: #87bbff; }
.blue .eyebrow { color: #d6e4f8; }
.content { flex: 1; display: flex; flex-direction: column; justify-content: center; gap: 28px; min-height: 0; padding: 24px 0; }
.slide footer { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; min-height: 22px; font-size: 12px; color: var(--muted); line-height: 1.5; }
.slide footer .num { font-variant-numeric: tabular-nums; letter-spacing: .12em; white-space: nowrap; }
h1, h2, h3, p { margin: 0; }
h1, h2 { font-family: var(--serif); font-weight: 400; letter-spacing: -.035em; line-height: 1.04; }
h1 { font-size: 88px; }
h2 { font-size: 64px; max-width: 1180px; }
h3 { font-size: 24px; font-weight: 500; line-height: 1.25; letter-spacing: -.025em; }
p, li { font-size: 21px; line-height: 1.5; color: var(--muted); }
em { font-weight: 400; }
strong { font-weight: 600; color: inherit; }
.lead { font-size: 25px; line-height: 1.5; max-width: 910px; }
.small { font-size: 17px; line-height: 1.5; }
.micro { font-size: 13px; line-height: 1.6; }
.accent { color: var(--blue); }
.dark .accent { color: #8cbfff; }
.blue .accent { color: #c7e1ff; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: start; }
.split.wide-left { grid-template-columns: 1.2fr 1fr; }
.split.wide-right { grid-template-columns: .8fr 1.3fr; }
.columns { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.columns.four { grid-template-columns: repeat(4, 1fr); gap: 28px; }
.stack { display: flex; flex-direction: column; gap: 20px; }
.rule-top { border-top: 1px solid var(--line); padding-top: 22px; }
.rule-left { border-left: 1px solid var(--line); padding-left: 36px; }
.statement { font-family: var(--serif); font-size: 36px; line-height: 1.18; letter-spacing: -.02em; color: inherit; }
.number { font-family: var(--serif); font-size: 76px; line-height: 1; color: var(--blue); letter-spacing: -.045em; }
.dark .number { color: #8cbfff; }
.blue .number { color: #fff; }
.step { font-size: 14px; font-weight: 600; color: var(--blue); letter-spacing: .08em; margin-bottom: 18px; }
.dark .step { color: #8cbfff; }
.status { font-size: 13px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--muted); }
.status.blue-text { color: var(--blue); }
.spaced { margin-top: 14px; }
.cover .content { gap: 28px; }
.cover h1 { max-width: 1150px; font-size: 100px; }
.cover .lead { max-width: 890px; }
.cover .wordmark { height: 43px; }
.cover-bottom { display: flex; justify-content: space-between; align-items: end; margin-top: 24px; gap: 48px; }
.cover-bottom p { font-size: 17px; }
.cover-category { font-size: 15px; letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.feature-list { margin: 0; padding: 0; list-style: none; }
.feature-list li { padding: 13px 0; border-bottom: 1px solid var(--line); }
.feature-list li:first-child { padding-top: 0; }
.feature-list li:last-child { border: 0; }
.feature-list li strong { color: var(--ink); }
.dark .feature-list li strong { color: #f5f4ef; }
.canvas-word { font-family: var(--serif); font-size: 96px; line-height: .95; letter-spacing: -.05em; }
.trust-note { background: #e4ecf5; padding: 21px 28px; display: flex; gap: 28px; align-items: center; }
.trust-note p { font-size: 18px; color: #31465d; }
.trust-note strong { color: #1558b3; white-space: nowrap; }
.product-row { display: grid; grid-template-columns: 230px 1fr 210px; gap: 32px; padding: 24px 0; border-top: 1px solid var(--line); align-items: center; }
.product-row h3 { font-family: var(--serif); font-size: 37px; }
.product-row p { font-size: 20px; }
.product-row .status { text-align: right; }
.comparison { width: 100%; border-collapse: collapse; font-size: 18px; table-layout: fixed; }
.comparison th { font-size: 13px; font-weight: 500; text-transform: uppercase; letter-spacing: .07em; color: var(--muted); text-align: left; padding: 0 22px 15px 0; }
.comparison td { vertical-align: top; border-top: 1px solid var(--line); padding: 19px 28px 19px 0; line-height: 1.45; color: var(--muted); }
.comparison td:first-child { color: inherit; font-weight: 500; }
.comparison .ours td { color: #1c63b7; }
.comparison th:first-child { width: 25%; }
.comparison th:nth-child(2) { width: 38%; }
.image-frame { margin: 0; }
.image-frame img { width: auto; max-width: 100%; max-height: 380px; object-fit: contain; object-position: left top; display: block; border: 1px solid var(--line); }
figcaption { font-size: 13px; color: var(--muted); line-height: 1.5; margin-top: 12px; }
.metrics { display: grid; grid-template-columns: 1.3fr 1fr 1fr; gap: 28px; }
.metrics h3 { font-size: 18px; margin-top: 7px; }
.metrics p { font-size: 14px; margin-top: 5px; }
.demo-links { display: flex; gap: 24px; margin-top: 16px; }
.demo-links a { font-size: 14px; }
.timeline { display: grid; grid-template-columns: 170px 1fr 1fr; gap: 30px; padding: 22px 0; border-top: 1px solid var(--line); }
.timeline p { font-size: 19px; }
.timeline h3 { font-size: 22px; }
.timeline .status { padding-top: 6px; }
.founder { display: grid; grid-template-columns: 132px 1fr; gap: 28px; align-items: center; }
.founder img { width: 132px; height: 154px; object-fit: cover; object-position: center 30%; border-radius: 2px; }
.founder h3 { font-size: 26px; }
.founder .role { font-size: 14px; color: var(--blue); text-transform: uppercase; letter-spacing: .08em; margin: 9px 0 14px; }
.founder p { font-size: 18px; }
.founder a { font-size: 14px; }
.contact { font-family: var(--serif); font-size: 38px; text-decoration: none; letter-spacing: -.02em; }
.sources { display: grid; grid-template-columns: 1fr 1fr; gap: 30px 60px; }
.sources h3 { font-size: 22px; margin-bottom: 8px; }
.sources p, .sources a { font-size: 17px; }
.source-tag { font-size: 12px; font-variant-numeric: tabular-nums; color: var(--blue); margin-bottom: 10px; }
.controls { position: fixed; bottom: 0; left: 0; right: 0; height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 28px; color: #eaf1f8; background: #101b2c; border-top: 1px solid #354253; gap: 24px; }
.control-group { display: flex; align-items: center; gap: 14px; }
.controls button { border: 1px solid #536174; background: transparent; color: inherit; border-radius: 4px; padding: 8px 12px; cursor: pointer; font-size: 13px; }
.controls button:hover { background: #263b55; }
.controls button:disabled { opacity: .3; cursor: default; }
.controls span { font-size: 12px; color: #b3bfcd; }
.controls #counter { min-width: 52px; text-align: center; font-variant-numeric: tabular-nums; }
.progress { position: fixed; bottom: 64px; height: 2px; left: 0; background: #72acff; width: 0; transition: width .18s; }
.index-panel { border: 1px solid #536174; background: #101b2c; color: #f5f4ef; border-radius: 6px; padding: 24px; width: min(600px, 90vw); max-height: 80dvh; }
.index-panel::backdrop { background: #0009; }
.index-panel h2 { font-size: 34px; margin-bottom: 18px; }
.index-panel nav { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.index-panel nav button { font-size: 14px; background: transparent; color: #d6e4f8; border: 0; text-align: left; padding: 12px; cursor: pointer; }
.index-panel nav button:hover { background: #263b55; }
.index-panel .close-index { float: right; background: transparent; color: white; border: 0; font-size: 24px; cursor: pointer; }
/* Canvas concept on the progress slide. Other slide layouts stay unchanged. */
.progress-slide .content { padding: 12px 0; gap: 22px; }
.progress-slide h2 { font-size: 49px; max-width: none; }
.progress-layout { display: grid; grid-template-columns: 240px 1fr; gap: 32px; align-items: start; }
.progress-layout > * { min-width: 0; }
.progress-summary { display: flex; flex-direction: column; gap: 19px; padding-top: 6px; }
.progress-metric .number { font-size: 61px; }
.progress-metric h3 { font-size: 16px; margin-top: 3px; }
.progress-summary p { font-size: 18px; line-height: 1.45; }
.progress-summary p.small { font-size: 16px; }
.concept-frame img { width: 100%; max-height: none; border: 1px solid #d1d8df; }
.concept-frame figcaption { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; margin-top: 10px; }
.concept-frame figcaption a { white-space: nowrap; }
@media screen and (max-width: 700px) {
  .progress-slide h2 { font-size: 43px; }
  .progress-layout { grid-template-columns: 1fr; gap: 26px; }
  .progress-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
  .progress-metric .number { font-size: 44px; }
  .progress-metric h3 { font-size: 13px; }
  .progress-summary p { grid-column: 1 / -1; }
  .concept-frame figcaption { flex-direction: column; }
}
@media screen and (max-width: 700px) {
  .stage { height: calc(100dvh - 60px); display: block; overflow: auto; }
  .deck { width: auto; height: auto; transform: none !important; }
  .slide { position: relative; inset: auto; min-height: calc(100dvh - 60px); padding: 28px 24px; overflow: visible; }
  .slide header { font-size: 10px; letter-spacing: .08em; }
  .wordmark { height: 23px; }
  .content { padding: 38px 0; gap: 28px; }
  .slide footer { font-size: 10px; }
  .cover .wordmark { height: 30px; }
  h1, .cover h1 { font-size: 57px; }
  h2 { font-size: 43px; }
  h3 { font-size: 23px; }
  p, li { font-size: 18px; }
  .lead { font-size: 20px; }
  .split, .split.wide-left, .split.wide-right, .columns, .columns.four, .sources { grid-template-columns: 1fr; gap: 28px; }
  .cover-bottom { flex-direction: column; align-items: start; gap: 22px; }
  .cover-bottom p { font-size: 15px; }
  .rule-left { padding-left: 0; border-left: 0; border-top: 1px solid var(--line); padding-top: 22px; }
  .canvas-word { font-size: 78px; }
  .statement { font-size: 30px; }
  .number { font-size: 62px; }
  .trust-note { align-items: start; flex-direction: column; gap: 10px; padding: 20px; }
  .trust-note p { font-size: 16px; }
  .product-row { grid-template-columns: 1fr; gap: 10px; }
  .product-row .status { text-align: left; }
  .comparison { font-size: 13px; }
  .comparison th { font-size: 10px; padding-right: 10px; }
  .comparison td { padding: 14px 10px 14px 0; overflow-wrap: anywhere; }
  .comparison th:first-child { width: 25%; }
  .comparison th:nth-child(2) { width: 36%; }
  .metrics { gap: 14px; grid-template-columns: 1fr 1fr 1fr; }
  .metrics .number { font-size: 52px; }
  .metrics h3 { font-size: 15px; }
  .metrics p { font-size: 12px; }
  .timeline { grid-template-columns: 1fr; gap: 12px; }
  .founder { grid-template-columns: 90px 1fr; gap: 20px; }
  .founder img { width: 90px; height: 112px; }
  .founder h3 { font-size: 22px; }
  .founder p { font-size: 16px; }
  .founder a { font-size: 12px; overflow-wrap: anywhere; }
  .contact { font-size: 30px; }
  .controls { height: 60px; padding: 0 12px; gap: 8px; }
  .controls .keyboard-hint { display: none; }
  .controls button { padding: 8px 10px; font-size: 12px; }
  .control-group { gap: 8px; }
  .progress { bottom: 60px; }
  .index-panel nav { grid-template-columns: 1fr; }
  .index-panel { padding: 18px; }
  .source-tag { margin-bottom: 5px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }
@media print {
  .concept-frame figcaption a { display: none; }
  @page { size: 15in 8.4375in; margin: 0; }
  * { -webkit-print-color-adjust: exact !important; print-color-adjust: exact !important; }
  html, body { width: 1440px; height: auto; background: white; }
  .stage { height: auto; display: block; overflow: visible; }
  .deck { width: 1440px; height: auto; transform: none !important; }
  .slide, .slide.active { display: flex !important; position: relative !important; width: 1440px; height: 810px; min-height: 0; break-after: page; page-break-after: always; padding: 48px 76px 44px; }
  .slide:last-child { break-after: auto; page-break-after: auto; }
  .controls, .progress, .index-panel { display: none !important; }
  a { text-decoration: none; }
}

/* Both deck lengths share the cover, product image and presentation controls. */
.cover-version { display: flex; align-items: center; gap: 28px; }
.version-switch { display: flex; padding: 4px; border: 1px solid #536174; border-radius: 6px; gap: 3px; }
.version-switch button { background: transparent; color: #b3bfcd; border: 0; padding: 9px 13px; font-size: 13px; cursor: pointer; border-radius: 3px; }
.version-switch button[aria-pressed="true"] { background: #eaf1f8; color: #17283c; }
#deckMode { font: inherit; font-size: 12px; color: #eaf1f8; background: #101b2c; border: 1px solid #536174; border-radius: 4px; padding: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.slide.excluded { display: none !important; }
@media screen and (max-width: 700px) {
  .cover header { flex-wrap: wrap; }
  .cover-version { flex-direction: column; align-items: flex-end; gap: 12px; }
  .version-switch button { font-size: 11px; padding: 7px 8px; }
  #deckMode { max-width: 116px; padding: 8px 2px; font-size: 10px; }
  .controls .control-group { gap: 5px; }
  .controls { gap: 5px; padding: 0 7px; }
  .controls #fullscreenBtn { display: none; }
}
@media print {
  .version-switch { display: none; }
  .slide.print-last { break-after: auto; page-break-after: auto; }
}

.team-evidence { gap: 64px; }
.founder-proof { border-top: 1px solid var(--line); padding-top: 16px; display: flex; flex-direction: column; gap: 10px; }
.founder-proof h3 { color: var(--blue); font-size: 27px; }
.founder-proof p { font-size: 18px; line-height: 1.4; }
.team-contact { display: flex; justify-content: space-between; align-items: center; gap: 24px; }
#q7 .content { gap: 21px; }
@media screen and (max-width: 700px) { .team-evidence { gap: 30px; } .team-contact { flex-direction: column; align-items: flex-start; } }