/*==========================================================
PUENTE DEL INCA
DESIGN SYSTEM v1.0
01. VARIABLES
==========================================================*/

:root{

/*==========================================================
COLORES
==========================================================*/

--pi-primary:#223D40;
--pi-primary-100:#2E5053;
--pi-primary-200:#45686B;
--pi-primary-300:#6B8B8E;

--pi-secondary:#F5F2EA;
--pi-secondary-100:#FBF9F5;
--pi-secondary-200:#E9F1F2;

--pi-accent:#B48A4A;
--pi-accent-light:#C8A66A;

--pi-white:#FFFFFF;

--pi-text:#223D40;
--pi-text-light:#5B7174;

--pi-border:#D7E2E3;

--pi-success:#4F7F52;
--pi-warning:#C59B3B;
--pi-danger:#B64D4D;


/*==========================================================
TIPOGRAFÍA
==========================================================*/

--font-heading:'Cormorant Garamond',serif;
--font-body:'Manrope',sans-serif;


/*==========================================================
PESOS
==========================================================*/

--fw-light:300;
--fw-regular:400;
--fw-medium:500;
--fw-semibold:600;
--fw-bold:700;


/*==========================================================
TAMAÑOS
==========================================================*/

--fs-display:clamp(4rem,7vw,6rem);

--fs-h1:clamp(3.4rem,5vw,5rem);
--fs-h2:clamp(2.7rem,4vw,3.8rem);
--fs-h3:clamp(2rem,3vw,2.8rem);
--fs-h4:1.6rem;

--fs-body:1.08rem;
--fs-small:.95rem;


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

--lh-display:1.05;
--lh-heading:1.1;
--lh-body:1.8;


/*==========================================================
ESPACIADOS
==========================================================*/

--space-xs:.5rem;
--space-sm:1rem;
--space-md:2rem;
--space-lg:4rem;
--space-xl:6rem;
--space-2xl:8rem;
--space-3xl:10rem;


/*==========================================================
CONTENEDORES
==========================================================*/

--container:1320px;
--container-wide:1480px;


/*==========================================================
RADIOS
==========================================================*/

--radius-sm:8px;
--radius-md:16px;
--radius-lg:28px;
--radius-xl:42px;
--radius-round:999px;


/*==========================================================
SOMBRAS
==========================================================*/

--shadow-sm:
0 5px 18px rgba(0,0,0,.06);

--shadow-md:
0 12px 30px rgba(0,0,0,.10);

--shadow-lg:
0 24px 60px rgba(0,0,0,.16);


/*==========================================================
TRANSICIONES
==========================================================*/

--transition-fast:.25s ease;

--transition:
.45s cubic-bezier(.22,.61,.36,1);


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

--header-height:100px;


/*==========================================================
BOTONES
==========================================================*/

--btn-height:56px;
--btn-padding:0 34px;


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

--z-header:1000;
--z-menu:1050;
--z-overlay:1100;
--z-modal:9999;

}