/* ============================================================
   NAWAL — Sistema de paleta de colores
   ------------------------------------------------------------
   Derivada de los DOS únicos colores del logo (assets/img/logo.png):

     flor      #ffb3fd  ->  oklch(0.862 0.129 327.5)
     wordmark  #686868  ->  oklch(0.517 0.000  —  )   gris neutro puro

   Toda la escala vive en el matiz 327.5 (rosa orquídea del logo).
   Los neutros salen del gris del wordmark, con una pizca del matiz
   de marca para que no se vean sucios junto al rosa.

   Nota: la versión anterior declaraba "derivado del logo" pero usaba
   un primario en 338 y acentos en 300 (violeta) y 280 (índigo). Esa
   dispersión de matices era la causa de que la marca se leyera como
   "rosa + morado" en vez de un solo color. Ahora el rango completo
   es 310–340: una sola familia.

   Espacio de color: OKLCH (perceptualmente uniforme)
   Contrastes verificados contra WCAG 2.1 AA (ver tabla al final).
   ============================================================ */

:root {
    /* ---- Color literal del logo (solo decorativo: es muy claro) ---- */
    --nw-brand-100: oklch(0.862 0.129 327.5);
    /* #ffb3fd  rosa exacto de la flor */

    /* ---- Superficies ---- */
    --nw-bg: oklch(0.985 0.006 327.5);
    /* fondo página       #fcf9fc */
    --nw-sidebar: oklch(0.991 0.004 327.5);
    /* barra lateral      #fdfbfd */
    --nw-card: #ffffff;
    /* tarjetas           */
    --nw-surface-alt: oklch(0.968 0.012 327.5);
    /* bandas alternas    #f9f2f9 */
    --nw-border: oklch(0.915 0.010 327.5);
    /* bordes / divisores #e7e1e6 */

    /* ---- Texto ---- */
    --nw-text: oklch(0.32 0.012 327.5);
    /* texto principal    #363136 */
    --nw-text-muted: oklch(0.517 0.000 327.5);
    /* secundario         #686868  = gris del logo */
    --nw-text-faint: oklch(0.545 0.008 327.5);
    /* tenue              #736e72  (oscurecido: antes no llegaba a 4.5:1) */

    /* ---- Marca / Primario ---- */
    --nw-primary: oklch(0.56 0.165 327.5);
    /* acción principal   #a54aa5 */
    --nw-primary-strong: oklch(0.47 0.175 327.5);
    /* hover / énfasis    #8b298c */
    --nw-primary-soft: oklch(0.955 0.030 327.5);
    /* fondo suave        #fce9fb */

    /* ---- Tinta profunda (footer, titulares) ---- */
    --nw-plum: oklch(0.27 0.060 327.5);
    /* #361b35 */

    /* ---- Acentos: misma familia (310–340), sin violeta ni índigo ---- */
    --nw-accent-1: oklch(0.60 0.150 340);
    /* rosa cálido        */
    --nw-accent-1-bg: oklch(0.955 0.032 340);
    --nw-accent-2: oklch(0.52 0.160 318);
    /* magenta profundo   */
    --nw-accent-2-bg: oklch(0.950 0.036 318);
    --nw-accent-3: oklch(0.57 0.155 327.5);
    /* orquídea (marca)   */
    --nw-accent-3-bg: oklch(0.955 0.034 327.5);
    --nw-accent-4: oklch(0.46 0.140 310);
    /* ciruela            */
    --nw-accent-4-bg: oklch(0.950 0.032 310);

    /* ---- Estados (fuera de la familia por necesidad semántica) ---- */
    --nw-success: oklch(0.62 0.13 155);
    --nw-success-bg: oklch(0.95 0.03 155);
    --nw-warning: oklch(0.72 0.13 70);
    --nw-warning-bg: oklch(0.96 0.04 80);
    --nw-danger: oklch(0.58 0.18 20);
    --nw-danger-bg: oklch(0.95 0.03 20);

    /* ---- Gradiente de marca ----
       Ambos extremos lo bastante oscuros para texto blanco encima. */
    --nw-gradient: linear-gradient(135deg, oklch(0.57 0.170 327.5), oklch(0.42 0.150 318));

    /* ---- Halo decorativo (usa el rosa literal del logo) ---- */
    --nw-glow: radial-gradient(circle, oklch(0.862 0.129 327.5 / 0.42), transparent 68%);

    /* ---- Sombras ---- */
    --nw-shadow-card: 0 1px 3px oklch(0.5 0.05 327.5 / 0.05);
    --nw-shadow-lift: 0 30px 60px -34px oklch(0.40 0.10 327.5 / 0.45);
    --nw-shadow-deep: 0 40px 80px -40px oklch(0.40 0.10 327.5 / 0.45);

    /* ---- Texto sobre el color primario ---- */
    --nw-on-primary: #ffffff;

    /* ---- Radios ---- */
    --nw-radius-sm: 10px;
    --nw-radius-md: 16px;
    --nw-radius-lg: 20px;
    --nw-radius-xl: 28px;

    /* ---- Curvas de easing (nunca linear ni ease-in-out) ---- */
    --nw-ease: cubic-bezier(0.16, 1, 0.3, 1);
    --nw-ease-soft: cubic-bezier(0.32, 0.72, 0, 1);
}

/* ============================================================
   Equivalentes HEX (por si tu herramienta no soporta OKLCH)
   ------------------------------------------------------------
   brand-100 (logo) #ffb3fd
   bg               #fcf9fc
   sidebar          #fefbfd
   card             #ffffff
   surface-alt      #f9f2f9
   border           #e7e1e6
   text             #363136
   text-muted       #686868   <- gris del logo
   text-faint       #736e72
   primary          #a54aa5
   primary-strong   #8b298c
   primary-soft     #fce9fb
   plum             #361b35
   accent-1         #b9579c   / bg #ffe8f7
   accent-2         #8e44a3   / bg #f9e7ff
   accent-3         #a651a5   / bg #fde9fc
   accent-4         #703c91   / bg #f5e9ff
   gradiente        #aa4baa -> #6d2981
   ============================================================

   Contraste verificado (WCAG 2.1 AA — mínimo 4.5:1 texto normal,
   3:1 texto grande):

   blanco / primary .................. 5.08:1   OK
   blanco / primary-strong ........... 7.53:1   OK
   blanco / gradiente (extremo claro)  4.89:1   OK
   blanco / gradiente (extremo osc.).. 9.17:1   OK
   blanco / plum ..................... 15.42:1  OK
   text / bg ......................... 12.19:1  OK
   text-muted / bg ................... 5.33:1   OK
   text-muted / surface-alt .......... 5.07:1   OK
   text-faint / bg ................... 4.76:1   OK
   primary / card (enlaces) .......... 5.08:1   OK
   primary-strong / primary-soft ..... 6.54:1   OK

   ============================================================ */