/* =====================================
   SENTIQUE STUDIO DESIGN SYSTEM
   VARIABLES
===================================== */

:root{

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

--color-petrol:#0A3D50;
--color-petrol-light:#1A6B7C;

--color-coral:#C15B42;
--color-apricot:#E8956D;

--color-raspberry:#C44B75;
--color-plum:#6B3F6E;

--color-cream:#F7F3EE;
--color-white:#FFFFFF;

--color-text:#1B2330;
--color-text-light:#6E7580;

--color-border:#E6DED7;


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

--container:1320px;
--container-wide:1440px;


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

--space-xs:8px;
--space-sm:16px;
--space-md:24px;
--space-lg:40px;
--space-xl:80px;
--space-xxl:140px;


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

--radius-sm:8px;
--radius-md:18px;
--radius-lg:30px;
--radius-xl:60px;


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

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

--shadow-md:0 20px 60px rgba(0,0,0,.08);

--shadow-lg:0 35px 90px rgba(0,0,0,.12);


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

--transition-fast:.25s ease;

--transition:.35s ease;

--transition-slow:.6s ease;


/* =====================================
   HEADER
===================================== */

--header-height:90px;


/* =====================================
   BUTTONS
===================================== */

--button-height:58px;

}