/* M7 Revista — tokens de design
   Dark é a experiência principal (padrão sem preferência do sistema).
   Light é um tema próprio (papel quente), não uma inversão do dark.
   O atributo data-theme é definido por js/theme.js antes da primeira pintura.
   Escopo: somente /revista (este CSS não é carregado pelo site principal). */

:root {
  /* marca */
  --red: #F1091B;

  /* dark (padrão) */
  color-scheme: dark;
  --bg: #0E0E10;
  --bg-elev: #151518;
  --fg: #F3F0EA;
  --fg-2: #BBB7AF;
  --fg-3: #8C8880;
  --line: rgba(243, 240, 234, .11);
  --line-strong: rgba(243, 240, 234, .22);
  --red-text: #FF2B3A;          /* vermelho M7 ajustado para texto pequeno (contraste ≥ 4.5:1) */
  --hero-fade: var(--bg);       /* dissolve a borda da fotografia no fundo */

  /* tipografia */
  --font-sans: 'Manrope', 'DM Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --font-text: 'DM Sans', system-ui, -apple-system, 'Segoe UI', Arial, sans-serif;
  --font-serif: 'Newsreader', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;

  /* layout */
  --maxw: 1200px;           /* largura do conteúdo editorial (portal) */
  --gutter: clamp(20px, 4vw, 56px);
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* light — vale para escolha manual e para prefers-color-scheme sem JS */
:root[data-theme="light"] {
  color-scheme: light;
  --bg: #F4F0E8;
  --bg-elev: #ECE7DC;
  --fg: #131211;
  --fg-2: #45413B;
  --fg-3: #6F6A62;
  --line: rgba(19, 18, 17, .13);
  --line-strong: rgba(19, 18, 17, .28);
  --red-text: #D3061A;
  --hero-fade: transparent;     /* no papel, a fotografia mantém a borda firme */
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
    color-scheme: light;
    --bg: #F4F0E8;
    --bg-elev: #ECE7DC;
    --fg: #131211;
    --fg-2: #45413B;
    --fg-3: #6F6A62;
    --line: rgba(19, 18, 17, .13);
    --line-strong: rgba(19, 18, 17, .28);
    --red-text: #D3061A;
    --hero-fade: transparent;
  }
}