/* cinezia — generated from tokens.json */
:root, [data-theme="beige"] {
  --cinezia-blue: #0454f2;
  --cinezia-beige: #f2f0d8;
  --black: #000000;
  --white: #ffffff;
  --surface: var(--cinezia-beige);
  --surface-inverse: var(--cinezia-blue);
  --ink: var(--cinezia-blue);
  --ink-inverse: var(--cinezia-beige);
  --ink-strong: var(--black);
  --night: var(--black);
  --focus: var(--cinezia-blue);
}
[data-theme="azul"] {
  --surface: var(--cinezia-blue);
  --surface-inverse: var(--cinezia-beige);
  --ink: var(--cinezia-beige);
  --ink-inverse: var(--cinezia-blue);
  --ink-strong: var(--white);
  --focus: var(--cinezia-beige);
}
:root {
  --space-1: 8px;
  --space-2: 16px;
  --space-3: 24px;
  --space-4: 32px;
  --space-6: 48px;
  --space-8: 64px;
  --radius-sm: 8px;
  --radius-md: 24px;
  --radius-lg: 32px;
  --radius-pill: 999px;
  --font-display: "scandia-web-stencil", "Scandia Stencil", "Arimo", Arial, sans-serif;
  --font-sans: "Arimo", Arial, Helvetica, sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 96px; line-height: 0.95; font-weight: 700; letter-spacing: -0.01em; }
.display-lg { font-family: var(--font-display); font-size: 56px; line-height: 1; font-weight: 700; }
.display-md { font-family: var(--font-display); font-size: 32px; line-height: 1.1; font-weight: 700; }
.heading { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 700; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body-emphasis { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 700; font-style: italic; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 12px; line-height: 16px; font-weight: 400; letter-spacing: 0.08em; }
/* Scandia Stencil se carga desde Adobe Fonts (kit «Cinezia web», gbg8lxw) en el <head> de Base.astro. */

/* ---------- Extensiones de la web (pasar a tokens.json del design system) ---------- */
:root {
  /* Colores de apoyo */
  --carbon: #111214;          /* fondo en modo oscuro */
  --carbon-2: #1c1d21;        /* superficie elevada en modo oscuro */
  --blue-on-dark: #7aa2ff;    /* azul legible sobre carbón (7,5:1) */
  --rec: #ff3b30;             /* punto de grabación de la portada */
  --scrim-strong: rgba(0, 0, 0, .6);
  --scrim: rgba(0, 0, 0, .5);
  --scrim-soft: rgba(0, 0, 0, .25);
  /* Escala de titulares: cuatro tamaños */
  --h-hero: clamp(52px, 12vw, 176px);     /* portada y título de cada película */
  --h-page: clamp(44px, 8.5vw, 120px);    /* título de página */
  --h-section: clamp(36px, 6.4vw, 92px);  /* título de sección */
  --h-sub: clamp(24px, 3vw, 40px);        /* subtítulos, tarjetas, paneles */
  /* Tipografía de datos técnicos: tiempos, duraciones, contador de cámara */
  --font-mono: "IBM Plex Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;
  /* Movimiento */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --ease-cine: cubic-bezier(.65, 0, 0, 1);  /* acelera fuerte, frena largo: portada y cortes */
  --ease-cut: cubic-bezier(.75, 0, 0, 1);   /* transiciones entre páginas */
  --dur-fast: .2s;
  --dur: .45s;
  --dur-slow: 1.1s;
}
/* Tema oscuro: se activa según el sistema del visitante */
@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --surface: var(--carbon);
    --surface-inverse: var(--cinezia-beige);
    --ink: var(--cinezia-beige);
    --ink-inverse: var(--carbon);
    --ink-strong: var(--white);
    --focus: var(--cinezia-beige);
  }
}