:root {
  --navy: #1E3A5F;
  --navy-900: #0F1D30;
  --navy-800: #162B48;
  --navy-600: #2A5080;
  --navy-100: #E0ECF5;
  --navy-50: #F0F5FA;
  --slate: #2C3E50;
  --ch: #2D7A6D;
  --ch-800: #276B60;
  --ch-600: #42A898;
  --ch-100: #E8F6F3;
  --us: #D4A847;
  --us-800: #8B6D1E;
  --us-100: #F8F0DA;
  --neutral: #718096;
  --cream: #F5F0EB;
  --snow: #FAFAFA;
  --border: #E2E8F0;
  --dim: #A0AEC0;
  --error: #C53030;
}

* { margin: 0; padding: 0; box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-snap-type: y proximity; }
body { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; color: var(--slate); background: var(--snow); }

/* ── Loading ── */
.loading-screen { position: fixed; inset: 0; background: white; display: flex; align-items: center; justify-content: center; z-index: 9999; transition: opacity 0.4s; }
.loading-screen.hidden { opacity: 0; pointer-events: none; }
.loading-spinner { text-align: center; }
.loading-spinner svg { animation: pulse 1.5s ease-in-out infinite; }
.loading-spinner p { margin-top: 16px; color: var(--neutral); font-size: 14px; }
@keyframes pulse { 0%,100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.05); opacity: 0.7; } }

/* ── Skip Link ── */
.skip-link { position: absolute; left: -9999px; top: auto; }
.skip-link:focus { left: 16px; top: 16px; width: auto; height: auto; padding: 8px 16px; background: var(--navy); color: white; border-radius: 6px; font-size: 14px; font-weight: 600; text-decoration: none; z-index: 10000; }

/* ── Navigation ── */
.nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; background: rgba(255,255,255,0.95); backdrop-filter: blur(10px); border-bottom: 1px solid var(--border); transform: translateY(-100%); transition: transform 0.3s; }
.nav.visible { transform: translateY(0); }
.nav-inner { max-width: 900px; margin: 0 auto; padding: 12px 24px; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nav-logo svg { display: block; }
.nav-links { display: flex; gap: 24px; flex: 1; justify-content: center; }
.nav-links a { font-size: 13px; font-weight: 500; color: var(--neutral); text-decoration: none; transition: color 0.2s; }
.nav-links a:hover, .nav-links a.active { color: var(--navy); }
.nav-present { background: none; border: 1px solid var(--border); border-radius: 6px; padding: 6px; cursor: pointer; color: var(--neutral); transition: all 0.2s; }
.nav-present:hover { color: var(--navy); border-color: var(--navy); }

/* ── Layout ── */
.container { max-width: 900px; margin: 0 auto; padding: 0 24px; }
.section { padding: 100px 0; }
.slide { scroll-snap-align: start; min-height: 80vh; display: flex; flex-direction: column; justify-content: center; }
.section.slide { display: block; }
.bg-snow { background: var(--snow); }
.bg-cream { background: var(--cream); }
h1, h2, h3 { color: var(--navy); }
h2 { font-size: 2.25rem; font-weight: 700; margin-bottom: 16px; }
h3 { font-size: 1.125rem; font-weight: 600; }
p { line-height: 1.7; }
a { color: var(--ch); }

.section-label { font-size: 12px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase; color: var(--ch); margin-bottom: 8px; }
.label-gold { color: var(--us); }
.section-intro { font-size: 1.0625rem; color: var(--neutral); max-width: 680px; margin-bottom: 48px; }
.solution-intro { text-align: center; max-width: 680px; margin: 0 auto 48px; }
.solution-intro p { margin-top: 16px; font-size: 1.0625rem; color: var(--neutral); }

/* ── Buttons ── */
.btn { display: inline-block; padding: 14px 36px; border-radius: 8px; font-size: 15px; font-weight: 600; text-decoration: none; transition: all 0.2s; cursor: pointer; border: none; }
.btn-primary { background: var(--ch); color: white; }
.btn-primary:hover { background: var(--ch-800); }
.btn-outline { border: 2px solid rgba(255,255,255,0.3); color: white; }
.btn-outline:hover { border-color: white; }
.btn-cta-primary { background: var(--ch); color: white; font-size: 16px; padding: 16px 40px; }
.btn-cta-primary:hover { background: var(--ch-800); }
.btn-cta-outline { background: transparent; color: white; border: 2px solid rgba(255,255,255,0.4); padding: 14px 38px; }
.btn-cta-outline:hover { border-color: white; }
.btn-cta-gold { background: var(--us); color: var(--navy-900); font-size: 16px; padding: 16px 40px; }
.btn-cta-gold:hover { background: var(--us-800); color: white; }

/* ── Hero ── */
.hero { background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy) 100%); color: white; text-align: center; padding: 120px 24px 100px; min-height: 100vh; display: flex; align-items: center; justify-content: center; }
.hero-content { max-width: 700px; }
.hero-title { color: white; font-size: 3.5rem; font-weight: 700; letter-spacing: 2px; display: flex; align-items: center; justify-content: center; gap: 6px; }
.hero-claim { color: var(--ch); font-size: 1.125rem; letter-spacing: 3px; text-transform: uppercase; font-weight: 500; margin: 16px 0 32px; }
.hero-subline { color: rgba(255,255,255,0.6); font-size: 1.125rem; margin-bottom: 48px; line-height: 1.7; }

