/* import font google montserrat */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@200;300;400;600;700;800&display=swap');

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html {
    --primary-color: #E9542A;
    --primary-color-dark: #D6451B;
    --secondary-color: #0E1F32;
    --secondary-color-light: #17344A;
    --white-color: #FFFFFF;
    --text-light-color: #f2f2f2;
    --text-gray-light: #999999;
    --text-color: #161616;
    --bg-btn-light: #ECF4FD;
    --border-radius-button: 8px;
    --size-text-btn: 13px;
    --size-text-base: 14px;
    --size-text-md: 16px;
    --size-text-lg: 18px;
    --size-text-h1: 38px; 
    --size-text-h2: 32px;
    --size-text-h3: 24px;
    overflow-x: hidden;
}

body {
    font-family: 'Montserrat', Arial, sans-serif;
    background-color: #fff;
    color: var(--text-color);
    line-height: 1.6;
    overflow-x: hidden;
}

.color-primary {
    color: var(--primary-color);
}

.color-secondary {
    color: var(--secondary-color);
}

.list-style-none {
    list-style: none;
    padding: 0;
    margin: 0;
}

.section-default {
    padding: 100px 0;

    @media all and (max-width: 768px) {
        padding: 60px 0;
    }
}

.color-white {
    color: var(--white-color)!important;
}

.hero {
    padding: 80px 0;
    background: url(../images/bg-hero.webp) no-repeat -180px -30px/cover;
    width: 100vw;
    height: auto;
    min-height: 800px;

    @media all and (max-width: 580px) {
        padding: 40px 0;
        min-height: auto;
        background: url(../images/bg-hero-mobile.webp) no-repeat center center/cover;
    }

    @media all and (min-width: 1367px) {
        background-position: 100px -30px;
    }

    .content-absolute {
        position: absolute;
        width: 100%;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 5;
    }

    & .hero-content {
        width: 100%;

        @media all and (min-width: 961px) {
            width: 50%;
        }

        @media all and (min-width: 1367px) {
            width: 40%;
        }

        & .subtitle {
            font-size: var(--size-text-base);
            margin-bottom: 16px;
            display: block;
            padding: 4px 18px;
            border-radius: var(--border-radius-button);
            border: 1px solid #DDE2EB;
            display: inline-block;
        }

        h1 {
            font-weight: 400;
            letter-spacing: 1px;
            & strong {
                font-weight: 600;
            }
        }

        & .cta {
            margin-top: 32px;
            display: inline-flex;
            gap: 22px;

            @media all and (max-width: 580px) {
                flex-wrap: wrap;
                gap: 16px;

                & a {
                    min-width: 231.5px;
                }
            }
        }
    }
}

#servicos {
    background: url('../images/services/bg-mapa.webp') no-repeat center 300px/contain;
}