/* Tema de Método Camaleónico: la identidad de su web pública (metodocamaleonico.com).
   Variables, tipografías y logo copiados de la web; el diseño de referencia está en
   docs/diseno/2026-09-29_fenrir-technologies_preview_panel-equipo-metodo-camaleonico_v01.html.
   Contraste AA comprobado: texto 15.9:1, secundario 6.8:1, botón 6.5:1 en su punto más oscuro.
   El tramo cobre más oscuro (#b5683f) no lleva texto encima: con él el botón se quedaría en 4.1:1. */
@font-face {
  font-family: "Sora"; font-style: normal; font-weight: 300 800; font-display: swap;
  src: url(/estaticos/tema/sora.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;
}
@font-face {
  font-family: "Playfair Display"; font-style: normal; font-weight: 700 900; font-display: swap;
  src: url(/estaticos/tema/playfair.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;
}

:root, :root[data-theme] {
  color-scheme: dark;
  --bg: #0e0809; --bg-2: #140c0d; --surface: #1b1012; --surface-2: #241619;
  --line: rgba(222, 176, 142, .14); --campo: #7a5c50; --text: #f4ece7; --muted: #a99a92;
  --c1: #e6c39c; --c2: #cf9266; --c3: #b5683f; --c4: #d99a8a; --c5: #e0b894;
  --red: #b1181d; --red-soft: #e0575c; --ok: #9ed4ae; --error: #f0a0a3;
  --grad: linear-gradient(110deg, #ecc9a0, #cf9266, #b5683f);
  --grad-boton: linear-gradient(110deg, #ecc9a0, #cf9266); --texto-boton: #2a160c;
  --peligro-fondo: #b1181d; --peligro-texto: #ffffff;
  --sans: "Sora", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Playfair Display", Georgia, "Times New Roman", serif;
  --cabecera: rgba(14, 8, 9, .88);
}
::selection { background: var(--c1); color: #2a160c; }

/* Los dos resplandores de la web, detrás de todo y sin recibir clics. */
body::before, body::after { content: ""; position: fixed; z-index: 0; border-radius: 50%; filter: blur(100px);
  opacity: .24; pointer-events: none; }
body::before { width: 46vw; height: 46vw; max-width: 560px; max-height: 560px; top: -12%; right: -8%;
  background: radial-gradient(circle, var(--red), transparent 65%); }
body::after { width: 42vw; height: 42vw; max-width: 520px; max-height: 520px; bottom: -15%; left: -10%;
  background: radial-gradient(circle, var(--c4), transparent 65%); }

h1 .resalte { background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
button:hover, .boton:hover { box-shadow: 0 12px 34px -8px rgba(177, 24, 29, .55); }
button.boton-claro, .boton.boton-claro { background: transparent; color: var(--c1); }
input:focus, select:focus, textarea:focus { border-color: var(--red-soft); box-shadow: 0 0 0 4px rgba(177, 24, 29, .25); }
select { color-scheme: dark; }

/* Estados de un lead (las claves salen de clientes/metodo-camaleonico.toml). */
.estado-nuevo { background: rgba(224, 87, 92, .16); border-color: rgba(224, 87, 92, .35); color: #f0a0a3; }
.estado-hablando { background: rgba(207, 146, 102, .2); border-color: rgba(207, 146, 102, .4); color: var(--c1); }
.estado-cliente { background: rgba(120, 190, 140, .16); border-color: rgba(120, 190, 140, .35); color: #9ed4ae; }
.estado-no { background: rgba(169, 154, 146, .12); color: var(--muted); }