/* =====================================================================
   NEXOYOGA — Tokens de diseño
   Única fuente de verdad de la marca en la web. Si la marca cambia,
   solo cambia este archivo.

   Fuente: Manual de identificación básica NEXOYOGA (Y...manera, 2016)
     · Coral      Pantone 7416 C  #E0684B  ("nexo" y la neurona)
     · Turquesa   Pantone 7466 C  #00B3BE  ("yoga")
     · Tipografía corporativa: Myriad Pro (licencia comercial de Adobe).
       En web se usa Source Sans 3: libre (OFL), de Adobe, misma familia
       humanista y proporciones casi idénticas. Alojada en el servidor.

   Accesibilidad (WCAG AA, texto normal >= 4,5:1):
     · Coral y turquesa originales NO alcanzan 4,5:1 sobre blanco
       (3,4 y 2,6). Se usan en logo, fondos, iconos y detalles.
     · Para texto, enlaces y botones se usan las variantes "-strong",
       mismo tono, más profundas: coral 5,3:1 · turquesa 4,9:1.
   ===================================================================== */

@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("/assets/fonts/source-sans-3-latin-wght-normal.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Source Sans 3";
  font-style: normal;
  font-weight: 200 900;
  font-display: swap;
  src: url("/assets/fonts/source-sans-3-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Source Sans 3";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url("/assets/fonts/source-sans-3-latin-wght-italic.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+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Source Sans 3";
  font-style: italic;
  font-weight: 200 900;
  font-display: swap;
  src: url("/assets/fonts/source-sans-3-latin-ext-wght-italic.woff2") format("woff2");
  unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* --- Marca (valores del manual, no modificar) --- */
  --brand-coral:      #E0684B;
  --brand-turquoise:  #00B3BE;
  --brand-black:      #1D1D1B;

  /* --- Coral: escala --- */
  --coral-50:   #FDF1EE;
  --coral-100:  #F9DDD5;
  --coral-500:  var(--brand-coral);
  --coral-strong: #BF4021;     /* texto y botones sobre claro: 5,3:1 */
  --coral-900:  #591E0F;

  /* --- Turquesa: escala --- */
  --turq-50:    #E8F8F9;
  --turq-100:   #C7EEF0;
  --turq-500:   var(--brand-turquoise);
  --turq-strong: #007D85;      /* enlaces sobre claro: 4,9:1 */
  --turq-800:   #00595F;
  --turq-900:   #003F42;       /* fondos oscuros: texto blanco 11,7:1 */

  /* --- Neutros (derivados del negro de marca, ligeramente cálidos) --- */
  --ink:        var(--brand-black);
  --ink-2:      #3D3A36;       /* texto de lectura: 11,3:1 */
  --ink-3:      #6B665F;       /* texto secundario: 5,6:1 */
  --line:       #E7E1DA;
  --surface:    #FFFFFF;
  --surface-2:  #FBF8F5;       /* fondo general, blanco cálido */
  --surface-3:  #F4EEE8;

  /* --- Roles (lo que usan los componentes) --- */
  --color-bg:          var(--surface-2);
  --color-text:        var(--ink-2);
  --color-heading:     var(--ink);
  --color-muted:       var(--ink-3);
  --color-link:        var(--turq-strong);
  --color-link-hover:  var(--turq-800);
  --color-accent:      var(--coral-strong);
  --color-primary:     var(--coral-strong);
  --color-primary-hover: #A6371D;
  --color-on-primary:  #FFFFFF;
  --color-secondary:   var(--turq-strong);
  --color-focus:       var(--brand-turquoise);

  /* --- Tipografía --- */
  --font-sans: "Source Sans 3", "Myriad Pro", Myriad, "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  --fw-light: 300;
  --fw-regular: 400;
  --fw-semibold: 600;
  --fw-bold: 700;
  --fw-black: 850;

  /* Escala fluida: móvil -> escritorio */
  --fs-xs:   0.8125rem;                          /* 13 */
  --fs-sm:   0.9375rem;                          /* 15 */
  --fs-base: 1.0625rem;                          /* 17 */
  --fs-read: clamp(1.0625rem, 1rem + .3vw, 1.1875rem);   /* 17 -> 19 */
  --fs-lg:   clamp(1.1875rem, 1.1rem + .4vw, 1.375rem);  /* 19 -> 22 */
  --fs-h4:   1.25rem;
  --fs-h3:   clamp(1.375rem, 1.2rem + .7vw, 1.625rem);
  --fs-h2:   clamp(1.75rem, 1.4rem + 1.4vw, 2.375rem);
  --fs-h1:   clamp(2.125rem, 1.6rem + 2.4vw, 3.5rem);
  --fs-display: clamp(2.125rem, 1.5rem + 3.4vw, 4.5rem);

  --lh-tight: 1.15;
  --lh-snug: 1.3;
  --lh-read: 1.65;

  /* --- Espaciado (base 4px) --- */
  --space-1: .25rem;  --space-2: .5rem;  --space-3: .75rem;  --space-4: 1rem;
  --space-5: 1.5rem;  --space-6: 2rem;   --space-7: 3rem;    --space-8: 4rem;
  --space-9: 6rem;
  --section-y: clamp(3rem, 2rem + 4vw, 6rem);

  /* --- Medidas --- */
  --container: 1180px;
  --container-narrow: 760px;
  --gutter: clamp(1rem, .5rem + 2vw, 2rem);
  --header-h: 72px;

  /* --- Forma --- */
  --radius-sm: 6px;
  --radius:    12px;
  --radius-lg: 20px;
  --radius-pill: 999px;
  --shadow-sm: 0 1px 2px rgb(29 29 27 / .06), 0 1px 3px rgb(29 29 27 / .08);
  --shadow:    0 4px 12px rgb(29 29 27 / .08), 0 2px 4px rgb(29 29 27 / .05);
  --shadow-lg: 0 18px 40px rgb(29 29 27 / .12);

  /* --- Movimiento --- */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --dur: 180ms;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur: 0ms; }
}
