/* =============================================================================
   Say Notary v2 — DESIGN TOKENS (fuente única de verdad)
   Identidad FINAL: paleta "Ciruela + Violeta" · tipografía Inter (display/UI) +
   Cormorant Garamond itálica (acento). Anclada al logo magenta #FF2E88 / #3D0A24.
   Cambia la marca desde AQUÍ. Nunca hex suelto: siempre var(--sn-*).
   ============================================================================= */

:root {
  /* ---------------------------------------------------------------------------
     COLOR — Ciruela + Violeta (campo claro frío + oscuros ciruela + magenta)
     --------------------------------------------------------------------------- */
  /* Superficies claras */
  --sn-cream:            #F2ECF0;  /* campo principal — crema fría con matiz violeta */
  --sn-card:             #FBF6FA;  /* tarjetas sobre el campo claro */

  /* Superficies oscuras (hero / secciones cinematográficas) */
  --sn-wine-night:       #0E0710;  /* ciruela nocturna — casi negro, fondo oscuro base */
  --sn-wine-raised:      #1A0A22;  /* ciruela-violeta elevada — cards/superficies oscuras */

  /* Marca */
  --sn-burgundy:         #7A1C46;  /* ciruela-baya — fills, botones secundarios */
  --sn-rose:             #FF2E88;  /* MAGENTA del logo — acento y glow. CON MODERACIÓN.
                                      Es ACENTO/GLOW/FILL, no texto de cuerpo. */
  --sn-violet:           #B14CFF;  /* violeta futurista — 2º acento, muy puntual (glows, gradientes) */
  --sn-champagne:        #E3CBB0;  /* champán frío — metal de lujo, brilla sobre oscuro */

  /* Tinta sobre claro */
  --sn-ink-heading:      #3D0A24;  /* titulares sobre claro (= oscuro del logo) */
  --sn-ink-body:         #6B4A5C;  /* cuerpo sobre claro (malva-gris) */

  /* Texto sobre oscuro */
  --sn-on-dark-heading:  #F2ECF0;  /* titulares/crema sobre oscuro */
  --sn-on-dark-body:     #C9A6BC;  /* cuerpo sobre oscuro */

  /* Overlay del hero (absorbe el gris del video hacia la ciruela) */
  --sn-hero-overlay:     rgba(14, 7, 16, 0.82);
  --sn-hero-gradient:    linear-gradient(180deg, rgba(14,7,16,0) 35%, rgba(14,7,16,0.85) 100%);

  /* Alias semánticos (usa estos en los componentes) */
  --sn-bg:               var(--sn-cream);
  --sn-surface:          var(--sn-card);
  --sn-text:             var(--sn-ink-body);
  --sn-heading:          var(--sn-ink-heading);
  --sn-accent:           var(--sn-rose);
  --sn-hairline:         rgba(61, 10, 36, 0.12);   /* líneas finas sobre claro */
  --sn-hairline-on-dark: rgba(227, 203, 176, 0.22); /* hairline champán sobre oscuro */

  /* ---------------------------------------------------------------------------
     TIPOGRAFÍA — Inter (estructura) + Cormorant Garamond itálica (movimiento)
     --------------------------------------------------------------------------- */
  --sn-font-display: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; /* titulares */
  --sn-font-body:    "Inter", system-ui, -apple-system, "Segoe UI", sans-serif; /* cuerpo/UI */
  --sn-font-accent:  "Fraunces", Georgia, "Times New Roman", serif;   /* acento en ITÁLICA (Fraunces) */

  --sn-fw-display-air:      500;  /* Inter medium para display */
  --sn-fw-display-emphasis: 600;
  --sn-fw-body:             400;
  --sn-fw-body-medium:      500;

  /* Escala fluida (clamp). Display Inter apretado; cuerpo sobrio. */
  --sn-fs-display-xl: clamp(2.75rem, 7vw, 6rem);      /* hero H1 (grande y apretado) */
  --sn-fs-display-l:  clamp(2.25rem, 4.5vw, 3.5rem);  /* H2 de sección */
  --sn-fs-display-m:  clamp(1.75rem, 3vw, 2.5rem);    /* H3 */
  --sn-fs-lead:       clamp(1.125rem, 1.6vw, 1.375rem); /* entradilla */
  --sn-fs-body:       1rem;
  --sn-fs-small:      0.875rem;
  --sn-fs-eyebrow:    0.8125rem;

  --sn-lh-tight:   1.02;  /* titulares Inter apretados */
  --sn-lh-snug:    1.3;
  --sn-lh-body:    1.65;
  --sn-tracking-eyebrow: 0.18em;
  --sn-tracking-display: -0.035em;  /* Inter display pide tracking negativo */
  --sn-tracking-accent:  0;         /* la itálica Cormorant no se aprieta */

  /* ---------------------------------------------------------------------------
     ESPACIADO — escala base 8
     --------------------------------------------------------------------------- */
  --sn-space-1: 0.25rem;  --sn-space-2: 0.5rem;   --sn-space-3: 0.75rem;
  --sn-space-4: 1rem;     --sn-space-5: 1.5rem;   --sn-space-6: 2rem;
  --sn-space-7: 3rem;     --sn-space-8: 4rem;     --sn-space-9: 6rem;   --sn-space-10: 8rem;

  --sn-container: 1200px;
  --sn-container-narrow: 760px;
  --sn-gutter: clamp(1.25rem, 4vw, 2.5rem);

  /* ---------------------------------------------------------------------------
     RADIOS Y ELEVACIÓN
     --------------------------------------------------------------------------- */
  --sn-radius-sm: 4px;
  --sn-radius:    10px;
  --sn-radius-lg: 18px;

  --sn-shadow-soft: 0 12px 40px rgba(14, 7, 16, 0.12);
  --sn-shadow-card: 0 20px 60px rgba(14, 7, 16, 0.16);
  /* Glow del acento — magenta con un pelín de violeta */
  --sn-glow-rose:   0 0 0 1px rgba(255, 46, 136, 0.35), 0 8px 30px rgba(255, 46, 136, 0.28);
  --sn-glow-violet: 0 0 40px rgba(177, 76, 255, 0.30);
  --sn-sheen-champagne: linear-gradient(135deg, #E3CBB0 0%, #F1E4CF 45%, #C9A574 100%);

  /* ---------------------------------------------------------------------------
     MOTION — tiempos y curvas (nada > 900ms, nada rebota, solo transform/opacity)
     --------------------------------------------------------------------------- */
  --sn-dur-micro:  0.18s;  --sn-dur-hover:  0.2s;  --sn-dur-reveal: 0.5s;
  --sn-dur-panel:  0.25s;  --sn-dur-slow:   0.9s;
  --sn-ease-out:   cubic-bezier(0.22, 1, 0.36, 1);
  --sn-ease-inout: cubic-bezier(0.65, 0, 0.35, 1);
  --sn-lenis-duration: 1.1;

  /* ---------------------------------------------------------------------------
     Z-INDEX
     --------------------------------------------------------------------------- */
  --sn-z-hero-video: 0;   --sn-z-hero-overlay: 1;  --sn-z-hero-content: 2;
  --sn-z-header: 100;     --sn-z-fab: 150;         --sn-z-modal: 200;
}

/* ============================================================
   BLOQUE CANÓNICO NUEVO (auditoría 20-ago-2026) — referencia
   Convive con el sistema --sn-* de arriba (home lo consume).
   Migración de home a estos nombres = paso aparte, deliberado.
   ============================================================ */
:root{
  --vino:#17070D; --dark:#0D0608; --vino2:#2A0F1C; --plum:#160A16; --borgo:#6E1A32;
  --cream:#F4ECE6; --creamsec:#FAF7F5; --card:#FBF7F3;
  --rose:#FF4F93; --rose2:#FF2E88; --violet:#B14CFF; --route:#E8729A; --mauve:#C9849A; --champ:#E7C9A3; --gold:#9A7B54;
  --ink:#2A0F1C; --ink-body:#6B4A52; --on-dark:#F4ECE6; --dim:rgba(244,236,230,.62);
  --font-display:'Space Grotesk',system-ui,sans-serif; --font-accent:'Instrument Serif',Georgia,serif; --font-body:'Manrope',system-ui,sans-serif;
  --dur:.8s; --ease:cubic-bezier(.16,1,.3,1); --stagger:.09s; --reveal-y:30px; --spin:4s;
}