:root {
  /* ── Paleta IMBO ── */
  --imbo-orange:        #f2c610;
  --imbo-orange-dark:   #c9a208;
  --imbo-orange-light:  #fef9c3;
  --imbo-orange-rgb:    242, 198, 16;  /* mismo tono que --imbo-orange, en formato r,g,b para usar dentro de rgba() */

  /* ── Acento Techo Propio (verde) — disponible en toda página, no solo con .tp-theme ── */
  --tp-green:       #1FAE6E;
  --tp-green-dark:  #158055;
  --tp-green-light: #E3F9EC;
  --tp-green-rgb:   31, 174, 110;

  /* ── Azul de campaña Techo Propio — tomado del PDF de referencia,
     distinto del --imbo-dark-2 del resto del sitio (más saturado) ── */
  --tp-blue: #015499;
  --imbo-gray:          #64748B;
  --imbo-gray-light:    #94A3B8;
  --imbo-dark:          #2b3134;
  --imbo-dark-2:        #0d4372;
  --imbo-light:         #F8FAFC;
  --imbo-white:         #FFFFFF;

  /* ── Tipografías ── */
  --font-heading: 'Outfit', sans-serif;
  --font-body:    'Urbanist', sans-serif;

  /* ── Tamaños de fuente (escala fluida) ── */
  --fs-xs:   0.75rem;
  --fs-sm:   0.875rem;
  --fs-base: 1rem;
  --fs-lg:   1.125rem;
  --fs-xl:   1.25rem;
  --fs-2xl:  1.5rem;
  --fs-3xl:  1.875rem;
  --fs-4xl:  2.25rem;
  --fs-5xl:  3rem;
  --fs-6xl:  3.75rem;

  /* ── Espaciado ── */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  1.5rem;
  --space-xl:  2rem;
  --space-2xl: 3rem;
  --space-3xl: 4rem;
  --space-4xl: 6rem;

  /* ── Border radius ── */
  --radius-sm:   0.375rem;
  --radius-md:   0.75rem;
  --radius-lg:   1rem;
  --radius-xl:   1.5rem;
  --radius-full: 625rem; /* "totalmente redondo" a cualquier tamaño de elemento, sin usar px */

  /* ── Transiciones ── */
  --transition-fast:   all 0.15s ease;
  --transition-smooth: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  --transition-slow:   all 0.5s cubic-bezier(0.4, 0, 0.2, 1);

  /* ── Sombras modernas difusas ── */
  --shadow-xs:    0 0.0625rem 0.125rem 0 rgb(0 0 0 / 0.05);
  --shadow-sm:    0 0.0625rem 0.1875rem 0 rgb(0 0 0 / 0.1), 0 0.0625rem 0.125rem -0.0625rem rgb(0 0 0 / 0.1);
  --shadow-card:  0 0.25rem 1.5rem -0.25rem rgb(0 0 0 / 0.18), 0 0.125rem 0.5rem -0.125rem rgb(0 0 0 / 0.1);
  --shadow-float: 0 1.25rem 3.75rem -0.625rem rgb(0 0 0 / 0.35), 0 0.5rem 1.25rem -0.3125rem rgb(0 0 0 / 0.2);
  --shadow-glow:  0 0 2rem 0 rgba(var(--imbo-orange-rgb), 0.35);

  /* ── Glassmorphism ── */
  --glass-bg:     rgb(255 255 255 / 0.06);
  --glass-border: rgb(255 255 255 / 0.12);
  --glass-blur:   blur(1rem);

  /* ── Contenedor máximo ── */
  --container-max: 80rem; /* 1280px equivalente — crece junto con el font-size fluido desde 1024px */
  --container-pad: clamp(1.5rem, 5vw, 3rem);
}