/* ── Problem Grid ── */
.problem-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 48px; }
.problem-card { background: white; border-radius: 16px; padding: 32px 24px; border: 1px solid var(--border); text-align: center; transition: box-shadow 0.2s, transform 0.2s; }
.problem-card:hover { box-shadow: 0 8px 30px rgba(30,58,95,0.08); transform: translateY(-2px); }
.problem-card h3 { margin: 16px 0 8px; }
.problem-card p { font-size: 0.9375rem; color: var(--neutral); }
.problem-icon { width: 48px; height: 48px; border-radius: 12px; background: var(--navy-100); display: flex; align-items: center; justify-content: center; margin: 0 auto; }

/* ── Steps ── */
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; margin-top: 48px; }
.step { text-align: center; }
.step-num { width: 48px; height: 48px; border-radius: 50%; background: linear-gradient(135deg, var(--navy) 0%, var(--navy-600) 100%); color: white; font-size: 1.25rem; font-weight: 700; display: flex; align-items: center; justify-content: center; margin: 0 auto 16px; }
.step h3 { margin-bottom: 8px; }
.step p { font-size: 0.9375rem; color: var(--neutral); }

/* ── Cards ── */
.card { background: white; border-radius: 16px; padding: 32px 24px; border: 1px solid var(--border); transition: box-shadow 0.2s, transform 0.2s; }
.card:hover { box-shadow: 0 8px 30px rgba(30,58,95,0.08); transform: translateY(-2px); }
.card h3 { margin: 16px 0 8px; }
.card p { font-size: 0.9375rem; color: var(--neutral); }
.card-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.card-grid { display: grid; gap: 24px; margin-top: 32px; }
.card-grid-3 { grid-template-columns: repeat(3, 1fr); }
.card-grid-2 { grid-template-columns: repeat(2, 1fr); }

/* ── Diff Grid (5-column) ── */
.diff-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; margin-top: 48px; }
.diff-card { background: white; border-radius: 16px; padding: 28px 20px; border: 1px solid var(--border); text-align: center; transition: box-shadow 0.2s, transform 0.2s; }
.diff-card:hover { box-shadow: 0 8px 30px rgba(30,58,95,0.08); transform: translateY(-2px); }
.diff-card h3 { font-size: 0.9375rem; margin: 12px 0 8px; }
.diff-card p { font-size: 0.8125rem; color: var(--neutral); }
.diff-icon { width: 40px; height: 40px; border-radius: 10px; display: flex; align-items: center; justify-content: center; margin: 0 auto; }

/* ── Compare Table ── */
.compare-table-wrap { margin-top: 48px; overflow-x: auto; }
.compare-table { width: 100%; border-collapse: collapse; background: white; border-radius: 12px; overflow: hidden; border: 1px solid var(--border); font-size: 14px; }
.compare-table th, .compare-table td { padding: 12px 16px; text-align: left; border-bottom: 1px solid var(--border); }
.compare-table thead th { background: var(--navy-50); font-size: 13px; font-weight: 600; color: var(--neutral); text-transform: uppercase; letter-spacing: 1px; }
.compare-table th.highlight, .compare-table td.highlight { background: var(--ch-100); color: var(--ch-800); font-weight: 600; }
.compare-table tr:last-child td { border-bottom: none; }

/* ── Stats Bar ── */
.stats-bar { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin: 32px 0; }
.stat-item { text-align: center; padding: 24px 16px; background: white; border-radius: 12px; border: 1px solid var(--border); }
.stat-value { font-size: 2rem; font-weight: 700; color: var(--navy); }
.stat-label { font-size: 13px; color: var(--neutral); margin-top: 4px; }

