/*==================================================
VARIABLES.CSS
Design System
==================================================*/

:root{

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

--primary:#00D9FF;
--primary-light:#63E8FF;
--primary-dark:#009FCC;

--secondary:#6C63FF;
--secondary-light:#8D86FF;
--secondary-dark:#5147D8;

--accent:#14F195;

--warning:#F5B301;
--danger:#FF5C7A;


/*==================================================
NEUTRALS
==================================================*/

--white:#FFFFFF;
--black:#000000;

--body:#060B14;

--surface:#0C1524;

--surface-light:#132238;

--card:#101C30;

--card-hover:#162844;


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

--text:#E8EEF8;

--text-light:#B4C1D8;

--text-muted:#7F90AA;


/*==================================================
BORDERS
==================================================*/

--border:rgba(255,255,255,.08);

--border-light:rgba(255,255,255,.12);

--border-primary:rgba(0,217,255,.25);


/*==================================================
GLASS
==================================================*/

--glass:rgba(255,255,255,.04);

--glass-strong:rgba(255,255,255,.08);


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

--shadow-sm:0 8px 20px rgba(0,0,0,.18);

--shadow-md:0 18px 40px rgba(0,0,0,.28);

--shadow-lg:0 30px 80px rgba(0,0,0,.40);


/*==================================================
GLOWS
==================================================*/

--glow-primary:0 0 35px rgba(0,217,255,.35);

--glow-secondary:0 0 35px rgba(108,99,255,.30);

--glow-success:0 0 30px rgba(20,241,149,.30);


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

--heading-font:"Space Grotesk",sans-serif;

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


/*==================================================
FONT WEIGHTS
==================================================*/

--fw-regular:400;

--fw-medium:500;

--fw-semibold:600;

--fw-bold:700;

--fw-black:800;


/*==================================================
TRANSITIONS
==================================================*/

--transition:all .35s ease;


/*==================================================
LAYOUT
==================================================*/

--container-width:1320px;

--content-width:820px;


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

--space-1:.25rem;
--space-2:.5rem;
--space-3:.75rem;
--space-4:1rem;
--space-5:1.5rem;
--space-6:2rem;
--space-7:2.5rem;
--space-8:3rem;
--space-9:4rem;
--space-10:5rem;
--space-11:7rem;

}