/* Pitch deck theme — "Enterprise Tech & Premium Minimal".
 * Standalone: this is the ONLY base stylesheet for the pitch deck (it replaces
 * theme.css for slug "pitch"), so it does not have to fight the technical theme.
 * Dark/light rhythm via per-slide data-background-color + a .dark/.light class
 * on the <section>; emerald accent; Poppins headings, Inter body. */

:root {
  --pitch-dark: #0b0f19;
  --pitch-light: #f8fafc;
  --emerald: #10b981;
  --emerald-soft: rgba(16, 185, 129, .14);
  --ink: #1e293b;       /* text on light */
  --ink-soft: #64748b;
  --snow: #f1f5f9;      /* text on dark */
  --snow-soft: #94a3b8;
  --card: #ffffff;
  --hair-light: #e2e8f0;
  --hair-dark: rgba(255, 255, 255, .09);
}

/* ── base type ─────────────────────────────────────────────────────────── */
.reveal {
  font-family: Inter, system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 30px;
  color: var(--ink);
}
.reveal h1, .reveal h2, .reveal h3 {
  font-family: Poppins, Inter, sans-serif;
  font-weight: 700;
  text-transform: none;
  letter-spacing: -.015em;
  line-height: 1.12;
  margin: 0 0 .35em;
}
.reveal h1 { font-size: 2.05em; }
.reveal h2 { font-size: 1.45em; }
.reveal h3 { font-size: 1.05em; }
.reveal p { line-height: 1.5; }
.reveal .emph { color: var(--emerald); }
.reveal strong { color: inherit; font-weight: 700; }

.reveal .kicker {
  font-family: Poppins, sans-serif;
  text-transform: uppercase;
  letter-spacing: .2em;
  font-size: .46em;
  font-weight: 600;
  color: var(--emerald);
  margin-bottom: 1.1em;
}

/* ── dark vs light slides ──────────────────────────────────────────────── */
.reveal section.dark { color: var(--snow); }
.reveal section.dark h1,
.reveal section.dark h2,
.reveal section.dark h3 { color: var(--snow); }
.reveal section.dark .muted { color: var(--snow-soft); }

.reveal section.light { color: var(--ink); }
.reveal section.light h1,
.reveal section.light h2,
.reveal section.light h3 { color: var(--ink); }
.reveal section.light .muted { color: var(--ink-soft); }

/* ── benefit list ──────────────────────────────────────────────────────── */
.reveal ul.points {
  list-style: none;
  margin: .7em auto 0;
  padding: 0;
  text-align: left;
  max-width: 22em;
}
.reveal ul.points li {
  position: relative;
  padding: .5em 0 .5em 1.5em;
  font-size: .74em;
  line-height: 1.42;
}
.reveal ul.points li::before {
  content: "";
  position: absolute;
  left: 0;
  top: .92em;
  width: .55em;
  height: .55em;
  border-radius: .14em;
  background: var(--emerald);
}
.reveal section.light ul.points li + li { border-top: 1px solid var(--hair-light); }
.reveal section.dark ul.points li + li { border-top: 1px solid var(--hair-dark); }

/* ── slide 1: hook (50/50 split) ───────────────────────────────────────── */
.reveal .hook {
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;
  gap: 1.5em;
  margin-top: 1.1em;
  height: 6.2em;
}
.reveal .hook-l {
  position: relative;
  height: 100%;
  border-right: 1px solid var(--hair-dark);
}
.reveal .noise-lines { position: absolute; inset: 0; width: 100%; height: 100%; }
.reveal .noise-lines line {
  stroke: var(--snow-soft);
  stroke-width: .5;
  stroke-dasharray: 2 2;
  opacity: .5;
}
.reveal .ic-dot {
  position: absolute;
  color: var(--snow-soft);
  transform: translate(-50%, -50%);
}
.reveal .ic-dot svg { width: 1.6em; height: 1.6em; }
.reveal .d1 { top: 22%; left: 28%; }
.reveal .d2 { top: 60%; left: 22%; }
.reveal .d3 { top: 38%; left: 62%; }
.reveal .d4 { top: 74%; left: 64%; }
.reveal .hook-r { display: flex; align-items: center; justify-content: center; }
.reveal .qmark {
  font-family: Poppins, sans-serif;
  font-weight: 700;
  font-size: 6em;
  color: var(--emerald);
  text-shadow: 0 0 50px rgba(16, 185, 129, .55);
}

