/* Principal PM deck — CDMX palette (orange · green · cream · ink) */

@import url("https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Sora:wght@400;500;600;700&display=swap");

:root {
  --ch-orange: #f15a29;
  --ch-orange-deep: #c43e14;
  --ch-green: #0b6e4f;
  --ch-green-soft: #0e8a63;
  --ch-pink: #b76e79;
  --ch-cream: #fbf4ec;
  --ch-cream-2: #f3e6d6;
  --ch-ink: #1a1512;
  --ch-ink-soft: #3a322c;
  --ch-ink-muted: rgba(26, 21, 18, 0.58);
  --ch-chrome: #14110f;

  --bg: var(--ch-cream);
  --bg-warm: var(--ch-cream-2);
  --bg-muted: #f7efe4;
  --ink: var(--ch-ink);
  --ink-soft: var(--ch-ink-soft);
  --ink-muted: var(--ch-ink-muted);
  --line: rgba(26, 21, 18, 0.12);
  --line-strong: rgba(26, 21, 18, 0.22);
  --accent: var(--ch-green);
  --slide-w: min(1120px, 94vw);
  --slide-h: min(630px, calc(94vw * 0.5625), 78vh);
}

body.principal-deck {
  font-family: "Sora", "Helvetica Neue", Helvetica, Arial, sans-serif;
  background: var(--ch-chrome);
}

body.principal-deck .chrome {
  color: rgba(251, 244, 236, 0.72);
}

body.principal-deck .chrome strong {
  color: var(--ch-cream);
  font-weight: 600;
}

body.principal-deck .deck-nav button {
  border: 1px solid rgba(244, 165, 184, 0.35);
  border-radius: 999px;
  color: var(--ch-cream);
}

body.principal-deck .deck-nav button:hover {
  background: rgba(241, 90, 41, 0.2);
  border-color: var(--ch-orange);
}

body.principal-deck #counter {
  color: rgba(251, 244, 236, 0.55);
  font-variant-numeric: tabular-nums;
}

body.principal-deck .slide {
  border-radius: 18px;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.35);
}

body.principal-deck .slide.dark {
  background: linear-gradient(155deg, #120e0c 0%, var(--ch-ink) 55%, #2a221c 100%);
  color: var(--ch-cream);
}

body.principal-deck .slide.warm {
  background: var(--ch-cream-2);
}

body.principal-deck .brand-mark {
  background: var(--ch-green);
  color: var(--ch-cream);
  font-family: "Fraunces", Georgia, serif;
  font-weight: 600;
  font-size: 13px;
  letter-spacing: 0.02em;
  border-radius: 8px;
}

body.principal-deck .slide.dark .brand-mark {
  background: var(--ch-orange);
  color: var(--ch-cream);
}

body.principal-deck .brand-word {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 560;
  letter-spacing: -0.02em;
  color: var(--ch-ink);
}

body.principal-deck .slide.dark .brand-word {
  color: var(--ch-cream);
}

body.principal-deck .meta,
body.principal-deck .eyebrow {
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-size: 11px;
  font-weight: 600;
  color: var(--ch-orange);
}

body.principal-deck .slide.dark .meta,
body.principal-deck .slide.dark .eyebrow {
  color: var(--ch-pink);
}

body.principal-deck .slide-title,
body.principal-deck h1,
body.principal-deck h2 {
  font-family: "Fraunces", Georgia, serif;
  font-weight: 560;
  letter-spacing: -0.03em;
}

body.principal-deck .title-slide .hero h1 {
  margin-bottom: 12px;
}

body.principal-deck .title-slide .hero .eyebrow {
  text-transform: none;
  font-family: "Sora", sans-serif;
  font-size: clamp(15px, 1.8vw, 20px);
  font-weight: 500;
  letter-spacing: -0.01em;
  color: rgba(251, 244, 236, 0.78);
  margin-bottom: 0;
}

body.principal-deck .title-slide h1 {
  white-space: normal;
  max-width: 22ch;
  line-height: 1.08;
  text-transform: none;
}

body.principal-deck .title-slide .sub {
  color: rgba(251, 244, 236, 0.78);
  max-width: 42ch;
}

body.principal-deck .title-footer {
  border-top-color: rgba(251, 244, 236, 0.14);
  color: rgba(251, 244, 236, 0.62);
}

body.principal-deck .letter-aside a,
body.principal-deck .resume-contact a {
  color: var(--ch-green);
  text-decoration: none;
  font-weight: 600;
}

body.principal-deck .letter-aside a:hover,
body.principal-deck .resume-contact a:hover {
  color: var(--ch-orange-deep);
  text-decoration: underline;
}

body.principal-deck .letter-aside img {
  border-radius: 8px;
  border: 3px solid var(--ch-cream);
  outline: 2px solid var(--ch-orange);
}

body.principal-deck .dots span.on {
  background: var(--ch-orange);
}

body.principal-deck .dots span {
  background: rgba(251, 244, 236, 0.25);
}

body.principal-deck .slide.dark.title-slide::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--ch-orange) 0%, var(--ch-pink) 40%, var(--ch-green) 100%);
}

body.principal-deck .slide.dark.title-slide {
  position: absolute;
  overflow: hidden;
}

body.principal-deck .resume h3 {
  color: var(--ch-orange-deep);
}

body.principal-deck .resume-job .role {
  color: var(--ch-ink);
}