/* ========================= */
/* ROOT VARIABLES */
/* ========================= */

:root {

    --primary: #1D3557;

    --secondary: #457B9D;

    --accent: #A8DADC;

    --bg: #F1FAEE;

    --action: #E63946;

    --white: #ffffff;

    --gray: #6b7280;
}



/* ========================= */
/* RESET */
/* ========================= */

* {

    margin: 0;

    padding: 0;

    box-sizing: border-box;
}



html {

    scroll-behavior: smooth;
}



body {

    font-family: 'Inter', sans-serif;

    background: var(--bg);

    color: #111827;

    overflow-x: hidden;
}



/* ========================= */
/* GLOBAL ELEMENTS */
/* ========================= */

img {

    max-width: 100%;

    display: block;
}



a {

    text-decoration: none;

    color: inherit;
}



ul {

    list-style: none;
}



button {

    border: none;

    outline: none;

    cursor: pointer;

    transition: 0.3s ease;

    font-family: inherit;
}



/* ========================= */
/* SECTIONS */
/* ========================= */

section {

    padding: 110px 8%;
}



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

.container {

    width: 100%;

    max-width: 1400px;

    margin: auto;
}



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

.green-text {

    color: #16a34a;
}


.red-text {

    color: var(--action);
}



/* ========================= */
/* UTILITIES */
/* ========================= */

.hidden {

    display: none;
}