/* =====================================================
   AEROVEX GLOBAL RESET
===================================================== */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/* =====================================================
   HTML
===================================================== */

html {
    scroll-behavior: smooth;
}


/* =====================================================
   BODY
===================================================== */

body {
    margin: 0;

    font-family: var(--font-body);

    font-size: var(--fs-base);

    font-weight: 400;

    line-height: var(--lh-body);

    color: var(--text-body);

    background: var(--white);

    overflow-x: hidden;
}


/* =====================================================
   HEADINGS
===================================================== */

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;

    font-family: var(--font-heading);

    color: var(--dark-navy);

    line-height: var(--lh-heading);

    font-weight: 600;
}


h1 {
    font-size: var(--fs-h1);
}


h2 {
    font-size: var(--fs-h2);
}


h3 {
    font-size: var(--fs-h3);
}


h4 {
    font-size: var(--fs-h4);
}


h5 {
    font-size: var(--fs-h5);
}


h6 {
    font-size: var(--fs-h6);
}


/* =====================================================
   PARAGRAPH
===================================================== */

p {
    margin: 0;

    font-family: var(--font-body);

    font-size: var(--fs-base);

    line-height: var(--lh-body);
}


/* =====================================================
   LINKS
===================================================== */

a {
    color: inherit;

    text-decoration: none;
}


/* =====================================================
   IMAGES
===================================================== */

img {
    display: block;

    max-width: 100%;

    height: auto;
}


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

button,
input,
textarea,
select {
    font-family: inherit;
}


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

.container {
    width: min(var(--container-width),
            calc(100% - 40px));

    margin: 0 auto;
}


/* =====================================================
   LISTS
===================================================== */

ul,
ol {
    margin: 0;
    padding: 0;

    list-style: none;
}


/* =====================================================
   TABLET
===================================================== */

@media (max-width: 991px) {

    .container {
        width: min(var(--container-width),
                calc(100% - 32px));
    }

}


/* =====================================================
   MOBILE
===================================================== */

@media (max-width: 767px) {

    .container {
        width: calc(100% - 30px);
    }

}


/* =====================================================
   SMALL MOBILE
===================================================== */

@media (max-width: 480px) {

    .container {
        width: calc(100% - 24px);
    }

}