/* =====================================================
   AEROVEX GLOBAL VARIABLES
===================================================== */

:root {

   /* ==============================
       COLORS
    ============================== */

   --primary-blue: #0B6EE8;
   --dark-navy: #061A3A;
   --deep-blue: #0754B8;
   --sky-blue: #56B8FF;

   --light-blue: #EAF7FF;
   --soft-blue: #F5FBFF;

   --white: #FFFFFF;
   --black: #111827;

   --text-dark: #172B4D;
   --text-body: #667085;
   --text-light: #98A2B3;

   --border-light: #E5EDF5;


   /* ==============================
       FONTS
    ============================== */

   --font-heading: "Poppins", sans-serif;
   --font-body: "Inter", sans-serif;


   /* ==============================
       GLOBAL FONT SIZES
    ============================== */

   --fs-xs: 10px;
   --fs-sm: 12px;
   --fs-base: 14px;
   --fs-md: 15px;
   --fs-lg: 17px;


   /* ==============================
       HEADINGS
    ============================== */

   --fs-h6: 16px;
   --fs-h5: 19px;
   --fs-h4: 22px;
   --fs-h3: 26px;
   --fs-h2: 34px;
   --fs-h1: 44px;


   /* ==============================
       LINE HEIGHT
    ============================== */

   --lh-tight: 1.15;

   --lh-heading: 1.20;

   --lh-body: 1.65;


   /* ==============================
       SPACING
    ============================== */

   --section-padding: 80px;

   --container-width: 1200px;


   /* ==============================
       BORDER RADIUS
    ============================== */

   --radius-sm: 7px;

   --radius-md: 10px;

   --radius-lg: 16px;

   --radius-xl: 20px;


   /* ==============================
       SHADOWS
    ============================== */

   --shadow-sm:
      0 5px 15px rgba(6, 26, 58, 0.06);

   --shadow-md:
      0 12px 30px rgba(6, 26, 58, 0.08);

   --shadow-lg:
      0 20px 50px rgba(6, 26, 58, 0.12);

}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 991px) {

   :root {

      --fs-h1: 38px;

      --fs-h2: 31px;

      --fs-h3: 24px;

      --fs-h4: 21px;

      --fs-h5: 18px;

      --fs-base: 14px;

      --section-padding: 70px;

   }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

   :root {

      --fs-base: 13px;

      --fs-sm: 11px;

      --fs-h1: 32px;

      --fs-h2: 27px;

      --fs-h3: 22px;

      --fs-h4: 19px;

      --fs-h5: 17px;

      --section-padding: 60px;

   }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 480px) {

   :root {

      --fs-h1: 29px;

      --fs-h2: 25px;

      --fs-h3: 21px;

      --fs-h4: 18px;

      --fs-h5: 16px;

      --fs-base: 13px;

      --section-padding: 55px;

   }

}