*{
    padding: 0;
    margin: 0;
}
:root {
    --primary-50: #BFD7FB;
    --primary-100: #bfd7fb;
    --primary-200: #9fc3f9;
    --primary-300: #7eaef7;
    --primary-400: #5e9af5;
    --primary-500: #3E86F3;
    --primary-600: #2979f2;
    --primary-700: #0d5dd5;
    --primary-800: #0a45a0;
    --primary-900: #072e6a;

    --secondary-500: #2a2460;
    --secondary-600: #231e50;
    --secondary-700: #1c1840;
    --secondary-800: #151230;
    --secondary-900: #0e0c20;

    --white: #fff;
    --gray: #6c757d;
    --gray-dark: #343a40;
    --secondary: #6EBBF6;
    --success: #28a745;
    --warning: #ffc107;
    --danger: #dc3545;
    --light: #BFD7FB;
    --dark: #211E1C;
}

h1, h2, h3, h4, h5, h6 {
    font-family: "Raleway", sans-serif;
    font-optical-sizing: auto;
    font-weight: 500;
    font-style: normal;
}
p{
    font-family: "Nunito", sans-serif;
    font-optical-sizing: auto;
    font-weight: 300;
    font-style: normal;
}


/* BACKGROUND */
.bg-primary-200{
    background-color: var(--primary-200);
}
.bg-primary-300{
    background-color: var(--primary-300);
}
.bg-primary-400{
    background-color: var(--primary-400);
}
.bg-primary-500{
    background-color: var(--primary-500);
}
.bg-secondary-500{
    background-color: var(--secondary-500);
}
/* BACKGROUND */


/* RGBA */
.bg-rgba-primary-200{
    background-color: rgba(159, 195, 249,0.45);
}
.bg-rgba-primary-500{
    background-color: rgba(62, 134, 243,0.85);
}
.bg-rgba-secondary-500-015{
    background-color: rgba(42, 36, 96,0.15);
}
.bg-rgba-secondary-500-045{
    background-color: rgba(42, 36, 96,0.45);
}
.bg-rgba-secondary-500-075{
    background-color: rgba(42, 36, 96,0.75);
}
.bg-rgba-secondary-500-090{
    background-color: rgba(42, 36, 96,0.90);
}
/* BACKGROUND */


/* TEXT COLOR */
.text-primary-100{
    color: var(--primary-100);
}
.text-primary-200{
    color: var(--primary-200);
}
.text-primary-500{
    color: var(--primary-500);
}
.text-primary-700{
    color: var(--primary-700);
}
.text-secondary-500{
    color: var(--secondary-500);
}
.text-secondary-600{
    color: var(--secondary-600);
}
.text-secondary-700{
    color: var(--secondary-700);
}
.text-secondary-800{
    color: var(--secondary-800);
}
.text-secondary-900{
    color: var(--secondary-900);
}
/* TEXT COLOR */


/* SHADOWS */
.shadow-primary-200{
    -webkit-box-shadow: 0px 0px 15px 3px rgba(159,195,249,0.63);
    -moz-box-shadow: 0px 0px 15px 3px rgba(159,195,249,0.63);
    box-shadow: 0px 0px 15px 3px rgba(159,195,249,0.63);
}
.shadow-bot-primary-200{
    -webkit-box-shadow: 0px 0px 15px 3px rgba(159,195,249,0.63);
    -moz-box-shadow: 0px 0px 15px 3px rgba(159,195,249,0.63);
    box-shadow: 0 4px 6px 0px rgba(159,195,249,0.63);
}
/* SHADOWS */


/* BUTTONS */
.basic-button-primary{
    border-radius: 11px;
    color: var(--secondary-500);
    border: 1px solid white;
}
.basic-button-primary:hover{
    border: 1px solid var(--primary-100);
    border-radius: 18px;
    transition: 0.9s;
    background-color: var(--primary-100);
    color: var(--secondary-900);

    -webkit-box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
    -moz-box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
    box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
}
.primary-button{
    background-color: var(--primary-500);
    border-radius: 11px;
    padding: 7px 13px 7px 13px;
    border: 1px solid var(--primary-500);
    color: white;
    text-decoration: none;
}
.primary-button:hover{
    border: 1px solid var(--primary-100);
    border-radius: 18px;
    transition: 0.7s;
    background-color: var(--primary-100);
    color: var(--secondary-500);

    -webkit-box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
    -moz-box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
    box-shadow: 0px 0px 21px 1px rgba(159,195,249,0.42);
}
.secondary-button{
    background-color: var(--secondary-500);
    border-radius: 11px;
    padding: 7px 13px 7px 13px;
    border: 1px solid var(--secondary-500);
    color: white;
}
.secondary-button:hover{
    border: 1px solid var(--primary-500);
    border-radius: 18px;
    transition: 0.7s;
    background-color: var(--primary-500);
    color: var(--secondary-900);

    -webkit-box-shadow: 0px 0px 18px 0px rgba(42,36,96,0.46);
    -moz-box-shadow: 0px 0px 18px 0px rgba(42,36,96,0.46);
    box-shadow: 0px 0px 18px 0px rgba(42,36,96,0.46);
}
/* BUTTONS */


/* WHATSAPP-ICON */
.whatsapp-icon{
    position: fixed;
    bottom: 10px;
    right: 10px;
    background-color: #25D366;
    border-radius: 50%;
    width: 60px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 24px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
    text-decoration: none;
    z-index: 1000;
}
/* WHATSAPP-ICON */

/* IMAGE */
.image-brightness{
    filter: brightness(75%)
}
.image-container {
    width: 100%;
    height: 310px;
    overflow: hidden; 
    position: relative;
}
.image-container img {
    width: 100%;
    height: 100%;
    object-fit: cover; /*mantiene la proporción y llena el contenedor*/
}
/* IMAGE */