/* ── Pilots Table ── */
.pilots-table { margin-top: 24px; }
.pilots-table table { width: 100%; border-collapse: collapse; background: white; border-radius: 12px; overflow: hidden; border: 1px solid var(--border); }
.pilots-table th { text-align: left; padding: 12px 16px; font-size: 13px; font-weight: 600; color: var(--neutral); text-transform: uppercase; letter-spacing: 1px; background: var(--navy-50); border-bottom: 1px solid var(--border); }
.pilots-table td { padding: 14px 16px; font-size: 14px; border-bottom: 1px solid var(--border); }
.pilots-table tr:last-child td { border-bottom: none; }

/* ── Badges ── */
.badge { display: inline-block; font-size: 12px; font-weight: 600; padding: 3px 10px; border-radius: 6px; }
.badge-ch { background: var(--ch-100); color: var(--ch-800); }
.badge-us { background: var(--us-100); color: var(--us-800); }
.badge-dim { background: var(--navy-50); color: var(--neutral); }

/* ── Confidentiality Demo ── */
.confidentiality-demo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; margin-top: 32px; }
.access-card { padding: 32px; border-radius: 16px; border: 2px solid var(--border); text-align: center; }
.access-card h3 { margin: 12px 0 8px; }
.access-card p { font-size: 14px; color: var(--neutral); }
.access-icon { display: flex; justify-content: center; }
.access-current { border-color: var(--ch); background: var(--ch-100); }
.access-locked { border-color: var(--us); background: var(--us-100); }
.access-unlocked { border-color: var(--us); background: white; }

/* ── Pilots Cards ── */
.pilots-cards { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; margin-top: 32px; }
.pilot-card { background: white; border-radius: 16px; padding: 28px 24px; border: 1px solid var(--border); }
.pilot-card h3 { margin-bottom: 4px; }
.pilot-domain { font-size: 13px; color: var(--ch); margin-bottom: 12px; }
.pilot-stats { display: flex; gap: 16px; margin-top: 12px; }
.pilot-stat { font-size: 13px; color: var(--neutral); }
.pilot-stat strong { color: var(--navy); font-weight: 600; }

/* ── Team ── */
.team-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 32px; margin-top: 32px; text-align: center; }
.team-card { padding: 32px 24px; }
.team-portrait { width: 120px; height: 120px; border-radius: 50%; object-fit: cover; margin-bottom: 16px; border: 3px solid var(--border); }
.team-role { font-size: 14px; color: var(--ch); font-weight: 500; margin: 4px 0; }
.team-firm { font-size: 13px; color: var(--neutral); margin-bottom: 12px; }
.team-desc { font-size: 14px; color: var(--neutral); }

