/*Geral*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@600&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Poppins&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Google+Sans:ital,opsz,wght@0,17..18,400..700;1,17..18,400..700&display=swap');
@font-face {
    font-family: "ElegantIcons";
    src: url("./fontes/ElegantIcons.woff") format("woff");
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
.arrow_carrot-2right::before {
    font-family: "ElegantIcons";
    font-style: normal;
    content: "9";

    align-self: center;
}
.arrow_carrot-right::before {
    font-family: "ElegantIcons";
    font-style: normal;
    content: "\35";

    color: #FEA51A;
    padding-right: 0.3rem;

    align-self: center;
}

    html {
        scroll-behavior: smooth;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
        text-decoration: none;
        list-style: none;
    }

    body {
        font-family: "Poppins", sans-serif;
    }

    .container {
        width: min(100%,1280px);
        margin-inline: auto;
        padding-inline: 10px;
    }

    .icon-svg{
        width: 11px;
        height: 11px;
    }

    .big-icon-svg {
        width: 24px;
        height: 24px;
    }

    .footer-icon-svg {
        width: 17.5px;
        height: 17.5px;
        color: #FEA51A;
    }

    .logo {
        width: 100%;
        max-width: 216px;
        height: auto;
    }
/*Fim Geral*/

/*Header*/

    #background-header {
        position: relative;
        overflow: hidden;
    }

    .slides {
        position: absolute;
        object-fit: cover;
        object-position: center;
        inset: 0;

        width: 100%;
        height: 100%;
        z-index: -1;

        opacity: 0;
        animation: slideshow 36s infinite;
    }
    .slides:nth-of-type(1) {
        animation-delay: 0s;
    }
    .slides:nth-of-type(2) {
        animation-delay: 9s;
    }
    .slides:nth-of-type(3) {
        animation-delay: 18s;
    }
    .slides:nth-of-type(4) {
        animation-delay: 27s;
    }

    @keyframes slideshow {
        0% {            
            opacity: 0;
        }
    
        3% {
            opacity: 1;
        }
    
        28% {
            opacity: 1;
        }
    
        31% {
            opacity: 0;
        }

        100% {
            opacity: 0;
        }
    }

    #background-nav {
        background: rgba(0, 0, 0, 0.62);
    }
    nav {
        display: flex;
    }
    nav img {
        max-width: 350px;
    }
    nav ul {
        display: flex;
        justify-content: end;
        flex: 1;
    }
    nav li {
        display: flex;
        align-self: center;
    }
    nav a {
        background-color: rgba(0, 0, 0, 0.3);
        color: white;
        font-family:Arial, Helvetica, sans-serif;
        font-weight: 600;
        letter-spacing: 1px;
        transition: background-color 0.5s ease;
        align-content: center;
        padding-inline: 1rem;
        padding-block: 1rem;
    }
    nav a:hover {
        background-color: rgba(0, 0, 0, 0.6);
    }
    .nav-destaque {
        background-color: rgba(0, 0, 0, 0.6);
    }
    .nav-details-destaque {
        background: rgba(0, 0, 0, 0.3);
    }
    details {
        display: none;
    }
    @media (max-width: 768px) {
        nav {
            gap: 1rem;
            padding-bottom: 0;
        }
        nav img {
            width: 50vw;
        }
        nav ul {
            justify-content: end;
        }
        nav a {
            display: none;
        }
        details {
            display: block;
            cursor: pointer;

            color: white;
            background-color: rgba(0, 0, 0, 0.8);

            padding: 0.5rem;
            margin-right: 1.5rem;

            line-height: 0;
            position: relative;
        }
        details svg {
            width: 2rem;
            height: 2rem;
            transition: all 0.5s ease;
        }
        details[open] svg {
            transform: rotate(90deg);
        }
        details[open] a {
            display: flex;
            justify-content: center;
            align-self: stretch;
            background: none;

            color: black;
        }
        details ul {
            opacity: 0;
        }
        details[open] ul {
            transition: opacity 0.5s ease;
            opacity: 1;

            display: flex;
            flex-direction: column;

            width: 40vw;

            position: absolute;

            right: 0;
            top: 3rem;

            background: rgba(251, 250, 250, 0.808);
            border: 1px solid white;
        }
        details[open] li {
            display: flex;
            flex-direction: column;
            align-self: stretch;

            border-block: 1px solid black;
        }
        details[open] li:active {
            background: rgba(0, 0, 0, 0.3);
        }
    }

    /*Section Header*/
        .section-header {
            display: flex;
            padding: 112px 0 224px 0
        }
        .section-header div {
            display: flex;
            padding: 4em 1em;
            gap: 20px;
            flex-direction: column;
            background: rgba(255, 255, 255, 0.904);
            border-radius: 30px;
        }
        .section-header div>h1 {
            font-size: 1.5rem;
            align-self: center;
        }
        @media (min-width:768px) {
            .section-header  {
                width: 50%;
            }
        }
        @media (max-width:768px) {
            .section-header h1 {
                white-space: wrap;
                text-align: center;
            }

            .section-header {
                padding-bottom: 2rem;
            }
            .section-header > div {
                background: rgba(255, 255, 255, 0.753);
            }
        }
        .section-header div>p {
            background: rgba(255, 255, 255, 0.58);
            border-radius: 10px;
            text-align: center;
            font-size: 1rem;
        }
        .section-header div>button {
            align-self: center;
            padding: 12px 24px;
        }
        .botao-orçamento {
            position: relative;
            overflow: hidden;
            display: flex;
            align-self: center;
            align-items: center;
            justify-content: center;
            gap: 5px;
            background-color: #2ecc71;
            border-style: none;
            padding: 10px 20px;
            font-family: "Inter", sans-serif;
            font-size: 11px;
            font-optical-sizing: auto;
            font-weight: 600;
            letter-spacing: 2px;
            line-height: 1em;
            color: white;
            cursor: pointer;
        }
        .botao-orçamento::after {
            content: "";

            position: absolute;

            width: 10px;
            height: 200%;

            background: linear-gradient(90deg,
                    transparent,
                    rgba(255, 255, 255, 0.674),
                    transparent);

            transform: rotate(20deg);

            left: -50px;
            top: -50%;
        }
        .botao-orçamento:hover::after {
            left: 120%;
            transition: left 0.3s linear;
        }
    /*Fim Section Header*/
