/* Slides editáveis: desenhados em 1280x720 e escalados por transform para caber em qualquer tela. */
.sl-frame { position: relative; overflow: hidden; flex: none; }
.sl {
  position: absolute; left: 0; top: 0; width: 1280px; height: 720px; transform-origin: 0 0;
  box-sizing: border-box; padding: 84px 96px; display: flex; flex-direction: column; overflow: hidden; text-align: left;
  font-family: Inter, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  color: var(--fg); background:
    radial-gradient(900px 560px at 92% -8%, color-mix(in srgb, var(--accent) var(--glow, 26%), transparent), transparent 62%), var(--bg);
}
/* Noir: identidade do PassaSlide. Carvão, filetes finos e acento dourado. */
.t-noir { --bg: #0e0e0f; --fg: #f1f1ee; --muted: #8f8f92; --accent: #d9ae4f; --card: rgba(255,255,255,.04); --line: rgba(255,255,255,.1); --on: #17130a; --glow: 13%; }
.t-noir h2::after { width: 56px; height: 3px; border-radius: 0; }
.t-noir .card { border-radius: 6px; }
.t-noir .l-title .bar, .l-title.t-noir .bar { height: 3px; width: 72px; border-radius: 0; }
.t-noir.l-title::after { background: radial-gradient(circle at 30% 30%, rgba(217,174,79,.35), transparent 70%); opacity: .8; }
.t-noir .kicker { letter-spacing: .28em; font-size: 22px; }
.t-noir .n { border-radius: 4px; }
/* Grafite: claro e limpo, com o laranja do logotipo */
.t-grafite { --bg: #f7f4ef; --fg: #2b2f33; --muted: #686d72; --accent: #b8541f; --card: #ffffff; --line: rgba(43,47,51,.12); --on: #ffffff; --glow: 0%; }
.t-grafite .card { border-radius: 6px; box-shadow: 0 1px 0 rgba(43,47,51,.05); }
.t-grafite.l-title::after { background: radial-gradient(circle at 30% 30%, rgba(184,84,31,.35), transparent 70%); opacity: .9; }
.t-violet { --bg: #15112e; --fg: #f4f2ff; --muted: #aaa5cb; --accent: #8b7bff; --card: rgba(255,255,255,.06); --line: rgba(255,255,255,.12); --on: #14102b; }
.t-ocean  { --bg: #0a2036; --fg: #eef6ff; --muted: #9db8d3; --accent: #38bdf8; --card: rgba(255,255,255,.06); --line: rgba(255,255,255,.12); --on: #04243a; }
.t-forest { --bg: #0e2a1f; --fg: #effbf3; --muted: #9fc7b0; --accent: #4ade80; --card: rgba(255,255,255,.06); --line: rgba(255,255,255,.12); --on: #06261a; }
.t-sunset { --bg: #2a1421; --fg: #fff3ec; --muted: #d4a99c; --accent: #fb923c; --card: rgba(255,255,255,.06); --line: rgba(255,255,255,.12); --on: #2b1005; }
.t-light  { --bg: #f8f8fc; --fg: #17142b; --muted: #615d7a; --accent: #5b4bff; --card: #ffffff; --line: rgba(20,18,43,.12); --on: #ffffff; }

/* Animações de entrada (escolhidas por apresentação) */
.sl.play .an { animation-duration: .6s; animation-timing-function: cubic-bezier(.2, .7, .2, 1); animation-fill-mode: both; animation-delay: calc(var(--i, 0) * 80ms); }
.sl.play[data-anim=fade] .an { animation-name: an-fade; }
.sl.play[data-anim=rise] .an { animation-name: an-rise; }
.sl.play[data-anim=slide] .an { animation-name: an-slide; }
.sl.play[data-anim=zoom] .an { animation-name: an-zoom; }
@keyframes an-fade { from { opacity: 0; } }
@keyframes an-rise { from { opacity: 0; transform: translateY(40px); } }
@keyframes an-slide { from { opacity: 0; transform: translateX(-70px); } }
@keyframes an-zoom { from { opacity: 0; transform: scale(.9); } }
.slide-stage > .fade-in { animation: an-fade .3s both; }
@media (prefers-reduced-motion: reduce) { .sl.play .an, .slide-stage > .fade-in { animation: none !important; } }

.sl h1 { margin: 0; font-size: 88px; line-height: 1.05; letter-spacing: -.03em; font-weight: 800; }
.sl h2 { margin: 0 0 44px; font-size: 56px; line-height: 1.1; letter-spacing: -.02em; font-weight: 800; padding-bottom: 26px; position: relative; }
.sl h2::after { content: ''; position: absolute; left: 0; bottom: 0; width: 80px; height: 7px; border-radius: 4px; background: var(--accent); }
.sl .sub { margin-top: 26px; font-size: 38px; line-height: 1.3; color: var(--muted); }
.sl .kicker { margin-bottom: 24px; font-size: 28px; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--accent); }
.sl ul.bl { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 22px; font-size: 40px; line-height: 1.3; }
.sl ul.bl li { position: relative; padding-left: 50px; }
.sl ul.bl li::before { content: ''; position: absolute; left: 0; top: .5em; width: 17px; height: 17px; border-radius: 50%; background: var(--accent); }
.sl.dense ul.bl { font-size: 32px; gap: 15px; }

.l-title, .l-section, .l-quote, .l-closing { justify-content: center; }
.l-title .bar { width: 100px; height: 9px; border-radius: 5px; background: var(--accent); margin-bottom: 38px; }
.l-title::after { content: ''; position: absolute; right: -140px; bottom: -180px; width: 560px; height: 560px; border-radius: 50%; background: linear-gradient(135deg, var(--accent), transparent 70%); opacity: .5; }
.l-section h1 { font-size: 100px; }
.l-closing { text-align: center; align-items: center; }
.l-closing .contact { margin-top: 44px; font-size: 32px; font-weight: 600; color: var(--accent); }

.l-twocol .cols { flex: 1; display: grid; grid-template-columns: 1fr 1fr; gap: 64px; }
.l-twocol .col h3 { margin: 0 0 22px; font-size: 34px; color: var(--accent); }
.l-twocol ul.bl { font-size: 32px; gap: 16px; }
.l-twocol.dense ul.bl { font-size: 27px; gap: 12px; }

.l-quote .qm { height: 110px; font-family: Georgia, serif; font-size: 240px; line-height: .8; color: var(--accent); }
.l-quote blockquote { margin: 0; font-size: 56px; line-height: 1.25; font-weight: 600; font-style: italic; }
.l-quote .author { margin-top: 38px; font-size: 30px; color: var(--muted); }

.l-stats .grid, .l-steps .grid { flex: 1; display: grid; grid-template-columns: repeat(var(--n), 1fr); gap: 28px; align-content: center; }
.sl .card { background: var(--card); border: 1px solid var(--line); border-radius: 24px; padding: 40px 32px; }
.sl .num { font-size: 70px; font-weight: 800; line-height: 1; color: var(--accent); letter-spacing: -.02em; overflow-wrap: break-word; }
.sl.many .card { padding: 36px 24px; }
.sl.many .num { font-size: 52px; }
.sl.many .st { font-size: 30px; }
.sl.many .sd { font-size: 24px; }
.sl .lab { margin-top: 18px; font-size: 28px; line-height: 1.3; color: var(--muted); }
.sl .n { width: 58px; height: 58px; margin-bottom: 26px; border-radius: 50%; display: grid; place-items: center; background: var(--accent); color: var(--on); font-size: 30px; font-weight: 800; }
.sl .st { font-size: 34px; font-weight: 700; line-height: 1.15; }
.sl .sd { margin-top: 14px; font-size: 26px; line-height: 1.3; color: var(--muted); }
