/* SevenApps — tokens 2026 (paleta logo-rodillo) */
:root {
  color-scheme: dark light;

  /* Neutros */
  --c-black: #07080c;
  --c-ink: #0e1016;
  --c-ink-2: #1a1d27;
  --c-soft: #c8ccd8;
  --c-mute: #8b92a5;
  --c-ink-soft: #3a4254;
  --c-line: rgba(255, 255, 255, 0.12);
  --c-line-dark: rgba(14, 16, 22, 0.1);
  --c-paper: #f5f5f5; /* whitesmoke */
  --c-white: #ffffff;
  --c-whitesmoke: #f5f5f5;

  /* Corporativos (logo-rodillo) */
  --c-yellow: #f0e465;
  --c-orange: #ee963b;
  --c-sky: #7be0cd;
  --c-sky-deep: #3bb8d0;
  --c-purple: #a536e6; /* usar con mesura */

  /* Alias compatibles con estilos existentes */
  --c-lavender: #b07aef; /* morado suave, poco uso */
  --c-cyan: #7be0cd;
  --c-cyan-deep: #3bb8d0;
  --c-accent: #ee963b;

  /* Gradientes: amarillo → naranja → cielo → morado (poco) */
  --c-spectrum: linear-gradient(125deg, #f0e465 0%, #ee963b 32%, #7be0cd 68%, #a536e6 100%);
  --c-brand: linear-gradient(105deg, #f0e465 0%, #ee963b 45%, #7be0cd 100%);
  --c-glow-a: rgba(240, 228, 101, 0.4);   /* amarillo */
  --c-glow-b: rgba(123, 224, 205, 0.38);  /* cielo */
  --c-glow-c: rgba(238, 150, 59, 0.32);   /* naranja */

  /* Solo Dosis */
  --font: "Dosis", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;

  /*
   * Tipografía 2026 — root estable (16px), fluidez solo en --step-*.
   * Rango profesional (no hinchado, no menudo):
   * body ~16–18 · lead ~18–20 · h3 ~22–26 · h2 ~28–36 · hero ~40–60
   */
  --fs-root: 100%;

  --step--2: clamp(0.75rem, 0.72rem + 0.1vw, 0.8125rem);     /* ~12–13px micro */
  --step--1: clamp(0.875rem, 0.84rem + 0.14vw, 0.9375rem);    /* ~14–15px caption */
  --step-0: clamp(1rem, 0.98rem + 0.15vw, 1.125rem);          /* ~16–18px body */
  --step-1: clamp(1.125rem, 1.06rem + 0.32vw, 1.25rem);       /* ~18–20px lead/sub */
  --step-2: clamp(1.375rem, 1.2rem + 0.55vw, 1.625rem);       /* ~22–26px h3 */
  --step-3: clamp(1.75rem, 1.45rem + 1.05vw, 2.25rem);        /* ~28–36px h2 */
  --step-4: clamp(2.125rem, 1.65rem + 1.6vw, 2.875rem);       /* ~34–46px display */
  --step-hero: clamp(2.5rem, 1.7rem + 2.4vw, 3.75rem);        /* ~40–60px hero */
  --step-display: clamp(3rem, 2.2rem + 3vw, 4.5rem);          /* números deco */

  --lh-tight: 1.12;
  --lh-snug: 1.35;
  --lh-body: 1.55;

  --space-xs: clamp(0.4rem, 0.35rem + 0.2vw, 0.55rem);
  --space-sm: clamp(0.65rem, 0.55rem + 0.3vw, 0.85rem);
  --space-md: clamp(1.15rem, 0.95rem + 0.7vw, 1.75rem);      /* ~18–28px: H1→lead */
  --space-lg: clamp(1.35rem, 1.05rem + 0.9vw, 1.85rem);
  --space-xl: clamp(1.85rem, 1.4rem + 1.5vw, 2.75rem);
  --space-2xl: clamp(3rem, 2.25rem + 2.6vw, 4.75rem);         /* ~48–76px → sección ~96–152px */
  --space-3xl: clamp(3rem, 3.25rem + 4.6vw, 8rem);

  --container: 1120px;
  --pad: clamp(1rem, 3.2vw, 1.75rem);
  --radius: 0.9rem;
  --radius-lg: 1.25rem;

  --t-fast: 0.18s;
  --t: 0.35s;
  --t-slow: 0.7s;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);

  --z-header: 80;
  --z-drawer: 90;
}

html {
  font-size: var(--fs-root);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--font);
  font-weight: 400;
  font-synthesis: none;
  font-stretch: normal;
  letter-spacing: 0.01em;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
}