/*Fim Header*/

/*Main*/
        #background-main {
            box-shadow: 0px -0.3rem 5px rgba(0, 0, 0, 0.175);
        }
    /*main-section-um*/
        #main-section-um {
            padding-inline: 24px;
            padding-bottom: 24px;
        }

        #main-section-um > h1{
            text-align: center;
            font-size: 3rem;
            padding-block: 30px;
        }
        #main-section-um h4 {
            font-family: "Google Sans", sans-serif;
            font-optical-sizing: auto;
            font-weight: bold;
            font-style: normal;
            font-variation-settings:
              "GRAD" 0;
        }

        #cards{
            display: grid;
            grid-template-columns: repeat(4,minmax(250px,1fr));
            padding: 30px 1rem;
            gap: 1rem;
            border-radius: 1rem;

            background: rgba(144, 238, 144, 0.297);
        }
        @media (max-width: 1200px) {
            #cards {
                grid-template-columns: repeat(2,minmax(250px,1fr));
            }
        }
        @media (max-width: 768px) {
            #cards {
                grid-template-columns: repeat(1,minmax(250px,1fr));
            }
        }
        #cards article {
            display: flex;
            flex-direction: column;
            gap: 1rem;
            padding: 1.2rem 1rem;
            align-items: center;

            background: white;
            transition: transform 0.3s ease, box-shadow 0.3s ease;
        }
        #cards article:hover {
            transform: scale(1.03);
            box-shadow: 2px 10px 20px 10px rgba(0, 0, 0, 0.175);
        }
        #cards article:hover .botao-orçamento:after {
            left: 120%;
            transition: left 0.3s linear;
        }
        #cards a {
            align-self: stretch;
        }
        #cards img {
            width: 100%;
            height: auto;
        }
    /*Fim main-section-um*/

    /*main-section-dois*/
        #main-section-dois {
            display: flex;
            padding: 16px 0;
        }
        @media (max-width: 1200px) {
            #main-section-dois {
                flex-direction: column;
                padding: 1rem;
                gap: 1.5rem;
            }
        }
        #main-section-dois div{
            flex: 1;
        }
        #main-section-dois > div:nth-of-type(1) {
            padding: 48px 80px 48px 16px;
            display: flex;
            flex-direction: column;
            gap: 20px;
        }
        @media (max-width: 768px) {
            #main-section-dois > div:nth-of-type(1){
                padding: 0;
            }
        }
        #main-section-dois div:nth-of-type(1)>h5 {
            font-size: 1rem;
            color: #FEA51A;
        }
        #main-section-dois div:nth-of-type(1)>h3 {
            font-size: 1.4rem;
        }
        .div-p-main-section-dois>p {
            font-size: 1rem;
            font-family: "Inter", sans-serif;
            text-align: justify;
            margin-bottom: 14.4px;
        }
        #main-section-dois div:nth-of-type(1) button {
            align-self: center;
            padding: 12px 24px;
        }
        #main-section-dois > div:nth-of-type(2) {
            padding: 32px 0px 0px 16px;
            position: relative;
        }
        #main-section-dois img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
        .div-img-main-section-dois {
            height: 100%;
        }
        .widget-main-section-dois {
            background: #1c1f22e9;
            border: 5px solid white;

            position: absolute;
            top: 0;
            left: 0;
            padding: 21px;

            font-weight: 700;
            width: auto;
            height: auto;
        }
        .widget-content-box {
            display: flex;
            flex-direction: column;
            gap: 7px;
        }
        .widget-main-section-dois span {
            font-size: 61px;
            text-transform: uppercase;
            letter-spacing: -2px;
            color: #FEA51A;

            line-height: 1;
            align-self: center;
        }
        .widget-main-section-dois p {
            text-transform: uppercase;
            color: white;

            line-height: 1;
            align-self: center;
        }
    /*Fim main-section-dois*/

    /*divisorias-sections-main*/
    .divisorias-sections-main {
        border: 0.2rem solid transparent;
        border-radius: 100%;
        margin-block: 1rem;
        margin-inline: 24px;

        background:
        linear-gradient(white, white) padding-box,
        radial-gradient(
            ellipse at center,
            #0c0a0ab8 30%,
            #32323850 100%
        ) border-box;
    }
    /*Fim divisorias-sections-main*/

    /*section-forms*/
        #section-forms {
            margin-bottom: 1rem;
        }
        #section-forms > div {
            display: flex;
            flex-direction: column;
            gap: 1rem;
        }
        @media (min-width: 768px) {
            .texto-section-forms {
                text-align: center;
            }
        }
        .texto-section-forms > h2 {
            font-size: clamp(2rem, 3vw, 3rem);
            margin-bottom: 1rem;
        }
        .texto-section-forms > p {
            font-size: clamp(1.3rem, 1.5vw, 1.5rem)
        }
        .texto-section-forms > p > span:first-child {
            font-weight: 700;
            color: #2ecc71;

            animation: brilho 2.5s infinite alternate;
        }
        @keyframes brilho {
            from {
                text-shadow:
                0 0 5px #2ecc71,
            }

            to {
                text-shadow:
                0 0 10px #2ecc71,
                0 0 20px #2ecc71,
                0 0 40px #2ecc71;
            }
        }
        .texto-section-forms > p > span:last-child {
            font-weight: 700;
        }
        #form {
            display: flex;
            flex-direction: column;
        }
        #form input:focus {
            outline: 1px solid #25292ecd;
        }
        #form > span:last-child input:last-child {
            align-self: center;
            padding: 0.3rem 2rem;
        }
        #container-contato-form {
            background: #1a1d20b9;
        }
        #contato-form {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
            padding-inline: 0.5rem;
            padding-top: 1rem;
        }
        #titulo-contato-form {
            color: white;
            background: #343430;
            padding: 1rem;
            border-top-left-radius: 15px;
            border-top-right-radius: 15px;
        }
        #campos-contato {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        .email {
            flex: 1;
        }
        .nome {
            flex:0.7;
        }
        @media (max-width: 500px) {
            .nome {
                flex: 1;
            }
        }
        .campo {
            background: rgba(46, 46, 41, 0.426);
            border-radius: 5px;
            padding: 0.2rem 0.5rem;

            display: flex;
            flex-direction: column;
        }
        .campo > input {
            height: 90%;
            border-radius: 5px;
            border: 1px solid #25292edf;
            padding: 0.5rem;
            transition: background-color 0.5s ease;
        }
        .campo input:focus {
            background-color: rgb(206, 204, 204);
        }
        .campo label {
            color: white;
        }
        .campo > select {
            width: 100%;
            max-width: 90px;
        }
        .campo > select option:first-child {
            text-align: center;
        }
        .container-campo-destino {
            display: flex;
            flex-wrap: wrap;
            gap: 0.5rem;
        }
        #celular {
            display: flex;
        }
        #radio {
            background: rgba(46, 46, 41, 0.426);
            border-radius: 5px;
        }
        #radio p {
            color: white;            
            background: rgba(46, 46, 41, 0.327);
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            padding: 0.2rem 0.5rem;
        }
        #radio-options {
            display: flex;
            gap: 1rem;
            color: white;
            padding: 0.2rem 0.5rem;
        }
        #planilha {
            display: flex;
            flex-direction: column;
            gap: 0.5rem;
        }
        #container-destino-origem {
            background: #1a1d20b9;
            border-bottom-left-radius: 15px;
            border-bottom-right-radius: 15px;
        }
        #destino-origem {
            display: flex;
            flex-flow: wrap;
            padding: 0.5rem 0.5rem 1rem 0.5rem;
            justify-content: space-between;

            gap: 2rem;
        }
        #listagem-items {
            display: grid;
            grid-template-columns: 0.4fr 2fr 0.7fr;
        }
        .input {
            width: 100%;
            border: 1px solid #25292e75;
            padding: 0.1rem 0.5rem;
        }
        .colum-title {
            display: flex;
            justify-content: center;
            align-items: center;

            background: #25292e52;
            border: 1px solid #25292e52;

            text-align: center;
            padding-inline: 0.2rem;
        }
        #add-row {
            background: rgb(83, 182, 83);
            justify-self: start;
            margin-top: 0.1rem;
            cursor: pointer;

            padding: 0.1rem 0.5rem;
            transition: transform 0.05s linear;
            user-select: none;
        }
        #add-row:active {
            transform: scale(0.8);
        }
        .posicao-relativa {
            position: relative;
        }
        .posicao-absoluta-botao {
            background: rgba(242, 15, 15, 0.667);
            border: none;

            position: absolute;
            top: 50%;
            transform: translateY(-50%);

            padding-inline: 0.2rem;
            margin-left: 0.2rem;

            user-select: none;
            cursor: pointer;
            line-height: 1;
            transition: transform 0.05s linear;
        }
        .posicao-absoluta-botao:active {
            transform: scale(0.8) translateY(-50%);
        }
        .posicao-absoluta-botao:focus {
            border: none;
            outline: none;
        }
        .campo-planilha {
            line-height: 0;
            margin-top: 0.2rem;
        }
        #dialogo {
            user-select: none;
            left: 50%;
            transform: translateX(-50%);
            padding: 1rem;

            background: #191C20;
            color: rgb(255, 255, 255);
            font-size: 0.8rem;

            border: 0.1px solid rgba(255, 255, 255, 0.368);
            border-radius: 10px;
        }
        #dialogo[open] {
            display: flex;
            flex-flow: column wrap;
            gap: 5px;
        }
        #dialogo h2 {
            text-align: start;
        }
        #dialogo span {
            display: flex;
            align-self: flex-end;
            gap: 0.5rem;
        }
        #dialogo button {
            padding: 0.7rem 2rem;
            border-radius: 20px;
            border: none;
        }
        #dialogo-sim {
           background: #2aa82a;
           border: none;
        }
        #dialogo-sim:hover {
            background: #319e31;            
         }
        #dialogo-cancelar {
            background: #f1f3f5;
            color: black;

            transition: background-color 0.3s ease;
        }
        #dialogo-cancelar:hover {
            background-color: #d3d3d4;
        }
        #dialogo button:focus {
            outline: 2px solid #6385c9;
            border: 2px solid black;
        }
        #dialogo::backdrop {
            position: fixed;
            inset: 0;
            background: rgba(0, 0, 0, 0.6);
        }
        @media (max-width: 768px) {
            #dialogo h2 {
                font-size: 1rem;
            }
            #dialogo[open] {
                gap: 1rem;
            }
            #dialogo button {
                padding: 0.5rem 1.5rem;
            }
        }
        @media (min-width: 768px) {
            #titulo-contato-form {
                text-align: center;
            }
            #contato-form {
                margin: 0 auto;
                width: 100%;
                max-width: 800px;

                padding-block: 1rem;
            }
            #destino-origem {
                margin: 0 auto;
                width: 100%;
                max-width: 800px;
            }
        }

        #rodape-forms {
            background: #343430;
            border-bottom-left-radius: 15px;
            border-bottom-right-radius: 15px;

            margin-top: 0.2rem;
        }
        #container-botao {
            display: flex;
            justify-content: center;
        }
        #container-botao > input {
            padding: 0.5rem 1rem;
            margin: 0.5rem 1rem;
            cursor: pointer;

            background: rgb(83, 182, 83);
            border: none;

            font-weight: 700;
            border-radius: 5px;
        }

    /*Fim section-forms*/

    /*main-section-tres*/
        #background-section-tres {
            background-image: linear-gradient(135deg, #1A1D20 0%, #25292e52 160%), url(img/background-caminhao-laranja.jpg);
            background-repeat: no-repeat;
            background-size: cover;
            background-attachment: fixed;
            background-position: center;
        }
        @media (max-width: 768px) {
            #background-section-tres {
                background-attachment: scroll;
            }
        }
        #main-section-tres{
            display: flex;
            flex-direction: column;
            padding-block: 2em;
        }
        @media (max-width: 1200px) {
            #main-section-tres {
                flex-direction: column;
                gap: 0.8rem;
                padding-right: 1em;
                padding-left: 1em;
            }
        }
        #main-section-tres h4 {
            font-weight: 600;
            color: #FEA51A;
        }
        #main-section-tres h2 {
            font-size: 39px;
            font-weight: 600;
            color: white;
        }
        #main-section-tres p {
            font-weight: 100;
            color: white;
        }
        #main-section-tres > div:first-child>p {
            font-weight: 500;
            font-size: 1.2rem;
        }
        #main-section-tres button {
            align-self: center;
            padding: 12px 24px;
        }

        #diferencial-section-tres {
            display: flex;
            flex-direction: column;
            justify-content: center;
            flex: 1;
            gap: 20px;
            padding: 48px 80px 48px 16px;
        }

        #cards-section-tres {
            display: grid;
            flex: 1.4;
            grid-template-columns: repeat(2,1fr);
            gap: 14px;
        }
        @media (max-width: 768px) {
            #cards-section-tres {
                grid-template-columns: repeat(1,1fr);
            }
            #diferencial-section-tres {
                padding: 48px 16px 48px 16px;
            }
        }
        #cards-section-tres article:hover {
            box-shadow: 2px 10px 20px 10px rgba(0, 0, 0, 0.175);
            border-radius: 0;
        }
        #cards-section-tres article {
            background: #25292ee4;
            cursor:default;
            transition: all 0.3s ease;

            display: flex;
            flex-direction: column;
            gap: 14px;
            padding: 2em;
            border-radius: 20px;
        }
        #cards-section-tres article>div {
            text-align: center;
            flex: 1;
        }
        #cards-section-tres .artic-destaque {
            background: #1a1d20ec;
        }
        #cards-section-tres .artic-destaque h5 {
            color: white;
        }
        #cards-section-tres .span-destaque {
            background: white;
        }
        #cards-section-tres h5 {
            font-size: 1.2rem;
            color: #FEA51A;
            margin-bottom: 4px;

            font-family: "Google Sans", sans-serif;
            font-optical-sizing: auto;
            font-weight: 600;
            font-style: normal;
            font-variation-settings:
              "GRAD" 0;
        }
        #cards-section-tres svg {
            align-self: center;
        }
        #cards-section-tres span {
            background: #FEA51A;
            align-self: center;
            padding: 17.5px;
            line-height: 1;
            line-height: 0;
        }
    /*Fim main-section-tres*/