/* ── CTA Section ── */
.cta-section { background: linear-gradient(135deg, var(--navy-900) 0%, var(--navy) 100%); color: white; text-align: center; padding: 80px 24px; }
.cta-section h2 { color: white; }
.cta-text { color: rgba(255,255,255,0.6); margin-bottom: 32px; max-width: 560px; margin-left: auto; margin-right: auto; }
.cta-buttons { display: flex; gap: 16px; justify-content: center; flex-wrap: wrap; }
.cta-investor { background: linear-gradient(135deg, var(--navy-900) 0%, #2A3A4F 100%); }

/* ── Investor Sections ── */
.investor-section { border-left: 4px solid var(--us); position: relative; }
.investor-section.hidden { display: none; }

/* ── Positioning Matrix ── */
.positioning-matrix { margin-top: 32px; }
.matrix-grid { display: grid; grid-template-columns: auto 1fr 1fr; grid-template-rows: auto 1fr 1fr; gap: 12px; max-width: 600px; }
.matrix-axis-y { grid-column: 1; grid-row: 1 / 3; writing-mode: vertical-lr; transform: rotate(180deg); font-size: 12px; font-weight: 600; color: var(--neutral); text-transform: uppercase; letter-spacing: 2px; display: flex; align-items: center; justify-content: center; }
.matrix-axis-x { grid-column: 2 / 4; grid-row: 3; text-align: center; font-size: 12px; font-weight: 600; color: var(--neutral); text-transform: uppercase; letter-spacing: 2px; padding-top: 8px; }
.matrix-cell { padding: 20px; border-radius: 12px; border: 1px solid var(--border); background: white; text-align: center; }
.matrix-label { display: block; font-weight: 600; font-size: 14px; color: var(--navy); }
.matrix-examples { display: block; font-size: 12px; color: var(--neutral); margin-top: 4px; }
.matrix-highlight { background: var(--us-100); border-color: var(--us); }
.matrix-highlight .matrix-label { color: var(--us-800); }
.matrix-q1 { grid-column: 2; grid-row: 2; }
.matrix-q2 { grid-column: 3; grid-row: 1; }
.matrix-q3 { grid-column: 2; grid-row: 1; }
.matrix-q4 { grid-column: 3; grid-row: 2; }

/* ── Pricing ── */
.pricing-card { text-align: center; }
.price { font-size: 2rem; font-weight: 700; color: var(--navy); margin: 16px 0; }
.price span { font-size: 14px; font-weight: 400; color: var(--neutral); }
.price.dim { color: var(--neutral); }
.pricing-features { list-style: none; text-align: left; }
.pricing-features li { padding: 8px 0; font-size: 14px; color: var(--slate); border-bottom: 1px solid var(--border); }
.pricing-features li:last-child { border-bottom: none; }
.pricing-features li.highlight { color: var(--ch); font-weight: 600; }
.pricing-compare { border-color: var(--dim); opacity: 0.8; }

/* ── Traction Timeline ── */
.traction-timeline { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 32px; }
.traction-item { text-align: center; padding: 24px 16px; background: white; border-radius: 12px; border: 1px solid var(--border); }
.traction-week { font-size: 12px; font-weight: 600; color: var(--ch); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.traction-metric { font-size: 2rem; font-weight: 700; color: var(--navy); margin-bottom: 8px; }
.traction-item p { font-size: 13px; color: var(--neutral); }

/* ── SWOT ── */
.swot-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-top: 32px; }
.swot-card { padding: 24px; border-radius: 12px; border: 1px solid var(--border); }
.swot-card h3 { margin-bottom: 12px; font-size: 1rem; }
.swot-card ul { list-style: none; }
.swot-card li { padding: 4px 0; font-size: 14px; color: var(--slate); }
.swot-card li::before { content: "• "; color: var(--dim); }
.swot-strength { background: var(--ch-100); border-color: var(--ch); }
.swot-strength h3 { color: var(--ch-800); }
.swot-weakness { background: #fff5f5; border-color: var(--error); }
.swot-weakness h3 { color: var(--error); }
.swot-opportunity { background: var(--us-100); border-color: var(--us); }
.swot-opportunity h3 { color: var(--us-800); }
.swot-risk { background: var(--navy-50); border-color: var(--navy); }
.swot-risk h3 { color: var(--navy); }
.swot-mitigation { margin-top: 12px; font-size: 13px; color: var(--neutral); font-style: italic; }

/* ── Compliance Docs ── */
.docs-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 32px; }
.doc-card { background: white; border-radius: 12px; padding: 24px; border: 1px solid var(--border); text-align: center; }
.doc-icon { margin-bottom: 12px; display: flex; justify-content: center; }
.doc-card h3 { margin-bottom: 4px; }
.doc-card p { font-size: 13px; color: var(--neutral); margin-bottom: 12px; }

/* ── Roadmap ── */
.roadmap-timeline { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; margin-top: 32px; }
.roadmap-phase { padding: 24px; background: white; border-radius: 12px; border: 1px solid var(--border); border-top: 3px solid var(--us); }
.roadmap-label { font-size: 12px; font-weight: 600; color: var(--us); text-transform: uppercase; letter-spacing: 1px; margin-bottom: 8px; }
.roadmap-phase h3 { margin-bottom: 12px; }
.roadmap-phase ul { list-style: none; }
.roadmap-phase li { padding: 4px 0; font-size: 14px; color: var(--slate); }
.roadmap-phase li::before { content: "→ "; color: var(--us); }

/* ── Footer ── */
.footer { padding: 32px 0; text-align: center; border-top: 1px solid var(--border); }
.footer p { font-size: 13px; color: var(--dim); }
.footer a { color: var(--neutral); text-decoration: none; }

/* ── Live stat ── */
.live-stat { font-weight: 700; color: var(--ch); }

/* ── Slide Indicator ── */
.slide-indicator { position: fixed; right: 16px; top: 50%; transform: translateY(-50%); display: flex; flex-direction: column; gap: 8px; z-index: 50; }
.slide-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--border); transition: all 0.3s; cursor: pointer; }
.slide-dot.active { background: var(--ch); transform: scale(1.3); }

