/*
 * variables.css — Design tokens de Soy Gema
 * Editar aquí para cambiar la paleta global.
 */

:root {
  /* Gradientes de marca */
  --grad:   linear-gradient(135deg, #8B5CF6 0%, #D946A8 100%);
  --grad-r: linear-gradient(315deg, #8B5CF6 0%, #D946A8 100%);

  /* Colores de marca */
  --purple: #8B5CF6;
  --pink:   #D946A8;

  /* Velocidad de transición global */
  --t-speed: background .4s ease, color .4s ease, border-color .4s ease;

  /* Dark background gradients para hero slides */
  --hero-dark1: #0d0820;
  --hero-dark2: #1a0a38;
  --hero-dark3: #0c0518;
}

/* ── TEMA CLARO ─────────────────────────────────────── */
[data-theme="light"] {
  --bg:         #F5F3FF;
  --bg2:        #FFFFFF;
  --bg3:        #EDE9FE;
  --surface:    #FFFFFF;
  --surface2:   #F5F3FF;
  --border:     rgba(139, 92, 246, .14);
  --border2:    rgba(139, 92, 246, .07);
  --text:       #1E1333;
  --text2:      #3D2E5A;
  --muted:      #7C6F9A;
  --accent:     #8B5CF6;
  --accent2:    #D946A8;
  --accent-bg:  rgba(139, 92, 246, .09);
  --shadow:     0 2px 20px rgba(139, 92, 246, .1);
  --shadow-lg:  0 12px 56px rgba(139, 92, 246, .18);
  --nav-bg:     rgba(245, 243, 255, .9);
  --logo-blend: multiply;
  --logo-filter: none;
}

/* ── TEMA OSCURO (por defecto) ───────────────────────── */
[data-theme="dark"] {
  --bg:         #0A0812;
  --bg2:        #0F0D1A;
  --bg3:        #14102A;
  --surface:    #0F0D1A;
  --surface2:   #12101F;
  --border:     rgba(139, 92, 246, .18);
  --border2:    rgba(139, 92, 246, .08);
  --text:       #EDE9FE;
  --text2:      #C4B5FD;
  --muted:      #6D5F90;
  --accent:     #A78BFA;
  --accent2:    #E879D9;
  --accent-bg:  rgba(139, 92, 246, .13);
  --shadow:     0 2px 20px rgba(0, 0, 0, .4);
  --shadow-lg:  0 16px 64px rgba(0, 0, 0, .6);
  --nav-bg:     rgba(10, 8, 18, .9);
  --logo-blend: normal;
  --logo-filter: brightness(1.15);
}