/*Fim Main*/

/*Footer*/
    #background-footer {
        background: #1a1d20;
        padding-top: 2rem;
    }

    #background-footer-layer-dois {
        background: #2E3239;
    }

    footer h4 {
        color: white;
    }
    footer p {
        font-size: 14px;
        color: white;
    }
    footer a {
        font-size: 0.8rem;
        color: white;
    }
    footer span {
        line-height: 0;
    }
    .footer-section-contato a {
        padding-bottom: 0.5rem;
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
    }
    footer li {
        padding-bottom: 0.2rem ;
    }
    footer > div {
        padding: 0 2rem;
    }
    #cards-footer {
        display: flex;
        padding-block: 2rem;
    }
    @media (max-width: 1200px) {
        #cards-footer {
            flex-wrap: wrap;
        }
        #cards-footer .sec-destaque {
            flex-basis: 100%;
        }
    }
    #cards-footer section {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: 20px;
        padding: 1rem;
    }
    #cards-footer .sec-destaque {
        align-items: center;
        text-align: center;
    }
    #cards-footer .sec-destaque a {
        background: #FEA51A;
        line-height: 0;
        padding: 0.8rem;
        border-radius: 50%;
    }
    #cards-footer .sec-destaque a:hover {
        background: #fcbb52;
        animation: transform-insta-icon 0.25s ease-in;
    }
    #cards-footer section:nth-of-type(2) a:hover, section:nth-of-type(3) a:hover, section:nth-of-type(4) a:hover {
        color: #fcbb52;
    }
    .footer-instagram-icon {
        width: 22px;
        height: 22px;
    }

    @keyframes transform-insta-icon {
        0% {
            transform: scale(1.0);
        }
        5%{
            transform: scale(1.1);
        }
        75% {
            transform: scale(1.2);
        }
        95% {
            transform: scale(1.1);
        }
        100% {
            transform: scale(1.0);
        }
    }
/*Fim Footer*/

/*Formatação Geral*/

.google-sans {
    font-family: "Google Sans", sans-serif;
    font-optical-sizing: auto;
    font-weight: bold;
    font-style: normal;
    font-variation-settings:
      "GRAD" 0;
  }