/**
 * Simberk — Design tokens
 * Única fuente de verdad: custom properties (--sk-*), @font-face self-hosted, keyframes.
 * Convención: variables --sk-* y clases sk-*. No pisar ast-* ni elementor-*.
 */

/* ==========================================================================
   Fuentes self-hosted (subset latin — sin CDN). Familias con el nombre exacto
   que usa Elementor en sus Global Fonts, para que resuelvan a estos archivos.
   ========================================================================== */
@font-face {
  font-family: 'Sora';
  font-style: normal;
  font-weight: 500 800;              /* fuente variable */
  font-display: swap;
  src: url('../fonts/sora/sora.woff2') format('woff2');
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  font-style: normal;
  font-weight: 400 700;              /* fuente variable */
  font-display: swap;
  src: url('../fonts/plus-jakarta-sans/plus-jakarta-sans.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('../fonts/space-mono/space-mono-400.woff2') format('woff2');
}
@font-face {
  font-family: 'Space Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('../fonts/space-mono/space-mono-700.woff2') format('woff2');
}

/* ==========================================================================
   Tokens
   ========================================================================== */
:root {
  /* Superficies */
  --sk-bg: #0A0D13;
  --sk-bg-alt: #080B11;
  --sk-surface: #0E131C;
  --sk-footer: #06080D;

  /* Acento */
  --sk-accent: #3D7BFF;
  --sk-accent-hover: #5E92FF;
  --sk-success: #3BD17A;

  /* Acento translúcido (fondos y realces) */
  --sk-accent-05: rgba(61, 123, 255, .05);
  --sk-accent-08: rgba(61, 123, 255, .08);
  --sk-accent-12: rgba(61, 123, 255, .12);
  --sk-accent-30: rgba(61, 123, 255, .30);
  --sk-accent-40: rgba(61, 123, 255, .40);
  --sk-accent-glow: rgba(61, 123, 255, .18);

  /* Texto */
  --sk-white: #FFFFFF;
  --sk-text: #F2F5FA;      /* títulos / texto fuerte */
  --sk-text-2: #93A1B5;    /* párrafos */
  --sk-text-3: #5C6B82;    /* terciario / mono */
  --sk-quote: #D2DAE6;     /* citas */

  /* Bordes */
  --sk-border: rgba(255, 255, 255, .10);
  --sk-border-soft: rgba(255, 255, 255, .08);
  --sk-border-card: rgba(255, 255, 255, .12);

  /* Tipografía */
  --sk-font-head: 'Sora', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --sk-font-body: 'Plus Jakarta Sans', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --sk-font-mono: 'Space Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
  --sk-ls-tight: -0.03em;
  --sk-ls-tighter: -0.045em;
  --sk-ls-wide: 0.04em;
  --sk-ls-wider: 0.16em;
  --sk-lh-body: 1.65;

  /* Layout */
  --sk-radius: 2px;
  --sk-container: 1240px;
  --sk-section-y: clamp(58px, 6.5vw, 96px);
  --sk-gutter: clamp(20px, 5vw, 40px);
}

/* ==========================================================================
   Keyframes (prefijados sk- para evitar colisiones)
   ========================================================================== */
@keyframes sk-floatY {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-10px); }
}
@keyframes sk-marquee {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
