/* ==========================================================
   INTERWEBINDO UI KIT
   File      : variables.css
   Version   : 1.0.0
   Author    : Interwebindo
   Purpose   : Global Design Tokens
========================================================== */

:root{

/*==========================================================
  BRAND COLORS
==========================================================*/
/*-- dark blue --*/
--iw-primary: #123C73;
--iw-primary-hover: #0E315F;

/*-- red --*/
--iw-secondary: #D62828;
--iw-secondary-hover: #B91C1C;

/*-- light blue --*/
--iw-accent: #1D72F3;
--iw-accent-hover: #155DC8;


/*==========================================================
  NEUTRAL COLORS
==========================================================*/
	
/*-- dark blue --*/
--iw-dark: #1E293B;
--iw-dark-light: #334155;

/*-- light blue dark --*/
--iw-text: #475569;
--iw-text-light: #64748B;

--iw-white: #FFFFFF;

--iw-bg-white: #FFFFFF;
--iw-bg-soft: #F8FAFC;
--iw-bg-grey: #F1F5F9;

--iw-border: #E2E8F0;


/*==========================================================
  TYPOGRAPHY
==========================================================*/

--iw-font:
'Plus Jakarta Sans',
sans-serif;

--iw-fw-light:300;
--iw-fw-normal:400;
--iw-fw-medium:500;
--iw-fw-semibold:600;
--iw-fw-bold:700;
--iw-fw-extra:800;


/*==========================================================
  FONT SIZE
==========================================================*/

--iw-fs-xs:12px;
--iw-fs-sm:14px;
--iw-fs-md:16px;
--iw-fs-lg:18px;
--iw-fs-xl:20px;

/*==========================================================
  HEADINGS
==========================================================*/
--iw-h1: 42px;
--iw-h2: 32px;
--iw-h3: 26px;
--iw-h4: 22px;
--iw-h5: 20px;
--iw-h6: 18px;

/*==========================================================
TEXT ALIGN
==========================================================*/

--iw-text-left: left;
--iw-text-center: center;
--iw-text-right: right;
--iw-text-justify: justify;

/*==========================================================
  CONTAINER
==========================================================*/

--iw-container:1240px;


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

--iw-section-desktop:120px;
--iw-section-tablet:80px;
--iw-section-mobile:60px;


/*==========================================================
  GAP
==========================================================*/

--iw-gap-xs:8px;
--iw-gap-sm:16px;
--iw-gap-md:24px;
--iw-gap-lg:32px;
--iw-gap-xl:48px;


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

--iw-radius-none: 0;
--iw-radius-sm: 4px;
--iw-radius: 8px;
--iw-radius-md: 10px;
--iw-radius-lg: 14px;
--iw-radius-xl: 20px;
--iw-radius-pill: 999px;
--iw-radius-circle: 50%;


/*==========================================================
  BUTTON HEIGHT
==========================================================*/

--iw-btn-height:48px;


/*==========================================================
  INPUT HEIGHT
==========================================================*/

--iw-input-height:52px;


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

--iw-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);

--iw-shadow-sm: 0 4px 12px rgba(18, 60, 115, 0.08);

--iw-shadow-md: 0 8px 24px rgba(18, 60, 115, 0.12);

--iw-shadow-lg: 0 16px 40px rgba(18, 60, 115, 0.16);

--iw-shadow-hover: 0 12px 32px rgba(18, 60, 115, 0.18);

/*==========================================================
  TRANSITION
==========================================================*/


--iw-transition-fast: .2s ease;

--iw-transition: .3s ease;

--iw-transition-slow: .5s ease;

/*==========================================================
  Z INDEX
==========================================================*/

--iw-z-header:100;
--iw-z-dropdown:200;
--iw-z-offcanvas:300;
--iw-z-modal:999;



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

--iw-space-0: 0;
--iw-space-1: .25rem;   /* 4px */
--iw-space-2: .5rem;    /* 8px */
--iw-space-3: 1rem;     /* 16px */
--iw-space-4: 1.5rem;   /* 24px */
--iw-space-5: 3rem;     /* 48px */

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

--iw-border-0: 0;
--iw-border-1: 1px;
--iw-border-2: 2px;
--iw-border-3: 3px;
--iw-border-4: 4px;

/* Border Colors */
--iw-border-light: #E5E7EB;
--iw-border-dark: #D1D5DB;

}