/* ============================================================
   VARIABLES.CSS — Design Tokens
   Aquacare Ingeniería — Corporate WaterTech
   ============================================================ */

@import url('https://api.fontshare.com/v2/css?f[]=general-sans@400,500,600,700&display=swap');

:root {
  /* ── Color Palette ─────────────────────────────────────── */
  --navy:          #0B1F3A;
  --navy-mid:      #162F56;
  --blue:          #1F4B99;
  --blue-hover:    #1a3f82;
  --blue-light:    #6FA9D6;
  --blue-tint:     #EBF3FA;

  --bg:            #F5F7FA;
  --bg-mid:        #EDF1F7;
  --white:         #FFFFFF;

  --text:          #1E293B;
  --text-mid:      #3D4F65;
  --text-soft:     #5F6B7A;
  --text-muted:    #8A97A6;

  --border:        #DDE4EE;
  --border-mid:    #C8D3E0;

  /* ── Typography ────────────────────────────────────────── */
  --font:          'General Sans', -apple-system, BlinkMacSystemFont, sans-serif;
  --fw-regular:    400;
  --fw-medium:     500;
  --fw-semibold:   600;
  --fw-bold:       700;

  /* ── Type Scale ────────────────────────────────────────── */
  --text-xs:       11px;
  --text-sm:       13px;
  --text-base:     15px;
  --text-md:       17px;
  --text-lg:       20px;
  --text-xl:       24px;
  --text-2xl:      32px;
  --text-3xl:      42px;
  --text-4xl:      52px;

  /* ── Spacing ───────────────────────────────────────────── */
  --space-xs:      8px;
  --space-sm:      16px;
  --space-md:      24px;
  --space-lg:      40px;
  --space-xl:      64px;
  --space-2xl:     96px;

  /* ── Layout ────────────────────────────────────────────── */
  --max-width:     1280px;
  --container-px:  40px;
  --header-h:      72px;

  /* ── Borders & Radius ──────────────────────────────────── */
  --radius-sm:     4px;
  --radius-md:     8px;
  --radius-lg:     12px;
  --radius-xl:     16px;

  /* ── Shadows ───────────────────────────────────────────── */
  --shadow-sm:     0 1px 4px rgba(11, 31, 58, 0.08);
  --shadow-md:     0 4px 16px rgba(11, 31, 58, 0.10);
  --shadow-lg:     0 8px 32px rgba(11, 31, 58, 0.13);

  /* ── Transitions ───────────────────────────────────────── */
  --t-fast:        0.15s ease;
  --t-base:        0.22s ease;
  --t-slow:        0.38s ease;
}