/* =====================================================================
   Mundo das Fotos · base compartilhada das páginas (vendas e obrigado)
   Cores da marca, tipografia e componentes comuns. Cada página pode
   acrescentar estilos próprios no <style> dela.
   ===================================================================== */

:root {
  --bg: #fff8ef;
  --card: #ffffff;
  --ink: #1f2a24;
  --muted: #5d6a63;
  --line: #f0e4d4;
  --wa: #1faa59;
  --wa-dark: #12873f;
  --ok: #0e7a4f;
  --ok-soft: #dff4e8;
  /* "lápis de cor" — usados em detalhes */
  --c1: #ff8a5b;
  --c2: #ffd166;
  --c3: #5ec2b7;
  --c4: #7b8cff;
  --c5: #ff6fa5;
  --logo-filter: none;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #14130f;
    --card: #1d1c18;
    --ink: #f3efe7;
    --muted: #b5ada0;
    --line: #2e2b25;
    --ok: #5fd39b;
    --ok-soft: #1d3329;
    --logo-filter: invert(1);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #14130f;
  --card: #1d1c18;
  --ink: #f3efe7;
  --muted: #b5ada0;
  --line: #2e2b25;
  --ok: #5fd39b;
  --ok-soft: #1d3329;
  --logo-filter: invert(1);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html, body { margin: 0; }
body {
  min-height: 100svh;
  background: var(--bg);
  color: var(--ink);
  font: 17px/1.55 Nunito, system-ui, -apple-system, "Segoe UI", sans-serif;
  overflow-x: hidden;
}
h1, h2, h3 { font-family: "Baloo 2", Nunito, sans-serif; font-weight: 800; line-height: 1.1; }

/* Logo (PNG preto com transparência; invertido no modo escuro) */
.logo { display: block; height: auto; filter: var(--logo-filter); }

/* Faixa de lápis de cor */
.pencils { position: fixed; inset: 0 0 auto 0; height: 8px; display: flex; z-index: 10; }
.pencils span { flex: 1; }
.pencils span:nth-child(1) { background: var(--c1); }
.pencils span:nth-child(2) { background: var(--c2); }
.pencils span:nth-child(3) { background: var(--c3); }
.pencils span:nth-child(4) { background: var(--c4); }
.pencils span:nth-child(5) { background: var(--c5); }

/* Botão do WhatsApp */
.btn-wa {
  display: flex; align-items: center; justify-content: center; gap: 10px;
  width: 100%; min-height: 58px; padding: 14px 18px;
  background: var(--wa); color: #fff; text-decoration: none;
  border-radius: 16px; font-weight: 800; font-size: 18px;
  box-shadow: 0 6px 0 var(--wa-dark);
  transition: transform .08s ease, box-shadow .08s ease, background .15s;
}
.btn-wa:hover { background: var(--wa-dark); }
.btn-wa:active { transform: translateY(4px); box-shadow: 0 2px 0 var(--wa-dark); }
.btn-wa svg { width: 26px; height: 26px; flex: none; }

.site-footer { color: var(--muted); font-size: 12px; margin-top: 20px; text-align: center; }

@media (prefers-reduced-motion: reduce) {
  .btn-wa { transition: none; }
}