/* Pixelio — tokens. Generado a partir de tokens.json del design system «Pixelio».
   Orden de carga: kit de Adobe Fonts, tokens.css, bundle.css, sitio.css. */

@font-face {
  font-family: "Departure Mono";
  src: url("/fonts/DepartureMono-Regular.woff2") format("woff2");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: "Jacquard 24";
  src: url("/fonts/Jacquard24-Regular.woff") format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}

:root, [data-theme="produccion"] {
  /* Marca: no cambian con el registro */
  --obsidiana: #0e0c0b;
  --hueso: #ece8df;
  --plata-fria: #a3b1b4;
  --humo: #5f6666;
  --granate: #6e1520;
  --azul-pixel: #004fff;
  /* Rol: Producción */
  --fondo: var(--hueso);
  --tinta: var(--obsidiana);
  --tinta-tecnica: var(--humo);
  --acento: var(--azul-pixel);
  --sobre-acento: var(--hueso);
  --linea: var(--humo);
}
[data-theme="firma"] {
  --fondo: var(--obsidiana);
  --tinta: var(--hueso);
  --tinta-tecnica: var(--plata-fria);
  --acento: var(--granate);
  --sobre-acento: var(--hueso);
  --linea: var(--plata-fria);
}
[data-theme="firma-clara"] {
  --fondo: var(--hueso);
  --tinta: var(--obsidiana);
  --tinta-tecnica: var(--humo);
  --acento: var(--granate);
  --sobre-acento: var(--hueso);
  --linea: var(--humo);
}
:root {
  /* Espacio (base 8) */
  --espacio-1: 4px;
  --espacio-2: 8px;
  --espacio-3: 16px;
  --espacio-4: 24px;
  --espacio-5: 32px;
  --espacio-6: 48px;
  --espacio-7: 64px;
  --espacio-8: 96px;
  /* Esquinas */
  --radio-0: 0px;
  /* Retícula */
  --reticula-columnas: 12;
  --reticula-medianil: 24px;
  --reticula-margen: 48px;
  --reticula-margen-movil: 16px;
  /* Trazo */
  --trazo-fino: 1px;
  /* Familias */
  --font-serif: ivypresto-display, "IvyPresto Display", Cormorant, Georgia, serif;
  --font-sans-display: neue-haas-grotesk-display, "Neue Haas Grotesk Display Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-sans: neue-haas-grotesk-text, "Neue Haas Grotesk Text Pro", "Helvetica Neue", Helvetica, Arial, sans-serif;
  --font-mono: "Departure Mono", "IBM Plex Mono", ui-monospace, monospace;
  /* Fayte Pixel Hard (kit de Adobe Fonts); Jacquard 24 queda solo de respaldo si el kit no carga. */
  --font-sello: "fayte-pixel-hard", "Jacquard 24", "Departure Mono", monospace;
}

/* Estilos tipográficos */
.titular-firma-xl, .titular-firma, .enfasis-firma, .nombre-caso {
  font-family: var(--font-serif); font-weight: 400; hyphens: manual;
}
.titular-firma-xl { font-size: clamp(64px, 6vw + 16px, 96px); line-height: 1; }
.titular-firma, .enfasis-firma { font-size: clamp(64px, 4.5vw + 32px, 96px); line-height: 1; }
.enfasis-firma { font-style: italic; }
.nombre-caso { font-size: 40px; line-height: 1.05; }
.titular-produccion, .titular-produccion-s {
  font-family: var(--font-sans-display); font-weight: 500; hyphens: manual;
}
.titular-produccion { font-size: clamp(40px, 2.2vw + 24px, 56px); line-height: 1.05; }
.titular-produccion-s { font-size: 40px; line-height: 1.1; }
.texto-grande { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 400; }
.texto { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.capa-tecnica, .capa-tecnica-l {
  font-family: var(--font-mono); font-weight: 400; letter-spacing: 0.06em;
  text-transform: uppercase; font-synthesis: none;
}
.capa-tecnica { font-size: 11px; line-height: 16px; }
.capa-tecnica-l { font-size: 13px; line-height: 18px; }
.sello { font-family: var(--font-sello); font-size: 48px; line-height: 1; font-weight: 400; font-synthesis: none; }

@media (max-width: 767px) {
  .texto-grande { font-size: 16px; line-height: 24px; }
}
