/* Mediterráneo · Variables CSS globales
   Misma paleta y tipografía que los mockups aprobados.
   Cambiar aquí = cambia en todo el tema. */

:root {
  /* Superficies */
  --bg:        #ffffff;
  --bg-alt:    #f5f5f5;
  --bg-soft:   #f8f8f8;
  --bg-dark:   #23282d;

  /* Texto */
  --ink:       #14181c;
  --ink-2:     #3c3c3b;
  --ink-soft:  #5a5a5a;
  --ink-mute:  #8a8a8a;

  /* Líneas */
  --line:      #e5e5e5;

  /* Marca */
  --brand:      #007AC9;
  --brand-dark: #005a9a;
  --brand-70:   rgba(0,122,201,0.7);
  --brand-tint: #e6f2fb;
  --brand-tint-2: #cfe4f5;
  --brand-sky:  #9ec8ea;

  /* Radios */
  --r-sm:  8px;
  --r-md:  14px;
  --r-lg:  22px;

  /* Sombras */
  --sh-soft:  0 20px 50px -20px rgba(0,0,0,0.12);
  --sh-brand: 0 30px 60px -25px rgba(0,122,201,0.22);
  --sh-card:  0 40px 80px -40px rgba(0,122,201,0.18);

  /* Layout */
  --maxw:     1220px;
  --gutter:   24px;

  /* Tipografía */
  --font-body:    'Inter', -apple-system, BlinkMacSystemFont, 'SF Pro Text', sans-serif;
  --font-display: 'Fraunces', 'SF Pro Display', Georgia, serif;

  /* Transiciones */
  --t-fast: 0.15s ease;
  --t-base: 0.2s ease;
  --t-slow: 0.3s cubic-bezier(0.2, 0.8, 0.2, 1);
}