/* ============================================================
   theme.rxspot.css — aparência do site institucional RXSpot
   (repo: rxspot-site)

   Valores das variáveis do contrato rx-core (ver
   rx-core-site/css/tokens.css para a lista e o significado de cada uma).
   Carregar DEPOIS de tokens.css. rx-core não define aparência de
   nenhuma marca — a paleta, as fontes e o ruído de fundo do rxspot.io
   vivem aqui.

   Fase 3 da separação visual (Set 2026) — identidade da marca-mãe:
   - UMA cor de destaque própria: cobalto de azulejo, que nenhum dos
     produtos usa. Só no botão principal, no foco e em "Spot".
   - Cada produto aparece com a SUA cor (âmbar do ImóvelRX, teal do
     CommunityRX), só dentro do seu cartão — ver --rs-imo / --rs-cr.
   - Tipografia: uma só família, Schibsted Grotesk.
   Sem variáveis --rx-overlay-*: este site não usa o overlay de transição.
   ============================================================ */

/* ── Fonte (subset latin, alojada neste repo em /fonts) ─────── */
@font-face {
  font-family: 'Schibsted Grotesk';
  font-style: normal;
  font-weight: 400 900;
  font-display: swap;
  src: url('/fonts/schibsted-latin.woff2') format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ── Tema escuro (por omissão) ── */
:root {
  --page-max-width: 980px;

  --rx-font-display: 'Schibsted Grotesk', 'Helvetica Neue', system-ui, sans-serif;
  --rx-font-body:    'Schibsted Grotesk', 'Helvetica Neue', system-ui, sans-serif;
  --rx-font-mono:    ui-monospace, 'SFMono-Regular', Menlo, monospace;

  --rx-surface-0: #0e1116;
  --rx-surface-1: #151a21;
  --rx-surface-2: #1c222b;
  --rx-surface-3: #242b35;

  --rx-text-1:  #eceef1;
  --rx-text-2:  #c4c9d1;
  --rx-text-3:  #959daa;
  --rx-muted-1: #69717e;
  --rx-muted-2: #858d99;

  --rx-tint-1: #ffffff0a;
  --rx-tint-2: #ffffff14;
  --rx-tint-3: #ffffff24;
  --rx-border:        #242b35;
  --rx-border-strong: #343d4a;

  --rx-accent:          #5b7ff0;
  --rx-accent-hover:    #7a98f5;
  --rx-accent-glow:     #5b7ff022;
  --rx-accent-contrast: #0a1233;
  --rx-accent-text:     #8aa4f6;

  --rx-good: #4cc38a;
  --rx-bad:  #f07a6e;
  --rx-warn: #e7b54a;

  --rx-noise-opacity: 0;

  /* Cores dos produtos — só dentro do cartão de cada um. */
  --rs-imo: #f5a623;
  --rs-cr:  #14b8a6;
  --rs-shadow: 0 1px 2px rgba(0,0,0,0.35);
  --rs-nav-bg: rgba(14,17,22,0.85);

  /* Rodapé do site (.site-footer, rx-core) — faixa escura nos dois
     temas; no escuro, um tom abaixo do fundo da página. */
  --rx-footer-bg:     #090b0f;
  --rx-footer-border: #242b35;
  --rx-footer-text:   #eceef1;
  --rx-footer-text-2: #959daa;
  --rx-footer-muted:  #69717e;
  --rx-footer-rule:   #ffffff14;
  --rx-footer-brand:  #8aa4f6;
}

/* ── Tema claro ── */
html.light {
  --rx-surface-0: #f7f7f5;
  --rx-surface-1: #ffffff;
  --rx-surface-2: #efefec;
  --rx-surface-3: #e4e5e8;

  --rx-text-1:  #111418;
  --rx-text-2:  #3b414b;
  --rx-text-3:  #666d78;
  --rx-muted-1: #8b919b;
  --rx-muted-2: #666d78;

  --rx-tint-1: #0000000a;
  --rx-tint-2: #00000012;
  --rx-tint-3: #0000001f;
  --rx-border:        #e2e4e8;
  --rx-border-strong: #cdd1d8;

  --rx-accent:          #2447b8;
  --rx-accent-hover:    #1d3a99;
  --rx-accent-glow:     #2447b81f;
  --rx-accent-contrast: #ffffff;
  --rx-accent-text:     #2447b8;

  --rx-good: #16734a;
  --rx-bad:  #b0281e;
  --rx-warn: #8a5a00;

  --rx-noise-opacity: 0;

  --rs-imo: #f2a01f;
  --rs-cr:  #14b8a6;
  --rs-shadow: 0 1px 2px rgba(17,20,24,0.05), 0 10px 30px rgba(17,20,24,0.06);
  --rs-nav-bg: rgba(247,247,245,0.9);

  --rx-footer-bg:     #111418;
  --rx-footer-border: #111418;
  --rx-footer-text:   #f7f7f5;
  --rx-footer-text-2: #aab0ba;
  --rx-footer-muted:  #7d8591;
  --rx-footer-rule:   #ffffff1a;
  --rx-footer-brand:  #8aa4f6;
}
