@charset "UTF-8";

/*** SECTION HEADER ***/

.sc-header {
    height: 60vh;
    background-color: #ede8e2;
    position: relative;
    overflow: hidden;
}

.sc-header .center-container {
    z-index: 1;
}

.sc-header #bg-video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    z-index: 0;
    opacity: .2;
}

.sc-header .titulo-header {
    padding: 0 40px 60px;
    margin-top: -5rem;
    color: #fff;
    text-align: right;
}

.sc-header .titulo-header h1 {
    font-size: 32px;
    color: #010101;
    font-weight: 700;
    margin-bottom: -5px;
}

.sc-header .titulo-header h2 {
    font-size: 29px;
    color: #3e3e3e;
    font-weight: 700;
}

.sc-header .titulo-header h3 {
    font-size: 19px;
    color: #010101;
    font-weight: 200;
}

.header-divider {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(calc(-100% + 1px));
    pointer-events: none;
}


/*** SECTION ABOUT ***/

.sc-about {
    background: #fff;
    position: relative;
    color: #232323;
    padding-bottom: 12%;
}

.sc-about>.center-container {
    margin-top: -9%;
    z-index: 1;
    padding: 30px;
}

.sc-about .titulo-sobre {
    padding-bottom: 2.5rem;
    position: relative;
}

.sc-about .titulo-sobre h1 {
    font-size: 35px;
    font-weight: 700;
    margin-bottom: -10px;
    color: #010101;
    font-family: "Sora";
}

.sc-about .titulo-sobre h2 {
    font-size: 17px;
    color: #3e3e3e;
    margin-top: 10px;
    font-family: "Inter";
}

.sc-about .titulo-sobre .divider-titulo-sobre {
    width: 30%;
    height: 4px;
    background: #a89978;
    position: absolute;
    bottom: 1.5rem;
    left: 0;
    transform: skewX(-40deg);
}

.sc-about .titulo-sobre .divider-titulo-sobre:before {
    content: '';
    width: 30px;
    height: 4px;
    background: #a89978;
    position: absolute;
    right: 0;
    transform: translateX(70px);
}

.sc-about .titulo-sobre .divider-titulo-sobre:after {
    content: '';
    width: 20px;
    height: 4px;
    background: #a89978;
    position: absolute;
    right: 0;
    transform: translateX(30px);
}

.sc-about .texto-sobre {
    font-weight: normal;
    font-style: normal;
    color: #323232;
    font-size: 14px;
    white-space: pre-line;
}

.sc-about .cont-btn-orcamento {
    margin-top: 2rem;
}

/*.sc-about .btn-orcamento {
    font-size: 14px;
    font-weight: 800;
    color: #000000;
    background: #ede8e2;
    text-transform: uppercase;
    padding: 1rem 2rem;
    border-radius: 5px;
    position: relative;
}*/


.sc-about .hello-perfil-image {
    width: 80%;
    margin-top: -10%;
    border-radius: 10px;
}


/*** SECTION COMMENTS ***/

.sc-comments {
    background: #ede8e2;
    position: relative;
    color: #000;
}

.sc-comments .about-divider {
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(calc(-100% + 1px));
    pointer-events: none;
}

.sc-comments .center-container {
    margin-top: -1%;
}

.sc-comments .titulo-comments {
    position: relative;
}

.sc-comments .titulo-comments h1 {
    font-size: 48px;
    color: #010101;
    font-weight: 700;
    padding-left: 1rem;
    z-index: 1;
    position: relative;
    font-family: "Sora";
}

.sc-comments .titulo-comments h2 {
    font-size: 16px;
    font-weight: 700;
    color: #3e3e3e;
    z-index: 1;
    position: relative;
    margin-bottom: 0;
    font-family: "Inter";
}

.sc-comments .titulo-comments h3 {
    font-size: 500px;
    font-weight: normal;
    font-style: italic;
    line-height: 0;
    color: #dbcfc7;
    position: absolute;
    top: 8rem;
    left: -2rem;
    z-index: 0;
}

.sc-comments .carousel {
    color: #323232;
    font-size: 14px;
    text-align: right;
    background-color: #fff;
    padding: 1rem;
    border-radius: 10px;
}

.sc-comments .carousel .comment-autor {
    color: #020202;
    font-style: italic;
}

.sc-comments .carousel .carousel-indicators {
    margin: 0;
    position: relative;
    justify-content: flex-end;
}

.sc-comments .carousel .carousel-indicators [data-bs-target] {
    background-color: #a89978;
    height: 4px;
}


/*** SECTION PORTIFOLIO ***/

.sc-portfolio {
    background: #ede8e2;
    position: relative;
    color: #000;
    padding-top: 5rem;
}

.sc-portfolio .anim-pen {
    width: 100%;
    max-width: 250px;
}

