/* ===========================================================
   THEME — PALETA EXPOINMOBILIARIA
   Azul eléctrico #0558FD + Verde lima #99FF00 + Negro #0A0A0A
   =========================================================== */
:root {
  /* ---------- COLORES ---------- */
  /* Primario = azul eléctrico del logo (CTAs, links, foco) */
  --color-primary:        #0558FD;
  --color-primary-dark:   #0442C7;
  --color-primary-soft:   #E6EEFF;

  /* Acento = verde lima del logo (highlights, badges, hover) */
  --color-accent:         #99FF00;
  --color-accent-dark:    #7ACC00;
  --color-accent-soft:    #EEFFD1;

  /* Tinta = negro del logo, para títulos y superficies oscuras */
  --color-ink:            #0A0A0A;
  --color-ink-soft:       #1F1F1F;
  --color-text:           #2D2D2D;
  --color-muted:          #707584;

  --color-bg:             #FFFFFF;
  --color-surface:        #F5F7FB;   /* secciones alternas claras */
  --color-surface-2:      #EEF1F8;
  --color-border:         #E3E6EE;

  --color-star:           #FFB547;

  /* ---------- TIPOGRAFÍAS ----------
     Cambia aquí para cambiar toda la tipografía del sitio */
  --font-heading:  'Poppins', 'Inter', system-ui, sans-serif;
  --font-body:     'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
  --font-accent:   'Poppins', 'Inter', sans-serif;   /* pills / labels */

  /* ---------- ESCALAS ---------- */
  --text-xs:   0.75rem;    /* 12 */
  --text-sm:   0.875rem;   /* 14 */
  --text-base: 1rem;       /* 16 */
  --text-md:   1.125rem;   /* 18 */
  --text-lg:   1.375rem;   /* 22 */
  --text-xl:   1.75rem;    /* 28 */
  --text-2xl:  2.25rem;    /* 36 */
  --text-3xl:  3rem;       /* 48 */
  --text-hero: clamp(2.5rem, 6vw, 4.25rem);

  /* Espaciado */
  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 0.75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --space-8: 2rem;
  --space-10: 2.5rem;
  --space-12: 3rem;
  --space-16: 4rem;
  --space-20: 5rem;
  --space-24: 6rem;

  /* Radios y sombras */
  --radius-sm: 6px;
  --radius:    10px;
  --radius-lg: 16px;
  --radius-pill: 999px;

  --shadow-sm: 0 2px 8px rgba(10, 10, 10, 0.05);
  --shadow:    0 10px 30px rgba(10, 10, 10, 0.08);
  --shadow-lg: 0 24px 60px rgba(10, 10, 10, 0.12);

  /* Contenedores */
  --container:  1240px;
  --container-narrow: 960px;

  /* Transiciones */
  --ease:  cubic-bezier(0.16, 1, 0.3, 1);
  --t-fast: 180ms var(--ease);
  --t: 260ms var(--ease);
}
