﻿:root {
    --font-display: "Playfair Display", serif;
    --font-body: "Inter", sans-serif;
    --font-accent: "Space Grotesk", sans-serif;
    --spacing: .25rem;
    --text-sm: .875rem;
    --text-sm--line-height: calc(1.25 / .875);
}

.internalPage h1,
.internalPage h2,
.internalPage h3,
.internalPage h4,
.internalPage h5,
.internalPage h6 {
    font-family: var(--font-display);
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    background-color: #c5a572;
}

.details_link {
    text-transform: none;
    font-weight: 500;
    font-size: 0.875rem;
    font-family: var(--font-accent);
    color: #c5a572;
}

.details_link svg{
    width: 12px;
    height: 12px;
}

.section-header h6 {
    color: #c5a572;
    text-transform: uppercase;
    letter-spacing: .15em;
    font-weight: 600;
    font-family: var(--font-accent);
    font-size: var(--text-sm);
    line-height: var(--tw-leading, var(--text-sm--line-height));
    display: flex;
    align-items: center;
    margin-bottom: calc(var(--spacing) * 4);
}

    .section-header h6:before {
        content: '';
        width: 40px;
        height: 2px;
        background: #c5a572;
        position: relative;
        display: block;
        margin-right: 12px;
    }

.section-header h1 {
    font-size: 3rem;
}

.theme_slider_4 {
    height: 60vh;
}
    .theme_slider_4 .navBlock {
        position: absolute;
        bottom: 20px;
        width: 100%;
        text-align: center;
        display: flex !important;
        justify-content: center;
        align-items: center;
    }

    .theme_slider_4 .swiper-pagination {
        z-index: 9999;
        bottom: unset !important;
        position: relative;
        width: auto !important;
        left: unset !important;
        transform: unset !important;
    }

.swiper-pagination-bullet {
    margin: 0rem 0.4375rem !important;
}

    .theme_slider_4 .swiper-button-next, .theme_slider_4 .swiper-button-prev {
        z-index: 9999;
        position: relative;
        left: unset !important;
        right: unset !important;
        top: 11px;
        bottom: unset;
        background-color: #ffffff1a;
        border-radius: 50%;
        width: 32px;
        height: 32px;
        color: #fff;
    }

    .heroFixedContent {
        position: absolute;
        bottom: 0;
        z-index: 999;
        color: #fff;
        max-width: 50%;
        padding-top: calc(var(--spacing) * 32);
        padding-bottom: calc(var(--spacing) * 16);
    }

    .heroFixedContent h1 {
        font-size: 4.5rem;
        line-height: 1.1;
    }

    .heroFixedContent span {
        color: #c5a572;
        text-transform: uppercase;
        font-family: var(--font-accent);
        font-size: .875rem;
        margin-bottom: calc(var(--spacing) * 4);
        display: block;
        letter-spacing: .2em;
        font-weight: 600;
    }

    .heroFixedContent p {
        color: rgba(255, 255, 255, 0.7) !important;
        font-family: var(--font-body);
        font-size: 1.25rem;
        line-height: 1.625;
        margin-top: calc(var(--spacing) * 6);
        max-width: 600px;
    }


.hero-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( to top, #0A1628 0%, rgba(10, 22, 40, 0.6) 60%, transparent 100% );
    z-index: 8;
}

.swiper {
    height: 100%;
}
/* Gradient overlay */
.swiper-slide::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    /* Equivalent to:
       bg-gradient-to-t
       from-[#0A1628]
       via-[#0A1628]/60
       to-transparent
    */
    background: linear-gradient( to top, #0A1628 0%, rgba(10, 22, 40, 0.6) 50%, transparent 100% );
}

/* Keep content above the overlay */
.swiper-slide > * {
    position: relative;
    z-index: 2;
}