/* ── Presentation Mode ── */
body.present-mode { overflow: hidden; }
body.present-mode .slide { min-height: 100vh; max-height: 100vh; overflow: hidden; scroll-snap-align: start; display: flex; align-items: center; }
body.present-mode .section.slide { padding: 40px 0; }
body.present-mode .hero { padding: 40px 24px; }
body.present-mode .nav { display: none; }
body.present-mode .footer { display: none; }
body.present-mode h2 { font-size: 2.5rem; }
body.present-mode .container { max-width: 1000px; }
body.present-mode main { scroll-snap-type: y mandatory; overflow-y: scroll; height: 100vh; }

/* ── Print/PDF ── */
@media print {
  body { background: white; }
  .nav, .footer, .loading-screen, .slide-indicator, .nav-present { display: none !important; }
  .slide { page-break-after: always; min-height: 100vh; padding: 40px; }
  .hero { min-height: auto; padding: 60px 40px; }
  .investor-section { border-left: 3px solid var(--us); }
  @page { size: landscape A4; margin: 0; }
}

/* ── Reduced Motion ── */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; scroll-snap-type: none; }
  .loading-spinner svg { animation: none; }
  .problem-card, .diff-card, .card { transition: none; }
}

/* ── Tablet ── */
@media (max-width: 900px) {
  .section { padding: 60px 0; }
  h2 { font-size: 1.625rem; }
  .hero { padding: 80px 24px 60px; min-height: 70vh; }
  .hero-title { font-size: 2rem; }
  .hero-title svg { width: 40px; height: 44px; }
  .problem-grid { grid-template-columns: 1fr; gap: 16px; }
  .steps { grid-template-columns: 1fr; gap: 24px; }
  .diff-grid { grid-template-columns: repeat(2, 1fr); }
  .card-grid-3, .card-grid-2 { grid-template-columns: 1fr; }
  .stats-bar { grid-template-columns: repeat(2, 1fr); }
  .confidentiality-demo { grid-template-columns: 1fr; }
  .pilots-cards { grid-template-columns: 1fr; }
  .team-grid { grid-template-columns: 1fr; }
  .traction-timeline { grid-template-columns: repeat(2, 1fr); }
  .swot-grid { grid-template-columns: 1fr; }
  .docs-grid { grid-template-columns: 1fr; }
  .roadmap-timeline { grid-template-columns: 1fr; }
  .nav-links { display: none; }
  .matrix-grid { grid-template-columns: auto 1fr; }
  .matrix-q1, .matrix-q3 { display: none; }
  .matrix-q2, .matrix-q4 { grid-column: 2; }
  .compare-table { font-size: 12px; }
}

/* ── Mobile ── */
@media (max-width: 600px) {
  .hero { min-height: 60vh; padding: 60px 16px 40px; }
  .hero-title { font-size: 1.625rem; }
  .hero-title svg { width: 32px; height: 35px; }
  .hero-subline { font-size: 1rem; }
  .container { padding: 0 16px; }
  .stats-bar { grid-template-columns: 1fr 1fr; gap: 8px; }
  .stat-value { font-size: 1.5rem; }
  .diff-grid { grid-template-columns: 1fr; }
  .cta-buttons { flex-direction: column; align-items: center; }
  .slide-indicator { display: none; }
}
/* ── Present FAB ── */
.present-fab { position: fixed; bottom: 24px; right: 24px; z-index: 50; width: 48px; height: 48px; border-radius: 50%; background: var(--navy); color: white; border: none; cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: 0 4px 16px rgba(30,58,95,0.25); transition: all 0.2s; }
.present-fab:hover { background: var(--navy-600); transform: scale(1.1); }
body.present-mode .present-fab { background: var(--ch); }

/* ── CTA Placeholder ── */
.cta-placeholder { opacity: 0.7; cursor: default; }
.cta-placeholder:hover { opacity: 0.8; transform: none; }
.cta-hint { font-size: 13px; color: rgba(255,255,255,0.4); margin-top: 16px; }

/* ── Copilot Answer ── */
.copilot-answer { background: var(--navy-50); border-radius: 12px; padding: 24px 28px; margin-top: 48px; border-left: 3px solid var(--navy); }
.copilot-answer h3 { font-size: 1rem; margin-bottom: 8px; }
.copilot-answer p { font-size: 0.9375rem; color: var(--slate); margin: 0; }

/* ── Nav Wordmark (HTML text instead of SVG text for robust rendering) ── */
.nav-wordmark { font-family: 'Plus Jakarta Sans', system-ui, sans-serif; font-weight: 700; font-size: 16px; letter-spacing: 1.5px; color: var(--navy); display: flex; align-items: center; }