/* ── slide 4: horizontal flow ──────────────────────────────────────────── */
.reveal .flow4 {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1em;
  margin: .4em 0 .2em;
}
.reveal .flow4 .node {
  background: var(--card);
  border: 1px solid var(--hair-light);
  border-radius: 16px;
  box-shadow: 0 10px 30px rgba(15, 23, 42, .08);
  padding: .85em 1em;
  min-width: 5.2em;
  text-align: center;
}
.reveal .flow4 .node.accent {
  border-color: var(--emerald);
  box-shadow: 0 12px 34px rgba(16, 185, 129, .22);
}
.reveal .flow4 .node svg { width: 1.7em; height: 1.7em; color: var(--ink); }
.reveal .flow4 .node.accent svg { color: var(--emerald); }
.reveal .flow4 .node .t {
  font-family: Poppins, sans-serif;
  font-weight: 600;
  font-size: .56em;
  margin-top: .45em;
  color: var(--ink);
}
.reveal .flow4 .arrow { color: var(--emerald); font-size: 1.5em; }

/* icons inherit currentColor */
.reveal svg.ic { display: inline-block; vertical-align: middle; }

/* ── two-column info layout (visual | bullets) ─────────────────────────── */
.reveal .cols2 {
  display: grid;
  grid-template-columns: 1fr 1.05fr;
  gap: 1.6em;
  align-items: center;
  text-align: left;
  margin-top: .4em;
}
.reveal .cols2 ul.points { margin: 0; max-width: none; }
.reveal .visual { display: flex; align-items: center; justify-content: center; }