.blog_post {
    height: 380px;
    border-radius: 0.5rem;
    margin-bottom: 32px !important;
}

    .blog_post .blog_content {
        top: unset;
    }

        .blog_post .blog_content::before {
            display: none;
        }

    .blog_post:hover .blog_content .post-count {
        font-size: 4.5rem;
    }

    .blog_post:hover .blog_content .post-count {
        font-size: calc(1.575rem + 3.34286vw);
        line-height: 4.875rem;
        opacity: 1;
        transform: translateY(0);
    }

    .blog_post .post-count {
        font-family: var(--font-accent);
        font-size: 4.5rem;
        line-height: 4.875rem;
        font-weight: 700;
        transition: all 0.5s ease;
        transform: translateY(0);
        opacity: 1;
        color: rgba(255, 255, 255, 0.3);
        top: 1.5rem;
        right: 1.5rem;
        position: absolute;
    }

    .blog_post img {
        opacity: 1;
        object-fit: cover;
        height: 100%;
        width: 100%;
        position: absolute;
        transition-property: transform, translate, scale, rotate;
        transition-duration: 0.7s;
        transition-timing-function: ease-out;
    }

    .blog_post:hover img {
        transform: scale(1.05);
    }


.blog-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( to top, rgba(10, 22, 40, 0.9) 0%, rgba(10, 22, 40, 0.4) 50%, transparent 100% );
    transition: all 0.5s ease;
}

.blog_post:hover .blog-overlay {
    background: linear-gradient( to top, rgba(10, 22, 40, 0.95) 0%, rgba(10, 22, 40, 0.4) 50%, transparent 100% );
}


.animated-element {
    opacity: 0;
    transform: translateY(15px); /* Starting position */
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.blog_post:hover .animated-element {
    opacity: 1;
    transform: translateY(0);
}

.blog_post .blog_content p {
    color: rgba(255, 255, 255, 0.7) !important;
    font-family: var(--font-body);
    line-height: 1.6;
    font-size: var(--text-sm);
    margin-bottom: calc(var(--spacing) * 4);
}

.blog_post .blog_content h5 {
    color: #fff !important;
    font-size: 1.875rem;
    line-height: 1.2;
    font-weight: bold;
    margin-bottom: calc(var(--spacing) * 2);
}

.blog_post .blog_content .meta {
    display: flex;
    align-items: center;
    color: #c5a572;
    font-family: var(--font-accent);
    font-size: .75rem;
}

.blog_content .meta .horizLine {
    background-color: #c5a572;
    width: 1.5rem;
    height: 1.5px;
}




/* project */

.project_post {
    position: relative;
    overflow: hidden;
    height: 488px;
    transition: all 0.5s ease-in-out;
    margin-bottom: 1.875rem;
}

.project_post {
    height: 260px;
    border-radius: 0.5rem;
    margin-bottom: 32px !important;
}

    .project_post .project_content {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        padding: 20px 30px 40px 45px;
        z-index: 1;
        transition: all 0.5s ease-in-out;
    }

    .project_post .project_content {
        top: unset;
    }

        .project_post .project_content::before {
            display: none;
        }

    .project_post:hover .project_content .post-count {
        font-size: 4.5rem;
    }

    .project_post:hover .project_content .post-count {
        font-size: calc(1.575rem + 3.34286vw);
        line-height: 4.875rem;
        opacity: 1;
        transform: translateY(0);
    }

    .project_post .blog_content {
        position: absolute;
        left: 0;
        top: 0;
        right: 0;
        bottom: 0;
        padding: 20px 30px 40px 45px;
        z-index: 1;
        transition: all 0.5s ease-in-out;
    }

    .project_post .post-count {
        font-size: calc(1.575rem + 3.34286vw);
        line-height: 4.875rem;
        font-weight: 700;
        transition: all 0.5s ease;
        transform: translateY(0);
        opacity: 1;
        color: rgba(255, 255, 255, 0.3);
        top: 1.5rem;
        right: 1.5rem;
        position: absolute;
    }

    .project_post img {
        opacity: 1;
        object-fit: cover;
        height: 100%;
        width: 100%;
        position: absolute;
        transition-property: transform, translate, scale, rotate;
        transition-duration: 0.7s;
        transition-timing-function: ease-out;
    }

    .project_post:hover img {
        transform: scale(1.05);
    }


.project-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient( to top, rgba(10, 22, 40, 0.9) 0%, rgba(10, 22, 40, 0.4) 50%, transparent 100% );
    transition: all 0.5s ease;
}