.sc-portfolio .titulo-portfolio {
    text-align: right;
    padding: 2rem 0;
}

.sc-portfolio .titulo-portfolio h1 {
    font-size: 37px;
    color: #010101;
    font-weight: 700;
    margin: 0rem 0 -.5rem;
    font-family: "Sora";
}

.sc-portfolio .titulo-portfolio h2 {
    font-size: 35px;
    font-weight: 700;
    margin-bottom: -10px;
    color: #010101;
    font-family: "Sora";
    text-align: left;
    padding-bottom: 2.5rem;
    position: relative;
}

.sc-portfolio .titulo-portfolio h2 .divider-titulo-portifolio {
    width: 30%;
    height: 4px;
    background: #a89978;
    position: absolute;
    bottom: 1.5rem;
    left: 0;
    transform: skewX(-40deg);
}

.sc-portfolio .titulo-portfolio h2 .divider-titulo-portifolio:before {
    content: '';
    width: 30px;
    height: 4px;
    background: #a89978;
    position: absolute;
    right: 0;
    transform: translateX(70px);
}

.sc-portfolio .titulo-portfolio h2 .divider-titulo-portifolio:after {
    content: '';
    width: 20px;
    height: 4px;
    background: #a89978;
    position: absolute;
    right: 0;
    transform: translateX(30px);
}

.sc-portfolio .titulo-portfolio h3 {
    color: #3e3e3e;
    font-size: 14px;
    text-align: left;
}

.sc-portfolio .titulo-portfolio span {
    color: #494848;
    font-size: 14px;
}

.sc-portfolio .cont-jobs {
    position: relative;
}

.sc-portfolio .cont-jobs>div {
    position: relative;
    background: #3a3528;
}

.sc-portfolio .cont-jobs img {
    width: 100%;
}

.sc-portfolio .cont-jobs a:hover img {
    opacity: .3;
}

.sc-portfolio .cont-jobs .cliente {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, 0%);
    font-size: 16px;
    color: #fff;
    border-bottom: 2px solid #fff;
    opacity: 0;
    transition: .3s;
}

.sc-portfolio .cont-jobs a:hover .cliente {
    transform: translate(-50%, -50%);
    opacity: 1;
}

.sc-portfolio .cont-jobs .btn-portfolio {
    width: 50%;
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    color: #343129;
    padding: .5rem 1.5rem;
    text-align: right;
    line-height: 2rem;
}

.sc-portfolio .cont-jobs .btn-portfolio-categorias {
    font-size: 14px;
    font-weight: bold;
    font-style: italic;
    color: #010101;
    padding: .5rem .5rem .5rem 1.5rem;
    text-align: left;
    width: 50%;
}

.sc-portfolio .cont-jobs .btn-portfolio-categorias span:nth-child(1) {
    display: block;
    font-size: 11px;
    margin-bottom: -5px;
}





/*** Tablets <= ***/
@media (max-width: 992px) {
    .sc-about {
        text-align: center;
    }

    .sc-about .titulo-sobre .divider-titulo-sobre {
        transform: skewX(-40deg);
    }

    .sc-about .titulo-sobre {
        text-align: left;
    }

    .sc-about .texto-sobre {
        text-align: justify;
        padding: 2rem 1rem;
    }

    .sc-about .hello-perfil-image {
        margin: -100px 0 2.5rem;
    }

    .sc-comments {
        text-align: center;
    }

    .sc-comments .center-container {
        margin-top: 0;
    }

    .sc-comments .titulo-comments {
        overflow: hidden;
        padding-top: 5rem;
        margin-top: -5rem;
    }

    .sc-comments .titulo-comments h3 {
        left: 50%;
        top: 13rem;
        margin-left: -8rem;
    }

    .sc-comments .carousel {
        width: 80%;
        margin: 3rem auto;
        text-align: justify;
    }

    .sc-portfolio .cont-jobs .btn-portfolio,
    .sc-portfolio .cont-jobs .btn-portfolio-categorias {
        padding: .5rem .7rem;
    }

}

/*** Celulares <= ***/
@media (max-width: 576px) {
    .sc-header .titulo-header {
        padding: 0;
    }

    .sc-header .titulo-header h2 {
        font-size: 25px;
    }

    .sc-header .titulo-header h3 {
        font-size: 19px;
        padding: 0;
    }

    .sc-about>.center-container {
        padding: 0 5% 2rem;
    }

    .sc-about .texto-sobre {
        padding: 0 0 2rem;
    }

    .sc-comments .carousel {
        width: 90%;
    }

    .sc-portfolio {
        padding-top: 2rem;
    }

    .sc-portfolio .titulo-portfolio {
        width: 90%;
        padding: 0;
        margin: 2rem auto;
    }

    .sc-portfolio .nav-tabs .nav-link {
        margin: 2px;
        border-radius: 3px;
    }

}