.header {
    --background-color: color-mix(in srgb, rgb(0 0 0), #000000 30%);
    --heading-color: #ffffff;
    color: var(--default-color);
    transition: all 0.5s;
    z-index: 997;
    background-color: var(--background-color);
}
/*--------------------------------------------------------------
# Project Details Section
--------------------------------------------------------------*/
 .project-details .portfolio-details-slider img {
     width: 100%;
 }
 .project-details .swiper-wrapper {
     height: auto;
 }
 .project-details .swiper-button-prev,
 .project-details .swiper-button-next {
     width: 48px;
     height: 48px;
 }
 .project-details .swiper-button-prev:after,
 .project-details .swiper-button-next:after {
     color: rgba(255, 255, 255, 0.8);
     background-color: rgba(0, 0, 0, 0.15);
     font-size: 24px;
     border-radius: 50%;
     width: 48px;
     height: 48px;
     display: flex;
     align-items: center;
     justify-content: center;
     transition: 0.3s;
 }
 .project-details .swiper-button-prev:hover:after,
 .project-details .swiper-button-next:hover:after {
     background-color: rgba(0, 0, 0, 0.3);
 }
 @media (max-width: 575px) {
     .project-details .swiper-button-prev,
     .project-details .swiper-button-next {
         display: none;
     }
 }
 .project-details .swiper-pagination {
     margin-top: 20px;
     position: relative;
 }
 .project-details .swiper-pagination .swiper-pagination-bullet {
     width: 10px;
     height: 10px;
     background-color: color-mix(in srgb, var(--default-color), transparent 85%);
     opacity: 1;
 }
 .project-details .swiper-pagination .swiper-pagination-bullet-active {
     background-color: var(--accent-color);
 }
 .project-details .portfolio-info h3 {
     font-size: 22px;
     font-weight: 700;
     margin-bottom: 20px;
     padding-bottom: 20px;
     position: relative;
     color: #000;
 }
 .project-details .portfolio-info h3:after {
     content: "";
     position: absolute;
     display: block;
     width: 50px;
     height: 3px;
     background: var(--accent-color);
     left: 0;
     bottom: 0;
 }
 .project-details .portfolio-info ul {
     list-style: none;
     padding: 0;
     font-size: 15px;
 }
 .project-details .portfolio-info ul li {
     display: flex;
     flex-direction: column;
     padding-bottom: 15px;
 }
 .project-details .portfolio-info ul strong {
     text-transform: uppercase;
     font-weight: 400;
     color: color-mix(in srgb, var(--default-color), transparent 50%);
     font-size: 1rem;
 }
 .project-details .portfolio-info .btn-visit {
     padding: 8px 40px;
     background: var(--accent-color);
     color: var(--contrast-color);
     border-radius: 50px;
     transition: 0.3s;
 }
 .project-details .portfolio-info .btn-visit:hover {
     background: color-mix(in srgb, var(--accent-color), transparent 20%);
 }
 .project-details .portfolio-description h2 {
     font-size: 26px;
     font-weight: 700;
     margin-bottom: 20px;
 }
 .project-details .portfolio-description p {
     padding: 0;
     font-size: 1.2rem;
 }
 .project-details .portfolio-description .testimonial-item {
     padding: 30px 30px 0 30px;
     position: relative;
     background: color-mix(in srgb, var(--default-color), transparent 97%);
     margin-bottom: 50px;
 }
 .project-details .portfolio-description .testimonial-item .testimonial-img {
     width: 90px;
     border-radius: 50px;
     border: 6px solid var(--background-color);
     float: left;
     margin: 0 10px 0 0;
 }
 .project-details .portfolio-description .testimonial-item h3 {
     font-size: 18px;
     font-weight: bold;
     margin: 15px 0 5px 0;
     padding-top: 20px;
 }
 .project-details .portfolio-description .testimonial-item h4 {
     font-size: 14px;
     color: #6c757d;
     margin: 0;
 }
 .project-details .portfolio-description .testimonial-item .quote-icon-left,
 .project-details .portfolio-description .testimonial-item .quote-icon-right {
     color: color-mix(in srgb, var(--accent-color), transparent 50%);
     font-size: 26px;
     line-height: 0;
 }
 .project-details .portfolio-description .testimonial-item .quote-icon-left {
     display: inline-block;
     left: -5px;
     position: relative;
 }
 .project-details .portfolio-description .testimonial-item .quote-icon-right {
     display: inline-block;
     right: -5px;
     position: relative;
     top: 10px;
     transform: scale(-1, -1);
 }
 .project-details .portfolio-description .testimonial-item p {
     font-style: italic;
     margin: 0 0 15px 0 0 0;
     padding: 0;
 }
 .hero-detalhes {
     background: linear-gradient(29deg, #000000, transparent), url(../img/pagina-unica.jpg) !important;
     background-size: cover;
     background-position: center;
 }

 #inner-hero {
    height: 40vh;
    display: flex;
    justify-content: center;
    align-items: center;    
    background-position: center !important;
    background-size: 100% !important;
    background-repeat: no-repeat !important;
}