.project_post:hover .project-overlay {
    background: linear-gradient( to top, rgba(10, 22, 40, 0.95) 0%, rgba(10, 22, 40, 0.4) 50%, transparent 100% );
}

.project_post .project_content {
    opacity: 1;
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.project_post:hover .project_content {
    opacity: 0;
}


.project_post .animated-element {
    padding: 20px 30px 40px 45px;
    opacity: 0;
    transform: translateY(15px); /* Starting position */
    transition: opacity 0.3s ease, transform 0.3s ease;
    padding: 0;
}

.project_post:hover .animated-element {
    opacity: 1;
    transform: translateY(0);
}

.project_content .project_content p {
    font-size: 1rem;
    margin-bottom: 25px;
    color: #999999;
    transition: all 0.5s ease;
}

.project_post .project_content p {
    font-size: 1rem;
    margin-bottom: 25px;
    color: #999999;
    transition: all 0.5s ease;

    color: rgba(255, 255, 255, 0.7) !important;
}


.project_post .project_content h5 {
    color: #fff !important;
}

.project_post .project_content .meta {
    margin-top: 10px;
    margin-bottom: 10px;
}

.project_post .project_content .meta {
    display: flex;
    align-items: center;
    color: #c5a572;
}

.project_content .meta .horizLine {
    background-color: #c5a572;
    width: 1.5rem;
    height: 1.5px;
}


.project_post .projectMainInfo {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 30px 40px 45px;
    z-index: 1;
    top: unset;
    display: flex;
    height: 100%;
    background: #0a1628d9;
    align-items: center;
    transform: translateY(0px);
}


    .project_post .projectMainInfo span {
        color: #c5a572;
        letter-spacing: .12em;
        font-size: .75rem;
        margin-bottom: 12px;
        display: block;
        text-transform: uppercase;
        font-family: var(--font-accent);
    }

    .project_post .projectMainInfo h2 {
        font-size: .875rem;
        font-family: var(--font-body);
        color: #fff;
    }

    .project_post .projectMainInfo h6 {
        color: rgba(255, 255, 255, 0.7) !important;
        font-size: .75rem;
        font-family: var(--font-accent);
        margin-bottom: 6px;
    }

.projectMainInfo .infoBlock{
    margin-bottom: 15px;
}
/**/

.expertisePage .bu-count {
    font-family: var(--font-accent);
    font-size: 4.5rem;
    line-height: 4.875rem;
    font-weight: 700;
    opacity: 1;
    color: rgba(255, 255, 255, 0.3);
}

.expertisePage #content3 {
    height: 55vh;
    pointer-events: auto;
}


    .expertisePage #content3 h1 {
        position: relative;
        font-size: 3.75rem;
        line-height: 1;
        font-weight: bold;
        text-transform: none;
    }

    .expertisePage #content3 img {
        width: 100%;
        z-index: -1;
        height: 100%;
        object-fit: cover;
        position: absolute;
    }

.titleBgContainer {
    justify-content: flex-start;
}

.sectorFirstTitleDiv {
    padding-top: calc(var(--spacing) * 28) !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    padding-bottom: 0px !important;
}

  .section-header {
        margin-bottom: 2rem;
    }

.projects-bu {
    background: #f8f9fa;
}

.expertiseBlock {
    background-color: #f8f9fa !important;
}

.post-share {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}