/* ── slide 2: iceberg ──────────────────────────────────────────────────── */
.reveal .berg { position: relative; width: 11em; height: 9em; }
.reveal .berg .water {
  position: absolute; left: -1.4em; right: -1.4em; top: 2.7em; height: 2px;
  background: linear-gradient(90deg, transparent, #7dd3fc, transparent);
}
.reveal .berg .tip {
  position: absolute; top: 0; left: 50%; transform: translateX(-50%);
  width: 6em; text-align: center; font-size: .55em;
}
.reveal .berg .tip svg { width: 1.5em; height: 1.5em; color: var(--emerald); }
.reveal .berg .tip .cap { font-family: Poppins; font-weight: 600; color: var(--ink); margin-top: .2em; }
.reveal .berg .mass {
  position: absolute; top: 3em; left: 50%; transform: translateX(-50%); width: 10.5em;
  clip-path: polygon(16% 0, 84% 0, 100% 100%, 0 100%);
  background: linear-gradient(180deg, #dbeafe, #bfdbfe);
  padding: .55em .4em .7em; display: flex; flex-direction: column; gap: .28em;
}
.reveal .berg .mass .lvl {
  font-size: .46em; text-align: center; color: #1e3a5f; font-weight: 600;
  background: rgba(255, 255, 255, .6); border-radius: 5px; padding: .3em;
}

/* ── slide 5: data box with flying layers ──────────────────────────────── */
.reveal .databox { position: relative; width: 11em; height: 8em; }
.reveal .databox .box {
  position: absolute; left: 0; top: 1.8em; width: 4.6em; height: 4.2em; border-radius: 14px;
  background: linear-gradient(160deg, #1e293b, #0f172a); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-family: Poppins; font-weight: 700; font-size: .72em;
  box-shadow: 0 16px 40px rgba(15, 23, 42, .25);
}
.reveal .databox .layer {
  position: absolute; left: 5.6em; background: #fff; border: 1px solid var(--hair-light);
  border-radius: 9px; padding: .35em .6em; font-size: .5em; font-family: Poppins; font-weight: 600;
  display: flex; align-items: center; gap: .45em; box-shadow: 0 8px 20px rgba(15, 23, 42, .12);
}
.reveal .databox .layer svg { width: 1.2em; height: 1.2em; color: var(--emerald); }
.reveal .databox .l1 { top: .2em; }
.reveal .databox .l2 { top: 3.1em; left: 6.4em; }
.reveal .databox .l3 { top: 6em; }

/* ── slide 6: feedback loop ────────────────────────────────────────────── */
.reveal .loop { position: relative; width: 9em; height: 9em; }
.reveal .loop .ring { position: absolute; inset: 0; }
.reveal .loop .ring circle { fill: none; stroke: var(--emerald); stroke-width: 1.4; stroke-dasharray: 4 3; opacity: .55; }
.reveal .loop-center {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 3em; height: 3em; border-radius: 50%; background: var(--emerald-soft);
  display: flex; align-items: center; justify-content: center;
}
.reveal .loop-center svg { width: 1.6em; height: 1.6em; color: var(--emerald); }
.reveal .loop-node {
  position: absolute; transform: translate(-50%, -50%); background: #fff;
  border: 1px solid var(--hair-light); border-radius: 20px; padding: .3em .65em;
  font-size: .5em; font-family: Poppins; font-weight: 600; white-space: nowrap;
  box-shadow: 0 6px 16px rgba(15, 23, 42, .1);
}
.reveal .loop .n1 { top: 4%; left: 50%; }
.reveal .loop .n2 { top: 80%; left: 16%; }
.reveal .loop .n3 { top: 80%; left: 84%; }
.reveal .loop .sip { position: absolute; right: -2.9em; bottom: -1.4em; text-align: center; color: var(--ink-soft); font-size: .8em; }
.reveal .loop .sip svg { width: 1.5em; height: 1.5em; }

/* ── slide 7: two freedom tiles ────────────────────────────────────────── */
.reveal .tiles { display: flex; flex-direction: column; gap: .8em; }
.reveal .tile {
  background: #fff; border: 1px solid var(--hair-light); border-radius: 16px;
  padding: .85em 1em; box-shadow: 0 8px 24px rgba(15, 23, 42, .07); text-align: left;
}
.reveal .tile .h { display: flex; align-items: center; gap: .5em; font-family: Poppins; font-weight: 600; font-size: .62em; color: var(--ink); }
.reveal .tile .h svg { width: 1.3em; height: 1.3em; color: var(--emerald); }
.reveal .tile .tags { margin-top: .5em; display: flex; flex-wrap: wrap; gap: .35em; }
.reveal .tile .tag { font-size: .45em; background: var(--emerald-soft); color: #047857; border-radius: 6px; padding: .25em .55em; font-weight: 600; }

/* ── slide 8: sovereignty shield ───────────────────────────────────────── */
.reveal .shield { position: relative; width: 8em; height: 8em; }
.reveal .shield .ring {
  position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--emerald);
  box-shadow: 0 0 30px rgba(16, 185, 129, .35), inset 0 0 28px rgba(16, 185, 129, .14);
}
.reveal .shield .core {
  position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  width: 3.6em; height: 3.6em; border-radius: 14px; background: #fff; border: 1px solid var(--hair-light);
  display: flex; align-items: center; justify-content: center; box-shadow: 0 10px 24px rgba(15, 23, 42, .12);
}
.reveal .shield .core svg { width: 2em; height: 2em; color: var(--ink); }
.reveal .shield .dot { position: absolute; width: .5em; height: .5em; border-radius: 50%; background: var(--emerald); }
.reveal .shield .p1 { top: 14%; left: 50%; } .reveal .shield .p2 { top: 50%; left: 86%; }
.reveal .shield .p3 { top: 86%; left: 50%; } .reveal .shield .p4 { top: 50%; left: 14%; }

/* ── slide 9: country map + stat ───────────────────────────────────────── */
.reveal .country svg { width: 11em; height: auto; }
.reveal .country .shape { fill: #e2e8f0; stroke: #cbd5e1; stroke-width: 1.5; }
.reveal .country .zone { fill: var(--emerald); }
.reveal .stat { font-family: Poppins; font-weight: 800; font-size: 1.7em; color: var(--emerald); line-height: 1; }
.reveal .stat .sub { display: block; font-size: .32em; color: var(--ink); font-weight: 600; margin-top: .5em; }

/* ── slide 3: insight, slide 10: CTA ───────────────────────────────────── */
.reveal .quote-en {
  font-size: .58em; color: var(--snow-soft); font-style: italic;
  max-width: 26em; margin: 0 auto 1.3em;
}
.reveal .insight { font-size: 1.9em; max-width: 17em; margin: 0 auto; }
.reveal .cta {
  display: inline-block; margin-top: 1.1em; background: var(--emerald); color: #06281e;
  font-family: Poppins; font-weight: 700; font-size: .68em; padding: .7em 1.6em;
  border-radius: 12px; box-shadow: 0 14px 44px rgba(16, 185, 129, .42);
}
.reveal section.dark .contact { margin-top: 1.5em; font-size: .5em; letter-spacing: .12em; text-transform: uppercase; }
