/* Definición de Variables Globales */
:root {
    /* Colores Neutrales */
    --Colors-Neutral-1000: #FCFCFD;
    --Colors-Neutral-700: #AAABC2;
    --Colors-Neutral-500: #777A99;
    --Colors-Neutral-400: #F6F8F9;
    --Colors-Neutral-200: #3C404B;
    --Colors-Neutral-100: #2A2E33;
    --Colors-Base-100: #F3F3F3;
    --Colors-Brand-300: #0054FF;
    --Colors-Brand-400: #0041C5;
    --Colors-property-color-2-Alpha-10: rgba(50, 165, 228, 0.10);
}

/* Reset y estilos genéricos */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    font-family: "Inter", sans-serif;
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; 
    line-height: 1.6;
    scroll-behavior: smooth;
}

body {
    height: 100vh;
    background: var(--Neutral-Neutral-400);
    margin: 0px;
}

a {
    all: unset; 
    display: inline-block; /* permite aplicar padding/margins si es necesario */
    cursor: pointer;
}

/* Encabezados */
h1 {
    font-size: 40px;
    line-height: 87px;
    font-weight: bold;
}

h2 {
    font-size: 24px;
    line-height: 38px;
    font-weight: bold;
}

h3 {
    font-size: 20px;
    line-height: 60px;
    font-weight: bold;
}

h4 {
    font-size: 24px;
    line-height: 51px;
    font-weight: bold;
}

h5 {
    font-size: 18px;
    line-height: 42px;
    font-weight: bold;
}



/* Cuerpo de texto */
.body-1 {
    font-size: 16px;
    line-height: 24px;
}

.body-2 {
    font-size: 14px;
    line-height: 21px;
}

.body-3 {
    font-size: 12px;
    line-height: 18px;
}

.body-4 {
    font-size: 10px;
    line-height: 15px;
}

.body-5 {
    font-size: 8px;
    line-height: 12px;
}