/* =========================================
   MINERVA STAR TECHNOLOGY
   SERVICES SECTION
========================================= */

.mst-services-section {
    position: relative;
    width: 100%;
    padding: 90px 30px 55px;
    background: #2b4573bd;
    /* background: #f5f6f8; */
    overflow: hidden;
}

.mst-services-container {
    width: 100%;
    max-width: 1320px;
    margin: 0 auto;
}


/* =========================================
   HEADING
========================================= */

.mst-services-heading {
    max-width: 720px;
    margin: 0 auto 60px;
    text-align: center;
}

.mst-services-subtitle {
    display: inline-block;
    margin-bottom: 15px;

    color: white;

    font-size: 17px;
    font-weight: 500;
}

.mst-services-heading h2 {
    margin: 0;

    color: white;

    font-size: 48px;
    line-height: 1.15;
    font-weight: 700;

    letter-spacing: -1.2px;
}

.mst-services-heading p {
    max-width: 620px;
    margin: 18px auto 0;

    color: #667085;

    font-size: 16px;
    line-height: 1.7;
}


/* =========================================
   SWIPER
========================================= */

.mst-services-slider-area {
    position: relative;
}

.mst-services-swiper {
    padding: 10px 5px 25px;
}

.mst-services-swiper .swiper-slide {
    height: auto;
}


/* =========================================
   SERVICE CARD
========================================= */

.mst-service-card {
    position: relative;

    display: flex;
    flex-direction: column;

    height: 100%;
    min-height: 365px;

    padding: 32px 30px;

    background: #ffffff;

    border-radius: 42px 0 42px 0;

    overflow: hidden;

    transition:
        transform 0.4s ease,
        box-shadow 0.4s ease;
}


/* Background decoration */

.mst-service-card::before {
    content: "";

    position: absolute;

    width: 190px;
    height: 190px;

    right: -90px;
    bottom: -100px;

    background: rgba(36, 76, 255, 0.06);

    border-radius: 50%;

    transition: transform 0.5s ease;
}


/* Top animated line */

.mst-service-card::after {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: #2b4573;

    transition: width 0.4s ease;
}


/* Card Hover */

.mst-service-card:hover {
    transform: translateY(-10px);

    box-shadow:
        0 20px 45px
        #2b4573;
}

.mst-service-card:hover::before {
    transform: scale(1.7);
}

.mst-service-card:hover::after {
    width: 100%;
}


/* =========================================
   ICON
========================================= */

.mst-service-icon {
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;

    width: 62px;
    height: 62px;

    margin-bottom: 48px;

    background: #f1f3f6;

    border-radius: 8px;

    color: #071b64;

    font-size: 24px;

    transition:
        background 0.35s ease,
        color 0.35s ease,
        transform 0.35s ease;
}

.mst-service-card:hover .mst-service-icon {
    background: #2b4573;
    color: #ffffff;

    transform: translateY(-5px);
}


/* =========================================
   CARD CONTENT
========================================= */

.mst-service-content {
    position: relative;
    z-index: 2;

    display: flex;
    flex-direction: column;

    flex: 1;
}

.mst-service-content h3 {
    margin: 0 0 14px;

    /* color: #071b64; */

    color: #c21f24;

    font-size: 20px;
    line-height: 1.4;
    font-weight: 700;
}

.mst-service-content p {
    margin: 0 0 25px;

    color: #667085;

    font-size: 15px;
    line-height: 1.8;
}


/* =========================================
   READ MORE
========================================= */

.mst-service-link {
    display: inline-flex;
    align-items: center;

    gap: 10px;

    width: fit-content;

    margin-top: auto;

    color: #2b4573;

    font-size: 15px;
    font-weight: 600;

    text-decoration: none;

    transition: gap 0.3s ease;
}

.mst-service-link i {
    font-size: 13px;

    transition: transform 0.3s ease;
}

.mst-service-link:hover {
    gap: 15px;
    color: #c21f24;
}

.mst-service-link:hover i {
    transform: translateX(5px);
    color: #c21f24;
}


/* =========================================
   SLIDER CONTROLS
========================================= */

.mst-slider-controls {
    display: flex;
    align-items: center;
    justify-content: center;

    gap: 18px;

    margin-top: 20px;
}

.mst-slider-button {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 46px;
    height: 46px;

    padding: 0;

    border: 1px solid #d9deeb;

    border-radius: 50%;

    background: #ffffff;

    color: #071b64;

    cursor: pointer;

    transition: all 0.3s ease;
}

.mst-slider-button:hover {
    background: #2b4573;

    border-color:#2b4573;

    color: #ffffff;

    transform: translateY(-3px);
}


/* =========================================
   PAGINATION
========================================= */

.mst-services-pagination {
    position: static !important;

    display: flex;
    align-items: center;
    justify-content: center;

    width: auto !important;
}

.mst-services-pagination .swiper-pagination-bullet {
    width: 8px;
    height: 8px;

    margin: 0 4px !important;

    background: #aeb7cd;

    opacity: 1;

    transition: all 0.3s ease;
}

.mst-services-pagination .swiper-pagination-bullet-active {
    width: 28px;

    border-radius: 20px;

    background: #2b4573;
}


/* =========================================
   BOTTOM CTA
========================================= */

.mst-services-bottom {
    margin-top: 38px;

    text-align: center;
}

.mst-services-bottom p {
    margin: 0;

    color: #071b64;

    font-size: 15px;
    line-height: 1.7;
}

.mst-services-bottom a {
    display: inline-flex;
    align-items: center;

    gap: 8px;

    margin-left: 5px;

    color: #244cff;

    font-weight: 600;

    text-decoration: none;
}

.mst-services-bottom a i {
    font-size: 12px;

    transition: transform 0.3s ease;
}

.mst-services-bottom a:hover i {
    transform: translateX(5px);
}


/* =========================================
   SCROLL REVEAL ANIMATION
========================================= */

.mst-reveal {
    opacity: 0;

    transform: translateY(40px);

    transition:
        opacity 0.8s ease,
        transform 0.8s ease;
}

.mst-reveal.mst-visible {
    opacity: 1;

    transform: translateY(0);
}


/* ==================================================
   LARGE DESKTOP / 4K
   1600px and above
================================================== */

@media (min-width: 1600px) {

    .mst-services-container {
        max-width: 1500px;
    }

    .mst-services-section {
        padding: 110px 40px 70px;
    }

    .mst-services-heading {
        max-width: 800px;
        margin-bottom: 65px;
    }

    .mst-services-heading h2 {
        font-size: 54px;
    }

    .mst-services-heading p {
        font-size: 17px;
    }

    .mst-service-card {
        min-height: 390px;
        padding: 36px;
    }

    .mst-service-content h3 {
        font-size: 21px;
    }

}


/* ==================================================
   STANDARD LAPTOP / DESKTOP
   1200px - 1599px
================================================== */

@media (min-width: 1200px) and (max-width: 1599px) {

    .mst-services-container {
        max-width: 1200px;
    }

    .mst-services-section {
        padding: 90px 30px 55px;
    }

    .mst-services-heading h2 {
        font-size: 46px;
    }

    .mst-service-card {
        min-height: 365px;
    }

}


/* ==================================================
   SMALL LAPTOP
   992px - 1199px
================================================== */

@media (min-width: 992px) and (max-width: 1199px) {

    .mst-services-section {
        padding: 80px 30px 50px;
    }

    .mst-services-heading {
        margin-bottom: 50px;
    }

    .mst-services-heading h2 {
        font-size: 42px;
    }

    .mst-services-heading p {
        max-width: 580px;
    }

    .mst-service-card {
        min-height: 350px;
        padding: 28px 26px;
    }

    .mst-service-icon {
        margin-bottom: 40px;
    }

}


/* ==================================================
   TABLET
   768px - 991px
================================================== */

@media (min-width: 768px) and (max-width: 991px) {

    .mst-services-section {
        padding: 70px 25px 45px;
    }

    .mst-services-heading {
        max-width: 620px;
        margin-bottom: 45px;
    }

    .mst-services-subtitle {
        font-size: 16px;
    }

    .mst-services-heading h2 {
        font-size: 38px;
    }

    .mst-services-heading p {
        font-size: 15px;
    }

    .mst-service-card {
        min-height: 345px;
        padding: 28px;
    }

    .mst-service-icon {
        width: 58px;
        height: 58px;

        margin-bottom: 38px;

        font-size: 22px;
    }

    .mst-service-content h3 {
        font-size: 19px;
    }

}


/* ==================================================
   LARGE MOBILE
   576px - 767px
================================================== */

@media (min-width: 576px) and (max-width: 767px) {

    .mst-services-section {
        padding: 60px 20px 40px;
    }

    .mst-services-heading {
        margin-bottom: 38px;
    }

    .mst-services-subtitle {
        font-size: 15px;
    }

    .mst-services-heading h2 {
        font-size: 34px;
        line-height: 1.2;
    }

    .mst-services-heading h2 br {
        display: none;
    }

    .mst-services-heading p {
        font-size: 14px;
    }

    .mst-service-card {
        min-height: 330px;

        padding: 26px;

        border-radius: 35px 0 35px 0;
    }

    .mst-service-icon {
        margin-bottom: 35px;
    }

}


/* ==================================================
   MOBILE
   381px - 575px
================================================== */

@media (min-width: 381px) and (max-width: 575px) {

    .mst-services-section {
        padding: 50px 16px 35px;
    }

    .mst-services-heading {
        margin-bottom: 32px;
    }

    .mst-services-subtitle {
        margin-bottom: 10px;

        font-size: 14px;
    }

    .mst-services-heading h2 {
        font-size: 29px;

        line-height: 1.2;

        letter-spacing: -0.5px;
    }

    .mst-services-heading h2 br {
        display: none;
    }

    .mst-services-heading p {
        margin-top: 14px;

        font-size: 14px;
    }

    .mst-services-swiper {
        padding-bottom: 15px;
    }

    .mst-service-card {
        min-height: 325px;

        padding: 25px;

        border-radius: 32px 0 32px 0;
    }

    .mst-service-icon {
        width: 56px;
        height: 56px;

        margin-bottom: 34px;

        font-size: 21px;
    }

    .mst-service-content h3 {
        font-size: 19px;
    }

    .mst-service-content p {
        font-size: 14px;

        line-height: 1.7;
    }

    .mst-slider-controls {
        gap: 12px;

        margin-top: 15px;
    }

    .mst-slider-button {
        width: 42px;
        height: 42px;
    }

    .mst-services-bottom {
        margin-top: 28px;
    }

    .mst-services-bottom p {
        font-size: 14px;
    }

}


/* ==================================================
   VERY SMALL MOBILE
   Up to 380px
================================================== */

@media (max-width: 380px) {

    .mst-services-section {
        padding: 45px 12px 30px;
    }

    .mst-services-heading {
        margin-bottom: 30px;
    }

    .mst-services-subtitle {
        font-size: 13px;
    }

    .mst-services-heading h2 {
        font-size: 26px;

        line-height: 1.2;
    }

    .mst-services-heading h2 br {
        display: none;
    }

    .mst-services-heading p {
        font-size: 13px;
    }

    .mst-service-card {
        min-height: 310px;

        padding: 22px;

        border-radius: 28px 0 28px 0;
    }

    .mst-service-icon {
        width: 52px;
        height: 52px;

        margin-bottom: 30px;

        font-size: 19px;
    }

    .mst-service-content h3 {
        font-size: 18px;
    }

    .mst-service-content p {
        font-size: 13px;
    }

    .mst-slider-controls {
        gap: 10px;
    }

    .mst-slider-button {
        width: 38px;
        height: 38px;

        font-size: 12px;
    }

    .mst-services-pagination
    .swiper-pagination-bullet-active {
        width: 20px;
    }

    .mst-services-bottom {
        margin-top: 25px;
    }

    .mst-services-bottom p {
        font-size: 13px;
    }

}


/* ==================================================
   ACCESSIBILITY - REDUCED MOTION
================================================== */

@media (prefers-reduced-motion: reduce) {

    .mst-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }

    .mst-service-card,
    .mst-service-icon,
    .mst-service-link,
    .mst-service-link i {
        transition: none;
    }

}



/* =============================================
   MINERVA STAR TECHNOLOGY
   OUR PARTNERS
============================================= */

.minerva-partners-section {
    position: relative;

    width: 100%;

    padding: 90px 30px 80px;

    background: #ffffff;

    overflow: hidden;
}


.minerva-partners-container {
    width: 100%;

    max-width: 1320px;

    margin: 0 auto;
}


/* =============================================
   SECTION HEADING
============================================= */

.minerva-partners-heading {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 20px;

    margin-bottom: 65px;
}


.minerva-partners-heading h2 {
    margin: 0;

    color: #101828;

    background: linear-gradient(110deg, #101828 20%, #2b63a8 45%, #c92a32 55%, #101828 80%);

    background-size: 250% 100%;

    -webkit-background-clip: text;
    background-clip: text;

    -webkit-text-fill-color: transparent;

    font-size: 18px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;

    animation: minerva-partners-title-shine 4.5s ease-in-out infinite;
}


.minerva-partners-heading .heading-line {
    display: none;

    position: relative;

    width: 55px;

    height: 10px;

    overflow: visible;

    border-radius: 0;

    background: transparent;

    clip-path: none;

    transition: width 0.5s ease;

    animation: minerva-partners-mark-pulse 1.8s ease-in-out infinite;
}


.minerva-partners-heading .heading-line::before,
.minerva-partners-heading .heading-line::after {
    content: "";

    position: absolute;

    top: 50%;

    border-radius: 50%;

    transform: translate(-50%, -50%);
}


.minerva-partners-heading .heading-line::before {
    left: 50%;

    width: 6px;
    height: 6px;

    background: #2b4573;

    box-shadow: none;

    animation: minerva-partners-dot-pulse 1.8s ease-in-out infinite;
}


.minerva-partners-heading .heading-line::after {
    left: 50%;

    width: 14px;
    height: 14px;

    border: 1px solid #2b4573;

    animation: minerva-partners-dot-ring 1.8s ease-out infinite;
}


.minerva-partners-heading:hover .heading-line {
    width: 75px;
}


@keyframes minerva-partners-title-shine {
    0%, 35% { background-position: 100% 50%; }
    65%, 100% { background-position: 0 50%; }
}


@keyframes minerva-partners-mark-pulse {
    0%, 100% { opacity: 0.45; }
    50% { opacity: 1; }
}


@keyframes minerva-partners-dot-pulse {
    0%, 100% { opacity: 0.35; transform: translate(-50%, -50%) scale(0.75); }
    50% { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}


@keyframes minerva-partners-dot-ring {
    0% { opacity: 0.65; transform: translate(-50%, -50%) scale(0.45); }
    75%, 100% { opacity: 0; transform: translate(-50%, -50%) scale(1.35); }
}


@media (prefers-reduced-motion: reduce) {
    .minerva-partners-heading h2,
    .minerva-partners-heading .heading-line,
    .minerva-partners-heading .heading-line::before,
    .minerva-partners-heading .heading-line::after {
        animation: none;
    }
}


/* =============================================
   PARTNERS FLEX LAYOUT
============================================= */

.minerva-partners-grid {
    display: flex;
    flex-wrap: wrap;

    justify-content: center;
    align-items: flex-start;

    row-gap: 45px;
}


/* 5 Partners Per Row */

.minerva-partner-item {
    position: relative;

    flex: 0 0 20%;
    max-width: 20%;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: flex-start;

    text-align: center;
}


/* =============================================
   PARTNER ITEM
============================================= */

.minerva-partner-item {
    position: relative;

    display: flex;

    flex-direction: column;

    align-items: center;
    justify-content: flex-start;

    min-width: 0;

    text-align: center;
}


/* =============================================
   LOGO AREA
============================================= */

.minerva-partner-logo {
    position: relative;

    display: flex;

    align-items: center;
    justify-content: center;

    width: 100%;

    height: 85px;

    padding: 10px 15px;

    border-radius: 10px;

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        box-shadow 0.35s ease;
}


.minerva-partner-logo img {
    display: block;

    max-width: 100%;

    width: auto;

    height: auto;

    max-height: 62px;

    object-fit: contain;

    transition:
        transform 0.4s ease,
        filter 0.4s ease;
}


/* =============================================
   DESCRIPTION
============================================= */

.minerva-partner-item p {
    position: relative;

    margin: 15px 0 0;

    color: #475467;

    font-size: 15px;

    line-height: 1.5;

    font-weight: 400;

    transition: color 0.3s ease;
}


/* Small underline */

.minerva-partner-item p::after {
    content: "";

    position: absolute;

    left: 50%;
    bottom: -7px;

    width: 0;

    height: 1px;

    background: #2b4573;

    transform: translateX(-50%);

    transition: width 0.35s ease;
}


/* =============================================
   HOVER ANIMATION
============================================= */

.minerva-partner-item:hover
.minerva-partner-logo {
    transform: translateY(-5px);

    background: #ffffff;

    box-shadow:
        0 12px 35px
        rgba(43, 69, 115, 0.10);
}


.minerva-partner-item:hover
.minerva-partner-logo img {
    transform: scale(1.05);
}


.minerva-partner-item:hover p {
    color: #2b4573;
}


.minerva-partner-item:hover p::after {
    width: 35px;
}


/* =============================================
   SCROLL REVEAL
============================================= */

.partner-reveal {
    opacity: 0;

    transform: translateY(30px);

    transition:
        opacity 0.7s ease,
        transform 0.7s ease;
}


.partner-reveal.partner-visible {
    opacity: 1;

    transform: translateY(0);
}


/* =============================================
   OPTIONAL BACKGROUND DECORATION
============================================= */

.minerva-partners-section::before {
    content: "";

    position: absolute;

    top: -180px;
    right: -180px;

    width: 400px;
    height: 400px;

    border-radius: 50%;

    background:
        rgba(43, 69, 115, 0.025);

    pointer-events: none;
}


/* ==================================================
   LARGE DESKTOP
   1600px AND ABOVE
================================================== */

@media (min-width: 1600px) {

    .minerva-partners-container {
        max-width: 1450px;
    }

    .minerva-partners-section {
        padding: 110px 40px 90px;
    }

    .minerva-partners-grid {
        column-gap: 45px;

        row-gap: 55px;
    }

      /* 5 items */
    .minerva-partner-item {
        flex: 0 0 20%;
        max-width: 20%;
    }

    .minerva-partner-logo {
        height: 95px;
    }

    .minerva-partner-logo img {
        max-height: 68px;
    }

    .minerva-partner-item p {
        font-size: 16px;
    }

}


/* ==================================================
   DESKTOP / LAPTOP
   1400px - 1599px
================================================== */

@media
(min-width: 1400px)
and
(max-width: 1599px) {

    .minerva-partners-container {
        max-width: 1320px;
    }

     .minerva-partner-item {
        flex: 0 0 20%;
        max-width: 20%;
    }


}


/* ==================================================
   LAPTOP
   1200px - 1399px
================================================== */

@media
(min-width: 1200px)
and
(max-width: 1399px) {

    .minerva-partners-section {
        padding: 85px 30px 70px;
    }

    .minerva-partners-container {
        max-width: 1140px;
    }

    .minerva-partners-grid {
        grid-template-columns:
            repeat(5, 1fr);

        column-gap: 25px;

        row-gap: 40px;
    }

    .minerva-partner-logo {
        height: 80px;

        padding: 10px;
    }

    .minerva-partner-logo img {
        max-height: 58px;
    }

}


/* ==================================================
   SMALL LAPTOP
   992px - 1199px
================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

    .minerva-partners-section {
        padding: 80px 30px 65px;
    }

    .minerva-partners-heading {
        margin-bottom: 55px;
    }

    .minerva-partners-grid {
        

        column-gap: 25px;

        row-gap: 45px;
    }

    .minerva-partner-item {
        flex: 0 0 25%;
        max-width: 25%;
    }

    .minerva-partner-logo {
        height: 80px;
    }

    .minerva-partner-logo img {
        max-height: 58px;
    }

}


/* ==================================================
   TABLET
   768px - 991px
================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

    .minerva-partners-section {
        padding: 70px 25px 60px;
    }

    .minerva-partners-heading {
        margin-bottom: 50px;

        gap: 16px;
    }

    .minerva-partners-heading h2 {
        font-size: 17px;
    }

    .minerva-partners-heading
    .heading-line {
        width: 45px;
    }

    .minerva-partners-grid {
        
        column-gap: 25px;

        row-gap: 40px;
    }

    .minerva-partner-item {
        flex: 0 0 33.333%;
        max-width: 33.333%;
    }

    .minerva-partner-logo {
        height: 78px;
    }

    .minerva-partner-logo img {
        max-height: 55px;
    }

    .minerva-partner-item p {
        margin-top: 12px;

        font-size: 14px;
    }

}


/* ==================================================
   LARGE MOBILE
   576px - 767px
================================================== */

@media
(min-width: 576px)
and
(max-width: 767px) {

    .minerva-partners-section {
        padding: 60px 20px 50px;
    }

    .minerva-partners-heading {
        margin-bottom: 45px;

        gap: 14px;
    }

    .minerva-partners-heading h2 {
        font-size: 16px;
    }

    .minerva-partners-heading
    .heading-line {
        width: 40px;
    }

    .minerva-partners-grid {
       

        column-gap: 20px;

        row-gap: 38px;
    }

    .minerva-partner-item {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .minerva-partner-logo {
        height: 75px;

        padding: 8px 12px;
    }

    .minerva-partner-logo img {
        max-height: 52px;
    }

    .minerva-partner-item p {
        margin-top: 10px;

        font-size: 14px;
    }

}


/* ==================================================
   MOBILE
   381px - 575px
================================================== */

@media
(min-width: 381px)
and
(max-width: 575px) {

    .minerva-partners-section {
        padding: 55px 16px 45px;
    }

    .minerva-partners-heading {
        margin-bottom: 40px;

        gap: 12px;
    }

    .minerva-partners-heading h2 {
        font-size: 15px;

        letter-spacing: 0.8px;
    }

    .minerva-partners-heading
    .heading-line {
        width: 35px;
    }

    .minerva-partners-grid {
        

        column-gap: 14px;

        row-gap: 35px;
    }

     .minerva-partner-item {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .minerva-partner-logo {
        height: 70px;

        padding: 8px;
    }

    .minerva-partner-logo img {
        max-height: 48px;
    }

    .minerva-partner-item p {
        margin-top: 8px;

        font-size: 13px;

        line-height: 1.4;
    }

}


/* ==================================================
   VERY SMALL MOBILE
   380px AND BELOW
================================================== */

@media (max-width: 380px) {

    .minerva-partners-section {
        padding: 50px 12px 40px;
    }

    .minerva-partners-heading {
        margin-bottom: 35px;

        gap: 10px;
    }

    .minerva-partners-heading h2 {
        font-size: 14px;

        letter-spacing: 0.5px;
    }

    .minerva-partners-heading
    .heading-line {
        width: 28px;
    }

    .minerva-partners-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));

        column-gap: 10px;

        row-gap: 30px;
    }

    .minerva-partner-logo {
        height: 65px;

        padding: 6px;
    }

    .minerva-partner-logo img {
        max-height: 44px;
    }

    .minerva-partner-item p {
        margin-top: 8px;

        font-size: 12px;
    }

}


/* ==================================================
   ACCESSIBILITY
================================================== */

@media (prefers-reduced-motion: reduce) {

    .partner-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }

    .minerva-partner-logo,
    .minerva-partner-logo img,
    .minerva-partner-item p,
    .minerva-partner-item p::after {
        transition: none;
    }

}


/* ==================================================
   LARGE MOBILE
   576px - 767px
   1 PARTNER PER ROW
================================================== */

@media (min-width: 576px) and (max-width: 767px) {

    .minerva-partners-section {
        padding: 60px 20px 50px;
    }

    .minerva-partners-heading {
        margin-bottom: 45px;
    }

    .minerva-partners-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        row-gap: 35px;
    }

    /* 1 Partner Per Row */
    .minerva-partner-item {
        flex: 0 0 100%;
        max-width: 100%;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        text-align: center;
    }

    .minerva-partner-logo {
        width: 100%;
        height: 90px;

        padding: 8px 20px;

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .minerva-partner-logo img {
        width: auto;
        height: auto;

        max-width: 220px;
        max-height: 70px;

        object-fit: contain;
    }

    .minerva-partner-item p {
        margin-top: 10px;

        font-size: 14px;
        line-height: 1.5;

        text-align: center;
    }

}


/* ==================================================
   MEDIUM MOBILE
   381px - 575px
   1 PARTNER PER ROW
================================================== */

@media (min-width: 381px) and (max-width: 575px) {

    .minerva-partners-section {
        padding: 55px 16px 45px;
    }

    .minerva-partners-heading {
        margin-bottom: 40px;
    }

    .minerva-partners-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        row-gap: 32px;
    }

    /* 1 Partner Per Row */
    .minerva-partner-item {
        flex: 0 0 100%;
        max-width: 100%;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        text-align: center;
    }

    .minerva-partner-logo {
        width: 100%;
        height: 85px;

        padding: 8px 15px;

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .minerva-partner-logo img {
        width: auto;
        height: auto;

        max-width: 200px;
        max-height: 65px;

        object-fit: contain;
    }

    .minerva-partner-item p {
        margin-top: 8px;

        font-size: 14px;
        line-height: 1.5;

        text-align: center;
    }

}


/* ==================================================
   SMALL MOBILE
   380px AND BELOW
   1 PARTNER PER ROW
================================================== */

@media (max-width: 380px) {

    .minerva-partners-section {
        padding: 50px 15px 40px;
    }

    .minerva-partners-heading {
        margin-bottom: 35px;
    }

    .minerva-partners-grid {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        row-gap: 30px;
    }

    /* 1 Partner Per Row */
    .minerva-partner-item {
        flex: 0 0 100%;
        max-width: 100%;

        display: flex;
        flex-direction: column;

        align-items: center;
        justify-content: center;

        text-align: center;
    }

    .minerva-partner-logo {
        width: 100%;
        height: 80px;

        padding: 6px 12px;

        display: flex;
        align-items: center;
        justify-content: center;
    }

    .minerva-partner-logo img {
        width: auto;
        height: auto;

        max-width: 180px;
        max-height: 60px;

        object-fit: contain;
    }

    .minerva-partner-item p {
        margin-top: 8px;

        font-size: 13px;
        line-height: 1.5;

        text-align: center;
    }

}


/* =====================================================
   MINERVA STAR TECHNOLOGY
   ACHIEVEMENT SECTION
===================================================== */

.mst-achievement-section {
    position: relative;

    width: 100%;

    padding: 100px 30px;

    background:
        linear-gradient(
            135deg,
            #ffffff 0%,
            #f5f8fc 55%,
            #edf3f9 100%
        );

    overflow: hidden;
}


/* Container */

.mst-achievement-container {
    position: relative;
    z-index: 2;

    width: 100%;
    max-width: 1450px;

    margin: 0 auto;
}


/* Main Layout */

.mst-achievement-wrapper {
    display: grid;

    grid-template-columns:
        minmax(0, 0.9fr)
        minmax(0, 1.1fr);

    align-items: center;

    gap: 70px;
}


/* =====================================================
   LEFT CONTENT
===================================================== */

.mst-achievement-content {
    position: relative;

    z-index: 3;
}


/* Subtitle */

.mst-achievement-subtitle {
    display: flex;

    align-items: center;

    gap: 14px;

    margin-bottom: 30px;

    color: #2b4573;

    font-size: 15px;

    font-weight: 700;

    letter-spacing: 0.8px;

    text-transform: uppercase;
}


.mst-subtitle-line {
    display: block;

    width: 38px;
    height: 2px;

    background: #2b4573;
}


/* =====================================================
   TITLE
===================================================== */

.mst-achievement-title {
    max-width: 700px;

    margin: 0;

    color: #171b24;

    font-size: 52px;

    line-height: 1.13;

    font-weight: 700;

    letter-spacing: -1.5px;
}


.mst-achievement-title span {
    display: block;

    color: #2b4573;
}


/* Small line under heading */

.mst-title-accent {
    display: block;

    width: 65px;
    height: 4px;

    margin: 32px 0 27px;

    background: #2b4573;

    border-radius: 10px;
}


/* =====================================================
   DESCRIPTION
===================================================== */

.mst-achievement-description {
    max-width: 650px;

    margin: 0 0 40px;

    color: #505968;

    font-size: 16px;

    line-height: 1.85;

    font-weight: 400;
}


/* =====================================================
   COUNTER GRID
===================================================== */

.mst-achievement-stats {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 20px;

    max-width: 650px;
}


/* =====================================================
   COUNTER CARD
===================================================== */

.mst-stat-card {
    position: relative;

    display: flex;

    align-items: center;

    min-height: 115px;

    background: #ffffff;

    border: 1px solid
        rgba(43, 69, 115, 0.07);

    border-radius: 14px;

    overflow: hidden;

    box-shadow:
        0 12px 35px
        rgba(43, 69, 115, 0.07);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease;
}


/* Hover */

.mst-stat-card:hover {
    transform: translateY(-6px);

    box-shadow:
        0 18px 45px
        rgba(43, 69, 115, 0.14);
}


/* Top line */

.mst-stat-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 0;
    height: 3px;

    background: #2b4573;

    transition: width 0.4s ease;
}


.mst-stat-card:hover::before {
    width: 100%;
}


/* =====================================================
   ICON
===================================================== */

.mst-stat-icon {
    flex: 0 0 95px;

    align-self: stretch;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #2b4573;

    color: #ffffff;

    font-size: 30px;

    transition: background 0.35s ease;
}


.mst-stat-card:hover
.mst-stat-icon {
    background: #1f365f;
}


/* =====================================================
   STAT TEXT
===================================================== */

.mst-stat-info {
    padding: 18px 20px;
}


.mst-stat-info h3 {
    margin: 0 0 6px;

    color: #2b4573;

    font-size: 40px;

    line-height: 1;

    font-weight: 700;

    letter-spacing: -1px;
}


.mst-stat-info p {
    margin: 0;

    color: #5d6470;

    font-size: 15px;

    line-height: 1.4;

    font-weight: 500;
}


/* =====================================================
   RIGHT IMAGE AREA
===================================================== */

.mst-achievement-visual {
    position: relative;

    display: grid;

    grid-template-columns:
        minmax(0, 1.5fr)
        minmax(180px, 0.75fr);

    gap: 12px;

    height: 650px;
}


/* =====================================================
   MAIN IMAGE
===================================================== */

.mst-achieve-main-image {
    position: relative;

    height: 100%;

    border-radius:
        90px 25px 25px 90px;

    overflow: hidden;

    border-top:
        8px solid #2b4573;

    border-left:
        8px solid #2b4573;
}


.mst-achieve-main-image img {
    width: 100%;
    height: 100%;

    display: block;

    object-fit: cover;

    transition:
        transform 0.8s
        cubic-bezier(0.22, 1, 0.36, 1);
}


.mst-achievement-visual:hover
.mst-achieve-main-image img {
    transform: scale(1.04);
}


/* =====================================================
   SIDE IMAGES
===================================================== */

.mst-achieve-side-images {
    display: grid;

    grid-template-rows: 0.8fr 1.2fr;

    gap: 12px;

    min-width: 0;
}


.mst-achieve-small-image {
    position: relative;

    width: 100%;
    height: 100%;

    overflow: hidden;

    border-radius: 20px;
}


.mst-achieve-small-image img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;

    transition:
        transform 0.7s
        cubic-bezier(0.22, 1, 0.36, 1);
}


.mst-achieve-small-image:hover img {
    transform: scale(1.07);
}


/* Engineer Image */

.mst-engineer-image {
    border-radius:
        20px 20px 80px 20px;
}





/* =====================================================
   BACKGROUND DECORATION
===================================================== */

.mst-achievement-bg-shape {
    position: absolute;

    width: 600px;
    height: 600px;

    top: -280px;
    left: -250px;

    border-radius: 50%;

    border:
        1px solid
        rgba(43, 69, 115, 0.07);

    pointer-events: none;
}


/* Dot pattern */

.mst-achievement-dots {
    position: absolute;

    z-index: -1;

    width: 130px;
    height: 130px;

    top: -50px;
    right: 40px;

    opacity: 0.35;

    background-image:
        radial-gradient(
            #2b4573 1.5px,
            transparent 1.5px
        );

    background-size: 14px 14px;
}


/* =====================================================
   SCROLL ANIMATION
===================================================== */

.mst-achieve-reveal {
    opacity: 0;

    transform: translateY(45px);

    transition:
        opacity 0.85s ease,
        transform 0.85s
        cubic-bezier(0.22, 1, 0.36, 1);
}


.mst-achieve-reveal.mst-achieve-visible {
    opacity: 1;

    transform: translateY(0);
}


/* Slight delay for image */

.mst-achievement-visual {
    transition-delay: 0.15s;
}


/* =====================================================
   EXTRA LARGE DESKTOP
   1600px+
===================================================== */

@media (min-width: 1600px) {

    .mst-achievement-container {
        max-width: 1500px;
    }

    .mst-achievement-section {
        padding: 110px 40px;
    }

    .mst-achievement-wrapper {
        gap: 85px;
    }

    .mst-achievement-title {
        font-size: 56px;
    }

    .mst-achievement-visual {
        height: 680px;
    }

}


/* =====================================================
   STANDARD DESKTOP / LAPTOP
   1400px - 1599px
===================================================== */

@media
(min-width: 1400px)
and
(max-width: 1599px) {

    .mst-achievement-container {
        max-width: 1320px;
    }

    .mst-achievement-title {
        font-size: 49px;
    }

    .mst-achievement-wrapper {
        gap: 55px;
    }

    .mst-achievement-visual {
        height: 620px;
    }

}


/* =====================================================
   LAPTOP
   1200px - 1399px
===================================================== */

@media
(min-width: 1200px)
and
(max-width: 1399px) {

    .mst-achievement-section {
        padding: 90px 30px;
    }

    .mst-achievement-container {
        max-width: 1140px;
    }

    .mst-achievement-wrapper {
        gap: 45px;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 0.9fr);
    }

    .mst-achievement-title {
        font-size: 43px;
    }

    .mst-achievement-description {
        font-size: 15px;
    }

    .mst-achievement-visual {
        height: 570px;
    }

    .mst-stat-icon {
        flex-basis: 80px;

        font-size: 26px;
    }

    .mst-stat-info {
        padding: 16px;
    }

    .mst-stat-info h3 {
        font-size: 34px;
    }

}


/* =====================================================
   SMALL LAPTOP
   992px - 1199px
===================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

    .mst-achievement-section {
        padding: 80px 30px;
    }

    .mst-achievement-wrapper {
        gap: 40px;

        grid-template-columns:
            minmax(0, 1fr)
            minmax(0, 0.9fr);
    }

    .mst-achievement-title {
        font-size: 38px;

        letter-spacing: -1px;
    }

    .mst-achievement-description {
        font-size: 14px;

        line-height: 1.7;
    }

    .mst-achievement-stats {
        gap: 15px;
    }

    .mst-stat-card {
        min-height: 95px;
    }

    .mst-stat-icon {
        flex-basis: 70px;

        font-size: 23px;
    }

    .mst-stat-info {
        padding: 14px;
    }

    .mst-stat-info h3 {
        font-size: 30px;
    }

    .mst-stat-info p {
        font-size: 13px;
    }

    .mst-achievement-visual {
        height: 500px;
    }

}


/* =====================================================
   TABLET
   768px - 991px
===================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

    .mst-achievement-section {
        padding: 75px 30px 90px;
    }

    .mst-achievement-wrapper {
        grid-template-columns: 1fr;

        gap: 60px;
    }

    .mst-achievement-content {
        max-width: 700px;

        margin: 0 auto;

        text-align: center;
    }

    .mst-achievement-subtitle {
        justify-content: center;
    }

    .mst-achievement-title {
        max-width: 650px;

        margin: 0 auto;

        font-size: 44px;
    }

    .mst-title-accent {
        margin:
            28px auto 25px;
    }

    .mst-achievement-description {
        max-width: 620px;

        margin:
            0 auto 35px;
    }

    .mst-achievement-stats {
        max-width: 650px;

        margin: 0 auto;

        text-align: left;
    }

    .mst-achievement-visual {
        max-width: 700px;

        width: 100%;
        height: 560px;

        margin: 0 auto;
    }

}


/* =====================================================
   LARGE MOBILE
   576px - 767px
===================================================== */

@media
(min-width: 576px)
and
(max-width: 767px) {

    .mst-achievement-section {
        padding: 65px 20px 80px;
    }

    .mst-achievement-wrapper {
        grid-template-columns: 1fr;

        gap: 50px;
    }

    .mst-achievement-subtitle {
        justify-content: center;

        margin-bottom: 22px;

        font-size: 14px;
    }

    .mst-achievement-content {
        text-align: center;
    }

    .mst-achievement-title {
        margin: 0 auto;

        font-size: 38px;

        line-height: 1.18;
    }

    .mst-title-accent {
        margin:
            25px auto 22px;
    }

    .mst-achievement-description {
        margin:
            0 auto 32px;

        font-size: 14px;

        line-height: 1.75;
    }

    .mst-achievement-stats {
        max-width: 520px;

        margin: 0 auto;

        grid-template-columns:
            repeat(2, 1fr);

        gap: 15px;

        text-align: left;
    }

    .mst-stat-card {
        min-height: 100px;
    }

    .mst-stat-icon {
        flex-basis: 70px;

        font-size: 23px;
    }

    .mst-stat-info {
        padding: 12px;
    }

    .mst-stat-info h3 {
        font-size: 29px;
    }

    .mst-stat-info p {
        font-size: 12px;
    }

    .mst-achievement-visual {
        height: 470px;

        grid-template-columns:
            1.35fr 0.75fr;
    }

    .mst-achieve-main-image {
        border-radius:
            55px 18px 18px 55px;
    }

    .mst-engineer-image {
        border-radius:
            15px 15px 50px 15px;
    }

}


/* =====================================================
   MOBILE
   381px - 575px
===================================================== */

@media
(min-width: 381px)
and
(max-width: 575px) {

    .mst-achievement-section {
        padding: 55px 16px 70px;
    }

    .mst-achievement-wrapper {
        grid-template-columns: 1fr;

        gap: 45px;
    }

    .mst-achievement-content {
        text-align: center;
    }

    .mst-achievement-subtitle {
        justify-content: center;

        gap: 10px;

        margin-bottom: 20px;

        font-size: 13px;
    }

    .mst-subtitle-line {
        width: 28px;
    }

    .mst-achievement-title {
        font-size: 31px;

        line-height: 1.2;

        letter-spacing: -0.7px;
    }

    .mst-title-accent {
        width: 50px;

        height: 3px;

        margin:
            22px auto 20px;
    }

    .mst-achievement-description {
        margin-bottom: 30px;

        font-size: 14px;

        line-height: 1.7;
    }


    /* One stat per row */

    .mst-achievement-stats {
        grid-template-columns: 1fr;

        gap: 12px;

        max-width: 370px;

        margin: 0 auto;

        text-align: left;
    }

    .mst-stat-card {
        min-height: 95px;
    }

    .mst-stat-icon {
        flex-basis: 85px;

        font-size: 25px;
    }

    .mst-stat-info h3 {
        font-size: 32px;
    }

    .mst-stat-info p {
        font-size: 14px;
    }


    /* Images */

    .mst-achievement-visual {
        display: grid;

        grid-template-columns: 1fr 1fr;

        grid-template-rows:
            300px 170px;

        gap: 10px;

        height: auto;
    }

    .mst-achieve-main-image {
        grid-column: 1 / -1;

        height: 300px;

        border-radius: 35px 15px 15px 35px;

        border-width: 5px;
    }

    .mst-achieve-side-images {
        display: contents;
    }

    .mst-achieve-small-image {
        height: 170px;

        border-radius: 15px;
    }

    .mst-engineer-image {
        border-radius:
            15px 15px 35px 15px;
    }

    .mst-achievement-visual::after {
        width: 300px;
        height: 140px;

        right: -100px;
        bottom: -60px;
    }

}


/* =====================================================
   VERY SMALL MOBILE
   380px AND BELOW
===================================================== */

@media (max-width: 380px) {

    .mst-achievement-section {
        padding: 50px 14px 65px;
    }

    .mst-achievement-wrapper {
        grid-template-columns: 1fr;

        gap: 40px;
    }

    .mst-achievement-content {
        text-align: center;
    }

    .mst-achievement-subtitle {
        justify-content: center;

        margin-bottom: 18px;

        font-size: 12px;
    }

    .mst-subtitle-line {
        width: 25px;
    }

    .mst-achievement-title {
        font-size: 27px;

        line-height: 1.2;

        letter-spacing: -0.5px;
    }

    .mst-title-accent {
        width: 45px;

        height: 3px;

        margin:
            20px auto 18px;
    }

    .mst-achievement-description {
        margin-bottom: 28px;

        font-size: 13px;

        line-height: 1.7;
    }


    /* Stats */

    .mst-achievement-stats {
        grid-template-columns: 1fr;

        gap: 12px;

        margin: 0 auto;

        text-align: left;
    }

    .mst-stat-card {
        min-height: 90px;
    }

    .mst-stat-icon {
        flex-basis: 75px;

        font-size: 22px;
    }

    .mst-stat-info {
        padding: 12px 15px;
    }

    .mst-stat-info h3 {
        font-size: 29px;
    }

    .mst-stat-info p {
        font-size: 13px;
    }


    /* Images */

    .mst-achievement-visual {
        display: grid;

        grid-template-columns: 1fr;

        gap: 10px;

        height: auto;
    }

    .mst-achieve-main-image {
        height: 280px;

        border-radius: 30px 12px 12px 30px;

        border-width: 4px;
    }

    .mst-achieve-side-images {
        display: grid;

        grid-template-columns: 1fr 1fr;

        grid-template-rows: 150px;

        gap: 10px;
    }

    .mst-achieve-small-image {
        height: 150px;

        border-radius: 12px;
    }

    .mst-engineer-image {
        border-radius:
            12px 12px 30px 12px;
    }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {

    .mst-achieve-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }

    .mst-stat-card,
    .mst-stat-icon,
    .mst-achieve-main-image img,
    .mst-achieve-small-image img {
        transition: none;
    }

}



/* =====================================================
   MINERVA CONTACT INFO SECTION
===================================================== */

.mst-contact-info-section {
    position: relative;
    width: 100%;
    padding: 100px 30px 90px;
    background: #f8faff;
    overflow: hidden;
}


/* Container */

.mst-contact-container {
    position: relative;
    z-index: 5;

    width: 100%;
    max-width: 1450px;
    margin: 0 auto;
}


/* =====================================================
   TOP SECTION
===================================================== */

.mst-contact-top {
    display: grid;
    grid-template-columns: 0.9fr 1.1fr;
    align-items: center;

    gap: 80px;

    margin-bottom: 60px;
}


/* =====================================================
   LEFT CONTENT
===================================================== */

.mst-contact-content {
    position: relative;
    z-index: 3;
}


/* Small Title */

.mst-contact-subtitle {
    display: flex;
    align-items: center;

    gap: 13px;

    margin-bottom: 25px;

    color: #2b4573;

    font-size: 14px;
    font-weight: 700;

    letter-spacing: 0.8px;

    text-transform: uppercase;
}


.mst-contact-subtitle-line {
    display: block;

    width: 40px;
    height: 2px;

    background: #2b4573;
}


/* =====================================================
   MAIN TITLE
===================================================== */

.mst-contact-title {
    max-width: 600px;

    margin: 0 0 25px;

    color: #2b4573;

    font-size: 52px;
    line-height: 1.12;

    font-weight: 700;

    letter-spacing: -1.5px;
}


.mst-contact-title span {
    display: block;

    color: #2b4573;
}


/* =====================================================
   DESCRIPTION
===================================================== */

.mst-contact-description {
    max-width: 610px;

    margin: 0;

    color: #7e8085;

    font-size: 16px;
    line-height: 1.8;
}


/* =====================================================
   WORLD MAP
===================================================== */

.mst-contact-map {
    position: relative;

    min-height: 320px;

    display: flex;
    align-items: center;
    justify-content: center;
}


/*
    CSS-generated world map effect.

    If you already have a world-map PNG/SVG,
    replace the background-image below.
*/

.mst-world-map {
    position: relative;

    width: 100%;
    max-width: 650px;
    height: 310px;

    opacity: 0.75;

    background-image:
        radial-gradient(
            circle,
            rgba(43, 69, 115, 0.28) 2px,
            transparent 2.5px
        );

    background-size: 14px 14px;

    -webkit-mask-image:
        radial-gradient(
            ellipse at center,
            #000 20%,
            transparent 75%
        );

    mask-image:
        radial-gradient(
            ellipse at center,
            #000 20%,
            transparent 75%
        );
}


/* Decorative map lines */

.mst-world-map::before,
.mst-world-map::after {
    content: "";

    position: absolute;

    border: 1px solid rgba(43, 69, 115, 0.12);

    border-radius: 50%;
}


.mst-world-map::before {
    width: 450px;
    height: 180px;

    left: 80px;
    top: 65px;

    transform: rotate(-10deg);
}


.mst-world-map::after {
    width: 350px;
    height: 130px;

    right: 30px;
    bottom: 40px;

    transform: rotate(12deg);
}


/* Map Pins */

.mst-map-pin {
    position: absolute;
    z-index: 5;

    color: #2b4573;

    font-size: 18px;

    animation: mstMapPin 2s ease-in-out infinite;
}


.pin-one {
    left: 25%;
    top: 40%;
}


.pin-two {
    left: 52%;
    top: 35%;

    animation-delay: 0.5s;
}


.pin-three {
    right: 20%;
    bottom: 35%;

    animation-delay: 1s;
}


@keyframes mstMapPin {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-6px);
    }
}


/* =====================================================
   CONTACT CARDS
===================================================== */

.mst-contact-cards {
    position: relative;
    z-index: 10;

    display: grid;
    grid-template-columns: repeat(3, 1fr);

    gap: 25px;
}


/* Card */

.mst-contact-card {
    position: relative;

    min-height: 155px;

    display: flex;
    align-items: center;

    gap: 22px;

    padding: 28px;

    background: #ffffff;

    border: 1px solid rgba(43, 69, 115, 0.08);
    border-radius: 16px;

    box-shadow:
        0 12px 35px
        rgba(43, 69, 115, 0.08);

    overflow: hidden;

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease;
}


/* Left accent */

.mst-contact-card::before {
    content: "";

    position: absolute;

    top: 0;
    left: 0;

    width: 4px;
    height: 100%;

    background: #2b4573;

    transition: width 0.35s ease;
}


/* Hover */

.mst-contact-card:hover {
    transform: translateY(-8px);

    border-color:
        rgba(43, 69, 115, 0.18);

    box-shadow:
        0 20px 45px
        rgba(43, 69, 115, 0.14);
}


.mst-contact-card:hover::before {
    width: 7px;
}


/* =====================================================
   CARD ICON
===================================================== */

.mst-contact-card-icon {
    flex: 0 0 70px;

    width: 70px;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #2b4573;

    color: #ffffff;

    border-radius: 50%;

    font-size: 24px;

    box-shadow:
        0 8px 20px
        rgba(43, 69, 115, 0.22);

    transition:
        transform 0.4s ease,
        background 0.35s ease;
}


.mst-contact-card:hover
.mst-contact-card-icon {
    transform: rotateY(360deg);

    background: #1d345d;
}


/* =====================================================
   CARD CONTENT
===================================================== */

.mst-contact-card-content {
    min-width: 0;
}


.mst-card-label {
    display: block;

    margin-bottom: 5px;

    color: #8a94a4;

    font-size: 11px;
    font-weight: 600;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.mst-contact-card-content h3 {
    margin: 0 0 8px;

    color: #151922;

    font-size: 19px;
    line-height: 1.3;

    font-weight: 700;
}


.mst-contact-card-content p,
.mst-contact-card-content a {
    margin: 0;

    color: #5c6470;

    font-size: 14px;
    line-height: 1.7;

    text-decoration: none;

    transition: color 0.3s ease;
}


.mst-contact-card-content a:hover {
    color: #2b4573;
}


/* =====================================================
   BACKGROUND DECORATIONS
===================================================== */

.mst-contact-glow {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;

    filter: blur(5px);
}


.mst-contact-glow-one {
    width: 500px;
    height: 500px;

    top: -300px;
    left: -200px;

    background:
        rgba(43, 69, 115, 0.06);
}


.mst-contact-glow-two {
    width: 450px;
    height: 450px;

    right: -200px;
    bottom: -300px;

    background:
        rgba(43, 69, 115, 0.07);
}


/* =====================================================
   SCROLL REVEAL ANIMATION
===================================================== */

.mst-contact-reveal {
    opacity: 0;

    transform: translateY(35px);

    transition:
        opacity 0.8s ease,
        transform 0.8s
        cubic-bezier(0.22, 1, 0.36, 1);
}


.mst-contact-reveal.mst-contact-visible {
    opacity: 1;

    transform: translateY(0);
}


/* Stagger cards */

.mst-contact-card:nth-child(1) {
    transition-delay: 0.05s;
}

.mst-contact-card:nth-child(2) {
    transition-delay: 0.15s;
}

.mst-contact-card:nth-child(3) {
    transition-delay: 0.25s;
}


/* =====================================================
   EXTRA LARGE DESKTOP
   1600px+
===================================================== */

@media (min-width: 1600px) {

    .mst-contact-info-section {
        padding: 110px 40px 100px;
    }

    .mst-contact-container {
        max-width: 1500px;
    }

    .mst-contact-title {
        font-size: 56px;
    }

    .mst-contact-top {
        gap: 100px;
    }

}


/* =====================================================
   LAPTOP
   1200px - 1599px
===================================================== */

@media
(min-width: 1200px)
and
(max-width: 1599px) {

    .mst-contact-info-section {
        padding: 90px 35px 85px;
    }

    .mst-contact-container {
        max-width: 1250px;
    }

    .mst-contact-top {
        gap: 60px;

        margin-bottom: 55px;
    }

    .mst-contact-title {
        font-size: 48px;
    }

    .mst-contact-map {
        min-height: 290px;
    }

    .mst-world-map {
        height: 280px;
    }

}


/* =====================================================
   SMALL LAPTOP
   992px - 1199px
===================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

    .mst-contact-info-section {
        padding: 80px 30px;
    }

    .mst-contact-top {
        grid-template-columns: 1fr 0.85fr;

        gap: 40px;

        margin-bottom: 50px;
    }

    .mst-contact-title {
        font-size: 42px;
    }

    .mst-contact-description {
        font-size: 15px;
    }

    .mst-contact-map {
        min-height: 250px;
    }

    .mst-world-map {
        height: 250px;
    }

    .mst-contact-cards {
        gap: 18px;
    }

    .mst-contact-card {
        min-height: 140px;

        gap: 16px;

        padding: 22px 18px;
    }

    .mst-contact-card-icon {
        flex-basis: 60px;

        width: 60px;
        height: 60px;

        font-size: 21px;
    }

    .mst-contact-card-content h3 {
        font-size: 17px;
    }

    .mst-contact-card-content p,
    .mst-contact-card-content a {
        font-size: 13px;
    }

}


/* =====================================================
   TABLET
   768px - 991px
===================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

    .mst-contact-info-section {
        padding: 70px 30px;
    }

    .mst-contact-top {
        grid-template-columns: 1fr 0.8fr;

        gap: 30px;

        margin-bottom: 45px;
    }

    .mst-contact-subtitle {
        margin-bottom: 20px;

        font-size: 13px;
    }

    .mst-contact-title {
        font-size: 37px;
    }

    .mst-contact-description {
        font-size: 14px;

        line-height: 1.7;
    }

    .mst-contact-map {
        min-height: 230px;
    }

    .mst-world-map {
        height: 230px;
    }


    /* Cards: 2 + centered last card */

    .mst-contact-cards {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;

        gap: 20px;
    }

    .mst-contact-card {
        flex: 0 0 calc(50% - 10px);

        max-width: calc(50% - 10px);

        min-height: 135px;
    }

}


/* =====================================================
   LARGE MOBILE
   576px - 767px
===================================================== */

@media
(min-width: 576px)
and
(max-width: 767px) {

    .mst-contact-info-section {
        padding: 60px 22px;
    }


    /* Stack heading + map */

    .mst-contact-top {
        grid-template-columns: 1fr;

        gap: 25px;

        margin-bottom: 40px;
    }

    .mst-contact-content {
        text-align: center;
    }

    .mst-contact-subtitle {
        justify-content: center;

        margin-bottom: 20px;
    }

    .mst-contact-title {
        max-width: 500px;

        margin:
            0 auto 20px;

        font-size: 38px;
    }

    .mst-contact-description {
        max-width: 520px;

        margin: 0 auto;

        font-size: 14px;
    }


    /* Map */

    .mst-contact-map {
        min-height: 200px;
    }

    .mst-world-map {
        max-width: 500px;

        height: 200px;
    }


    /* Cards */

    .mst-contact-cards {
        grid-template-columns: 1fr;

        max-width: 500px;

        margin: 0 auto;

        gap: 15px;
    }

    .mst-contact-card {
        min-height: 125px;

        padding: 22px;
    }

}


/* =====================================================
   MEDIUM MOBILE
   381px - 575px
===================================================== */

@media
(min-width: 381px)
and
(max-width: 575px) {

    .mst-contact-info-section {
        padding: 55px 16px;
    }

    .mst-contact-top {
        display: block;

        margin-bottom: 35px;
    }

    .mst-contact-content {
        text-align: center;
    }

    .mst-contact-subtitle {
        justify-content: center;

        gap: 10px;

        margin-bottom: 18px;

        font-size: 12px;
    }

    .mst-contact-subtitle-line {
        width: 28px;
    }

    .mst-contact-title {
        margin-bottom: 18px;

        font-size: 31px;

        line-height: 1.18;

        letter-spacing: -0.8px;
    }

    .mst-contact-description {
        font-size: 13px;

        line-height: 1.7;
    }


    /* Hide large decorative map on mobile */

    .mst-contact-map {
        min-height: 160px;

        margin-top: 25px;
    }

    .mst-world-map {
        height: 160px;
    }


    /* Cards */

    .mst-contact-cards {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .mst-contact-card {
        min-height: 115px;

        gap: 17px;

        padding: 20px;

        border-radius: 14px;
    }

    .mst-contact-card-icon {
        flex: 0 0 58px;

        width: 58px;
        height: 58px;

        font-size: 20px;
    }

    .mst-contact-card-content h3 {
        margin-bottom: 5px;

        font-size: 17px;
    }

    .mst-contact-card-content p,
    .mst-contact-card-content a {
        font-size: 13px;

        line-height: 1.6;
    }

}


/* =====================================================
   SMALL MOBILE
   380px AND BELOW
===================================================== */

@media (max-width: 380px) {

    .mst-contact-info-section {
        padding: 50px 14px;
    }

    .mst-contact-top {
        display: block;

        margin-bottom: 30px;
    }

    .mst-contact-content {
        text-align: center;
    }

    .mst-contact-subtitle {
        justify-content: center;

        gap: 8px;

        margin-bottom: 16px;

        font-size: 11px;
    }

    .mst-contact-subtitle-line {
        width: 25px;
    }

    .mst-contact-title {
        margin-bottom: 17px;

        font-size: 27px;

        line-height: 1.2;

        letter-spacing: -0.5px;
    }

    .mst-contact-description {
        font-size: 13px;

        line-height: 1.65;
    }


    /* Map */

    .mst-contact-map {
        min-height: 140px;

        margin-top: 22px;
    }

    .mst-world-map {
        height: 140px;
    }


    /* Contact cards */

    .mst-contact-cards {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .mst-contact-card {
        min-height: 105px;

        gap: 14px;

        padding: 17px;

        border-radius: 12px;
    }

    .mst-contact-card-icon {
        flex: 0 0 52px;

        width: 52px;
        height: 52px;

        font-size: 18px;
    }

    .mst-card-label {
        font-size: 9px;
    }

    .mst-contact-card-content h3 {
        margin-bottom: 4px;

        font-size: 16px;
    }

    .mst-contact-card-content p,
    .mst-contact-card-content a {
        font-size: 12px;

        line-height: 1.55;

        overflow-wrap: anywhere;
    }

}


/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {

    .mst-contact-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }

    .mst-contact-card,
    .mst-contact-card-icon {
        transition: none;
    }

    .mst-map-pin {
        animation: none;
    }

}



/* =====================================================
   MINERVA STAR TECHNOLOGY
   CONTACT / ENQUIRY SECTION
===================================================== */

.mst-enquiry-section {
    position: relative;
    width: 100%;

    padding: 100px 25px;

    background: #ffffff;

    overflow: hidden;
}


.mst-enquiry-container {
    position: relative;
    z-index: 5;

    width: 100%;
    max-width: 1050px;

    margin: 0 auto;
}


/* =====================================================
   HEADING
===================================================== */

.mst-enquiry-heading {
    position: relative;

    max-width: 650px;

    margin: 0 auto 45px;

    text-align: center;
}


/* Small Title */

.mst-enquiry-subtitle {
    display: flex;

    align-items: center;
    justify-content: center;

    gap: 14px;

    margin-bottom: 20px;
}


.mst-enquiry-subtitle p {
    margin: 0;

    color: #2b4573;

    font-size: 13px;
    line-height: 1;

    font-weight: 700;

    letter-spacing: 1px;

    text-transform: uppercase;
}


.mst-enquiry-subtitle span {
    display: block;

    width: 42px;
    height: 2px;

    background: #2b4573;
}


/* Heading */

.mst-enquiry-heading h2 {
    margin: 0;

    color: #161b24;

    font-size: 43px;
    line-height: 1.18;

    font-weight: 700;

    letter-spacing: -1px;
}


.mst-enquiry-heading h2 span {
    display: block;

    color: #2b4573;
}


/* Bottom Accent */

.mst-enquiry-heading-line {
    width: 50px;
    height: 3px;

    margin: 22px auto 0;

    background: #2b4573;

    border-radius: 10px;

    transition: width 0.4s ease;
}


.mst-enquiry-heading:hover
.mst-enquiry-heading-line {
    width: 80px;
}


/* =====================================================
   FORM CONTAINER
===================================================== */

.mst-enquiry-form-wrapper {
    position: relative;

    max-width: 900px;

    margin: 0 auto;

    padding: 35px;

    background:
        rgba(255, 255, 255, 0.96);

    border:
        1px solid
        rgba(43, 69, 115, 0.10);

    border-radius: 22px;

    box-shadow:
        0 18px 60px
        rgba(43, 69, 115, 0.08);
}


/* Decorative border */

.mst-enquiry-form-wrapper::before {
    content: "";

    position: absolute;

    top: -1px;
    left: 50%;

    width: 100px;
    height: 3px;

    transform: translateX(-50%);

    background: #2b4573;

    border-radius: 0 0 10px 10px;
}


/* =====================================================
   FORM GRID
===================================================== */

.mst-enquiry-form {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 18px;
}


/* =====================================================
   INPUT FIELD
===================================================== */

.mst-enquiry-field {
    position: relative;

    width: 100%;
}


/* Icon */

.mst-enquiry-input-icon {
    position: absolute;

    z-index: 2;

    top: 50%;
    left: 20px;

    transform: translateY(-50%);

    display: flex;

    align-items: center;
    justify-content: center;

    color: #2b4573;

    font-size: 15px;

    pointer-events: none;

    transition:
        transform 0.3s ease,
        color 0.3s ease;
}


/* Input */

.mst-enquiry-field input {
    width: 100%;
    height: 62px;

    padding:
        0 20px
        0 52px;

    color: #202631;

    background: #ffffff;

    border:
        1px solid
        #dfe5ee;

    border-radius: 12px;

    outline: none;

    font-family: inherit;

    font-size: 14px;

    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        background 0.3s ease;
}


/* Placeholder */

.mst-enquiry-field input::placeholder,
.mst-enquiry-field textarea::placeholder {
    color: #8b94a3;

    opacity: 1;
}


/* =====================================================
   TEXTAREA
===================================================== */

.mst-enquiry-message-field {
    grid-column: 1 / -1;
}


.mst-enquiry-message-field
.mst-enquiry-input-icon {
    top: 23px;

    transform: none;
}


.mst-enquiry-field textarea {
    display: block;

    width: 100%;
    min-height: 180px;

    padding:
        20px 20px
        20px 52px;

    color: #202631;

    background: #ffffff;

    border:
        1px solid
        #dfe5ee;

    border-radius: 12px;

    outline: none;

    resize: vertical;

    font-family: inherit;

    font-size: 14px;

    line-height: 1.7;

    transition:
        border-color 0.3s ease,
        box-shadow 0.3s ease;
}


/* =====================================================
   INPUT FOCUS
===================================================== */

.mst-enquiry-field:focus-within input,
.mst-enquiry-field:focus-within textarea {
    border-color: #2b4573;

    box-shadow:
        0 0 0 4px
        rgba(43, 69, 115, 0.08);
}


.mst-enquiry-field:focus-within
.mst-enquiry-input-icon {
    color: #1b3159;
}


.mst-enquiry-field:not(.mst-enquiry-message-field):focus-within
.mst-enquiry-input-icon {
    transform:
        translateY(-50%)
        scale(1.12);
}


/* =====================================================
   BUTTON
===================================================== */

.mst-enquiry-button-wrapper {
    grid-column: 1 / -1;

    display: flex;

    justify-content: center;

    margin-top: 12px;
}


.mst-enquiry-button {
    position: relative;

    min-width: 210px;
    height: 58px;

    display: inline-flex;

    align-items: center;
    justify-content: space-between;

    gap: 25px;

    padding:
        6px 7px
        6px 27px;

    background: #2b4573;

    color: #ffffff;

    border: none;

    border-radius: 50px;

    cursor: pointer;

    font-family: inherit;

    font-size: 13px;

    font-weight: 700;

    letter-spacing: 0.4px;

    text-transform: uppercase;

    overflow: hidden;

    box-shadow:
        0 10px 25px
        rgba(43, 69, 115, 0.20);

    transition:
        transform 0.35s ease,
        background 0.35s ease,
        box-shadow 0.35s ease;
}


/* Button Icon */

.mst-enquiry-button-icon {
    position: relative;
    z-index: 2;

    flex: 0 0 44px;

    width: 44px;
    height: 44px;

    display: flex;

    align-items: center;
    justify-content: center;

    background: #ffffff;

    color: #2b4573;

    border-radius: 50%;

    font-size: 13px;

    transition:
        transform 0.35s ease,
        color 0.35s ease;
}


/* Button Hover */

.mst-enquiry-button:hover {
    background: #1d345d;

    transform: translateY(-3px);

    box-shadow:
        0 15px 30px
        rgba(43, 69, 115, 0.28);
}


.mst-enquiry-button:hover
.mst-enquiry-button-icon {
    transform: rotate(-35deg);
}


/* =====================================================
   STATUS MESSAGE
===================================================== */

.mst-enquiry-form-status {
    grid-column: 1 / -1;

    display: none;

    margin-top: 5px;

    text-align: center;

    color: #2b4573;

    font-size: 13px;

    font-weight: 600;
}



.mst-enquiry-form-status.success{
    color:#198754;
}

.mst-enquiry-form-status.error{
    color:#dc3545;
}

.mst-enquiry-button:disabled{
    opacity:.7;
    cursor:not-allowed;
}



.mst-enquiry-form-status.active {
    display: block;
}


/* =====================================================
   BACKGROUND DECORATIONS
===================================================== */

.mst-enquiry-shape {
    position: absolute;

    border-radius: 50%;

    pointer-events: none;
}


.mst-enquiry-shape-1 {
    width: 500px;
    height: 500px;

    top: -320px;
    right: -200px;

    border:
        1px solid
        rgba(43, 69, 115, 0.07);
}


.mst-enquiry-shape-2 {
    width: 300px;
    height: 300px;

    bottom: -200px;
    left: -100px;

    background:
        rgba(43, 69, 115, 0.025);
}


/* =====================================================
   SCROLL ANIMATION
===================================================== */

.mst-enquiry-reveal {
    opacity: 0;

    transform: translateY(35px);

    transition:
        opacity 0.8s ease,
        transform 0.8s
        cubic-bezier(0.22, 1, 0.36, 1);
}


.mst-enquiry-reveal.mst-enquiry-visible {
    opacity: 1;

    transform: translateY(0);
}


.mst-enquiry-form-wrapper {
    transition-delay: 0.12s;
}

/* =====================================================
   LARGE DESKTOP
   1600px+
===================================================== */

@media (min-width: 1600px) {

    .mst-enquiry-section {
        padding: 115px 30px;
    }

    .mst-enquiry-container {
        max-width: 1100px;
    }

    .mst-enquiry-heading h2 {
        font-size: 46px;
    }

    .mst-enquiry-form-wrapper {
        max-width: 950px;

        padding: 40px;
    }

}


/* =====================================================
   LAPTOP
   1200px - 1599px
===================================================== */

@media
(min-width: 1200px)
and
(max-width: 1599px) {

    .mst-enquiry-section {
        padding: 95px 30px;
    }

    .mst-enquiry-container {
        max-width: 1000px;
    }

    .mst-enquiry-heading h2 {
        font-size: 42px;
    }

    .mst-enquiry-form-wrapper {
        max-width: 880px;
    }

}


/* =====================================================
   SMALL LAPTOP
   992px - 1199px
===================================================== */

@media
(min-width: 992px)
and
(max-width: 1199px) {

    .mst-enquiry-section {
        padding: 85px 30px;
    }

    .mst-enquiry-heading {
        margin-bottom: 40px;
    }

    .mst-enquiry-heading h2 {
        font-size: 39px;
    }

    .mst-enquiry-form-wrapper {
        max-width: 820px;

        padding: 32px;
    }

}


/* =====================================================
   TABLET
   768px - 991px
===================================================== */

@media
(min-width: 768px)
and
(max-width: 991px) {

    .mst-enquiry-section {
        padding: 75px 30px;
    }

    .mst-enquiry-heading {
        max-width: 600px;

        margin-bottom: 38px;
    }

    .mst-enquiry-heading h2 {
        font-size: 37px;
    }

    .mst-enquiry-form-wrapper {
        max-width: 700px;

        padding: 30px;
    }

    .mst-enquiry-form {
        gap: 16px;
    }

    .mst-enquiry-field input {
        height: 60px;
    }

    .mst-enquiry-field textarea {
        min-height: 165px;
    }

}


/* =====================================================
   LARGE MOBILE
   576px - 767px
===================================================== */

@media
(min-width: 576px)
and
(max-width: 767px) {

    .mst-enquiry-section {
        padding: 65px 20px;
    }

    .mst-enquiry-heading {
        margin-bottom: 35px;
    }

    .mst-enquiry-heading h2 {
        font-size: 34px;
    }

    .mst-enquiry-subtitle {
        margin-bottom: 17px;
    }

    .mst-enquiry-form-wrapper {
        max-width: 540px;

        padding: 25px;
    }


    /* 1 field per row */

    .mst-enquiry-form {
        grid-template-columns: 1fr;

        gap: 14px;
    }

    .mst-enquiry-message-field,
    .mst-enquiry-button-wrapper,
    .mst-enquiry-form-status {
        grid-column: auto;
    }

    .mst-enquiry-field input {
        height: 58px;
    }

    .mst-enquiry-field textarea {
        min-height: 155px;
    }

}


/* =====================================================
   MEDIUM MOBILE
   381px - 575px
===================================================== */

@media
(min-width: 381px)
and
(max-width: 575px) {

    .mst-enquiry-section {
        padding: 55px 15px;
    }

    .mst-enquiry-heading {
        margin-bottom: 30px;
    }

    .mst-enquiry-subtitle {
        gap: 9px;

        margin-bottom: 16px;
    }

    .mst-enquiry-subtitle span {
        width: 28px;
    }

    .mst-enquiry-subtitle p {
        font-size: 11px;
    }

    .mst-enquiry-heading h2 {
        font-size: 29px;

        line-height: 1.2;
    }

    .mst-enquiry-heading-line {
        width: 40px;

        margin-top: 18px;
    }


    /* Form */

    .mst-enquiry-form-wrapper {
        padding: 20px;

        border-radius: 16px;
    }

    .mst-enquiry-form {
        grid-template-columns: 1fr;

        gap: 13px;
    }

    .mst-enquiry-message-field,
    .mst-enquiry-button-wrapper,
    .mst-enquiry-form-status {
        grid-column: auto;
    }


    /* Inputs */

    .mst-enquiry-field input {
        height: 56px;

        padding:
            0 15px
            0 46px;

        font-size: 13px;
    }

    .mst-enquiry-input-icon {
        left: 17px;

        font-size: 14px;
    }

    .mst-enquiry-field textarea {
        min-height: 145px;

        padding:
            18px 15px
            18px 46px;

        font-size: 13px;
    }


    /* Button */

    .mst-enquiry-button-wrapper {
        margin-top: 8px;
    }

    .mst-enquiry-button {
        min-width: 200px;

        height: 55px;

        padding-left: 24px;

        font-size: 12px;
    }

    .mst-enquiry-button-icon {
        flex-basis: 41px;

        width: 41px;
        height: 41px;
    }

}


/* =====================================================
   SMALL MOBILE
   380px AND BELOW
===================================================== */

@media (max-width: 380px) {

    .mst-enquiry-section {
        padding: 50px 12px;
    }

    .mst-enquiry-heading {
        margin-bottom: 28px;
    }

    .mst-enquiry-subtitle {
        gap: 8px;

        margin-bottom: 14px;
    }

    .mst-enquiry-subtitle span {
        width: 24px;
    }

    .mst-enquiry-subtitle p {
        font-size: 10px;
    }

    .mst-enquiry-heading h2 {
        font-size: 26px;

        line-height: 1.2;

        letter-spacing: -0.5px;
    }

    .mst-enquiry-heading-line {
        width: 35px;

        margin-top: 16px;
    }


    /* Form Container */

    .mst-enquiry-form-wrapper {
        padding: 16px;

        border-radius: 14px;
    }

    .mst-enquiry-form {
        grid-template-columns: 1fr;

        gap: 12px;
    }

    .mst-enquiry-message-field,
    .mst-enquiry-button-wrapper,
    .mst-enquiry-form-status {
        grid-column: auto;
    }


    /* Inputs */

    .mst-enquiry-field input {
        height: 54px;

        padding:
            0 12px
            0 43px;

        border-radius: 10px;

        font-size: 12px;
    }

    .mst-enquiry-input-icon {
        left: 15px;

        font-size: 13px;
    }

    .mst-enquiry-field textarea {
        min-height: 135px;

        padding:
            17px 12px
            17px 43px;

        border-radius: 10px;

        font-size: 12px;
    }

    .mst-enquiry-message-field
    .mst-enquiry-input-icon {
        top: 20px;
    }


    /* Button */

    .mst-enquiry-button-wrapper {
        margin-top: 7px;
    }

    .mst-enquiry-button {
        width: 100%;
        max-width: 220px;

        height: 54px;

        padding:
            5px 6px
            5px 23px;

        font-size: 11px;
    }

    .mst-enquiry-button-icon {
        flex: 0 0 40px;

        width: 40px;
        height: 40px;
    }

}


/* =====================================================
   ACCESSIBILITY
===================================================== */

@media (prefers-reduced-motion: reduce) {

    .mst-enquiry-reveal {
        opacity: 1;

        transform: none;

        transition: none;
    }

    .mst-enquiry-button,
    .mst-enquiry-button-icon,
    .mst-enquiry-field input,
    .mst-enquiry-field textarea {
        transition: none;
    }

}



/*=========================================================
    MINERVA STAR TECHNOLOGY - FAQ SECTION
    Theme Colors : #2b4573, #c4272c
=========================================================*/

.mst-faq-section{
    position: relative;
    padding:120px 0;
    background:#f7f9fc;
    overflow:hidden;
}

.mst-faq-section::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    border-radius:50%;
    background:rgba(43,69,115,.05);
    top:-180px;
    right:-120px;
}

.mst-faq-section::after{
    content:"";
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(196,39,44,.05);
    bottom:-120px;
    left:-120px;
}

.mst-faq-section .container{
    position:relative;
    z-index:2;
}

/*======================================
Heading
======================================*/

.mst-faq-heading{
    max-width:760px;
    margin:0 auto 70px;
    text-align:center;
}

.mst-faq-subtitle{
    display:inline-block;
    padding:10px 24px;
    border-radius:50px;
    background:rgba(196,39,44,.09);
    color:#c4272c;
    font-size:14px;
    font-weight:700;
    letter-spacing:1px;
    text-transform:uppercase;
    margin-bottom:20px;
}

.mst-faq-heading h2{
    font-size:46px;
    line-height:1.2;
    font-weight:700;
    color:#1c2430;
    margin-bottom:22px;
}

.mst-faq-heading p{
    font-size:17px;
    line-height:30px;
    color:#6d7480;
    margin:0;
}

/*======================================
Wrapper
======================================*/

.mst-faq-wrapper{
    max-width:950px;
    margin:auto;
}

/*======================================
FAQ Card
======================================*/

.mst-faq-item{
    position:relative;
    margin-bottom:22px;
    border-radius:18px;
    background:rgba(255,255,255,.85);
    backdrop-filter:blur(12px);
    border:1px solid rgba(43,69,115,.08);
    box-shadow:0 12px 35px rgba(20,35,60,.06);
    transition:.4s;
    overflow:hidden;
}

.mst-faq-item:last-child{
    margin-bottom:0;
}

.mst-faq-item::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:5px;
    height:0%;
    background:#2b4573;
    transition:.45s;
}

/* Alternate accents bring both Minerva primary colours into the FAQ list. */
.mst-faq-item:nth-child(even)::before{
    background:#c4272c;
}

/*======================================
Question
======================================*/

.mst-faq-question{
    width:100%;
    border:none;
    outline:none;
    background:transparent;
    cursor:pointer;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:28px 35px;
}

.mst-faq-left{
    display:flex;
    align-items:center;
    gap:25px;
}

.mst-faq-number{
    min-width:62px;
    width:62px;
    height:62px;
    border-radius:50%;
    background:#2b4573;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:20px;
    transition:.4s;
}

.mst-faq-left h4{
    font-size:22px;
    font-weight:600;
    color:#1d2430;
    line-height:1.45;
    margin:0;
    text-align:left;
}

/*======================================
Plus Icon
======================================*/

.mst-faq-icon{
    width:52px;
    height:52px;
    border-radius:50%;
    background:#edf2f8;
    color:#2b4573;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:30px;
    font-weight:300;
    flex-shrink:0;
    transition:.4s;
}

/*======================================
Answer
======================================*/

.mst-faq-answer{
    max-height:0;
    overflow:hidden;
    transition:max-height .45s ease;
}

.mst-faq-answer p{
    margin:0;
    padding:0 35px 32px 122px;
    color:#6c7380;
    font-size:16px;
    line-height:30px;
}

/*======================================
Bottom CTA
======================================*/

.mst-faq-bottom{
    margin-top:70px;
    text-align:center;
    padding:60px;
    border-radius:25px;
    background:#2b4573;
    color:#fff;
    box-shadow:0 20px 50px rgba(43,69,115,.20);
}

.mst-faq-bottom h3{
    font-size:34px;
    margin-bottom:15px;
    color:#fff;
}

.mst-faq-bottom p{
    max-width:650px;
    margin:0 auto 35px;
    line-height:30px;
    font-size:17px;
    color:rgba(255,255,255,.85);
}

.mst-faq-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:18px 42px;
    background:#fff;
    color:#2b4573;
    font-weight:700;
    text-decoration:none;
    border-radius:60px;
    transition:.4s;
    border:2px solid transparent;
}

.mst-faq-btn:hover{
    background:transparent;
    color:#fff;
    border-color:#fff;
}

/*======================================
Transitions
======================================*/

.mst-faq-item,
.mst-faq-number,
.mst-faq-icon,
.mst-faq-btn{
    transition:all .4s ease;
}


/*=========================================================
    MINERVA STAR TECHNOLOGY FAQ
    CSS PART 2
=========================================================*/

/*======================================
Hover Effects
======================================*/

.mst-faq-item:hover{
    transform:translateY(-8px);
    box-shadow:0 22px 60px rgba(43,69,115,.15);
    border-color:rgba(43,69,115,.18);
}

.mst-faq-item:hover::before{
    height:100%;
}

.mst-faq-item:hover .mst-faq-number{
    transform:scale(1.08);
    box-shadow:0 10px 25px rgba(43,69,115,.30);
}

.mst-faq-item:hover .mst-faq-icon{
    background:#2b4573;
    color:#fff;
    transform:rotate(90deg);
}

.mst-faq-item:hover h4{
    color:#2b4573;
}

.mst-faq-item:nth-child(even):hover{
    border-color:rgba(196,39,44,.25);
    box-shadow:0 22px 60px rgba(196,39,44,.14);
}

.mst-faq-item:nth-child(even):hover .mst-faq-number,
.mst-faq-item:nth-child(even):hover .mst-faq-icon{
    background:#c4272c;
    box-shadow:0 10px 25px rgba(196,39,44,.28);
}

.mst-faq-item:nth-child(even):hover h4{
    color:#c4272c;
}

/*======================================
Active Accordion
======================================*/

.mst-faq-item.active{
    border-color:#2b4573;
    box-shadow:0 25px 65px rgba(43,69,115,.18);
}

.mst-faq-item.active::before{
    height:100%;
}

.mst-faq-item.active .mst-faq-icon{
    background:#2b4573;
    color:#fff;
    transform:rotate(45deg);
}

.mst-faq-item.active .mst-faq-number{
    transform:scale(1.08);
}

.mst-faq-item.active .mst-faq-answer{
    max-height:500px;
}

.mst-faq-item:nth-child(even).active{
    border-color:#c4272c;
    box-shadow:0 25px 65px rgba(196,39,44,.17);
}

.mst-faq-item:nth-child(even).active .mst-faq-number,
.mst-faq-item:nth-child(even).active .mst-faq-icon{
    background:#c4272c;
}

/*======================================
Reveal Animation
======================================*/

.mst-faq-item{
    opacity:0;
    transform:translateY(60px);
}

.mst-faq-item.show{
    opacity:1;
    transform:translateY(0);
    transition:
    opacity .8s ease,
    transform .8s ease;
}

.mst-faq-heading{
    opacity:0;
    transform:translateY(40px);
}

.mst-faq-heading.show{
    opacity:1;
    transform:translateY(0);
    transition:.8s ease;
}

.mst-faq-bottom{
    opacity:0;
    transform:translateY(40px);
}

.mst-faq-bottom.show{
    opacity:1;
    transform:translateY(0);
    transition:.8s ease;
}

/*======================================
Floating Animation
======================================*/

@keyframes mstFloat{

0%{
transform:translateY(0px);
}

50%{
transform:translateY(-10px);
}

100%{
transform:translateY(0px);
}

}

.mst-faq-subtitle{
    animation:mstFloat 5s ease-in-out infinite;
}

/*======================================
Button Shine
======================================*/

.mst-faq-btn{
    position:relative;
    overflow:hidden;
}

.mst-faq-btn::before{

content:"";

position:absolute;

top:0;

left:-120%;

width:80%;

height:100%;

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

transition:.8s;

}

.mst-faq-btn:hover::before{

left:120%;

}

/*======================================
Smooth
======================================*/

.mst-faq-question{

transition:.35s;

}

.mst-faq-question:focus{

outline:none;

}

.mst-faq-answer{

transition:max-height .45s ease;

}

/*=========================================================
Responsive
=========================================================*/

/*-------------------------
Large Desktop
--------------------------*/

@media(max-width:1600px){

.mst-faq-heading h2{

font-size:42px;

}

}

/*-------------------------
Laptop
--------------------------*/

@media(max-width:1399px){

.mst-faq-section{

padding:40px 0;

}

.mst-faq-heading h2{

font-size:40px;

}

.mst-faq-left h4{

font-size:20px;

}

}

/*-------------------------
Small Laptop
--------------------------*/

@media(max-width:1199px){

.mst-faq-question{

padding:25px;

}

.mst-faq-left{

gap:18px;

}

.mst-faq-answer p{

padding:0 25px 25px 105px;

}

.mst-faq-bottom{

padding:50px;

}

}

/*-------------------------
Tablet
--------------------------*/

@media(max-width:991px){

.mst-faq-heading{

margin-bottom:50px;

}

.mst-faq-heading h2{

font-size:34px;

}

.mst-faq-left{

align-items:flex-start;

}

.mst-faq-left h4{

font-size:18px;

}

.mst-faq-number{

width:55px;
height:55px;
min-width:55px;
font-size:18px;

}

.mst-faq-icon{

width:45px;
height:45px;
font-size:24px;

}

.mst-faq-answer p{

padding:0 25px 25px 95px;

font-size:15px;

line-height:28px;

}

.mst-faq-bottom{

padding:45px 30px;

}

}

/*-------------------------
Large Mobile
--------------------------*/

@media(max-width:767px){

.mst-faq-section{

padding:80px 0;

}

.mst-faq-heading h2{

font-size:30px;

}

.mst-faq-heading p{

font-size:15px;

line-height:28px;

}

.mst-faq-question{

padding:22px;

}

.mst-faq-left{

gap:15px;

}

.mst-faq-left h4{

font-size:17px;

line-height:28px;

}

.mst-faq-answer p{

padding:0 22px 22px 92px;

}

.mst-faq-bottom h3{

font-size:28px;

}

}

/*-------------------------
Mobile
--------------------------*/

@media(max-width:575px){

.mst-faq-left{

flex-direction:column;
align-items:flex-start;
gap:15px;

}

.mst-faq-question{

align-items:flex-start;

}

.mst-faq-answer p{

padding:0 22px 22px 22px;

}

.mst-faq-icon{

margin-left:15px;

}

.mst-faq-bottom{

padding:35px 20px;

}

.mst-faq-bottom h3{

font-size:24px;

}

}

/*-------------------------
Small Mobile
--------------------------*/

@media(max-width:420px){

.mst-faq-heading h2{

font-size:26px;

}

.mst-faq-left h4{

font-size:16px;

line-height:26px;

}

.mst-faq-number{

width:50px;
height:50px;
min-width:50px;

font-size:16px;

}

.mst-faq-icon{

width:40px;
height:40px;
font-size:20px;

}

.mst-faq-btn{

padding:16px 30px;

font-size:15px;

}

}


/*=========================================================
    MINERVA STAR TECHNOLOGY
    TECHNOLOGY PARTNERS
    CSS PART 2
=========================================================*/

.mst-partners-section{
    position:relative;
    padding:120px 0;
    background:#f7f9fc;
    overflow:hidden;
}

.mst-partners-section::before{
    content:"";
    position:absolute;
    width:420px;
    height:420px;
    background:rgba(43,69,115,.05);
    border-radius:50%;
    top:-180px;
    left:-140px;
}

.mst-partners-section::after{
    content:"";
    position:absolute;
    width:350px;
    height:350px;
    background:rgba(43,69,115,.04);
    border-radius:50%;
    bottom:-150px;
    right:-120px;
}

.mst-partners-section .container{
    position:relative;
    z-index:5;
}

/*=========================================
Heading
=========================================*/

.mst-partners-heading{
    max-width:780px;
    margin:0 auto 70px;
    text-align:center;
}

.mst-subtitle{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:10px 24px;

    border-radius:50px;

    background:#edf2f9;

    color:#2b4573;

    font-size:14px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:1px;

    margin-bottom:22px;

}

.mst-partners-heading h2{

    font-size:48px;

    color:#1d2430;

    font-weight:700;

    margin-bottom:20px;

    line-height:1.2;

}

.mst-partners-heading p{

    color:#7e8285;

    font-size:17px;

    line-height:31px;

    margin:0;

}

/*=========================================
Slider
=========================================*/

.mst-partners-slider{

    position:relative;

    overflow:hidden;

    width:100%;

    /* margin-top:20px; */

    padding: 18px 0;

}

/* Left Fade */

.mst-partners-slider::before{

content:"";

position:absolute;

left:0;

top:0;

width:180px;

height:100%;

background:linear-gradient(to right,#f7f9fc 10%,transparent);

z-index:10;

pointer-events:none;

}

/* Right Fade */

.mst-partners-slider::after{

content:"";

position:absolute;

right:0;

top:0;

width:180px;

height:100%;

background:linear-gradient(to left,#f7f9fc 10%,transparent);

z-index:10;

pointer-events:none;

}

/*=========================================
Track
=========================================*/

.mst-partners-track{

display:flex;

align-items:stretch;

gap:28px;

width:max-content;

}

/*=========================================
Partner Card
=========================================*/

.mst-partner-card{

width:240px;
min-width:240px;

height:140px;

background:#fff;

border-radius:18px;

padding: 25px;

text-align:center;

border:1px solid rgba(43,69,115,.08);

 box-shadow:0 15px 35px rgba(0,0,0,.05);

transition:.4s;

display:flex;

/* flex-direction:column; */

align-items:center;


justify-content:center;

}

/*=========================================
Logo
=========================================*/

.mst-logo{

height:80px;

display:flex;

align-items:center;

justify-content:center;

margin-bottom:25px;

}

.mst-logo img{

/* max-width:160px; */

/* max-height:70px; */

width:250px;

height:150px;

object-fit:contain;

filter:grayscale(100%);

opacity:.75;

transition:.45s;

}

/*=========================================
Title
=========================================*/

.mst-partner-card h5{

font-size:20px;

font-weight:700;

color:#1f2937;

margin-bottom:10px;

}

/*=========================================
Category
=========================================*/

.mst-partner-card span{

display:block;

font-size:15px;

font-weight:500;

color:#6b7280;

line-height:24px;

}

/*=========================================
Hover
=========================================*/

.mst-partner-card:hover{

transform:translateY(-8px);

box-shadow:0 25px 60px rgba(43,69,115,.15);

border-color:#2b4573;

}

.mst-partner-card:hover img{

filter:grayscale(0);

opacity:1;

transform:scale(1.05);

}

.mst-partner-card:hover h5{

color:#2b4573;

}

.mst-partner-card:hover span{

color:#4b5563;

}

/*=========================================
Transition
=========================================*/

.mst-partner-card,
.mst-logo img,
.mst-partner-card h5,
.mst-partner-card span{

transition:all .4s ease;

}

/*=========================================================
    MINERVA STAR TECHNOLOGY
    TECHNOLOGY PARTNERS
    CSS PART 3A
    Animation
=========================================================*/

/*=========================================
Infinite Auto Scroll
=========================================*/

.mst-partners-track{

    animation:mstPartnerScroll 80s linear infinite;

    will-change:transform;

}

.mst-partners-slider:hover .mst-partners-track{

    animation-play-state:paused;

}

/*=========================================
Continuous Marquee
=========================================*/

@keyframes mstPartnerScroll{

    0%{

        transform:translateX(0);

    }

    100%{

        transform:translateX(-50%);

    }

}

/*=========================================
Heading Reveal
=========================================*/

.mst-partners-heading{

    opacity:0;

    transform:translateY(40px);

}

.mst-partners-heading.show{

    opacity:1;

    transform:translateY(0);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

/*=========================================
Partner Reveal
=========================================*/

.mst-partner-card{

    opacity:0;

    transform:translateY(60px);

}

.mst-partner-card.show{

    opacity:1;

    transform:translateY(0);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

/*=========================================
Floating Logo
=========================================*/

.mst-logo{

    animation:mstLogoFloat 4s ease-in-out infinite;

}

.mst-partner-card:nth-child(even) .mst-logo{

    animation-delay:.4s;

}

.mst-partner-card:nth-child(3n) .mst-logo{

    animation-delay:.8s;

}

@keyframes mstLogoFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-8px);

    }

    100%{

        transform:translateY(0);

    }

}

/*=========================================
Subtitle Float
=========================================*/

.mst-subtitle{

    animation:mstBadgeFloat 5s ease-in-out infinite;

}

@keyframes mstBadgeFloat{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-6px);

    }

    100%{

        transform:translateY(0);

    }

}

/*=========================================
Card Shine Effect
=========================================*/

.mst-partner-card{

    position:relative;

    overflow:hidden;

}

.mst-partner-card::after{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:70%;

    height:100%;

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

    transform:skewX(-25deg);

    transition:.9s;

}

.mst-partner-card:hover::after{

    left:140%;

}

/*=========================================
Logo Zoom
=========================================*/

.mst-partner-card:hover .mst-logo img{

    transform:scale(1.08);
    

}

/*=========================================
Card Hover Lift
=========================================*/

.mst-partner-card:hover{

    transform:translateY(-12px);

}

/*=========================================
Smooth Animation
=========================================*/

.mst-partner-card,
.mst-logo,
.mst-logo img,
.mst-partners-heading,
.mst-subtitle{

    transition:all .4s ease;

}

/*=========================================
Reduced Motion
=========================================*/

@media (prefers-reduced-motion: reduce){

    .mst-partners-track,
    .mst-logo,
    .mst-subtitle{

        animation:none;

    }

    .mst-partner-card,
    .mst-partners-heading{

        transition:none;

    }

}

/*=========================================================
    MINERVA STAR TECHNOLOGY
    TECHNOLOGY PARTNERS
    CSS PART 3B
    Responsive Media Queries
=========================================================*/


/*=========================================
Large Desktop
=========================================*/

@media (max-width:1600px){

    .mst-partners-section{
        padding:50px 0;
    }

    .mst-partners-heading h2{
        font-size:44px;
    }

}


/*=========================================
Desktop
=========================================*/

@media (max-width:1400px){

    .mst-partner-card{

        width:230px;
        min-width:230px;

        padding:32px 22px;

    }

    .mst-logo img{

        max-width:145px;

    }

}


/*=========================================
Laptop
=========================================*/

@media (max-width:1200px){

    .mst-partners-section{

        padding:100px 0;

    }

    .mst-partners-heading{

        margin-bottom:60px;

    }

    .mst-partners-heading h2{

        font-size:40px;

    }

    .mst-partners-heading p{

        font-size:16px;

        line-height:30px;

    }

    .mst-partner-card{

        width:210px;
        min-width:210px;

        padding:30px 20px;

    }

    .mst-logo{

        height:70px;

    }

    .mst-logo img{

        max-width:135px;
        max-height:60px;

    }

}


/*=========================================
Small Laptop
=========================================*/

@media (max-width:992px){

    .mst-partners-section{

        padding:90px 0;

    }

    .mst-partners-heading{

        margin-bottom:50px;

    }

    .mst-partners-heading h2{

        font-size:34px;

    }

    .mst-partners-track{

        gap:22px;

    }

    .mst-partner-card{

        width:190px;
        min-width:190px;

        padding:28px 18px;

    }

    .mst-logo img{

        max-width:120px;

    }

    .mst-partner-card h5{

        font-size:18px;

    }

    .mst-partner-card span{

        font-size:14px;

    }

}


/*=========================================
Tablet
=========================================*/

@media (max-width:768px){

    .mst-partners-section{

        padding:80px 0;

    }

    .mst-subtitle{

        font-size:13px;

        padding:8px 18px;

    }

    .mst-partners-heading{

        margin-bottom:45px;

    }

    .mst-partners-heading h2{

        font-size:30px;

        line-height:1.3;

    }

    .mst-partners-heading p{

        font-size:15px;

        line-height:28px;

        padding:0 10px;

    }

    .mst-partners-track{

        gap:18px;

    }

    .mst-partner-card{

        width:170px;
        min-width:170px;

        padding:24px 18px;

        border-radius:16px;

    }

    .mst-logo{

        height:65px;

        margin-bottom:18px;

    }

    .mst-logo img{

        max-width:110px;

        max-height:55px;

    }

    .mst-partner-card h5{

        font-size:17px;

    }

}


/*=========================================
Large Mobile
=========================================*/

@media (max-width:576px){

    .mst-partners-section{

        padding:70px 0;

    }

    .mst-partners-heading{

        margin-bottom:40px;

    }

    .mst-partners-heading h2{

        font-size:26px;

    }

    .mst-partners-heading p{

        font-size:15px;

    }

    .mst-partners-track{

        gap:15px;

    }

    .mst-partner-card{

        width:155px;
        min-width:155px;

        padding:20px 15px;

    }

    .mst-logo{

        height:55px;

    }

    .mst-logo img{

        max-width:95px;

    }

    .mst-partner-card h5{

        font-size:16px;

        margin-bottom:8px;

    }

    .mst-partner-card span{

        font-size:13px;

        line-height:22px;

    }

}


/*=========================================
Mobile
=========================================*/

@media (max-width:480px){

    .mst-partners-section{

        padding:65px 0;

    }

    .mst-partners-heading h2{

        font-size:24px;

    }

    .mst-subtitle{

        font-size:12px;

    }

    .mst-partner-card{

        width:145px;
        min-width:145px;

        padding:18px 14px;

    }

    .mst-logo img{

        max-width:90px;

    }

}


/*=========================================
Small Mobile
=========================================*/

@media (max-width:380px){

    .mst-partners-section{

        padding:60px 0;

    }

    .mst-partners-heading{

        margin-bottom:35px;

    }

    .mst-partners-heading h2{

        font-size:22px;

    }

    .mst-partners-heading p{

        font-size:14px;

        line-height:26px;

    }

    .mst-partners-track{

        gap:12px;

    }

    .mst-partner-card{

        width:135px;
        min-width:135px;

        padding:16px 12px;

    }

    .mst-logo{

        height:50px;

    }

    .mst-logo img{

        max-width:80px;

    }

    .mst-partner-card h5{

        font-size:15px;

    }

    .mst-partner-card span{

        font-size:12px;

    }

}







.tv-footer-contact{
    display:flex;
    flex-direction:column;
    gap:22px;
}

.footer-contact-item{
    display:flex;
    align-items:flex-start;
    gap:15px;
}

.footer-contact-item i{
    width:42px;
    height:42px;
    min-width:42px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    background:rgba(255,255,255,.08);
    color:#fff;
    font-size:18px;
    transition:.3s;
}

.footer-contact-item:hover i{
    background:#ff3b30;
    transform:translateY(-3px);
}

.footer-contact-item p,
.footer-contact-item a{
    margin:0;
    color:#ffffff;
    font-size:16px;
    line-height:1.7;
    text-decoration:none;
    transition:.3s;
}

.footer-contact-item a:hover{
    color:#ff3b30;
}


/*==================================================
                ROOT VARIABLES
==================================================*/

:root{

    --primary:#1b2d6b;
    --primary-light:#23408f;
    --secondary:#2f63ff;

    --white:#ffffff;

    --text:#bfc7db;

    --heading:#ffffff;

    --border:rgba(255,255,255,.08);

    --card:#0d1737;

    --body:#081126;

    --hover:#12214d;

    --transition:.4s ease;

    --shadow:0 20px 60px rgba(0,0,0,.35);

}

/*==================================================
                SECTION
==================================================*/

.featured-projects{

    position:relative;

    padding:120px 0;

    background:#ffffff;

    overflow:hidden;

}

/* Background Overlay */

.featured-projects::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        180deg,
        #ffffff 0%,
        #f8faff 100%
    );

    opacity: 1;

    /* pointer-events:none; */

}

.featured-projects .container{

    position:relative;

    z-index:2;

}

/*==================================================
                SECTION TITLE
==================================================*/

.section-title{

    text-align:center;

    max-width:760px;

    margin:auto;

    margin-bottom:70px;

}

.sub-title{

    display:inline-flex;

    align-items:center;

    gap:14px;

    color:#2f63ff;;

    text-transform:uppercase;

    font-size:14px;

    font-weight:700;

    letter-spacing:2px;

}

.sub-title span{

    width:45px;

    height:2px;

    background:#2f63ff;

}

.section-title h2{

    color:#1b2d6b;

    font-size:58px;

    font-weight:800;

    margin-top:18px;

    margin-bottom:18px;

    line-height:1.1;

    text-transform:uppercase;

}

.section-title p{

    color:#6b7280;

    font-size:17px;

    line-height:30px;

}

/*==================================================
                FILTER BUTTONS
==================================================*/

.project-filter{

    display:flex;

    justify-content:center;

    align-items:center;

    flex-wrap:wrap;

    gap:15px;

    margin-bottom:70px;

}

.project-filter button{

    display:flex;

    align-items:center;

    gap:10px;

    padding:14px 28px;

    border:1px solid #dbe3f4;

    border-radius:10px;

    background:#ffffff;

    color:#1b2d6b;

    box-shadow:0 8px 20px rgba(0,0,0,.05);

    cursor:pointer;

    font-size:14px;

    font-weight:600;

    transition:var(--transition);

    backdrop-filter:blur(12px);

}

.project-filter button i{

    font-size:15px;

}

.project-filter button:hover{

    background:#1b2d6b;

    color:#fff;

    border-color:var(--primary-light);

    transform:translateY(-4px);

}

.project-filter button.active{

    background:#1b2d6b;

    border-color:#2956e6;

    color:#fff;

    box-shadow:0 12px 30px rgba(41,86,230,.35);

}

/*==================================================
                PROJECT GRID
==================================================*/

.project-grid{

    row-gap:30px;

}

.project-item{

    display:block;

}

/* Bootstrap column spacing improvement */

.project-grid>[class*="col-"]{

    margin-bottom:30px;

}

/*==================================================
            COMMON CARD SETTINGS
==================================================*/

.project-card{

    position:relative;

    background:#ffffff;;

    border:1px solid var(--border);

    border-radius:18px;

    overflow:hidden;

    transition:var(--transition);

    box-shadow:var(--shadow);

    height:100%;

}

.project-card:hover{

    transform:translateY(-10px);

    border-color:#2956e6;

}

/*==================================================
                IMAGE WRAPPER
==================================================*/

.project-image{

    position:relative;

    overflow:hidden;

}

.project-image img{

    width:100%;

    height:250px;

    object-fit:cover;

    display:block;

    transition:.6s;

}

.project-card:hover .project-image img{

    transform:scale(1.08);

}

/*==================================================
            CATEGORY BADGE
==================================================*/

.project-tag{

    position:absolute;

    top:18px;

    left:18px;

    padding:8px 16px;

    border-radius:6px;

    background:#1b2d6b;

    color:#fff;

    font-size:12px;

    font-weight:600;

    letter-spacing:.5px;

    text-transform:uppercase;

    backdrop-filter:blur(10px);

}

/*==================================================
                PROJECT CARD CONTENT
==================================================*/

.project-content{

    padding:25px;

}

.project-content h3{

    color:var(--white);

    font-size:24px;

    font-weight:700;

    line-height:1.4;

    margin-bottom:12px;

    transition:var(--transition);

}

.project-content p{

    color:var(--text);

    font-size:15px;

    line-height:28px;

    margin-bottom:25px;

}

/*==================================================
                PROJECT FOOTER
==================================================*/

.project-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

}

.project-footer span{

    display:flex;

    align-items:center;

    gap:8px;

    color:#9db3ff;

    font-size:14px;

    font-weight:500;

}

.project-footer span i{

    color:#2f63ff;

    font-size:15px;

}

/*==================================================
                ARROW BUTTON
==================================================*/

.project-footer a{

    width:46px;

    height:46px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#f5f8ff;

    border:1px solid #d9e3f7;

    color:#1b2d6b;

    text-decoration:none;

    transition:all .4s ease;

}

.project-footer a:hover{

    background:#2f63ff;

    color:#fff;

    border-color:#2f63ff;

    transform:rotate(-45deg);

}

/*==================================================
            IMAGE OVERLAY
==================================================*/

.project-image::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(6,12,35,.75),
        rgba(6,12,35,.05)
    );

    opacity:0;

    transition:.5s;

    z-index:1;

}

.project-card:hover .project-image::before{

    opacity:1;

}

/*==================================================
            VIEW PROJECT BUTTON
==================================================*/

.project-overlay{

    position:absolute;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%) scale(.8);

    opacity:0;

    z-index:2;

    transition:.45s;

}

.project-card:hover .project-overlay{

    opacity:1;

    transform:translate(-50%,-50%) scale(1);

}

.project-overlay a{

    padding:14px 30px;

    background:#2f63ff;

    color:#fff;

    border-radius:40px;

    text-decoration:none;

    font-weight:600;

    font-size:14px;

    transition:.4s;

}

.project-overlay a:hover{

    background:#fff;

    color:#1b2d6b;

}

/*==================================================
            TOP BLUE BORDER
==================================================*/

.project-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:0;

    height:4px;

    background:#2f63ff;

    transition:.5s;

    z-index:5;

}

.project-card:hover::before{

    width:100%;

}

/*==================================================
            CARD SHADOW
==================================================*/

.project-card:hover{

    box-shadow:
    0 20px 60px rgba(0,0,0,.45),
    0 0 35px rgba(47,99,255,.20);

}

/*==================================================
            TITLE HOVER
==================================================*/

.project-card:hover h3{

    color:#7ea6ff;

}

/*==================================================
            LOCATION HOVER
==================================================*/

.project-card:hover .project-footer span{

    color:#fff;

}

/*==================================================
            ICON ANIMATION
==================================================*/

.project-footer a i{

    transition:.4s;

}

.project-footer a:hover i{

    transform:translateX(3px);

}

/*==================================================
            IMAGE ZOOM
==================================================*/

.project-card:hover img{

    transform:scale(1.12);

}

/*==================================================
            GLASS EFFECT
==================================================*/

.project-card{

    backdrop-filter:blur(18px);

}

/*==================================================
            FADE ANIMATION
==================================================*/

.project-card{

    opacity:0;

    transform:translateY(50px);

    animation:fadeUp .8s forwards;

}

.project-card:nth-child(1){

    animation-delay:.1s;

}

.project-card:nth-child(2){

    animation-delay:.2s;

}

.project-card:nth-child(3){

    animation-delay:.3s;

}

.project-card:nth-child(4){

    animation-delay:.4s;

}

.project-card:nth-child(5){

    animation-delay:.5s;

}

.project-card:nth-child(6){

    animation-delay:.6s;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(50px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*==================================================
        MINERVA PREMIUM ANIMATIONS
==================================================*/

/*=========================================
        GLOBAL TRANSITION
==========================================*/

.project-card,
.project-filter button,
.project-tag,
.theme-btn,
.feature,
.project-footer a,
.project-image img{

    transition:all .45s ease;

}

/*=========================================
        CARD HOVER
==========================================*/

.project-card{

    position:relative;

    overflow:hidden;

    transform:translateY(0);

}

.project-card:hover{

    transform:translateY(-12px);

}

/*=========================================
        BLUE BORDER ANIMATION
==========================================*/

.project-card::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:0;

    height:3px;

    background:#2f63ff;

    transition:.45s;

}

.project-card:hover::after{

    width:100%;

}

/*=========================================
        IMAGE ZOOM
==========================================*/

.project-image{

    overflow:hidden;

}

.project-image img{

    transform:scale(1);

}

.project-card:hover img{

    transform:scale(1.12);

}

/*=========================================
        IMAGE DARK OVERLAY
==========================================*/

.project-image::before{

    content:"";

    position:absolute;

    inset:0;

    background:rgba(8,17,38,.55);

    opacity:0;

    transition:.45s;

    z-index:1;

}

.project-card:hover .project-image::before{

    opacity:1;

}

/*=========================================
        VIEW BUTTON
==========================================*/

.project-overlay{

    position:absolute;

    left:50%;

    top:50%;

    transform:translate(-50%,-50%) scale(.7);

    opacity:0;

    z-index:2;

    transition:.45s;

}

.project-card:hover .project-overlay{

    opacity:1;

    transform:translate(-50%,-50%) scale(1);

}

/*=========================================
        TITLE ANIMATION
==========================================*/

.project-content h3{

    transition:.4s;

    color:#1b2d6b;

}

.project-card:hover h3{

    color:#5f8cff;

}

/*=========================================
        TAG ANIMATION
==========================================*/

.project-tag{

    transform:translateY(0);

}

.project-card:hover .project-tag{

    transform:translateY(-4px);

}

/*=========================================
        ARROW BUTTON
==========================================*/

.project-footer a{

    overflow:hidden;

}

.project-footer a i{

    transition:.35s;

}

.project-footer a:hover{

    background:#2f63ff;

    transform:rotate(-45deg);

}

.project-footer a:hover i{

    transform:translateX(4px);

}

/*=========================================
        FEATURE BOX
==========================================*/

.feature{

    position:relative;

    overflow:hidden;

}

.feature::before{

    content:"";

    position:absolute;

    left:-120%;

    top:0;

    width:100%;

    height:100%;

    background:rgba(255,255,255,.08);

    transform:skewX(-30deg);

    transition:.6s;

}

.feature:hover::before{

    left:130%;

}

/*=========================================
        BUTTON SHINE
==========================================*/

.theme-btn{

    overflow:hidden;

    position:relative;

}

.theme-btn::after{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:70px;

    height:100%;

    background:rgba(255,255,255,.25);

    transform:skewX(-25deg);

}

.theme-btn:hover::after{

    animation:shine .8s;

}

@keyframes shine{

    from{

        left:-120%;

    }

    to{

        left:140%;

    }

}

/*=========================================
        FILTER BUTTON
==========================================*/

.project-filter button{

    position:relative;

    overflow:hidden;

}

.project-filter button::before{

    content:"";

    position:absolute;

    width:0;

    height:100%;

    left:0;

    top:0;

    background:#2956e6;

    transition:.45s;

    z-index:-1;

}

.project-filter button:hover::before,

.project-filter button.active::before{

    width:100%;

}

.project-filter button:hover{

    color:#fff;

}

/*=========================================
        SCROLL REVEAL
==========================================*/

.project-card{

    opacity:0;

    transform:translateY(60px);

}

.project-card.show{

    animation:fadeUp .8s forwards;

}

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(60px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
        STAGGER EFFECT
==========================================*/

.project-item:nth-child(1) .project-card{

    animation-delay:.1s;

}

.project-item:nth-child(2) .project-card{

    animation-delay:.2s;

}

.project-item:nth-child(3) .project-card{

    animation-delay:.3s;

}

.project-item:nth-child(4) .project-card{

    animation-delay:.4s;

}

.project-item:nth-child(5) .project-card{

    animation-delay:.5s;

}

.project-item:nth-child(6) .project-card{

    animation-delay:.6s;

}

/*=========================================
        FLOATING CTA
==========================================*/

.project-cta{

    display:flex;

    justify-content:space-between;

    align-items:center;

    gap:40px;

    padding:40px 50px;

    border-radius:20px;

    background:linear-gradient(135deg,#17307d,#2f63ff);

    color:#fff;

    flex-wrap:wrap;

}


@keyframes floating{

    0%{

        transform:translateY(0px);

    }

    50%{

        transform:translateY(-6px);

    }

    100%{

        transform:translateY(0px);

    }

}


.cta-left{

    flex:1;

    min-width:280px;

}


.cta-left p{

    color:rgba(255,255,255,.85);

    line-height:28px;

}


.cta-left h3{

    font-size:36px;

    color:#fff;

    margin-bottom:12px;

    font-weight:700;
}



.cta-features{

    display:flex;

    gap:20px;

    flex-wrap:wrap;

    justify-content:center;

    flex:1;

}

.feature{

    display:flex;

    align-items:center;

    gap:10px;

    color:#fff;

    font-size:15px;

    font-weight:500;

}

.feature i{

    width:42px;

    height:42px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:50%;

    background:rgba(255,255,255,.12);

}

.cta-btn{

    display:flex;

    justify-content:flex-end;

}

.theme-btn{

    padding:16px 34px;

    border-radius:50px;

    background:#fff;

    color:#17307d;

    text-decoration:none;

    font-weight:600;

    display:inline-flex;

    align-items:center;

    gap:10px;

    transition:.4s;

}

.theme-btn:hover{

    background:#17307d;

    color:#fff;

}





/*=========================================
        ICON ROTATION
==========================================*/

.feature i{

    transition:.5s;

}

.feature:hover i{

    transform:rotateY(180deg);

}

/*=========================================
        GLOW SHADOW
==========================================*/

.project-card:hover{

    box-shadow:
    0 20px 60px rgba(0,0,0,.45),
    0 0 40px rgba(47,99,255,.18);

}

/*=========================================
        PARALLAX EFFECT
==========================================*/

.project-card:hover .project-image{

    transform:translateY(-3px);

}

/*=========================================
        SMOOTH SCROLL
==========================================*/

html{

    scroll-behavior:smooth;

}


/*==================================================
                RESPONSIVE CSS
===================================================*/

/*==================================================
        1600px
===================================================*/

@media (max-width:1600px){

    .featured-projects{

        padding:110px 0;

    }

}

/*==================================================
        1400px
===================================================*/

@media (max-width:1400px){

    .section-title h2{

        font-size:52px;

    }

    .project-cta{

        padding:45px;

    }

}

/*==================================================
        1200px
===================================================*/

@media (max-width:1200px){

    .section-title{

        max-width:700px;

    }

    .section-title h2{

        font-size:46px;

    }

    .project-content{

        padding:22px;

    }

    .project-content h3{

        font-size:22px;

    }

    .project-image img{

        height:230px;

    }

    .cta-left h3{

        font-size:34px;

    }

}

/*==================================================
        992px
===================================================*/

@media (max-width:992px){

    .featured-projects{

        padding:90px 0;

    }

    .section-title{

        margin-bottom:50px;

    }

    .section-title h2{

        font-size:40px;

    }

    .project-filter{

        gap:10px;

    }

    .project-filter button{

        padding:12px 18px;

        font-size:14px;

    }

    .project-grid>[class*="col-"]{

        margin-bottom:25px;

    }

    .project-cta{

        flex-direction:column;

        text-align:center;

        gap:30px;

    }

    .cta-left{

        max-width:100%;

    }

}

/*==================================================
        768px
===================================================*/

@media (max-width:768px){

    .featured-projects{

        padding:80px 0;

    }

    .section-title{

        margin-bottom:40px;

    }

    .section-title h2{

        font-size:34px;

    }

    .section-title p{

        font-size:15px;

        line-height:28px;

    }

    .project-filter{

        justify-content:flex-start;

        overflow-x:auto;

        flex-wrap:nowrap;

        padding-bottom:10px;

        scrollbar-width:none;

    }

    .project-filter::-webkit-scrollbar{

        display:none;

    }

    .project-filter button{

        white-space:nowrap;

    }

    .project-image img{

        height:220px;

    }

    .project-content{

        padding:20px;

    }

    .project-content h3{

        font-size:20px;

    }

    .project-content p{

        font-size:14px;

        line-height:26px;

        color:#64748b;

    }

    .project-footer{

        flex-direction:column;

        align-items:flex-start;

        gap:15px;

    }

    .project-cta{

        padding:35px;

    }

    .cta-left h3{

        font-size:30px;

    }

    .cta-features{

        justify-content:center;

    }

}

/*==================================================
        576px
===================================================*/

@media (max-width:576px){

    .featured-projects{

        padding:70px 0;

    }

    .section-title h2{

        font-size:30px;

    }

    .sub-title{
        
        font-size:13px;

    }

    .project-card{

        border-radius:16px;

    }

    .project-image img{

        height:210px;

    }

    .project-content{

        padding:18px;

    }

    .project-content h3{

        font-size:19px;

    }

    .project-tag{

        font-size:11px;

        padding:7px 14px;

    }

    .project-footer a{

        width:42px;

        height:42px;

    }

    .feature{

        width:100%;

        justify-content:flex-start;

    }

    .theme-btn{

        width:100%;

    }

}

/*==================================================
        425px
===================================================*/

@media (max-width:425px){

    .section-title h2{

        font-size:26px;

    }

    .section-title p{

        font-size:14px;

    }

    .project-image img{

        height:190px;

    }

    .project-content{

        padding:16px;

    }

    .project-content h3{

        font-size:18px;

    }

    .project-content p{

        font-size:13px;

    }

    .project-footer span{

        font-size:13px;



    }

    .cta-left h3{

        font-size:26px;

    }

    .cta-left p{

        font-size:14px;

    }

}

/*==================================================
        375px
===================================================*/

@media (max-width:375px){

    .section-title h2{

        font-size:24px;

    }

    .project-filter button{

        padding:10px 14px;

        font-size:13px;

    }

    .project-image img{

        height:180px;

    }

    .project-content h3{

        font-size:17px;

    }

    .project-content p{

        line-height:24px;

    }

}

/*==================================================
        320px
===================================================*/

@media (max-width:320px){

    .featured-projects{

        padding:60px 0;

    }

    .section-title h2{

        font-size:22px;

    }

    .project-image img{

        height:170px;

    }

    .project-content{

        padding:14px;

    }

    .project-content h3{

        font-size:16px;

    }

    .project-content p{

        font-size:12px;

        line-height:22px;

    }

    .project-tag{

        font-size:10px;

        padding:6px 12px;

    }

    .theme-btn{

        font-size:14px;

        padding:15px;

    }

}






/*==================================================
        SOLUTION PAGE
==================================================*/



/*=========================================
    INTRO SECTION
=========================================*/

.intro-section{
    position:relative;
    width:100%;
    overflow:hidden;
    padding:110px 0;
    background:#ffffff;
}

.intro-section::before{
    content:"";
    position:absolute;
    top:-220px;
    left:-220px;
    width:500px;
    height:500px;
    background:radial-gradient(circle,rgba(0,73,184,.08),transparent 70%);
    z-index:0;
}

.intro-section::after{
    content:"";
    position:absolute;
    bottom:-250px;
    right:-200px;
    width:550px;
    height:550px;
    background:radial-gradient(circle,rgba(0,73,184,.05),transparent 70%);
    z-index:0;
}

/*=========================================
    CONTAINER
=========================================*/

.container-sol{
    width:100%;
    max-width:1320px;
    margin:auto;
    padding:0 15px;
    position:relative;
    z-index:2;
}

/*=========================================
    GRID
=========================================*/

.intro-wrapper{
    display:grid;
    grid-template-columns:1fr 1fr;
    align-items:center;
    gap:70px;
}

/*=========================================
    LEFT SIDE
=========================================*/

.intro-content{
    position:relative;
    z-index:2;
}

/*=========================================
    TAG
=========================================*/

.section-tag{
    display:flex;
    align-items:center;
    gap:18px;
    margin-bottom:28px;
}

.tag-line{
    width:70px;
    height:2px;
    background:#0b4dbd;
}

.section-tag span:last-child{
    font-size:17px;
    font-weight:700;
    letter-spacing:1px;
    color:#2b4573;
    text-transform:uppercase;
}

/*=========================================
    TITLE
=========================================*/

.intro-title{
    font-size:45px;
    line-height:1.08;
    font-weight:800;
    color:#0b1739;
    margin-bottom:28px;
}

.intro-title span{
    color:#2b4573;
}

/*=========================================
    DESCRIPTION
=========================================*/

.intro-description{
    max-width:620px;
    font-size:21px;
    line-height:1.8;
    color:#7e8085;
    margin-bottom:55px;
    padding-left:22px;
    border-left:4px solid #2b4573;
}

/*=========================================
    RIGHT SIDE
=========================================*/

.intro-media{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    min-height:620px;
}

/*=========================================
    IMAGE FRAME
=========================================*/

.image-frame{
    position:relative;
    width:100%;
    max-width:650px;
    border-radius:24px;
    overflow:hidden;
    z-index:5;
}

.image-frame img{
    display:block;
    width:100%;
    border-radius:24px;
}

/*=========================================
    BLUE BACK PANEL
=========================================*/

.background-shape{
    position:absolute;
    top:-35px;
    right:-35px;
    width:92%;
    height:92%;
    border-radius:24px;
    background:#2b4573;
    z-index:1;
}

/*=========================================
    DOT GRID
=========================================*/

.dot-grid{
    position:absolute;
    top:-10px;
    right:-70px;
    width:150px;
    height:150px;
    z-index:2;

    background-image:
    radial-gradient(#ffffff 2px,transparent 2px);

    background-size:16px 16px;
}


/*=========================================
    FEATURES
=========================================*/

.intro-features{
    display:flex;
    flex-wrap:wrap;
    align-items:flex-start;
    gap:28px;
    margin-bottom:55px;
}

.feature-item{
    display:flex;
    align-items:center;
    gap:16px;
    transition:.35s ease;
    width: 250px;
}

.feature-item:hover{
    transform:translateY(-6px);
}

.feature-icon{
    width:65px;
    height:65px;
    border-radius:50%;
    background:#2b4573;
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
    transition:.35s ease;
    box-shadow:0 15px 30px rgba(11,77,189,.18);
}

.feature-icon svg{
    width:28px;
    height:28px;
}

.feature-item:hover .feature-icon{
    background:#092d77;
    transform:rotateY(180deg);
}

.feature-text h5{
    margin:0;
    font-size:22px;
    font-weight:700;
    line-height:1.2;
    color:#091b46;
}

.feature-text span{
    display:block;
    margin-top:4px;
    font-size:18px;
    color:#5e6778;
    line-height:1.4;
}

/*=========================================
    PRIMARY BUTTON
=========================================*/

.primary-btn{
    position:relative;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:18px;
    padding:18px 36px;
    background:#2b4573;
    color:#ffffff;
    text-decoration:none;
    border-radius:14px;
    font-size:18px;
    font-weight:700;
    letter-spacing:.5px;
    overflow:hidden;
    transition:.4s ease;
    box-shadow:0 18px 35px rgba(11,77,189,.25);
}

.primary-btn:hover{
    background:#082f83;
    transform:translateY(-5px);
    box-shadow:0 22px 45px rgba(11,77,189,.35);
}

.btn-arrow{
    width:42px;
    height:42px;
    border-radius:50%;
    background:rgba(255,255,255,.12);
    display:flex;
    align-items:center;
    justify-content:center;
    transition:.35s ease;
}

.primary-btn:hover .btn-arrow{
    transform:translateX(6px);
    background:#ffffff;
    color:#0b4dbd;
}

.btn-arrow svg{
    width:18px;
    height:18px;
}

/*=========================================
    FLOATING INFORMATION CARD
=========================================*/

.info-card{
    position:absolute;
    left:-40px;
    bottom:-40px;
    width:430px;
    max-width:90%;
    background:#ffffff;
    border-radius:22px;
    padding:30px;
    display:flex;
    align-items:flex-start;
    gap:22px;
    z-index:20;
    box-shadow:0 20px 50px rgba(0,0,0,.12);
    transition:.4s ease;
}

.info-card:hover{
    transform:translateY(-8px);
    box-shadow:0 30px 70px rgba(0,0,0,.16);
}

.info-icon{
    width:80px;
    height:80px;
    border-radius:50%;
    background:#2b4573;
    color:#ffffff;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.info-icon svg{
    width:36px;
    height:36px;
}

.info-content{
    flex:1;
}

.info-content h4{
    margin:0;
    color:#0a1c49;
    font-size:30px;
    line-height:1.2;
    font-weight:700;
}

.info-content span{
    display:block;
    width:70px;
    height:3px;
    background:#0b4dbd;
    border-radius:50px;
    margin:18px 0;
}

.info-content p{
    margin:0;
    font-size:17px;
    line-height:1.8;
    color:#7e8085;
}


/*=========================================
    IMAGE STYLING
=========================================*/

.image-frame{
    position:relative;
    overflow:hidden;
    border-radius:24px;
    background:#ffffff;
    box-shadow:0 35px 80px rgba(0,0,0,.12);
    transition:all .45s ease;
}

.image-frame img{
    width:100%;
    display:block;
    transition:transform .7s ease;
}

.image-frame:hover img{
    transform:scale(1.08);
}

.image-frame:hover{
    transform:translateY(-10px);
}

/*=========================================
    BLUE BACKGROUND PANEL
=========================================*/

.background-shape{
    position:absolute;
    top:-35px;
    right:-35px;
    width:90%;
    height:92%;
    border-radius:28px;
    background:linear-gradient(135deg,#0b4dbd,#2b4573);
    z-index:1;
    transition:.45s ease;
}

.intro-media:hover .background-shape{
    transform:translate(12px,-12px);
}

/*=========================================
    DOT PATTERN
=========================================*/

.dot-grid{
    position:absolute;
    top:-18px;
    right:-80px;
    width:180px;
    height:180px;
    z-index:2;
    opacity:.9;

    background-image:
        radial-gradient(#ffffff 2px,transparent 2px);

    background-size:16px 16px;

    animation:dotsMove 12s linear infinite;
}

/*=========================================
    IMAGE OVERLAY
=========================================*/

.image-frame::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(
        to top,
        rgba(0,0,0,.18),
        rgba(0,0,0,0) 55%
    );
    opacity:0;
    transition:.45s;
}

.image-frame:hover::after{
    opacity:1;
}

/*=========================================
    FLOATING CARD
=========================================*/

.info-card{

    backdrop-filter:blur(18px);

    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(255,255,255,.55);

    animation:floatCard 5s ease-in-out infinite;

}

.info-card::before{

    content:"";

    position:absolute;

    inset:0;

    border-radius:22px;

    background:linear-gradient(
        135deg,
        rgba(255,255,255,.65),
        rgba(255,255,255,.15)
    );

    opacity:.35;

    z-index:-1;

}

/*=========================================
    CARD ICON
=========================================*/

.info-icon{

    position:relative;

    overflow:hidden;

}

.info-icon::before{

    content:"";

    position:absolute;

    width:130%;

    height:130%;

    background:rgba(255,255,255,.18);

    transform:rotate(45deg);

    left:-150%;

    transition:.7s;

}

.info-card:hover .info-icon::before{

    left:140%;

}

/*=========================================
    TITLE EFFECT
=========================================*/

.info-content h4{

    transition:.35s;

}

.info-card:hover h4{

    color:#0b4dbd;

}

/*=========================================
    BUTTON SHINE
=========================================*/

.primary-btn{

    position:relative;

}

.primary-btn::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:60%;

    height:100%;

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

    transform:skewX(-25deg);

    transition:.75s;

}

.primary-btn:hover::before{

    left:150%;

}

/*=========================================
    FEATURE EFFECT
=========================================*/

.feature-item{

    position:relative;

}

.feature-item::after{

    content:"";

    position:absolute;

    bottom:-10px;

    left:0;

    width:0;

    height:2px;

    background:#0b4dbd;

    transition:.4s;

}

.feature-item:hover::after{

    width:100%;

}

/*=========================================
    MEDIA HOVER
=========================================*/

.intro-media:hover{

    transform:translateY(-8px);

    transition:.4s ease;

}

/*=========================================
    ANIMATION
=========================================*/

@keyframes floatCard{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-14px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes dotsMove{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-12px);

    }

    100%{

        transform:translateY(0);

    }

}



/*=========================================
    INTRO SECTION ANIMATIONS
=========================================*/

.intro-section *{
    transition:
    color .35s ease,
    background-color .35s ease,
    border-color .35s ease,
    box-shadow .35s ease,
    transform .35s ease;
}

/*=========================================
    IMAGE BORDER EFFECT
=========================================*/

.image-frame::before{
    content:"";
    position:absolute;
    inset:0;
    border-radius:24px;
    border:2px solid rgba(255,255,255,.35);
    z-index:2;
    pointer-events:none;
}

.image-frame:hover::before{
    border-color:rgba(255,255,255,.7);
}

/*=========================================
    DECORATIVE CIRCLE
=========================================*/

.intro-media::before{
    content:"";
    position:absolute;
    width:170px;
    height:170px;
    border-radius:50%;
    background:rgba(11,77,189,.08);
    top:-60px;
    left:-60px;
    animation:circleFloat 8s ease-in-out infinite;
    z-index:0;
}

.intro-media::after{
    content:"";
    position:absolute;
    width:110px;
    height:110px;
    border-radius:50%;
    background:rgba(11,77,189,.12);
    right:-40px;
    bottom:60px;
    animation:circleFloatReverse 7s ease-in-out infinite;
    z-index:0;
}

/*=========================================
    TITLE ANIMATION
=========================================*/

.intro-title{
    animation:titleFade .9s ease;
}

.intro-description{
    animation:textFade 1.2s ease;
}

.intro-features{
    animation:textFade 1.5s ease;
}

.primary-btn{
    animation:textFade 1.8s ease;
}

.image-frame{
    animation:imageFade 1s ease;
}

.info-card{
    animation:
    floatCard 5s ease-in-out infinite,
    cardFade 1.2s ease;
}

/*=========================================
    HOVER EFFECTS
=========================================*/

.feature-item:hover .feature-text h5{
    color:#1e3a6b;
}

.feature-item:hover .feature-text span{
    color:#091b46;
}

.image-frame:hover{
    box-shadow:
    0 40px 90px rgba(0,0,0,.18);
}

.primary-btn:active{
    transform:scale(.97);
}

.info-card:hover .info-icon{
    transform:rotate(10deg) scale(1.08);
}

/*=========================================
    SECTION VISIBILITY
=========================================*/

.fade-up{
    opacity:0;
    transform:translateY(60px);
    transition:all .8s ease;
}

.fade-up.show{
    opacity:1;
    transform:translateY(0);
}

/*=========================================
    TEXT SELECTION
=========================================*/

::selection{
    background:#0b4dbd;
    color:#ffffff;
}

::-moz-selection{
    background:#0b4dbd;
    color:#ffffff;
}

/*=========================================
    FOCUS
=========================================*/

.primary-btn:focus{
    outline:none;
    box-shadow:
    0 0 0 5px rgba(11,77,189,.20);
}

/*=========================================
    PERFORMANCE
=========================================*/

.image-frame,
.info-card,
.feature-item,
.primary-btn{
    will-change:transform;
}

/*=========================================
    KEYFRAMES
=========================================*/

@keyframes titleFade{

    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes textFade{

    from{
        opacity:0;
        transform:translateY(45px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes imageFade{

    from{
        opacity:0;
        transform:translateX(60px);
    }

    to{
        opacity:1;
        transform:translateX(0);
    }

}

@keyframes cardFade{

    from{
        opacity:0;
        transform:translateY(50px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes circleFloat{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(-25px);
    }

    100%{
        transform:translateY(0);
    }

}

@keyframes circleFloatReverse{

    0%{
        transform:translateY(0);
    }

    50%{
        transform:translateY(20px);
    }

    100%{
        transform:translateY(0);
    }

}



/*=========================================
    BUTTON RIPPLE
=========================================*/

.primary-btn{
    overflow:hidden;
    position:relative;
}

.ripple{

    position:absolute;

    width:20px;

    height:20px;

    border-radius:50%;

    background:rgba(255,255,255,.45);

    transform:translate(-50%,-50%) scale(0);

    animation:rippleEffect .6s linear;

    pointer-events:none;

}

@keyframes rippleEffect{

    to{

        transform:translate(-50%,-50%) scale(18);

        opacity:0;

    }

}



/*=========================================
    RESPONSIVE CSS
=========================================*/

/*========== Large Desktop ==========*/

@media (max-width:1400px){

    .container{
        max-width:1140px;
    }

    .intro-title{
        font-size:62px;
    }

    .intro-description{
        font-size:20px;
    }

    .info-card{
        width:390px;
    }

}

/*========== Laptop ==========*/

@media (max-width:1200px){

    .container{
        max-width:960px;
    }

    .intro-wrapper{
        gap:50px;
    }

    .intro-title{
        font-size:54px;
    }

    .intro-description{
        font-size:18px;
        margin-bottom:45px;
    }

    .intro-features{
        gap:20px;
    }

    .feature-icon{
        width:58px;
        height:58px;
    }

    .feature-text h5{
        font-size:19px;
    }

    .feature-text span{
        font-size:16px;
    }

    .image-frame{
        max-width:560px;
    }

    .info-card{
        width:340px;
        padding:24px;
    }

    .info-content h4{
        font-size:24px;
    }

}

/*========== Small Laptop ==========*/

@media (max-width:992px){

    .intro-section{
        padding:90px 0;
    }

    .intro-wrapper{

        grid-template-columns:1fr;

        gap:70px;

    }

    .intro-content{

        order:2;

    }

    .intro-media{

        order:1;

        min-height:auto;

    }

    .intro-title{

        font-size:48px;

    }

    .intro-description{

        max-width:100%;

    }

    .image-frame{

        max-width:700px;

        margin:auto;

    }

    .background-shape{

        right:-20px;

        top:-20px;

    }

    .dot-grid{

        right:-35px;

    }

    .info-card{

        left:25px;

        bottom:-25px;

    }

}

/*========== Tablet ==========*/

@media (max-width:768px){

    .intro-section{

        padding:70px 0;

    }

    .intro-title{

        font-size:40px;

        line-height:1.2;

    }

    .section-tag{

        margin-bottom:18px;

    }

    .section-tag span:last-child{

        font-size:15px;

    }

    .intro-description{

        font-size:17px;

        padding-left:18px;

        margin-bottom:35px;

    }

    .intro-features{

        display:grid;

        grid-template-columns:repeat(2,1fr);

        gap:22px;

    }

    .feature-item{

        align-items:flex-start;

    }

    .feature-icon{

        width:55px;

        height:55px;

    }

    .primary-btn{

        padding:16px 30px;

        font-size:17px;

    }

    .image-frame{

        border-radius:18px;

    }

    .info-card{

        position:relative;

        width:100%;

        left:0;

        bottom:0;

        margin-top:25px;

    }

}

/*========== Mobile ==========*/

@media (max-width:576px){

    .intro-title{

        font-size:34px;

    }

    .intro-description{

        font-size:16px;

        line-height:1.7;

        border-left:3px solid #0b4dbd;

    }

    .intro-features{

        grid-template-columns:1fr;

        gap:18px;

    }

    .feature-text h5{

        font-size:18px;

    }

    .feature-text span{

        font-size:15px;

    }

    .primary-btn{

        width:100%;

        justify-content:center;

    }

    .background-shape{

        display:none;

    }

    .dot-grid{

        display:none;

    }

    .info-card{

        padding:20px;

        gap:18px;

    }

    .info-icon{

        width:65px;

        height:65px;

    }

    .info-content h4{

        font-size:21px;

    }

}

/*========== Small Mobile ==========*/

@media (max-width:480px){

    .intro-section{

        padding:60px 0;

    }

    .intro-title{

        font-size:30px;

    }

    .section-tag{

        gap:12px;

    }

    .tag-line{

        width:40px;

    }

    .section-tag span:last-child{

        font-size:13px;

    }

    .intro-description{

        font-size:15px;

        padding-left:15px;

    }

    .feature-icon{

        width:50px;

        height:50px;

    }

    .feature-icon svg{

        width:22px;

        height:22px;

    }

    .primary-btn{

        font-size:16px;

        padding:15px 24px;

    }

    .btn-arrow{

        width:36px;

        height:36px;

    }

}

/*========== iPhone SE ==========*/

@media (max-width:375px){

    .intro-title{

        font-size:27px;

    }

    .intro-description{

        font-size:14px;

    }

    .feature-item{

        gap:12px;

    }

    .feature-text h5{

        font-size:16px;

    }

    .feature-text span{

        font-size:14px;

    }

    .info-card{

        flex-direction:column;

        text-align:center;

    }

    .info-icon{

        margin:auto;

    }

    .info-content span{

        margin:15px auto;

    }

}

/*========== Extra Small ==========*/

@media (max-width:320px){

    .intro-title{

        font-size:24px;

    }

    .section-tag{

        flex-wrap:wrap;

    }

    .primary-btn{

        font-size:15px;

        padding:14px 18px;

    }

    .btn-arrow{

        display:none;

    }

    .info-content h4{

        font-size:18px;

    }

    .info-content p{

        font-size:14px;

    }

}



/*=========================================
    SOLUTION PAGE CARD SECTION
=========================================*/

/*==================================================
                SOLUTIONS SECTION
==================================================*/

.solutions-section{
    position:relative;
    padding:110px 0;
    background:#ffffff;
    overflow:hidden;
}

/*==============================
    Background Decoration
==============================*/

.solutions-section::before{
    content:"";
    position:absolute;
    top:-220px;
    left:-220px;
    width:500px;
    height:500px;
    border-radius:50%;
    background:radial-gradient(circle,
    rgba(43,69,115,.07),
    transparent 70%);
}

.solutions-section::after{
    content:"";
    position:absolute;
    right:-180px;
    bottom:-180px;
    width:450px;
    height:450px;
    border-radius:50%;
    background:radial-gradient(circle,
    rgba(43,69,115,.05),
    transparent 70%);
}

/*==================================================
                CONTAINER
==================================================*/

.solution-card-container{

    width:100%;

    max-width:1320px;

    margin:auto;

    padding:0 15px;

    position:relative;

    z-index:2;

}

/*==================================================
                SECTION HEADER
==================================================*/

.section-header{

    max-width:760px;

    margin:auto;

    text-align:center;

    margin-bottom:70px;

}

/*==============================
        Label
==============================*/

.section-label{

    display:inline-flex;

    align-items:center;

    gap:18px;

    font-size:15px;

    letter-spacing:2px;

    text-transform:uppercase;

    color:#2b4573;

    font-weight:700;

    margin-bottom:22px;

}

.label-line{

    width:60px;

    height:2px;

    background:#2b4573;

}

/*==============================
        Title
==============================*/

.section-title{

    font-size:58px;

    line-height:1.15;

    color:#1d2238;

    font-weight:800;

    margin-bottom:25px;

}

.section-title span{

    display:block;

    color:#2b4573;

}

/*==============================
        Description
==============================*/

.section-description{

    max-width:700px;

    margin:auto;

    color:#7e8085;

    font-size:18px;

    line-height:1.9;

}

/*==================================================
                GRID
==================================================*/

.solutions-grid{

    display:grid;

    grid-template-columns:
    repeat(4,1fr);

    gap:28px;

}

/*==================================================
                CARD
==================================================*/

.solution-card{

    position:relative;

    background:#ffffff;

    border:1px solid #edf1f7;

    border-radius:18px;

    padding:38px 28px;

    transition:.4s ease;

    overflow:hidden;

    min-height:320px;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

}

/*==============================
        Card Hover
==============================*/

.solution-card:hover{

    transform:translateY(-10px);

    border-color:#2b4573;

    box-shadow:
    0 25px 60px rgba(43,69,115,.12);

}

/*==============================
        Number
==============================*/

.card-number{

    position:absolute;

    top:20px;

    right:20px;

    font-size:15px;

    font-weight:700;

    color:#b9c2d3;

}

/*==============================
        Icon
==============================*/

.solution-icon{

    width:80px;

    height:80px;

    border-radius:50%;

    background:#f5f8fc;

    display:flex;

    align-items:center;

    justify-content:center;

    color:#2b4573;

    margin-bottom:28px;

    transition:.35s;

}

.solution-icon svg{

    width:34px;

    height:34px;

    stroke-width:1.8;

}

.solution-icon i{

     font-size:34px;

    line-height:1;

    color:inherit;

    transition:0.35s ease;

}

/*==============================
        Heading
==============================*/

.solution-card h3{

    font-size:24px;

    color:#20263b;

    margin-bottom:18px;

    font-weight:700;

    line-height:1.3;

}

/*==============================
        Paragraph
==============================*/

.solution-card p{

    font-size:16px;

    line-height:1.8;

    color:#7e8085;

    margin-bottom:30px;

    flex:1;

}

/*==============================
        Link
==============================*/

.card-link{

    display:inline-flex;

    align-items:center;

    gap:10px;

    text-decoration:none;

    color:#2b4573;

    font-weight:700;

    font-size:15px;

    transition:.35s;

}

.card-link svg{

    width:18px;

    height:18px;

    fill:none;

    stroke:currentColor;

    stroke-width:2;

}

.card-link i{

    width:18px;

    height:18px;

    fill:none;

    stroke:currentColor;

    stroke-width:2;

}

.card-link:hover{

    letter-spacing:.4px;

}


/*==================================================
        PREMIUM CARD EFFECTS
==================================================*/

/* Top Accent Line */

.solution-card::before{

    content:"";

    position:absolute;

    top:0;

    left:50%;

    transform:translateX(-50%);

    width:0;

    height:4px;

    border-radius:0 0 20px 20px;

    background:#2b4573;

    transition:.45s ease;

}

/* Hover Accent */

.solution-card:hover::before{

    width:100%;

}

/* Background Glow */

.solution-card::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        180deg,
        rgba(43,69,115,.04),
        transparent 60%
    );

    opacity:0;

    transition:.4s;

    pointer-events:none;

}

.solution-card:hover::after{

    opacity:1;

}

/*==================================================
        ICON
==================================================*/

.solution-icon{

    position:relative;

    overflow:hidden;

    transition:.45s ease;

}

/* Icon Shine */

.solution-icon::before{

    content:"";

    position:absolute;

    width:140%;

    height:140%;

    background:

    linear-gradient(

    120deg,

    transparent,

    rgba(255,255,255,.65),

    transparent

    );

    left:-180%;

    top:-20%;

    transform:rotate(25deg);

    transition:.8s;

}

.solution-card:hover .solution-icon::before{

    left:180%;

}

.solution-card:hover .solution-icon{

    background:#2b4573;

    color:#ffffff;

    transform:

    rotate(8deg)

    scale(1.08);

    box-shadow:

    0 15px 35px rgba(43,69,115,.20);

}

.solution-card:hover .solution-icon svg{

    stroke:#ffffff;

}

.solution-card:hover .solution-icon i{

    stroke:#ffffff;

}

/*==================================================
        TITLE
==================================================*/

.solution-card h3{

    transition:.35s;

}

.solution-card:hover h3{

    color:#2b4573;

}

/*==================================================
        DESCRIPTION
==================================================*/

.solution-card p{

    transition:.35s;

}

.solution-card:hover p{

    color:#5b6476;

}

/*==================================================
        NUMBER
==================================================*/

.card-number{

    width:42px;

    height:42px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#f3f6fb;

    color:#2b4573;

    font-size:14px;

    font-weight:700;

    transition:.35s;

}

.solution-card:hover .card-number{

    background:#2b4573;

    color:#ffffff;

}

/*==================================================
        LINK
==================================================*/

.card-link{

    position:relative;

    width:max-content;

    overflow:hidden;

}

.card-link::after{

    content:"";

    position:absolute;

    bottom:-3px;

    left:0;

    width:0;

    height:2px;

    background:#2b4573;

    transition:.4s;

}

.card-link:hover::after{

    width:100%;

}

.card-link svg{

    transition:.35s;

}

.solution-card:hover .card-link svg{

    transform:translateX(6px);

}

.solution-card:hover .card-link i{

    transform:translateX(6px);

}

/*==================================================
        CARD SHADOW
==================================================*/

.solution-card:hover{

    box-shadow:

        0 25px 55px rgba(43,69,115,.12),

        0 8px 20px rgba(43,69,115,.08);

}

/*==================================================
        GLASS HIGHLIGHT
==================================================*/

.solution-card{

    backdrop-filter:blur(8px);

    -webkit-backdrop-filter:blur(8px);

}

/*==================================================
        IMAGE EFFECT
==================================================*/

.solution-card:hover{

    background:

    linear-gradient(

    180deg,

    #ffffff,

    #fbfcfe

    );

}

/*==================================================
        TRANSITIONS
==================================================*/

.solution-card,
.solution-icon,
.card-number,
.card-link,
.solution-card h3,
.solution-card p{

    transition:all .35s ease;

}


/*==================================================
            DECORATIVE BACKGROUND
==================================================*/

.solutions-section .bg-circle-1{
    position:absolute;
    width:320px;
    height:320px;
    border-radius:50%;
    background:rgba(43,69,115,.04);
    top:-140px;
    left:-140px;
    animation:floatCircle 12s ease-in-out infinite;
    pointer-events:none;
}

.solutions-section .bg-circle-2{
    position:absolute;
    width:240px;
    height:240px;
    border-radius:50%;
    background:rgba(43,69,115,.06);
    bottom:-100px;
    right:-100px;
    animation:floatCircleReverse 10s ease-in-out infinite;
    pointer-events:none;
}

/*==================================================
            DOT PATTERN
==================================================*/

.solutions-grid{

    position:relative;

}

.solutions-grid::before{

    content:"";

    position:absolute;

    width:170px;

    height:170px;

    top:-60px;

    right:-70px;

    background-image:

    radial-gradient(rgba(43,69,115,.18) 1.5px, transparent 1.5px);

    background-size:16px 16px;

    opacity:.55;

    pointer-events:none;

}

/*==================================================
            CARD BORDER GLOW
==================================================*/

.solution-card{

    isolation:isolate;

}

.solution-card::selection{

    background:none;

}

.solution-card:hover{

    border-color:rgba(43,69,115,.35);

}

.solution-card:hover{

    box-shadow:

    0 18px 50px rgba(43,69,115,.12),

    0 5px 15px rgba(43,69,115,.08);

}

/*==================================================
            SOFT GRADIENT
==================================================*/

.solution-card::after{

    background:

    radial-gradient(

    circle at top right,

    rgba(43,69,115,.08),

    transparent 65%

    );

}

/*==================================================
            CARD CONTENT
==================================================*/

.solution-card>*{

    position:relative;

    z-index:2;

}

/*==================================================
            CARD HOVER SCALE
==================================================*/

.solution-card:hover{

    transform:

    translateY(-12px)

    scale(1.02);

}

/*==================================================
            ICON SHADOW
==================================================*/

.solution-icon{

    box-shadow:

    0 10px 25px rgba(43,69,115,.08);

}

.solution-card:hover .solution-icon{

    box-shadow:

    0 20px 40px rgba(43,69,115,.18);

}

/*==================================================
            LINK ANIMATION
==================================================*/

.card-link{

    transition:.35s ease;
    width: 200px;

}

.solution-card:hover .card-link{

    color:#1f3c6c;

}

.solution-card:hover .card-link svg{

    transform:translateX(6px);

}

.solution-card:hover .card-link i{

    transform:translateX(6px);

}

/*==================================================
            TITLE ANIMATION
==================================================*/

.solution-card h3{

    position:relative;

}

.solution-card h3::after{

    content:"";

    position:absolute;

    left:0;

    bottom:-10px;

    width:0;

    height:2px;

    background:#2b4573;

    transition:.4s;

}

.solution-card:hover h3::after{

    width:60px;

}

/*==================================================
            CARD FADE
==================================================*/

.solution-card{

    opacity:0;

    transform:translateY(60px);

}

.solution-card.show{

    opacity:1;

    transform:translateY(0);

}

/*==================================================
            IMAGE / ICON FLOAT
==================================================*/

.solution-card:hover .solution-icon{

    animation:iconFloat .8s ease;

}

/*==================================================
            SECTION HEADER
==================================================*/

.section-header{

    position:relative;

}

.section-header::after{

    content:"";

    width:90px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

    display:block;

    margin:30px auto 0;

}

/*==================================================
            KEYFRAMES
==================================================*/

@keyframes floatCircle{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-25px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes floatCircleReverse{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(20px);

    }

    100%{

        transform:translateY(0);

    }

}

@keyframes iconFloat{

    0%{

        transform:translateY(0) scale(1);

    }

    50%{

        transform:translateY(-8px) scale(1.08);

    }

    100%{

        transform:translateY(0) scale(1.08);

    }

}



/*==================================================
            FINAL POLISH
==================================================*/

/* Smooth Rendering */

.solutions-section,
.solution-card,
.solution-icon,
.card-link,
.section-header{

    -webkit-font-smoothing:antialiased;

    -moz-osx-font-smoothing:grayscale;

    text-rendering:optimizeLegibility;

}

/*==================================================
            CARD TRANSITION
==================================================*/

.solution-card{

    will-change:transform;

    transform-style:preserve-3d;

    backface-visibility:hidden;

}

/*==================================================
            CARD ACTIVE
==================================================*/

.solution-card:active{

    transform:
    translateY(-6px)
    scale(.99);

}

/*==================================================
            NUMBER BADGE
==================================================*/

.card-number{

    position:absolute;

    top:22px;

    right:22px;

    z-index:5;

    transition:.35s ease;

}

.solution-card:hover .card-number{

    transform:rotate(12deg);

}

/*==================================================
            ICON ROTATION
==================================================*/

.solution-icon svg{

    transition:transform .45s ease;

}

.solution-card:hover .solution-icon svg{

    transform:rotate(-8deg);

}

.solution-icon i{

    transition:transform .45s ease,color .35s;

}

.solution-card:hover .solution-icon i{

    transform:rotate(-8deg) scale(1.1);


}

/*==================================================
            PARAGRAPH
==================================================*/

.solution-card p{

    transition:.35s ease;

}

.solution-card:hover p{

    color:#4d586d;

}

/*==================================================
            BUTTON LINK
==================================================*/

.card-link{

    margin-top:auto;

    font-weight:600;

}

.card-link svg{

    transition:.35s ease;

}

.card-link i{

    transition:.35s ease;

}

.solution-card:hover .card-link{

    letter-spacing:.3px;

}

/*==================================================
            TITLE
==================================================*/

.solution-card h3{

    transition:.35s ease;

}

.solution-card:hover h3{

    transform:translateX(4px);

}

/*==================================================
            GRID ALIGNMENT
==================================================*/

.solutions-grid{

    align-items:stretch;

}

.solution-card{

    height:100%;

}

/*==================================================
            GLASS BORDER
==================================================*/

.solution-card{

    border:1px solid rgba(43,69,115,.08);

}

.solution-card:hover{

    border-color:#2b4573;

}

/*==================================================
            IMAGE QUALITY
==================================================*/

.solution-icon svg{

    stroke-linecap:round;

    stroke-linejoin:round;

}

.solution-icon i{

    stroke-linecap:round;

    stroke-linejoin:round;

}

/*==================================================
            SELECTION
==================================================*/

::selection{

    background:#2b4573;

    color:#ffffff;

}

::-moz-selection{

    background:#2b4573;

    color:#ffffff;

}

/*==================================================
            FOCUS
==================================================*/

.card-link:focus{

    outline:none;

}

.solution-card:focus-within{

    border-color:#2b4573;

    box-shadow:0 0 0 4px rgba(43,69,115,.12);

}

/*==================================================
            HOVER TIMING
==================================================*/

.solution-card:hover{

    transition-duration:.35s;

}

.solution-icon,
.card-link,
.card-number,
.solution-card h3{

    transition-duration:.35s;

}

/*==================================================
            SUBTLE BACKGROUND
==================================================*/

.solutions-section{

    background-image:

    linear-gradient(
        180deg,
        #ffffff 0%,
        #fbfcff 100%
    );

}

/*==================================================
            HEADER ANIMATION
==================================================*/

.section-header{

    opacity:0;

    transform:translateY(40px);

}

.section-header.show{

    opacity:1;

    transform:translateY(0);

}

/*==================================================
            PERFORMANCE
==================================================*/

.solution-card,
.solution-icon{

    contain:layout paint;

}



/*==================================================
            RESPONSIVE CSS
==================================================*/

/*==============================
    Large Desktop (1600px)
==============================*/

@media (max-width:1600px){

    .container{
        max-width:1400px;
    }

    .solutions-grid{
        gap:25px;
    }

}

/*==============================
    Laptop (1400px)
==============================*/

@media (max-width:1400px){

    .container{
        max-width:1200px;
    }

    .section-title{
        font-size:52px;
    }

}

/*==============================
    Laptop (1200px)
==============================*/

@media (max-width:1200px){

    .solutions-section{
        padding:90px 0;
    }

    .section-title{
        font-size:46px;
    }

    .solutions-grid{
        grid-template-columns:repeat(3,1fr);
        gap:24px;
    }

    .solution-card{
        min-height:300px;
    }

}

/*==============================
    Tablet Landscape (992px)
==============================*/

@media (max-width:992px){

    .solutions-section{
        padding:80px 0;
    }

    .section-header{
        margin-bottom:55px;
    }

    .section-title{
        font-size:40px;
    }

    .section-description{
        font-size:17px;
    }

    .solutions-grid{
        grid-template-columns:repeat(2,1fr);
        gap:22px;
    }

    .solution-card{
        padding:32px 24px;
    }

    .solution-card h3{
        font-size:22px;
    }

}

/*==============================
    Tablet Portrait (768px)
==============================*/

@media (max-width:768px){

    .solutions-section{
        padding:70px 0;
    }

    .section-header{
        margin-bottom:45px;
    }

    .section-label{
        font-size:13px;
        gap:12px;
    }

    .label-line{
        width:40px;
    }

    .section-title{
        font-size:34px;
    }

    .section-description{
        font-size:16px;
        line-height:1.8;
    }

    .solutions-grid{
        grid-template-columns:1fr;
        gap:20px;
    }

    .solution-card{
        min-height:auto;
        padding:30px 24px;
    }

    .solution-icon{
        width:70px;
        height:70px;
    }

    .solution-icon svg{
        width:30px;
        height:30px;
    }

    .solution-icon i{
        font-size:30px;

    }

    .solution-card h3{
        font-size:21px;
    }

}

/*==============================
    Large Mobile (576px)
==============================*/

@media (max-width:576px){

    .solutions-section{
        padding:60px 0;
    }

    .container{
        padding:0 20px;
    }

    .section-title{
        font-size:30px;
        line-height:1.3;
    }

    .section-description{
        font-size:15px;
    }

    .solution-card{
        padding:28px 22px;
        border-radius:16px;
    }

    .solution-icon{
        width:64px;
        height:64px;
        margin-bottom:22px;
    }

    .solution-icon svg{
        width:28px;
        height:28px;
    }

    .solution-icon i{
        font-size:28px;

    }

    .solution-card h3{
        font-size:20px;
    }

    .solution-card p{
        font-size:15px;
        margin-bottom:24px;
    }

    .card-number{
        width:38px;
        height:38px;
        font-size:13px;
    }

}

/*==============================
    Mobile (480px)
==============================*/

@media (max-width:480px){

    .section-label{
        font-size:12px;
        letter-spacing:1px;
    }

    .label-line{
        width:30px;
    }

    .section-title{
        font-size:28px;
    }

    .solution-card{
        padding:24px 20px;
    }

    .solution-icon{
        width:60px;
        height:60px;
    }

    .solution-icon svg{
        width:26px;
        height:26px;
    }

    .solution-icon i{
        font-size:26px;

    }

    .solution-card h3{
        font-size:19px;
    }

    .solution-card p{
        font-size:14px;
        line-height:1.7;
    }

    .card-link{
        font-size:14px;
    }

}

/*==============================
    Small Mobile (360px)
==============================*/

@media (max-width:360px){

    .container{
        padding:0 16px;
    }

    .section-title{
        font-size:24px;
    }

    .section-description{
        font-size:14px;
    }

    .solution-card{
        padding:22px 18px;
    }

    .solution-icon{
        width:56px;
        height:56px;
    }

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

    .solution-icon i{
        font-size:24px;

    }

    .solution-card h3{
        font-size:18px;
    }

    .solution-card p{
        font-size:13px;
    }

    .card-link{
        font-size:13px;
    }

    .card-number{
        width:34px;
        height:34px;
        font-size:12px;
    }

}





/*==================================================
    SOLUTION INNER PAGE CARD
==================================================*/


/*==================================================
                RESET
==================================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    font-family:'Inter',sans-serif;
    background:#ffffff;
    color:#1d1d1d;
    overflow-x:hidden;
    line-height:1.7;
}

img{
    width:100%;
    display:block;
}

a{
    text-decoration:none;
}

ul{
    list-style:none;
}


/*==================================================
            AUTO CONTAINER
==================================================*/

.auto-container{
    position:relative;
    width:100%;
    max-width:1280px;
    margin:auto;
    padding:0 20px;
}


/*==================================================
            SECTION
==================================================*/

.mv-safety-section{
    position:relative;
    padding:110px 0;
    background:#ffffff;
}


/*==================================================
            SECTION HEADING
==================================================*/

.mv-safety-heading{
    text-align:center;
    margin-bottom:70px;
}

.mv-section-subtitle{

    display:inline-flex;
    align-items:center;
    justify-content:center;

    padding:10px 22px;

    border-radius:50px;

    background:#edf4ff;

    color:#224b9b;

    font-size:13px;

    font-weight:600;

    letter-spacing:.5px;

    text-transform:uppercase;

    margin-bottom:18px;

}

.mv-section-title{

    font-size:54px;

    line-height:1.15;

    font-weight:800;

    color:#202020;

}

.mv-title-divider{

    width:65px;

    height:4px;

    background:#1d4c96;

    border-radius:20px;

    margin:28px auto 0;

}


/*==================================================
            CARD
==================================================*/

.mv-solution-card{

    position:relative;

    display:grid;

    grid-template-columns:
    320px
    1fr
    260px;

    align-items:center;

    gap:40px;

    background:#fff;

    border:1px solid #ebedf2;

    border-radius:24px;

    padding:32px;

    margin-bottom:35px;

    overflow:hidden;

    transition:.45s;

    box-shadow:
    0 10px 40px rgba(0,0,0,.05);

}


/*==================================================
            HOVER
==================================================*/

.mv-solution-card:hover{

    transform:translateY(-10px);

    box-shadow:
    0 22px 60px rgba(0,0,0,.10);

}


/*==================================================
            IMAGE COLUMN
==================================================*/

.mv-solution-image{

    position:relative;

    overflow:hidden;

    border-radius:18px;

    background:#f5f5f5;

}

.mv-solution-image img{

    width:100%;

    height:230px;

    object-fit:cover;

}


/*==================================================
            CONTENT
==================================================*/

.mv-solution-content{

    position:relative;

}

.mv-badge{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:10px 20px;

    background:#edf4ff;

    border-radius:40px;

    color:#234f9b;

    font-size:13px;

    font-weight:600;

    margin-bottom:22px;

}

.mv-solution-content h3{

    font-size:44px;

    line-height:1.2;

    font-weight:800;

    color:#222;

    margin-bottom:20px;

}

.mv-content-divider{

    width:48px;

    height:4px;

    background:#1d4c96;

    border-radius:50px;

    margin-bottom:22px;

}

.mv-solution-content p{

    color:#7e8085;

    font-size:16px;

    line-height:2;

}


/*==================================================
            FEATURES COLUMN
==================================================*/

.mv-feature-list{

    position:relative;

    border-left:1px solid #ececec;

    padding-left:35px;

}

.mv-feature-item{

    display:flex;

    align-items:flex-start;

    gap:16px;

    margin-bottom:38px;

}

.mv-feature-item:last-child{

    margin-bottom:0;

}

.mv-feature-icon{

    width:34px;

    height:34px;

    border-radius:50%;

    border:2px solid #204f99;

    display:flex;

    align-items:center;

    justify-content:center;

    flex-shrink:0;

    color:#204f99;

    font-size:13px;

}

.mv-feature-text h5{

    font-size:21px;

    font-weight:700;

    color:#232323;

    margin-bottom:4px;

}

.mv-feature-text span{

    font-size:15px;

    color:#7c7c7c;

}


/*==================================================
        CARD SPACING
==================================================*/

.mv-solution-card:last-child{

    margin-bottom:0;

}



/*==================================================
        PART 2B
        PREMIUM CARD EFFECTS
==================================================*/


/*------------------------------------
    Animated Top Border
------------------------------------*/

.mv-solution-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:0;
    height:4px;
    background:linear-gradient(90deg,#0f4ba5,#3d8bff);
    transition:.6s ease;
    z-index:2;
}

.mv-solution-card:hover::before{
    width:100%;
}


/*------------------------------------
    Soft Background Glow
------------------------------------*/

.mv-solution-card::after{
    content:"";
    position:absolute;
    right:-120px;
    top:-120px;
    width:260px;
    height:260px;
    border-radius:50%;
    background:rgba(33,84,180,.05);
    transition:.6s;
    pointer-events:none;
}

.mv-solution-card:hover::after{
    transform:scale(1.25);
}


/*------------------------------------
    Card Hover Enhancement
------------------------------------*/

.mv-solution-card:hover{
    border-color:#d9e7ff;
}


/*==================================================
            IMAGE EFFECTS
==================================================*/

.mv-solution-image{
    position:relative;
    cursor:pointer;
}


/* Image Overlay */

.mv-solution-image::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
    to top,
    rgba(10,30,80,.28),
    rgba(255,255,255,0)
    );

    opacity:0;

    transition:.45s;

    z-index:2;

}

.mv-solution-image:hover::before{

    opacity:1;

}


/* Shine Effect */

.mv-solution-image::after{

    content:"";

    position:absolute;

    top:0;

    left:-140%;

    width:60%;

    height:100%;

    transform:skewX(-25deg);

    background:
    rgba(255,255,255,.45);

    transition:.8s;

    z-index:3;

}

.mv-solution-card:hover .mv-solution-image::after{

    left:170%;

}


/* Image Zoom */

.mv-solution-image img{

    transition:
    transform .8s ease,
    filter .5s;

}

.mv-solution-card:hover
.mv-solution-image img{

    transform:scale(1.08);

}

.mv-solution-image:hover img{

    filter:brightness(1.05);

}


/*==================================================
            BADGE
==================================================*/

.mv-badge{

    transition:.35s;

}

.mv-solution-card:hover .mv-badge{

    background:#1f4c98;

    color:#ffffff;

    transform:translateY(-2px);

}


/*==================================================
            HEADING
==================================================*/

.mv-solution-content h3{

    transition:.35s;

}

.mv-solution-card:hover
.mv-solution-content h3{

    color:  #2b4573;

}


/*==================================================
        CONTENT DIVIDER
==================================================*/

.mv-content-divider{

    position:relative;

    overflow:hidden;

}

.mv-content-divider::before{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:100%;

    height:100%;

    background:#2b4573

}

.mv-solution-card:hover
.mv-content-divider::before{

    animation:dividerMove .8s linear;

}

@keyframes dividerMove{

0%{
left:-100%;
}

100%{
left:100%;
}

}


/*==================================================
            FEATURE PANEL
==================================================*/

.mv-feature-list{

    transition:.4s;

}

.mv-solution-card:hover
.mv-feature-list{

    border-left-color:#2a5fb7;

}


/*==================================================
            FEATURE ITEM
==================================================*/

.mv-feature-item{

    transition:.35s;

}

.mv-solution-card:hover
.mv-feature-item{

    transform:translateX(8px);

}


/*------------------------------------
    Feature Icon
------------------------------------*/

.mv-feature-icon{

    transition:
    .35s;

}

.mv-feature-item:hover
.mv-feature-icon{

    background:#2b4573;

    color:#ffffff;

    transform:rotate(360deg);

}


/*------------------------------------
    Feature Text
------------------------------------*/

.mv-feature-text h5{

    transition:.3s;

}

.mv-feature-item:hover
.mv-feature-text h5{

    color:#1b4d9b;

}

.mv-feature-text span{

    transition:.3s;

}

.mv-feature-item:hover
.mv-feature-text span{

    color:#4d6fa8;

}


/*==================================================
        PARAGRAPH
==================================================*/

.mv-solution-content p{

    transition:.35s;

}

.mv-solution-card:hover
.mv-solution-content p{

    color:#555;

}


/*==================================================
            FOCUS STATE
==================================================*/

.mv-solution-card:focus-within{

    outline:none;

    box-shadow:
    0 0 0 4px rgba(28,77,160,.12),
    0 20px 55px rgba(0,0,0,.12);

}


/*==================================================
        SMOOTH TRANSITIONS
==================================================*/

.mv-solution-card,
.mv-solution-card *,
.mv-solution-card::before,
.mv-solution-card::after{

    transition-duration:.35s;

    transition-timing-function:ease;

}



/*==================================================
            PART 2C
    SCROLL REVEAL & MICRO ANIMATIONS
==================================================*/


/*=====================================
        INITIAL REVEAL STATE
=====================================*/

.reveal{

    opacity:0;

    transform:translateY(80px);

    transition:
    opacity .9s ease,
    transform .9s ease;

    will-change:transform,opacity;

}


/* Active Class */

.reveal.active{

    opacity:1;

    transform:translateY(0);

}



/*=====================================
        CARD STAGGER
=====================================*/

.mv-solution-card:nth-child(2){

    transition-delay:.10s;

}

.mv-solution-card:nth-child(3){

    transition-delay:.20s;

}

.mv-solution-card:nth-child(4){

    transition-delay:.30s;

}

.mv-solution-card:nth-child(5){

    transition-delay:.40s;

}



/*=====================================
        IMAGE ENTRANCE
=====================================*/

.reveal .mv-solution-image{

    opacity:0;

    transform:translateX(-40px);

    transition:

    opacity .8s ease .2s,

    transform .8s ease .2s;

}

.reveal.active .mv-solution-image{

    opacity:1;

    transform:translateX(0);

}



/*=====================================
        CONTENT ENTRANCE
=====================================*/

.reveal .mv-solution-content{

    opacity:0;

    transform:translateY(30px);

    transition:

    opacity .8s ease .35s,

    transform .8s ease .35s;

}

.reveal.active .mv-solution-content{

    opacity:1;

    transform:translateY(0);

}



/*=====================================
        FEATURES ENTRANCE
=====================================*/

.reveal .mv-feature-list{

    opacity:0;

    transform:translateX(40px);

    transition:

    opacity .8s ease .45s,

    transform .8s ease .45s;

}

.reveal.active .mv-feature-list{

    opacity:1;

    transform:translateX(0);

}



/*=====================================
        BADGE FLOAT
=====================================*/

.mv-badge{

    animation:badgeFloat 4s ease-in-out infinite;

}

@keyframes badgeFloat{

0%{

    transform:translateY(0);

}

50%{

    transform:translateY(-4px);

}

100%{

    transform:translateY(0);

}

}



/*=====================================
        TITLE UNDERLINE
=====================================*/

.mv-title-divider{

    position:relative;

    overflow:hidden;

}

.mv-title-divider::before{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:100%;

    height:100%;

    background:#6da8ff;

    animation:titleLine 4s linear infinite;

}

@keyframes titleLine{

0%{

left:-100%;

}

100%{

left:100%;

}

}



/*=====================================
        FEATURE ICON PULSE
=====================================*/

.mv-feature-icon{

    position:relative;

    overflow:hidden;

}

.mv-feature-icon::after{

    content:"";

    position:absolute;

    width:100%;

    height:100%;

    border-radius:50%;

    border:2px solid rgba(30,75,160,.25);

    left:0;

    top:0;

    animation:pulseRing 2.8s infinite;

}

@keyframes pulseRing{

0%{

    transform:scale(1);

    opacity:.6;

}

70%{

    transform:scale(1.55);

    opacity:0;

}

100%{

    opacity:0;

}

}



/*=====================================
        IMAGE FLOAT
=====================================*/

.mv-solution-image{

    animation:imageFloat 6s ease-in-out infinite;

}

@keyframes imageFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-6px);

}

100%{

transform:translateY(0);

}

}



/*=====================================
        CARD GLOW
=====================================*/

.mv-solution-card{

    overflow:hidden;

}

.mv-solution-card .card-glow{

    display:none;

}

.mv-solution-card:hover{

    box-shadow:

    0 20px 50px rgba(0,0,0,.10),

    0 0 45px rgba(42,93,180,.08);

}



/*=====================================
        CONTENT FADE
=====================================*/

.mv-solution-content p{

    transition:

    opacity .4s,

    color .4s;

}

.mv-solution-card:hover

.mv-solution-content p{

    opacity:.95;

}



/*=====================================
        HEADING ANIMATION
=====================================*/

.mv-section-title{

    animation:fadeTitle .9s ease;

}

@keyframes fadeTitle{

0%{

opacity:0;

transform:translateY(40px);

}

100%{

opacity:1;

transform:translateY(0);

}

}



/*=====================================
        FEATURE ITEM DELAY
=====================================*/

.mv-feature-item{

    opacity:0;

    transform:translateX(25px);

}

.reveal.active .mv-feature-item{

    animation:featureFade .6s forwards;

}

.reveal.active .mv-feature-item:nth-child(1){

animation-delay:.55s;

}

.reveal.active .mv-feature-item:nth-child(2){

animation-delay:.70s;

}

.reveal.active .mv-feature-item:nth-child(3){

animation-delay:.85s;

}

.reveal.active .mv-feature-item:nth-child(4){

animation-delay:1s;

}

.reveal.active .mv-feature-item:nth-child(5){

animation-delay:1.15s;

}

@keyframes featureFade{

to{

opacity:1;

transform:translateX(0);

}

}



/*=====================================
        BUTTON RIPPLE READY
=====================================*/

.mv-feature-icon i{

    transition:

    transform .35s ease;

}

.mv-feature-item:hover i{

    transform:scale(1.25);

}



/*=====================================
        SCROLL PERFORMANCE
=====================================*/

.mv-solution-card,

.mv-solution-image,

.mv-feature-item{

    backface-visibility:hidden;

    transform-style:preserve-3d;

}



/*=====================================
    ACCESSIBILITY
=====================================*/

@media (prefers-reduced-motion: reduce){

*{

animation:none !important;

transition:none !important;

scroll-behavior:auto !important;

}

.reveal{

opacity:1 !important;

transform:none !important;

}

}


/*==================================================
        PART 2D
        RESPONSIVE MEDIA QUERIES
==================================================*/


/*=========================================
        LARGE DESKTOP
        1600px and Above
=========================================*/

@media only screen and (min-width:1600px){

.auto-container{
    max-width:1480px;
}

.mv-section-title{
    font-size:64px;
}

.mv-solution-card{

    grid-template-columns:
    360px
    1fr
    280px;

    gap:60px;

    padding:45px;
}

.mv-solution-content h3{
    font-size:50px;
}

.mv-solution-content p{
    font-size:18px;
}

.mv-feature-text h5{
    font-size:22px;
}

}



/*=========================================
            DESKTOP
    1200px - 1599px
=========================================*/

@media only screen and (max-width:1599px){

.mv-section-title{
    font-size:54px;
}

.mv-solution-card{

    grid-template-columns:
    300px
    1fr
    250px;

    gap:35px;

}

.mv-solution-content h3{
    font-size:42px;
}

}



/*=========================================
            LAPTOP
    992px - 1199px
=========================================*/

@media only screen and (max-width:1199px){

.mv-safety-section{

    padding:90px 0;

}

.mv-section-title{

    font-size:46px;

}

.mv-solution-card{

    grid-template-columns:

    270px
    1fr
    220px;

    gap:30px;

    padding:28px;

}

.mv-solution-image img{

    height:220px;

}

.mv-solution-content h3{

    font-size:34px;

}

.mv-solution-content p{

    font-size:15px;

    line-height:1.9;

}

.mv-feature-list{

    padding-left:25px;

}

.mv-feature-text h5{

    font-size:18px;

}

}



/*=========================================
            TABLET
    768px - 991px
=========================================*/

@media only screen and (max-width:991px){

.mv-safety-section{

    padding:80px 0;

}

.mv-safety-heading{

    margin-bottom:55px;

}

.mv-section-title{

    font-size:38px;

}

.mv-solution-card{

    grid-template-columns:1fr;

    gap:35px;

    padding:28px;

}

.mv-solution-image{

    width:100%;

}

.mv-solution-image img{

    width:100%;

    height:340px;

}

.mv-solution-content{

    text-align:left;

}

.mv-solution-content h3{

    font-size:32px;

}

.mv-feature-list{

    border-left:none;

    border-top:1px solid #ececec;

    padding-left:0;

    padding-top:25px;

}

.mv-feature-item{

    margin-bottom:25px;

}

}



/*=========================================
        LARGE MOBILE
    576px - 767px
=========================================*/

@media only screen and (max-width:767px){

.auto-container{

    padding:0 18px;

}

.mv-safety-section{

    padding:70px 0;

}

.mv-section-subtitle{

    font-size:12px;

    padding:9px 18px;

}

.mv-section-title{

    font-size:32px;

    line-height:1.25;

}

.mv-title-divider{

    margin-top:20px;

}

.mv-solution-card{

    border-radius:20px;

    padding:22px;

    gap:28px;

}

.mv-solution-image{

    border-radius:16px;

}

.mv-solution-image img{

    height:260px;

}

.mv-badge{

    font-size:12px;

    padding:8px 16px;

}

.mv-solution-content h3{

    font-size:28px;

}

.mv-solution-content p{

    font-size:15px;

    line-height:1.8;

}

.mv-feature-list{

    padding-top:20px;

}

.mv-feature-item{

    gap:14px;

}

.mv-feature-icon{

    width:32px;

    height:32px;

}

.mv-feature-text h5{

    font-size:18px;

}

.mv-feature-text span{

    font-size:14px;

}

}



/*=========================================
        MOBILE
    480px and Below
=========================================*/

@media only screen and (max-width:480px){

.auto-container{

    padding:0 15px;

}

.mv-safety-section{

    padding:60px 0;

}

.mv-safety-heading{

    margin-bottom:45px;

}

.mv-section-title{

    font-size:28px;

}

.mv-solution-card{

    padding:18px;

    border-radius:18px;

}

.mv-solution-image{

    border-radius:14px;

}

.mv-solution-image img{

    height:220px;

}

.mv-badge{

    width:100%;

    justify-content:center;

}

.mv-solution-content h3{

    font-size:24px;

    line-height:1.3;

}

.mv-content-divider{

    margin-bottom:18px;

}

.mv-solution-content p{

    font-size:14px;

    line-height:1.7;

}

.mv-feature-list{

    padding-top:18px;

}

.mv-feature-item{

    margin-bottom:18px;

}

.mv-feature-icon{

    width:30px;

    height:30px;

    font-size:11px;

}

.mv-feature-text h5{

    font-size:16px;

}

.mv-feature-text span{

    font-size:13px;

}

}



/*=========================================
        EXTRA SMALL DEVICES
    360px and Below
=========================================*/

@media only screen and (max-width:360px){

.mv-section-title{

    font-size:24px;

}

.mv-solution-card{

    padding:15px;

}

.mv-solution-image img{

    height:190px;

}

.mv-solution-content h3{

    font-size:22px;

}

.mv-solution-content p{

    font-size:13px;

}

.mv-feature-item{

    gap:10px;

}

.mv-feature-icon{

    width:28px;

    height:28px;

}

.mv-feature-text h5{

    font-size:15px;

}

.mv-feature-text span{

    font-size:12px;

}

}



/*=========================================
        LANDSCAPE MOBILE
=========================================*/

@media only screen and (max-height:500px) and (orientation:landscape){

.mv-safety-section{

    padding:50px 0;

}

.mv-solution-card{

    grid-template-columns:220px 1fr;

}

.mv-feature-list{

    grid-column:1 / -1;

    border-left:none;

    border-top:1px solid #ececec;

    padding-left:0;

    padding-top:20px;

}

}



/*=========================================
        HIGH RESOLUTION DEVICES
=========================================*/

@media only screen and (min-width:1920px){

.mv-section-title{

    font-size:68px;

}

.mv-solution-content h3{

    font-size:54px;

}

.mv-solution-content p{

    font-size:19px;

}

}



/*========================================
    SCROLL REVEAL PREPARATION
========================================*/

.mv-fire-card{

    opacity:0;

    transform:translateY(60px);

    transition:
        opacity .8s ease,
        transform .8s ease,
        box-shadow .4s ease;

    width: 1600px;
}

.mv-fire-card.mv-fire-visible{

    opacity:1;

    transform:translateY(0);
}

.mv-fire-card{
    margin-left:auto;
    margin-right:auto;
    margin-bottom:35px;
}



/*========================================
    STAGGER DELAY
========================================*/

.mv-fire-card:nth-child(2){

    transition-delay:.15s;
}

.mv-fire-card:nth-child(3){

    transition-delay:.3s;
}



/*========================================
    REDUCE MOTION
========================================*/

@media (prefers-reduced-motion: reduce){

.mv-fire-card,
.mv-fire-image,
.mv-fire-feature,
.mv-fire-icon{

    transition:none !important;

    animation:none !important;
}

}


/*==================================================
    MV FIRE SECTION
    RESPONSIVE CSS
==================================================*/


/*=========================================
    Large Desktop
=========================================*/

@media only screen and (min-width:1600px){

.mv-fire-card{

    grid-template-columns:420px 1fr 320px;

    gap:60px;
}

.mv-fire-main-title{

    font-size:54px;
}

.mv-fire-title{

    font-size:38px;
}

}



/*=========================================
    Desktop
=========================================*/

@media only screen and (max-width:1400px){

.mv-fire-card{

    grid-template-columns:330px 1fr 260px;

    gap:35px;
}

.mv-fire-main-title{

    font-size:44px;
}

.mv-fire-title{

    font-size:30px;
}

}



/*=========================================
    Laptop
=========================================*/

@media only screen and (max-width:1199px){

.mv-fire-section{

    padding:100px 0;
}

.mv-fire-card{

    grid-template-columns:300px 1fr;

    gap:35px;
}

.mv-fire-image-box{

    height:260px;
}

.mv-fire-feature-box{

    grid-column:1/-1;

    border-left:none;

    border-top:1px solid #ececec;

    padding-left:0;

    padding-top:30px;
}

.mv-fire-feature-box{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:20px;
}

.mv-fire-feature{

    margin-bottom:0;
}

}



/*=========================================
    Tablet Landscape
=========================================*/

@media only screen and (max-width:991px){

.mv-fire-section{

    padding:90px 0;
}

.mv-fire-heading{

    margin-bottom:55px;
}

.mv-fire-main-title{

    font-size:38px;
}

.mv-fire-card{

    grid-template-columns:1fr;

    gap:28px;

    padding:28px;
}

.mv-fire-image-box{

    height:340px;
}

.mv-fire-content{

    text-align:center;
}

.mv-fire-tag{

    margin-left:auto;

    margin-right:auto;
}

.mv-fire-divider{

    margin:18px auto 22px;
}

.mv-fire-feature-box{

    grid-template-columns:repeat(2,1fr);

    gap:18px;
}

}



/*=========================================
    Tablet Portrait
=========================================*/

@media only screen and (max-width:767px){

.mv-fire-section{

    padding:80px 0;
}

.mv-fire-main-title{

    font-size:32px;
}

.mv-fire-subtitle{

    font-size:12px;

    letter-spacing:2px;
}

.mv-fire-card{

    padding:24px;
}

.mv-fire-image-box{

    height:280px;
}

.mv-fire-title{

    font-size:26px;
}

.mv-fire-description{

    text-align:left;

    font-size:15px;
}

.mv-fire-feature-box{

    grid-template-columns:1fr;
}

}



/*=========================================
    Mobile
=========================================*/

@media only screen and (max-width:575px){

.mv-fire-section{

    padding:70px 0;
}

.mv-fire-main-title{

    font-size:27px;

    line-height:1.35;
}

.mv-fire-card{

    padding:20px;

    border-radius:18px;
}

.mv-fire-image-box{

    height:220px;

    border-radius:14px;
}

.mv-fire-image{

    border-radius:14px;
}

.mv-fire-title{

    font-size:22px;
}

.mv-fire-description{

    font-size:15px;

    line-height:1.8;
}

.mv-fire-feature{

    padding:12px;
}

.mv-fire-feature h5{

    font-size:16px;
}

.mv-fire-feature span{

    font-size:14px;
}

.mv-fire-icon{

    width:40px;

    height:40px;

    min-width:40px;
}

}



/*=========================================
    Small Mobile
=========================================*/

@media only screen and (max-width:420px){

.mv-fire-section{

    padding:60px 0;
}

.mv-fire-main-title{

    font-size:24px;
}

.mv-fire-title{

    font-size:20px;
}

.mv-fire-description{

    font-size:14px;
}

.mv-fire-image-box{

    height:190px;
}

.mv-fire-feature{

    gap:12px;
}

.mv-fire-icon{

    width:36px;

    height:36px;

    min-width:36px;
}

.mv-fire-feature h5{

    font-size:15px;
}

.mv-fire-feature span{

    font-size:13px;
}

}



/*=========================================
    Touch Devices
=========================================*/

@media (hover:none){

.mv-fire-card:hover{

    transform:none;
}

.mv-fire-image{

    transform:none !important;
}

.mv-fire-feature:hover{

    transform:none;

    background:transparent;
}

.mv-fire-icon{

    transform:none !important;
}

}



/*=========================================
    SERVICE INNER PAGE BOTTOM
=========================================*/

/*=========================================================
    MINERVA BENEFITS SECTION
    PART 2A - COMPLETE BASE CSS
=========================================================*/

.mv-benefit-section{
    position:relative;
    padding:90px 0;
    background:#ffffff;
    overflow:hidden;
}

.mv-benefit-section .auto-container{
    position:relative;
}

/*==================================================
    WRAPPER
==================================================*/

.mv-benefit-wrapper{

    max-width:1200px;      /* Change to 1100px or 1000px if you want it smaller */

    width:100%;

    margin:0 auto;

    display:grid;

    grid-template-columns:repeat(4,1fr);

    background:#ffffff;

    border:1px solid #eceff4;

    border-radius:18px;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(0,0,0,.05);

}
/*==================================================
    CARD
==================================================*/

.mv-benefit-card{

    position:relative;

    padding:35px 25px;

    text-align:center;

    background:#ffffff;

    transition:all .35s ease;

    cursor:default;

}

/* Divider */

.mv-benefit-card:not(:last-child){

    border-right:1px solid #edf1f5;
}

/*==================================================
    ICON
==================================================*/

.mv-benefit-icon{

    width:65px;

    height:65px;

    margin:0 auto 20px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:50%;

    background:#f7f9fc;

    border:1px solid #dfe5ef;

    transition:.35s ease;
}

.mv-benefit-icon i{

    font-size:28px;

    color:#2b4573;

    transition:.35s ease;
}

/*==================================================
    TITLE
==================================================*/

.mv-benefit-title{

    font-size:18px;

    font-weight:700;

    color:#7e8085;

    line-height:1.3;

    margin-bottom:12px;

    transition:.3s;
}

/*==================================================
    TEXT
==================================================*/

.mv-benefit-text{

    margin:0;

    font-size:15px;

    line-height:1.7;

    color:#6b7280;
}

/*==================================================
    SIMPLE HOVER
==================================================*/

.mv-benefit-card:hover{

    background:#fafcff;

    transform:translateY(-8px);
}

.mv-benefit-card:hover .mv-benefit-icon{

    background:#2b4573;

    border-color:#2b4573;

    transform:translateY(-5px);
}

.mv-benefit-card:hover .mv-benefit-icon i{

    color:#ffffff;

    transform:scale(1.10);
}

.mv-benefit-card:hover .mv-benefit-title{

    color:#2b4573;
}

/*==================================================
    SCROLL ANIMATION
==================================================*/

.mv-benefit-card{

    opacity:0;

    transform:translateY(50px);

    transition:
        opacity .7s ease,
        transform .7s ease,
        background .35s ease;
}

.mv-benefit-card.mv-benefit-show{

    opacity:1;
}

/*==================================================
    STAGGER
==================================================*/

.mv-benefit-card:nth-child(1){

    transition-delay:.05s;
}

.mv-benefit-card:nth-child(2){

    transition-delay:.15s;
}

.mv-benefit-card:nth-child(3){

    transition-delay:.25s;
}

.mv-benefit-card:nth-child(4){

    transition-delay:.35s;
}



/*=========================================================
    MINERVA BENEFITS SECTION
    PART 2B
=========================================================*/


/*==========================================
    HOVER EFFECT
==========================================*/

.mv-benefit-card{

    will-change:transform;

    transform:translateY(0);
}

.mv-benefit-card:hover{

    transform:translateY(-10px);

    box-shadow:
        0 18px 40px rgba(43,69,115,.12);
}

.mv-benefit-card:hover .mv-benefit-icon{

    background:#2b4573;

    border-color:#2b4573;

    transform:scale(1.08);
}

.mv-benefit-card:hover .mv-benefit-icon i{

    color:#fff;

    transform:scale(1.15);
}

.mv-benefit-card:hover .mv-benefit-title{

    color:#2b4573;
}


/*==========================================
    ICON TRANSITION
==========================================*/

.mv-benefit-icon{

    transition:
        background .35s ease,
        border-color .35s ease,
        transform .35s ease,
        box-shadow .35s ease;
}

.mv-benefit-icon i{

    transition:
        color .35s ease,
        transform .35s ease;
}


/*==========================================
    RESPONSIVE
==========================================*/


/* Laptop */

@media only screen and (max-width:1199px){

    .mv-benefit-wrapper{

        grid-template-columns:repeat(2,1fr);
    }

    .mv-benefit-card{

        border-right:none;

        border-bottom:1px solid #edf1f5;

        padding:45px 30px;
    }

    .mv-benefit-card:nth-child(2){

        border-right:none;
    }

    .mv-benefit-card:nth-child(3),
    .mv-benefit-card:nth-child(4){

        border-bottom:none;
    }

}


/* Tablet */

@media only screen and (max-width:991px){

    .mv-benefit-section{

        padding:70px 0;
    }

    .mv-benefit-card{

        padding:40px 25px;
    }

    .mv-benefit-icon{

        width:75px;
        height:75px;
    }

    .mv-benefit-icon i{

        font-size:32px;
    }

    .mv-benefit-title{

        font-size:24px;
    }

}


/* Mobile */

@media only screen and (max-width:767px){

    .mv-benefit-wrapper{

        grid-template-columns:1fr;
    }

    .mv-benefit-card{

        border-right:none;

        border-bottom:1px solid #edf1f5;

        padding:35px 25px;
    }

    .mv-benefit-card:last-child{

        border-bottom:none;
    }

    .mv-benefit-icon{

        width:68px;
        height:68px;
        margin-bottom:22px;
    }

    .mv-benefit-icon i{

        font-size:28px;
    }

    .mv-benefit-title{

        font-size:22px;
    }

    .mv-benefit-text{

        font-size:15px;

        line-height:1.8;
    }

}


/* Small Mobile */

@media only screen and (max-width:575px){

    .mv-benefit-section{

        padding:55px 0;
    }

    .mv-benefit-card{

        padding:30px 20px;
    }

    .mv-benefit-icon{

        width:62px;
        height:62px;
    }

    .mv-benefit-icon i{

        font-size:24px;
    }

    .mv-benefit-title{

        font-size:20px;
    }

    .mv-benefit-text{

        font-size:14px;

        line-height:1.7;
    }

}


/*==========================================
    TOUCH DEVICES
==========================================*/

@media (hover:none){

    .mv-benefit-card:hover{

        transform:none;

        box-shadow:none;
    }

    .mv-benefit-card:hover .mv-benefit-icon{

        transform:none;
    }

}


/*==========================================
    SOLUTION INNER POWER AND COOLING
==========================================*/

/*==================================================
        INNER HERO SECTION
        PART 2A - LAYOUT
==================================================*/

:root{

    --primary:#2b4573;
    --primary-light:#4568a5;
    --primary-dark:#1d3358;

    --text:#1d1d1d;
    --body:#6d7280;

    --white:#ffffff;

    --border:#e7edf6;

    --section-bg:#ffffff;

}



/*==================================================
        SECTION
==================================================*/

.mv-inner-hero{

    position:relative;

    overflow:hidden;

    background:var(--section-bg);

    padding:120px 0;

}



/*==================================================
        WRAPPER
==================================================*/

.mv-inner-hero-wrapper{

    display:grid;

    grid-template-columns:1fr 560px;

    align-items:center;

    gap:80px;

}



/*==================================================
        LEFT CONTENT
==================================================*/

.mv-inner-content{

    position:relative;

    z-index:2;

}



/*==================================================
        SUBTITLE
==================================================*/

.mv-inner-subtitle{

    display:inline-flex;

    align-items:center;

    gap:10px;

    font-size:13px;

    font-weight:700;

    letter-spacing:2px;

    text-transform:uppercase;

    color:var(--primary);

    margin-bottom:22px;

}

.mv-inner-subtitle::before{

    content:"";

    width:45px;

    height:2px;

    background:var(--primary);

}



/*==================================================
        TITLE
==================================================*/

.mv-inner-title{

    font-size:58px;

    line-height:1.08;

    font-weight:800;

    color:var(--text);

    margin-bottom:24px;

}

.mv-inner-title span{

    color:var(--primary);

}



/*==================================================
        DIVIDER
==================================================*/

.mv-inner-divider{

    width:70px;

    height:4px;

    border-radius:50px;

    background:var(--primary);

    margin-bottom:28px;

}



/*==================================================
        DESCRIPTION
==================================================*/

.mv-inner-description{

    font-size:12px;

    line-height:1.9;

    color:#7e8085;

    margin-bottom:22px;

    max-width:650px;

}



/*==================================================
        BUTTONS
==================================================*/

.mv-inner-buttons{

    display:flex;

    align-items:center;

    gap:18px;

    margin-top:40px;

}



/* Primary */

.mv-primary-btn{

    display:inline-flex;

    align-items:center;

    gap:12px;

    padding:16px 32px;

    border-radius:10px;

    background:var(--primary);

    color:#fff;

    font-size:15px;

    font-weight:600;

    transition:.35s;

}

.mv-primary-btn i{

    font-size:14px;

}



/* Outline */

.mv-outline-btn{

    display:inline-flex;

    align-items:center;

    justify-content:center;

    padding:16px 32px;

    border-radius:10px;

    border:2px solid var(--primary);

    color:var(--primary);

    font-size:15px;

    font-weight:600;

    transition:.35s;

}



/*==================================================
        RIGHT SIDE
==================================================*/

.mv-inner-image{

    position:relative;

}



/*==================================================
        IMAGE BOX
==================================================*/

.mv-image-box{

    position:relative;

    overflow:hidden;

    border-radius:22px;

    background:#f5f8ff;

    border:1px solid var(--border);

    padding:12px;

    box-shadow:

    0 18px 50px rgba(43,69,115,.12);

}

.mv-image-box img{

    width:100%;

    display:block;

    border-radius:16px;

}



/*==================================================
        FLOATING CARD
==================================================*/

.mv-floating-card{

    position:absolute;

    left:-40px;

    bottom:35px;

    display:flex;

    align-items:center;

    gap:18px;

    background:#fff;

    border-radius:18px;

    padding:18px 24px;

    border:1px solid var(--border);

    box-shadow:

    0 18px 40px rgba(0,0,0,.08);

}



/* Icon */

.mv-floating-icon{

    width:58px;

    height:58px;

    border-radius:50%;

    display:flex;

    align-items:center;

    justify-content:center;

    background:#eef3fb;

    color:var(--primary);

    font-size:24px;

}



/* Text */

.mv-floating-content h5{

    font-size:28px;

    font-weight:800;

    color:var(--primary);

    line-height:1;

    margin-bottom:5px;

}

.mv-floating-content span{

    font-size:14px;

    color:var(--body);

}



/*==================================================
        DECORATIVE SHAPES
==================================================*/

.mv-shape{

    position:absolute;

    border-radius:50%;

    z-index:-1;

}

.mv-shape-one{

    width:170px;

    height:170px;

    background:rgba(43,69,115,.05);

    top:-40px;

    left:-40px;

}

.mv-shape-two{

    width:110px;

    height:110px;

    background:rgba(43,69,115,.08);

    right:-20px;

    bottom:20px;

}

.mv-shape-three{

    width:50px;

    height:50px;

    background:rgba(43,69,115,.12);

    top:50%;

    right:-15px;

}



/*==================================================
        DOT PATTERN
==================================================*/

.mv-dot-pattern{

    position:absolute;

    top:-18px;

    right:-18px;

    width:110px;

    height:110px;

    background-image:radial-gradient(

    var(--primary) 1.5px,

    transparent 1.5px

    );

    background-size:12px 12px;

    opacity:.18;

}



/*==================================================
        LINKS
==================================================*/

.mv-primary-btn:hover{

    background:var(--primary-dark);

}

.mv-outline-btn:hover{

    background:var(--primary);

    color:#fff;

}



/*==================================================
        IMAGE
==================================================*/

.mv-image-box img{

    object-fit:cover;

    aspect-ratio:16/10;

}



/*==================================================
        SELECTION
==================================================*/

::selection{

    background:var(--primary);

    color:#fff;

}



/*==================================================
        PART 2B
        PREMIUM EFFECTS & ANIMATIONS
==================================================*/


/*=========================================
        HERO BACKGROUND
=========================================*/

.mv-inner-hero::before{

    content:"";

    position:absolute;

    width:650px;

    height:650px;

    border-radius:50%;

    background:radial-gradient(
    rgba(43,69,115,.06),
    transparent 70%
    );

    left:-220px;

    top:-220px;

    z-index:0;

}

.mv-inner-hero::after{

    content:"";

    position:absolute;

    width:500px;

    height:500px;

    border-radius:50%;

    background:radial-gradient(
    rgba(43,69,115,.05),
    transparent 75%
    );

    right:-180px;

    bottom:-180px;

}



/*=========================================
        IMAGE BOX
=========================================*/

.mv-image-box{

    transition:
    transform .6s ease,
    box-shadow .6s ease;

    cursor:pointer;

}

.mv-image-box:hover{

    transform:
    translateY(-10px);

    box-shadow:
    0 35px 80px rgba(43,69,115,.18);

}



/*=========================================
        IMAGE
=========================================*/

.mv-image-box{

    overflow:hidden;

}

.mv-image-box img{

    transition:
    transform .8s ease,
    filter .6s ease;

}

.mv-image-box:hover img{

    transform:scale(1.08);

    filter:brightness(1.05);

}



/*=========================================
        IMAGE OVERLAY
=========================================*/

.mv-image-box::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(

        to top,

        rgba(43,69,115,.35),

        transparent

    );

    opacity:0;

    transition:.45s;

    z-index:1;

}

.mv-image-box:hover::before{

    opacity:1;

}



/*=========================================
        SHINE EFFECT
=========================================*/

.mv-image-box::after{

    content:"";

    position:absolute;

    top:0;

    left:-150%;

    width:45%;

    height:100%;

    background:

    rgba(255,255,255,.45);

    transform:skewX(-25deg);

    transition:.9s;

    z-index:2;

}

.mv-image-box:hover::after{

    left:170%;

}



/*=========================================
        BUTTON HOVER
=========================================*/

.mv-primary-btn{

    position:relative;

    overflow:hidden;

}

.mv-primary-btn::before{

    content:"";

    position:absolute;

    width:0;

    height:100%;

    background:

    rgba(255,255,255,.12);

    left:0;

    top:0;

    transition:.45s;

}

.mv-primary-btn:hover::before{

    width:100%;

}

.mv-primary-btn:hover{

    transform:translateY(-3px);

}

.mv-outline-btn:hover{

    transform:translateY(-3px);

}



/*=========================================
        TITLE ANIMATION
=========================================*/

.mv-inner-title{

    animation:titleFade .9s ease;

}

@keyframes titleFade{

0%{

opacity:0;

transform:translateY(40px);

}

100%{

opacity:1;

transform:none;

}

}



/*=========================================
        DIVIDER
=========================================*/

.mv-inner-divider{

    position:relative;

    overflow:hidden;

}

.mv-inner-divider::before{

    content:"";

    position:absolute;

    left:-100%;

    width:100%;

    height:100%;

    background:#7b97c8;

    animation:dividerMove 4s linear infinite;

}

@keyframes dividerMove{

0%{

left:-100%;

}

100%{

left:100%;

}

}



/*=========================================
        FLOATING CARD
=========================================*/

.mv-floating-card{

    animation:floatCard 5s ease-in-out infinite;

}

@keyframes floatCard{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-10px);

}

100%{

transform:translateY(0);

}

}

.mv-floating-card:hover{

    transform:translateY(-10px) scale(1.05);

}



/*=========================================
        ICON
=========================================*/

.mv-floating-icon{

    transition:.45s;

}

.mv-floating-card:hover

.mv-floating-icon{

    background:var(--primary);

    color:#fff;

    transform:rotate(360deg);

}



/*=========================================
        SHAPES
=========================================*/

.mv-shape-one{

    animation:shapeOne 8s ease-in-out infinite;

}

.mv-shape-two{

    animation:shapeTwo 7s ease-in-out infinite;

}

.mv-shape-three{

    animation:shapeThree 6s ease-in-out infinite;

}

@keyframes shapeOne{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-25px);

}

}

@keyframes shapeTwo{

0%,100%{

transform:translateX(0);

}

50%{

transform:translateX(-18px);

}

}

@keyframes shapeThree{

0%,100%{

transform:scale(1);

}

50%{

transform:scale(1.25);

}

}



/*=========================================
        DOT PATTERN
=========================================*/

.mv-dot-pattern{

    animation:dotsFloat 8s linear infinite;

}

@keyframes dotsFloat{

0%{

transform:translateY(0);

}

50%{

transform:translateY(-18px);

}

100%{

transform:translateY(0);

}

}



/*=========================================
        DESCRIPTION
=========================================*/

.mv-inner-description{

    transition:.35s;

}

.mv-inner-content:hover

.mv-inner-description{

    color:#4d5563;

}



/*=========================================
        REVEAL
=========================================*/

.reveal{

    opacity:0;

    transform:translateY(80px);

    transition:

    opacity .9s ease,

    transform .9s ease;

}

.reveal.active{

    opacity:1;

    transform:none;

}



/*=========================================
        IMAGE FLOAT
=========================================*/

.mv-image-box{

    animation:imageFloat 6s ease-in-out infinite;

}

@keyframes imageFloat{

0%,100%{

transform:translateY(0);

}

50%{

transform:translateY(-8px);

}

}



/*=========================================
        SUBTITLE
=========================================*/

.mv-inner-subtitle{

    animation:fadeSubtitle 1s ease;

}

@keyframes fadeSubtitle{

0%{

opacity:0;

transform:translateX(-30px);

}

100%{

opacity:1;

transform:none;

}

}



/*=========================================
        BUTTONS
=========================================*/

.mv-primary-btn,
.mv-outline-btn{

    transition:

    transform .35s,

    background .35s,

    color .35s,

    border-color .35s;

}



/*=========================================
        GLASS EFFECT
=========================================*/

.mv-floating-card{

    backdrop-filter:blur(15px);

    -webkit-backdrop-filter:blur(15px);

}



/*=========================================
        SMOOTH
=========================================*/

.mv-inner-hero *{

    backface-visibility:hidden;

}



/*=========================================
        REDUCED MOTION
=========================================*/

@media (prefers-reduced-motion:reduce){

*{

animation:none !important;

transition:none !important;

}

}


/*==================================================
            RIPPLE
==================================================*/

.mv-primary-btn,
.mv-outline-btn{

    position:relative;

    overflow:hidden;

}

.ripple{

    position:absolute;

    border-radius:50%;

    transform:scale(0);

    background:rgba(255,255,255,.35);

    animation:ripple .6s linear;

    pointer-events:none;

}

@keyframes ripple{

to{

transform:scale(4);

opacity:0;

}

}



/*==================================================
        PART 2C
        RESPONSIVE MEDIA QUERIES
==================================================*/


/*=========================================
        LARGE DESKTOP
        1600px+
=========================================*/

@media only screen and (min-width:1600px){

.auto-container{
    max-width:1480px;
}

.mv-inner-hero{
    padding:60px 0;
}

.mv-inner-hero-wrapper{
    grid-template-columns:1fr 650px;
    gap:110px;
}

.mv-inner-title{
    font-size:68px;
}

.mv-inner-description{
    font-size:18px;
}

.mv-floating-card{
    left:-60px;
}

}



/*=========================================
        DESKTOP
        1200px - 1599px
=========================================*/

@media only screen and (max-width:1599px){

.mv-inner-title{
    font-size:44px;
}

.mv-inner-hero-wrapper{
    gap:70px;
}

}



/*=========================================
        LAPTOP
        992px - 1199px
=========================================*/

@media only screen and (max-width:1199px){

.mv-inner-hero{

    padding:100px 0;

}

.mv-inner-hero-wrapper{

    grid-template-columns:1fr 480px;

    gap:50px;

}

.mv-inner-title{

    font-size:34px;

}

.mv-inner-description{

    font-size:11px;

}

.mv-primary-btn,
.mv-outline-btn{

    padding:15px 28px;

}

.mv-floating-card{

    left:-20px;

    bottom:20px;

    padding:16px 20px;

}

.mv-floating-icon{

    width:52px;

    height:52px;

}

.mv-floating-content h5{

    font-size:24px;

}

}



/*=========================================
        TABLET
        768px - 991px
=========================================*/

@media only screen and (max-width:991px){

.mv-inner-hero{

    padding:90px 0;

}

.mv-inner-hero-wrapper{

    grid-template-columns:1fr;

    gap:60px;

}

.mv-inner-content{

    order:2;

    text-align:center;

}

.mv-inner-image{

    order:1;

    max-width:650px;

    margin:auto;

}

.mv-inner-subtitle{

    justify-content:center;

}

.mv-inner-subtitle::before{

    display:none;

}

.mv-inner-divider{

    margin:25px auto;

}

.mv-inner-description{

    max-width:100%;

}

.mv-inner-buttons{

    justify-content:center;

}

.mv-floating-card{

    left:30px;

    bottom:25px;

}

}



/*=========================================
        LARGE MOBILE
        576px - 767px
=========================================*/

@media only screen and (max-width:767px){

.mv-inner-hero{

    padding:70px 0;

}

.mv-inner-title{

    font-size:38px;

    line-height:1.2;

}

.mv-inner-subtitle{

    font-size:12px;

    letter-spacing:1px;

}

.mv-inner-description{

    font-size:15px;

    line-height:1.8;

}

.mv-inner-buttons{

    flex-direction:column;

    align-items:stretch;

    gap:15px;

}

.mv-primary-btn,
.mv-outline-btn{

    justify-content:center;

    width:100%;

}

.mv-floating-card{

    position:relative;

    left:0;

    bottom:0;

    margin-top:20px;

}

.mv-image-box{

    padding:8px;

}

}



/*=========================================
        MOBILE
        480px and Below
=========================================*/

@media only screen and (max-width:480px){

.mv-inner-hero{

    padding:60px 0;

}

.mv-inner-title{

    font-size:31px;

}

.mv-inner-subtitle{

    font-size:11px;

}

.mv-inner-description{

    font-size:14px;

}

.mv-inner-buttons{

    margin-top:30px;

}

.mv-primary-btn,
.mv-outline-btn{

    padding:14px 20px;

    font-size:14px;

}

.mv-floating-card{

    flex-direction:column;

    text-align:center;

    gap:12px;

    padding:18px;

}

.mv-floating-icon{

    width:50px;

    height:50px;

}

.mv-floating-content h5{

    font-size:22px;

}

.mv-dot-pattern{

    width:70px;

    height:70px;

}

.mv-shape-one{

    width:100px;

    height:100px;

}

.mv-shape-two{

    width:70px;

    height:70px;

}

}



/*=========================================
        EXTRA SMALL
        360px and Below
=========================================*/

@media only screen and (max-width:360px){

.mv-inner-title{

    font-size:27px;

}

.mv-inner-description{

    font-size:13px;

}

.mv-primary-btn,
.mv-outline-btn{

    padding:13px 18px;

    font-size:13px;

}

.mv-floating-card{

    padding:15px;

}

.mv-floating-content h5{

    font-size:20px;

}

}



/*=========================================
        LANDSCAPE MOBILE
=========================================*/

@media only screen and (max-height:520px)
and (orientation:landscape){

.mv-inner-hero{

    padding:50px 0;

}

.mv-inner-hero-wrapper{

    grid-template-columns:1fr 420px;

    gap:35px;

}

.mv-inner-title{

    font-size:34px;

}

.mv-floating-card{

    display:none;

}

}



/*=========================================
        ULTRA HD
        1920px+
=========================================*/

@media only screen and (min-width:1920px){

.mv-inner-title{

    font-size:48px;

}

.mv-inner-description{

    font-size:16px;

}

.mv-image-box{

    border-radius:28px;

}

}




/*==================================================
        SOLUTION INNER PAGE POWER AND COOLING -2
==================================================*/


/*=========================================
    SOLUTION SECTION
=========================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family: "Inter", sans-serif;
    background:#ffffff;
}

.container{
    width:100%;
    max-width:1320px;
    margin:auto;
    padding:0 15px;
}

.solution-section{
    padding:80px 0;
    background:#fff;
}

.solution-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:22px;
}


.solution-two-wrapper{
    max-width:770px;
    margin:0 auto;
}

.solution-two-wrapper .solution-grid{
    grid-template-columns:repeat(2,1fr);
}

/*=========================================
    CARD
=========================================*/

.solution-card{
    position:relative;
    background:#fff;
    border:1px solid #e8edf7;
    border-radius:12px;
    padding:34px 32px 70px;
    overflow:hidden;
    transition:.45s ease;
    min-height:335px;
}


/*=========================================
    ICON
=========================================*/

.solution-icon{
    width:74px;
    height:74px;
    border-radius:50%;
    background:#eef3fb;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:0 auto 28px;
    transition:.4s ease;
}

.solution-icon i{
    font-size:34px;
    color:white;
    transition:.4s ease;
}


/*=========================================
    TITLE
=========================================*/

.solution-card h3{
    font-size:31px;
    line-height:1.2;
    font-weight:700;
    color:#111827;
    margin-bottom:14px;
}


/*=========================================
    BLUE UNDERLINE
=========================================*/

.title-line{
    display:block;
    width:32px;
    height:2px;
    background:#2b4573;
    margin-bottom:22px;
    transition:.4s ease;
}


/*=========================================
    DESCRIPTION
=========================================*/

.solution-card p{
    color:#7e8085;
    font-size:16px;
    line-height:1.9;
    font-weight:400;
    margin-bottom:34px;
}


/*=========================================
    BUTTON
=========================================*/

.learn-btn{
    display:inline-flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    color:#2b4573;
    font-size:15px;
    font-weight:700;
    transition:.35s ease;
}

.learn-btn i{
    font-size:14px;
    transition:.35s ease;
}


/*=========================================
    NUMBER CIRCLE
=========================================*/

.card-number{
    position:absolute;
    width:92px;
    height:92px;
    right:-46px;
    bottom:-46px;
    background:#2b4573;
    border-radius:50%;
    display:flex;
    justify-content:flex-start;
    align-items:flex-start;
    transition:.45s ease;
}

.card-number span{
    position:absolute;
    top:18px;
    left:18px;
    color:#fff;
    font-size:14px;
    font-weight:700;
}


/*=========================================
    CARD SHADOW
=========================================*/

.solution-card{
    box-shadow:
        0 8px 25px rgba(18,38,63,.05);
}



/*=========================================
    CARD HOVER EFFECT
=========================================*/

.solution-card:hover{
    transform:translateY(-12px);
    border-color:#2b4573;
    box-shadow:0 18px 45px rgba(43,69,115,.16);
}


/*=========================================
    ICON HOVER
=========================================*/

.solution-card:hover .solution-icon{
    background:#2b4573;
    transform:translateY(-6px) rotate(8deg);
}

.solution-card:hover .solution-icon i{
    color:#ffffff;
}


/*=========================================
    TITLE LINE ANIMATION
=========================================*/

.solution-card:hover .title-line{
    width:70px;
}


/*=========================================
    LEARN MORE BUTTON
=========================================*/

.solution-card:hover .learn-btn{
    color:#2b4573;
}

.solution-card:hover .learn-btn i{
    transform:translateX(6px);
}


/*=========================================
    BOTTOM CIRCLE
=========================================*/

.solution-card:hover .card-number{
    width:108px;
    height:108px;
    right:-54px;
    bottom:-54px;
    background:#2b4573;
}

.solution-card:hover .card-number span{
    transform:scale(1.08);
}


/*=========================================
    SMOOTH TRANSITIONS
=========================================*/

.solution-card,
.solution-icon,
.solution-icon i,
.title-line,
.learn-btn,
.learn-btn i,
.card-number,
.card-number span{
    transition:all .4s ease;
}


/*=========================================
    OPTIONAL FADE-UP ANIMATION
=========================================*/

.solution-card{
    opacity:0;
    transform:translateY(35px);
    animation:cardFade .8s ease forwards;
}

/* Stagger Delay */

.solution-card:nth-child(1){
    animation-delay:.1s;
}

.solution-card:nth-child(2){
    animation-delay:.25s;
}

.solution-card:nth-child(3){
    animation-delay:.4s;
}

.solution-card:nth-child(4){
    animation-delay:.55s;
}


/*=========================================
    KEYFRAMES
=========================================*/

@keyframes cardFade{

    from{
        opacity:0;
        transform:translateY(35px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}


/*=========================================
    ACCESSIBILITY
=========================================*/

.solution-card:focus-within{
    transform:translateY(-12px);
    border-color:#2b4573;
    box-shadow:0 18px 45px rgba(43,69,115,.16);
}

.learn-btn:focus{
    outline:none;
}

.learn-btn:focus-visible{
    outline:2px solid #2b4573;
    outline-offset:4px;
    border-radius:4px;
}


/*=========================================
    LARGE DESKTOP
=========================================*/
@media (min-width:1400px){

    .container{
        max-width:1320px;
    }

    .solution-grid{
        gap:24px;
    }

    .solution-card{
        padding:34px 32px 70px;
    }

}


/*=========================================
    DESKTOP
=========================================*/
@media (max-width:1199px){

    .solution-section{
        padding:70px 0;
    }

    .solution-grid{
        gap:20px;
    }

    .solution-card{
        min-height:320px;
        padding:30px 26px 65px;
    }

    .solution-card h3{
        font-size:28px;
    }

    .solution-card p{
        font-size:15px;
        line-height:1.8;
    }

}


/*=========================================
    LAPTOP
=========================================*/
@media (max-width:991px){

    .solution-grid{
        grid-template-columns:repeat(2,1fr);
        gap:22px;
    }

    .solution-card{
        min-height:310px;
        padding:30px 28px 65px;
    }

    .solution-card h3{
        font-size:27px;
    }

    .solution-icon{
        width:72px;
        height:72px;
    }

    .solution-icon i{
        font-size:32px;
    }

}


/*=========================================
    TABLET
=========================================*/
@media (max-width:767px){

    .solution-section{
        padding:60px 0;
    }

    .solution-grid{
        grid-template-columns:1fr;
        gap:22px;
    }

    .solution-card{
        min-height:auto;
        padding:30px 24px 65px;
    }

    .solution-card h3{
        font-size:26px;
    }

    .solution-card p{
        font-size:15px;
    }

    .solution-icon{
        width:68px;
        height:68px;
        margin-bottom:24px;
    }

    .solution-icon i{
        font-size:30px;
    }

    .card-number{
        width:86px;
        height:86px;
        right:-43px;
        bottom:-43px;
    }

    .card-number span{
        top:17px;
        left:17px;
    }

}

/*=========================================
    LARGE MOBILE
=========================================*/
@media (max-width:575px){

    .container{
        padding:0 16px;
    }

    .solution-section{
        padding:50px 0;
    }

    .solution-card{
        padding:28px 22px 60px;
        border-radius:10px;
    }

    .solution-card h3{
        font-size:24px;
        margin-bottom:12px;
    }

    .solution-card p{
        font-size:14px;
        line-height:1.8;
        margin-bottom:28px;
    }

    .solution-icon{
        width:65px;
        height:65px;
        margin-bottom:22px;
    }

    .solution-icon i{
        font-size:28px;
    }

    .title-line{
        margin-bottom:18px;
    }

    .learn-btn{
        font-size:14px;
    }

    .card-number{
        width:82px;
        height:82px;
        right:-41px;
        bottom:-41px;
    }

    .card-number span{
        font-size:13px;
        top:16px;
        left:16px;
    }

}


/*=========================================
    SMALL MOBILE
=========================================*/
@media (max-width:400px){

    .solution-card{
        padding:24px 20px 58px;
    }

    .solution-card h3{
        font-size:22px;
    }

    .solution-card p{
        font-size:13px;
        line-height:1.7;
    }

    .solution-icon{
        width:60px;
        height:60px;
    }

    .solution-icon i{
        font-size:26px;
    }

    .learn-btn{
        font-size:13px;
    }

    .card-number{
        width:78px;
        height:78px;
        right:-39px;
        bottom:-39px;
    }

    .card-number span{
        font-size:12px;
        top:15px;
        left:15px;
    }

}


/*=========================================
    TOUCH DEVICES
=========================================*/
@media (hover:none){

    .solution-card:hover{
        transform:none;
    }

    .solution-card:hover .solution-icon{
        transform:none;
    }

    .solution-card:hover .learn-btn i{
        transform:none;
    }

}







/*=========================================
    INNER SERVICE PAGE
=========================================*/

/*==================================================
    INNER SERVICE SECTION
==================================================*/

.inner-service-section{
    position:relative;
    padding:120px 0;
    background:#ffffff;
}

.inner-service-section *{
    box-sizing:border-box;
}

.inner-service-wrapper{
    display:grid;
    grid-template-columns:330px 1fr;
    gap:60px;
    align-items:flex-start;
}


/*==================================================
    SIDEBAR
==================================================*/

.inner-service-sidebar{
    position:sticky;
    top:120px;
}


/*==================================================
    SERVICE MENU
==================================================*/

.inner-service-menu{
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-bottom:35px;
}


/*==================================================
    MENU ITEM
==================================================*/

.inner-service-menu-item{

    position:relative;

    display:flex;
    justify-content:space-between;
    align-items:center;

    padding:18px 22px;

    background:#f6f7fb;

    border:1px solid #edf0f7;

    border-radius:6px;

    color:#1d2433;

    text-decoration:none;

    transition:.35s ease;

    overflow:hidden;

}


/* Left Blue Border */

.inner-service-menu-item::before{

    content:"";

    position:absolute;

    left:0;
    top:0;

    width:0;

    height:100%;

    background:#2b4573;

    transition:.35s;

}


.inner-service-menu-item span{

    position:relative;

    z-index:2;

    font-size:15px;

    font-weight:600;

    line-height:1.5;

}


.inner-service-menu-item i{

    position:relative;

    z-index:2;

    font-size:14px;

    color:#2b4573;

    transition:.35s;

}


/*==================================================
    ACTIVE MENU
==================================================*/

.inner-service-active{

    background:#2b4573;

    border-color:#2b4573;

}

.inner-service-active span{

    color:#ffffff;

}

.inner-service-active i{

    color:#ffffff;

}


/*==================================================
    MENU HOVER
==================================================*/

.inner-service-menu-item:hover{

    border-color:#2b4573;

    transform:translateX(5px);

}

.inner-service-menu-item:hover::before{

    width:5px;

}

.inner-service-menu-item:hover i{

    transform:translateX(5px);

}


/*==================================================
    HELP BOX
==================================================*/

.inner-service-help-box{

    background:#f7f8fc;

    border-radius:18px;

    padding:35px 30px;

    border:1px solid #edf0f7;

}


.inner-service-help-box h3{

    font-size:30px;

    color:#2b4573;

    margin-bottom:14px;

    font-weight:700;

}


.inner-service-help-box>p{

    color:#6b7280;

    font-size:15px;

    line-height:1.8;

    margin-bottom:35px;

}


/*==================================================
    HELP ITEM
==================================================*/

.inner-service-help-item{

    display:flex;

    align-items:flex-start;

    gap:18px;

}

.inner-service-help-item:not(:last-child){

    margin-bottom:30px;

}


/*==================================================
    HELP ICON
==================================================*/

.inner-service-help-icon{

    width:56px;

    height:56px;

    min-width:56px;

    border-radius:50%;

    border:2px solid #2b4573;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#2b4573;

    font-size:18px;

    transition:.35s;

}


/*==================================================
    HELP CONTENT
==================================================*/

.inner-service-help-content{

    flex:1;

}

.inner-service-help-content span{

    display:block;

    color:#8b8f98;

    font-size:13px;

    margin-bottom:6px;

    font-weight:600;

}

.inner-service-help-content a{

    display:block;

    color:#111827;

    text-decoration:none;

    font-size:15px;

    font-weight:700;

    transition:.35s;

}

.inner-service-help-content p{

    color:#111827;

    font-size:15px;

    line-height:1.8;

    font-weight:600;

}


/*==================================================
    HELP BOX HOVER
==================================================*/

.inner-service-help-item:hover .inner-service-help-icon{

    background:#2b4573;

    color:#ffffff;

    transform:rotate(-10deg);

}

.inner-service-help-item:hover a{

    color:#2b4573;

}


/*==================================================
    CONTENT WRAPPER
==================================================*/

.inner-service-content{

    width:100%;

}


/*==================================================
    CONTENT AREA
==================================================*/

.inner-service-content{
    position:relative;
}

.inner-service-image{
    position:relative;
    overflow:hidden;
    border-radius:28px;
    margin-bottom:40px;
    background:#f4f6fb;
}

.inner-service-image img{
    width:100%;
    display:block;
    border-radius:28px;
    transition:.6s ease;
}

.inner-service-image:hover img{
    transform:scale(1.05);
}


/*==================================================
    TITLE
==================================================*/

.inner-service-title{

    font-size:48px;

    font-weight:700;

    line-height:1.2;

    color:#2b4573;

    margin-bottom:20px;

}


/*==================================================
    PARAGRAPH
==================================================*/

.inner-service-text{

    font-size:17px;

    color:#6b7280;

    line-height:1.95;

    margin-bottom:28px;

}


/*==================================================
    BULLET LIST
==================================================*/

.inner-service-list{

    margin:40px 0;

}

.inner-service-list-item{

    display:flex;

    align-items:flex-start;

    gap:16px;

}

.inner-service-list-item:not(:last-child){

    margin-bottom:22px;

}

.inner-service-list-item i{

    width:26px;

    height:26px;

    min-width:26px;

    border-radius:50%;

    background:#2b4573;

    color:#ffffff;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:12px;

    margin-top:3px;

    transition:.35s;

}

.inner-service-list-item span{

    font-size:17px;

    line-height:1.8;

    color:#222;

    font-weight:500;

}


/*==================================================
    HOVER EFFECTS
==================================================*/

.inner-service-list-item:hover i{

    transform:rotate(360deg);

    background:#1f3760;

}

.inner-service-list-item:hover span{

    color:#2b4573;

}


/*==================================================
    IMAGE SHADOW
==================================================*/

.inner-service-image{

    box-shadow:

    0 15px 40px rgba(25,42,70,.08);

}


/*==================================================
    CONTENT ANIMATION
==================================================*/

.inner-service-content{

    animation:inner-service-fade .8s ease;

}

.inner-service-sidebar{

    animation:inner-service-left .8s ease;

}


/*==================================================
    KEYFRAMES
==================================================*/

@keyframes inner-service-fade{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

@keyframes inner-service-left{

    from{

        opacity:0;

        transform:translateX(-40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}


/*==================================================
    IMAGE OVERLAY
==================================================*/

.inner-service-image::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        180deg,
        rgba(43,69,115,0) 55%,
        rgba(43,69,115,.08) 100%
    );

    pointer-events:none;

}


/*==================================================
    TEXT SELECTION
==================================================*/

.inner-service-content ::selection{

    background:#2b4573;

    color:#ffffff;

}


/*==================================================
    LINKS
==================================================*/

.inner-service-content a{

    color:#2b4573;

    text-decoration:none;

    transition:.3s;

}

.inner-service-content a:hover{

    color:#1f3760;

}


/*==================================================
    SMOOTH TRANSITIONS
==================================================*/

.inner-service-image,
.inner-service-image img,
.inner-service-list-item,
.inner-service-list-item i,
.inner-service-list-item span,
.inner-service-help-icon,
.inner-service-menu-item,
.inner-service-menu-item i{

    transition:all .35s ease;

}



/*==================================================
    LARGE DESKTOP (1400px+)
==================================================*/

@media (min-width:1400px){

    .inner-service-wrapper{
        grid-template-columns:330px 1fr;
        gap:60px;
    }

}


/*==================================================
    DESKTOP (1200px - 1399px)
==================================================*/

@media (max-width:1399px){

    .inner-service-wrapper{
        gap:50px;
    }

    .inner-service-title{
        font-size:42px;
    }

}


/*==================================================
    LAPTOP (992px - 1199px)
==================================================*/

@media (max-width:1199px){

    .inner-service-section{
        padding:90px 0;
    }

    .inner-service-wrapper{
        grid-template-columns:290px 1fr;
        gap:40px;
    }

    .inner-service-menu-item{
        padding:16px 18px;
    }

    .inner-service-menu-item span{
        font-size:14px;
    }

    .inner-service-help-box{
        padding:28px 24px;
    }

    .inner-service-help-box h3{
        font-size:28px;
    }

    .inner-service-title{
        font-size:38px;
    }

    .inner-service-text{
        font-size:16px;
    }

    .inner-service-help-content a{
        font-size: 13px;
    }

}


/*==================================================
    TABLET (768px - 991px)
==================================================*/

@media (max-width:991px){

    .inner-service-wrapper{
        grid-template-columns:1fr;
        gap:45px;
    }

    .inner-service-sidebar{
        position:relative;
        top:0;
        width:100%;
    }

    .inner-service-menu{
        margin-bottom:30px;
    }

    .inner-service-help-box{
        margin-bottom:10px;
    }

    .inner-service-image{
        margin-bottom:30px;
    }

    .inner-service-title{
        font-size:36px;
    }

     .inner-service-wrapper{

        display:flex;
        flex-direction:column;

    }

    /* Right content first */

    .inner-service-content{

        order:1;

    }

    /* Sidebar below */

    .inner-service-sidebar{

        order:2;

        position:relative;
        top:0;
        width:100%;
        margin-top:40px;

    }


}


/*==================================================
    MOBILE LANDSCAPE
==================================================*/

@media (max-width:767px){

    .inner-service-section{
        padding:70px 0;
    }

    .inner-service-wrapper{
        gap:35px;
    }

    .inner-service-menu-item{
        padding:15px 18px;
    }

    .inner-service-menu-item span{
        font-size:14px;
    }

    .inner-service-help-box{
        padding:28px 22px;
        border-radius:15px;
    }

    .inner-service-help-box h3{
        font-size:26px;
    }

    .inner-service-help-item{
        gap:15px;
    }

    .inner-service-help-icon{
        width:52px;
        height:52px;
        min-width:52px;
        font-size:17px;
    }

    .inner-service-title{
        font-size:32px;
    }

    .inner-service-text{
        font-size:15px;
        line-height:1.9;
    }

    .inner-service-list{
        margin:30px 0;
    }

    .inner-service-list-item span{
        font-size:15px;
    }


    .inner-service-wrapper{

        display:flex;
        flex-direction:column;

    }

    .inner-service-content{

        order:1;

    }

    .inner-service-sidebar{

        order:2;

        position:relative;
        top:0;
        width:100%;
        margin-top:35px;

    }


}


/*==================================================
    MOBILE
==================================================*/

@media (max-width:575px){

    .inner-service-section{
        padding:60px 0;
    }

    .inner-service-wrapper{
        gap:30px;
    }

    .inner-service-image{
        border-radius:18px;
    }

    .inner-service-image img{
        border-radius:18px;
    }

    .inner-service-title{
        font-size:28px;
        line-height:1.3;
        margin-bottom:18px;
    }

    .inner-service-text{
        font-size:15px;
        margin-bottom:20px;
    }

    .inner-service-menu-item{
        padding:15px 16px;
    }

    .inner-service-menu-item span{
        font-size:13px;
    }

    .inner-service-help-box{
        padding:24px 20px;
    }

    .inner-service-help-box h3{
        font-size:24px;
    }

    .inner-service-help-box>p{
        font-size:14px;
    }

    .inner-service-help-item{
        gap:14px;
    }

    .inner-service-help-icon{
        width:48px;
        height:48px;
        min-width:48px;
        font-size:16px;
    }

    .inner-service-help-content a{
        font-size:15px;
    }

    .inner-service-help-content p{
        font-size:14px;
    }

    .inner-service-list-item{
        gap:12px;
    }

    .inner-service-list-item i{
        width:22px;
        height:22px;
        min-width:22px;
        font-size:10px;
    }

    .inner-service-list-item span{
        font-size:14px;
        line-height:1.7;
    }

}


/*==================================================
    SMALL MOBILE
==================================================*/

@media (max-width:400px){

    .inner-service-title{
        font-size:24px;
    }

    .inner-service-text{
        font-size:14px;
    }

    .inner-service-menu-item{
        padding:14px;
    }

    .inner-service-menu-item span{
        font-size:12px;
    }

    .inner-service-help-box{
        padding:20px 18px;
    }

    .inner-service-help-box h3{
        font-size:22px;
    }

    .inner-service-help-icon{
        width:44px;
        height:44px;
        min-width:44px;
        font-size:15px;
    }

}


/*==================================================
    TOUCH DEVICES
==================================================*/

@media (hover:none){

    .inner-service-menu-item:hover{

        transform:none;

    }

    .inner-service-image:hover img{

        transform:none;

    }

    .inner-service-list-item:hover i{

        transform:none;

    }

}


/*=========================================
    SCROLL REVEAL
=========================================*/

.inner-service-hidden{

    opacity:0;

    transform:translateY(40px);

    transition:all .8s ease;

}

.inner-service-show{

    opacity:1;

    transform:translateY(0);

}


/*=========================================
    STAGGER EFFECT
=========================================*/

.inner-service-list-item:nth-child(1){

    transition-delay:.1s;

}

.inner-service-list-item:nth-child(2){

    transition-delay:.2s;

}

.inner-service-list-item:nth-child(3){

    transition-delay:.3s;

}

.inner-service-list-item:nth-child(4){

    transition-delay:.4s;

}

.inner-service-list-item:nth-child(5){

    transition-delay:.5s;

}




/*==================================================
    INNER INNER SOLUTION PAGE
==================================================*/


/*==================================================
    INNER SOLUTION SECTION
==================================================*/

.inner-soln-section{
    position:relative;
    padding:110px 0 90px;
    background:#ffffff;
    overflow:hidden;
}

.inner-soln-section *{
    box-sizing:border-box;
}


/*==================================================
    WRAPPER
==================================================*/

.inner-soln-wrapper{

    display:grid;

    grid-template-columns:1fr 1.1fr;

    gap:70px;

    align-items:center;

    margin-bottom:80px;

}


/*==================================================
    LEFT CONTENT
==================================================*/

.inner-soln-content{

    position:relative;

}


/*==================================================
    SUB TITLE
==================================================*/

.inner-soln-subtitle{

    position:relative;

    display:inline-block;

    color:#2b4573;

    text-transform:uppercase;

    letter-spacing:3px;

    font-size:24px;

    font-weight:700;

    padding-top:28px;

    margin-bottom:32px;

}

.inner-soln-subtitle::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:55px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

}


/*==================================================
    TITLE
==================================================*/

.inner-soln-title{

    font-size:35px;

    line-height:1.18;

    font-weight:800;

    color:#121826;

    margin-bottom:34px;

}

.inner-soln-title span{

    color:#2b4573;

}


/*==================================================
    DIVIDER
==================================================*/

.inner-soln-divider{

    width:55px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

    margin-bottom:34px;

}


/*==================================================
    PARAGRAPH
==================================================*/

.inner-soln-text{

    font-size:16px;

    line-height:1.9;

    color:#7e8085;

    margin-bottom:28px;

}

.inner-soln-text:last-child{

    margin-bottom:0;

}


/*==================================================
    RIGHT IMAGE
==================================================*/

.inner-soln-image{

    position:relative;

    overflow:hidden;

    border-radius:28px;

    box-shadow:0 20px 60px rgba(24,44,73,.10);

}

.inner-soln-image img{

    width:100%;

    display:block;

    border-radius:28px;

    transition:.6s ease;

}


/*==================================================
    IMAGE HOVER
==================================================*/

.inner-soln-image:hover img{

    transform:scale(1.04);

}


/*==================================================
    PRODUCT HEADING
==================================================*/

.inner-soln-product-heading{

    margin-bottom:40px;

}

.inner-soln-product-heading span{

    position:relative;

    display:inline-block;

    color:#2b4573;

    text-transform:uppercase;

    font-size:28px;

    font-weight:700;

    letter-spacing:3px;

    padding-bottom:20px;

}

.inner-soln-product-heading span::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:55px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

}


/*==================================================
    PRODUCT GRID
==================================================*/

.inner-soln-product-grid{

    display:grid;

    grid-template-columns:repeat(3,1fr);

    gap:32px;

}


/*==================================================
    SECTION BOTTOM BORDER
==================================================*/

.inner-soln-product-grid::after{

    content:"";

    grid-column:1/-1;

    height:1px;

    background:#e8edf6;

    margin-top:8px;

}


/*==================================================
    PRODUCT CARD
==================================================*/

.inner-soln-product-card{

    position:relative;

    display:flex;

    align-items:flex-start;

    gap:28px;

    padding:38px 34px;

    background:#ffffff;

    border:1px solid #edf1f8;

    border-radius:18px;

    overflow:hidden;

    transition:all .4s ease;

    box-shadow:0 10px 35px rgba(20,42,71,.05);

}


/*==================================================
    PRODUCT ICON
==================================================*/

.inner-soln-product-icon{

    width:86px;

    height:86px;

    min-width:86px;

    border-radius:50%;

    background:#f3f6fc;

    display:flex;

    justify-content:center;

    align-items:center;

    transition:.4s;

}

.inner-soln-product-icon i{

    font-size:38px;

    color:#2b4573;

    transition:.4s;

}


/*==================================================
    PRODUCT CONTENT
==================================================*/

.inner-soln-product-content{

    flex:1;

}

.inner-soln-product-content h3{

    font-size:28px;

    color:#111827;

    font-weight:700;

    margin-bottom:16px;

}


/*==================================================
    SMALL BLUE LINE
==================================================*/

.inner-soln-card-line{

    width:42px;

    height:3px;

    background:#2b4573;

    border-radius:50px;

    margin-bottom:18px;

    transition:.4s;

}


/*==================================================
    DESCRIPTION
==================================================*/

.inner-soln-product-content p{

    font-size:18px;

    color:#7e8085;

    line-height:1.9;

}


/*==================================================
    HOVER EFFECT
==================================================*/

.inner-soln-product-card:hover{

    transform:translateY(-12px);

    border-color:#2b4573;

    box-shadow:0 25px 60px rgba(43,69,115,.12);

}

.inner-soln-product-card:hover .inner-soln-product-icon{

    background:#2b4573;

    transform:rotate(10deg);

}

.inner-soln-product-card:hover .inner-soln-product-icon i{

    color:#ffffff;

}

.inner-soln-product-card:hover .inner-soln-card-line{

    width:75px;

}

.inner-soln-product-card:hover h3{

    color:#2b4573;

}


/*==================================================
    LIGHT TOP HIGHLIGHT
==================================================*/

.inner-soln-product-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:#2b4573;

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.inner-soln-product-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
    SOFT BACKGROUND EFFECT
==================================================*/

.inner-soln-product-card::after{

    content:"";

    position:absolute;

    width:160px;

    height:160px;

    right:-80px;

    bottom:-80px;

    background:rgba(43,69,115,.04);

    border-radius:50%;

    transition:.4s;

}

.inner-soln-product-card:hover::after{

    transform:scale(1.15);

}


/*==================================================
    FADE-UP ANIMATION
==================================================*/

.inner-soln-content{

    animation:innerSolnLeft .8s ease;

}

.inner-soln-image{

    animation:innerSolnRight .8s ease;

}

.inner-soln-product-card{

    animation:innerSolnCard .8s ease both;

}

.inner-soln-product-card:nth-child(1){

    animation-delay:.15s;

}

.inner-soln-product-card:nth-child(2){

    animation-delay:.3s;

}

.inner-soln-product-card:nth-child(3){

    animation-delay:.45s;

}


/*==================================================
    KEYFRAMES
==================================================*/

@keyframes innerSolnLeft{

    from{

        opacity:0;

        transform:translateX(-40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

@keyframes innerSolnRight{

    from{

        opacity:0;

        transform:translateX(40px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

@keyframes innerSolnCard{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*==================================================
    SMOOTH TRANSITIONS
==================================================*/

.inner-soln-product-card,
.inner-soln-product-icon,
.inner-soln-product-icon i,
.inner-soln-card-line,
.inner-soln-image img{

    transition:all .4s ease;

}


/*==================================================
    ACCESSIBILITY
==================================================*/

.inner-soln-product-card:focus-within{

    transform:translateY(-12px);

    border-color:#2b4573;

    box-shadow:0 25px 60px rgba(43,69,115,.12);

}


/*=========================================
    SCROLL REVEAL
=========================================*/

.inner-soln-hidden{

    opacity:0;

    transform:translateY(50px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.inner-soln-show{

    opacity:1;

    transform:translateY(0);

}


/*=========================================
    IMAGE REVEAL
=========================================*/

.inner-soln-image.inner-soln-hidden{

    transform:translateX(60px);

}

.inner-soln-image.inner-soln-show{

    transform:translateX(0);

}


/*=========================================
    LEFT CONTENT REVEAL
=========================================*/

.inner-soln-content.inner-soln-hidden{

    transform:translateX(-60px);

}

.inner-soln-content.inner-soln-show{

    transform:translateX(0);

}


/*=========================================
    PRODUCT CARD STAGGER
=========================================*/

.inner-soln-product-card:nth-child(1){

    transition-delay:.15s;

}

.inner-soln-product-card:nth-child(2){

    transition-delay:.30s;

}

.inner-soln-product-card:nth-child(3){

    transition-delay:.45s;

}



/*==================================================
    LARGE DESKTOP (1400px+)
==================================================*/

@media (min-width:1400px){

    .inner-soln-wrapper{
        grid-template-columns:1fr 1.1fr;
        gap:70px;
    }

}


/*==================================================
    DESKTOP (1200px - 1399px)
==================================================*/

@media (max-width:1399px){

    .inner-soln-wrapper{
        gap:55px;
    }

    .inner-soln-title{
        font-size:56px;
    }

    .inner-soln-text{
        font-size:20px;
    }

}


/*==================================================
    LAPTOP (992px - 1199px)
==================================================*/

@media (max-width:1199px){

    .inner-soln-section{
        padding:90px 0 80px;
    }

    .inner-soln-wrapper{
        gap:40px;
    }

    .inner-soln-title{
        font-size:30px;
    }

    .inner-soln-subtitle{
        font-size:18px;
        letter-spacing:2px;
    }

    .inner-soln-text{
        font-size:12px;
    }

    .inner-soln-product-grid{
        gap:24px;
    }

    .inner-soln-product-card{
        padding:30px 26px;
    }

    .inner-soln-product-content h3{
        font-size:24px;
    }

    .inner-soln-product-content p{
        font-size:12px;
    }

}


/*==================================================
    TABLET (768px - 991px)
==================================================*/

@media (max-width:991px){

    .inner-soln-wrapper{

        grid-template-columns:1fr;

        gap:45px;

    }

    .inner-soln-image{

        order:-1;

    }

    .inner-soln-title{

        font-size:42px;

    }

    .inner-soln-text{

        font-size:17px;

    }

    .inner-soln-product-grid{

        grid-template-columns:repeat(2,1fr);

    }

}


/*==================================================
    MOBILE LANDSCAPE
==================================================*/

@media (max-width:767px){

    .inner-soln-section{

        padding:70px 0;

    }

    .inner-soln-wrapper{

        gap:35px;

        margin-bottom:60px;

    }

    .inner-soln-subtitle{

        font-size:16px;

        letter-spacing:2px;

        margin-bottom:24px;

    }

    .inner-soln-title{

        font-size:34px;

        line-height:1.25;

        margin-bottom:25px;

    }

    .inner-soln-divider{

        margin-bottom:25px;

    }

    .inner-soln-text{

        font-size:16px;

        line-height:1.8;

    }

    .inner-soln-product-heading{

        margin-bottom:30px;

    }

    .inner-soln-product-heading span{

        font-size:22px;

    }

    .inner-soln-product-grid{

        grid-template-columns:1fr;

        gap:22px;

    }

    .inner-soln-product-card{

        padding:28px 24px;

        gap:20px;

    }

    .inner-soln-product-icon{

        width:72px;
        height:72px;
        min-width:72px;

    }

    .inner-soln-product-icon i{

        font-size:30px;

    }

    .inner-soln-product-content h3{

        font-size:22px;

    }

    .inner-soln-product-content p{

        font-size:15px;

    }

}


/*==================================================
    MOBILE
==================================================*/

@media (max-width:575px){

    .inner-soln-section{

        padding:60px 0;

    }

    .inner-soln-title{

        font-size:30px;

    }

    .inner-soln-subtitle{

        font-size:15px;

        letter-spacing:1px;

    }

    .inner-soln-text{

        font-size:15px;

        margin-bottom:20px;

    }

    .inner-soln-image{

        border-radius:18px;

    }

    .inner-soln-image img{

        border-radius:18px;

    }

    .inner-soln-product-card{

        flex-direction:column;

        align-items:flex-start;

        padding:26px 22px;

    }

    .inner-soln-product-icon{

        width:68px;
        height:68px;
        min-width:68px;

    }

    .inner-soln-product-icon i{

        font-size:28px;

    }

    .inner-soln-product-content h3{

        font-size:21px;

    }

    .inner-soln-product-content p{

        font-size:14px;

        line-height:1.8;

    }

}


/*==================================================
    SMALL MOBILE
==================================================*/

@media (max-width:400px){

    .inner-soln-title{

        font-size:26px;

    }

    .inner-soln-subtitle{

        font-size:14px;

    }

    .inner-soln-text{

        font-size:14px;

    }

    .inner-soln-product-card{

        padding:22px 18px;

    }

    .inner-soln-product-icon{

        width:60px;
        height:60px;
        min-width:60px;

    }

    .inner-soln-product-icon i{

        font-size:24px;

    }

    .inner-soln-product-content h3{

        font-size:19px;

    }

    .inner-soln-product-content p{

        font-size:13px;

    }

}


/*==================================================
    TOUCH DEVICES
==================================================*/

@media (hover:none){

    .inner-soln-product-card:hover{

        transform:none;

    }

    .inner-soln-image:hover img{

        transform:none;

    }

    .inner-soln-product-card:hover
    .inner-soln-product-icon{

        transform:none;

    }

}







/*==================================================
    IN SOLUTIONS SECTION
==================================================*/

.in-solns-section{
    position:relative;
    padding:110px 0;
    background:#ffffff;
    overflow:hidden;
}

.in-solns-section *{
    box-sizing:border-box;
}


/*==================================================
    TOP WRAPPER
==================================================*/

.in-solns-wrapper{

    display:grid;

    grid-template-columns:1fr 1.25fr;

    gap:65px;

    align-items:center;

    margin-bottom:70px;

}


/*==================================================
    LEFT CONTENT
==================================================*/

.in-solns-content{

    position:relative;

}


/*==================================================
    SUB TITLE
==================================================*/

.in-solns-subtitle{

    position:relative;

    display:inline-block;

    color:#2b4573;

    text-transform:uppercase;

    font-size:18px;

    font-weight:700;

    letter-spacing:1.5px;

    padding-top:28px;

    margin-bottom:28px;

}

.in-solns-subtitle::before{

    content:"";

    position:absolute;

    top:0;

    left:0;

    width:55px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

}


/*==================================================
    TITLE
==================================================*/

.in-solns-title{

    font-size:50px;

    line-height:1.15;

    font-weight:800;

    color:#101828;

    margin-bottom:28px;

}

.in-solns-title span{

    color:#2b4573;

}


/*==================================================
    DIVIDER
==================================================*/

.in-solns-divider{

    width:60px;

    height:4px;

    background:#2b4573;

    border-radius:50px;

    margin-bottom:30px;

}


/*==================================================
    PARAGRAPH
==================================================*/

.in-solns-text{

    font-size:15px;

    color:#7e8085;

    line-height:1.9;

    margin-bottom:24px;

}

.in-solns-text:last-child{

    margin-bottom:0;

}


/*==================================================
    IMAGE
==================================================*/

.in-solns-image{

    position:relative;

    overflow:hidden;

    border-radius:24px;

    box-shadow:0 18px 55px rgba(22,42,72,.10);

}

.in-solns-image img{

    width:100%;

    display:block;

    border-radius:24px;

    transition:.6s ease;

}

.in-solns-image:hover img{

    transform:scale(1.05);

}


/*==================================================
    PRODUCT GRID
==================================================*/

.in-solns-product-grid{

    display:grid;

    grid-template-columns:repeat(2,1fr);

    gap:30px;

}


/*==================================================
    PRODUCT CARD
==================================================*/

.in-solns-card{

    position:relative;

    display:flex;

    flex-direction:column;

    align-items:flex-start;

    gap:30px;

    padding:35px;

    background:#ffffff;

    border:1px solid #edf1f7;

    border-radius:20px;

    overflow:hidden;

    box-shadow:0 15px 45px rgba(25,42,70,.06);

    transition:.4s ease;

}


/*==================================================
    CARD LEFT
==================================================*/

.in-solns-card-left{

    display:flex;

    align-items:flex-start;

    gap:20px;

    width:100%;

}


/*==================================================
    ICON
==================================================*/

.in-solns-icon{

    width:70px;

    height:70px;

    min-width:70px;

    border-radius:18px;

    background:#f3f6fc;

    display:flex;

    justify-content:center;

    align-items:center;

    transition:.4s;

}

.in-solns-icon i{

    font-size:32px;

    color:#2b4573;

    transition:.4s;

}


/*==================================================
    CONTENT
==================================================*/

.in-solns-card-content{

    flex:1;

}

.in-solns-card-content h3{

    font-size:34px;

    color:#111827;

    font-weight:700;

    margin-bottom:6px;

}

.in-solns-card-content span{

    display:block;

    color:#2b4573;

    font-size:15px;

    font-weight:600;

    margin-bottom:14px;

}

.in-solns-card-line{

    width:42px;

    height:3px;

    background:#2b4573;

    border-radius:30px;

    margin-bottom:18px;

    transition:.4s;

}

.in-solns-card-content p{

    font-size:16px;

    color:#7e8085;

    line-height:1.9;

    margin-bottom:18px;

}

.in-solns-card-content h5{

    font-size:18px;

    color:#2b4573;

    font-weight:700;

    margin-bottom:10px;

}


/*==================================================
    PRODUCT IMAGE
==================================================*/

.in-solns-card-image{

    width:100%;

    text-align:center;

    margin-top:10px;

}

.in-solns-card-image img{

    max-width:320px;

    width:100%;

    transition:.45s ease;

}


/*==================================================
    DOT DECORATION
==================================================*/

.in-solns-dots{

    position:absolute;

    right:25px;

    bottom:15px;

    width:85px;

    height:70px;

    opacity:.45;

    background-image:radial-gradient(#2b4573 1.6px, transparent 1.6px);

    background-size:10px 10px;

}


/*==================================================
    CARD HOVER
==================================================*/

.in-solns-card:hover{

    transform:translateY(-10px);

    border-color:#2b4573;

    box-shadow:0 30px 65px rgba(43,69,115,.12);

}

.in-solns-card:hover .in-solns-icon{

    background:#2b4573;

    transform:rotate(10deg);

}

.in-solns-card:hover .in-solns-icon i{

    color:#ffffff;

}

.in-solns-card:hover .in-solns-card-line{

    width:70px;

}

.in-solns-card:hover .in-solns-card-image img{

    transform:scale(1.06);

}

.in-solns-card:hover h3{

    color:#2b4573;

}


/*==================================================
    TOP BLUE BORDER
==================================================*/

.in-solns-card::before{

    content:"";

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:4px;

    background:#2b4573;

    transform:scaleX(0);

    transform-origin:left;

    transition:.4s;

}

.in-solns-card:hover::before{

    transform:scaleX(1);

}


/*==================================================
    BACKGROUND CIRCLE
==================================================*/

.in-solns-card::after{

    content:"";

    position:absolute;

    width:170px;

    height:170px;

    right:-90px;

    top:-90px;

    border-radius:50%;

    background:rgba(43,69,115,.03);

    transition:.4s;

}

.in-solns-card:hover::after{

    transform:scale(1.15);

}


/*==================================================
    FADE ANIMATION
==================================================*/

.in-solns-content{

    animation:inSolnsLeft .8s ease;

}

.in-solns-image{

    animation:inSolnsRight .8s ease;

}

.in-solns-card{

    animation:inSolnsUp .8s ease both;

}

.in-solns-card:nth-child(1){

    animation-delay:.2s;

}

.in-solns-card:nth-child(2){

    animation-delay:.45s;

}


/*==================================================
    KEYFRAMES
==================================================*/

@keyframes inSolnsLeft{

    from{

        opacity:0;

        transform:translateX(-45px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

@keyframes inSolnsRight{

    from{

        opacity:0;

        transform:translateX(45px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

@keyframes inSolnsUp{

    from{

        opacity:0;

        transform:translateY(45px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/*==================================================
    SMOOTH TRANSITIONS
==================================================*/

.in-solns-card,
.in-solns-icon,
.in-solns-icon i,
.in-solns-card-line,
.in-solns-card-image img{

    transition:all .4s ease;

}



/*=========================================
    SCROLL REVEAL
=========================================*/

.in-solns-hidden{

    opacity:0;

    transform:translateY(50px);

    transition:
        opacity .8s ease,
        transform .8s ease;

}

.in-solns-show{

    opacity:1;

    transform:translateY(0);

}


/*=========================================
    LEFT CONTENT
=========================================*/

.in-solns-content.in-solns-hidden{

    transform:translateX(-60px);

}

.in-solns-content.in-solns-show{

    transform:translateX(0);

}


/*=========================================
    RIGHT IMAGE
=========================================*/

.in-solns-image.in-solns-hidden{

    transform:translateX(60px);

}

.in-solns-image.in-solns-show{

    transform:translateX(0);

}


/*=========================================
    PRODUCT CARDS
=========================================*/

.in-solns-card:nth-child(1){

    transition-delay:.15s;

}

.in-solns-card:nth-child(2){

    transition-delay:.35s;

}


/*=========================================
    PERFORMANCE
=========================================*/

.in-solns-content,
.in-solns-image,
.in-solns-card{

    will-change:transform, opacity;

}


/*==================================================
    LARGE DESKTOP
==================================================*/

@media (min-width:1400px){

    .in-solns-wrapper{
        grid-template-columns:1fr 1.25fr;
        gap:65px;
    }

}


/*==================================================
    DESKTOP
==================================================*/

@media (max-width:1399px){

    .in-solns-wrapper{
        gap:50px;
    }

    .in-solns-title{
        font-size:52px;
    }

    .in-solns-text{
        font-size:18px;
    }

}


/*==================================================
    LAPTOP
==================================================*/

@media (max-width:1199px){

    .in-solns-section{
        padding:90px 0;
    }

    .in-solns-wrapper{
        gap:40px;
    }

    .in-solns-title{
        font-size:38px;
    }

    .in-solns-subtitle{
        font-size:16px;
    }

    .in-solns-text{
        font-size:12px;
        line-height:1.8;
    }

    .in-solns-product-grid{
        gap:25px;
    }

    .in-solns-card{
        padding:28px;
    }

    .in-solns-card-content h3{
        font-size:30px;
    }

    .in-solns-card-image{
        width:170px;
    }

}


/*==================================================
    TABLET
==================================================*/

@media (max-width:991px){

    .in-solns-wrapper{

        grid-template-columns:1fr;

        gap:40px;

    }

    .in-solns-image{

        order:-1;

    }

    .in-solns-title{

        font-size:40px;

    }

    .in-solns-product-grid{

        grid-template-columns:1fr;

    }

    

    .in-solns-card-left{

        width:100%;

    }

    

    .in-solns-card-image img{

        max-width:260px;

    }

    .in-solns-dots{

        right:25px;

        bottom:10px;

    }

}


/*==================================================
    MOBILE LANDSCAPE
==================================================*/

@media (max-width:767px){

    .in-solns-section{

        padding:70px 0;

    }

    .in-solns-wrapper{

        gap:30px;

        margin-bottom:50px;

    }

    .in-solns-subtitle{

        font-size:15px;

        letter-spacing:1px;

        margin-bottom:20px;

    }

    .in-solns-title{

        font-size:34px;

        line-height:1.25;

        margin-bottom:22px;

    }

    .in-solns-divider{

        margin-bottom:22px;

    }

    .in-solns-text{

        font-size:16px;

        line-height:1.8;

        margin-bottom:18px;

    }

    .in-solns-card{

        padding:25px;

        gap:25px;

    }

    .in-solns-card-left{

        flex-direction:column;

        gap:18px;

    }

    .in-solns-icon{

        width:65px;
        height:65px;
        min-width:65px;

    }

    .in-solns-icon i{

        font-size:28px;

    }

    .in-solns-card-content h3{

        font-size:28px;

    }

    .in-solns-card-content p{

        font-size:15px;

    }

    .in-solns-card-image img{

        max-width:220px;

    }

    .in-solns-dots{

        width:70px;
        height:60px;

    }

}


/*==================================================
    MOBILE
==================================================*/

@media (max-width:575px){

    .in-solns-section{

        padding:60px 0;

    }

    .in-solns-title{

        font-size:30px;

    }

    .in-solns-subtitle{

        font-size:14px;

    }

    .in-solns-text{

        font-size:15px;

    }

    .in-solns-image{

        border-radius:18px;

    }

    .in-solns-image img{

        border-radius:18px;

    }

    .in-solns-card{

        padding:22px;

    }

    .in-solns-icon{

        width:60px;
        height:60px;
        min-width:60px;

    }

    .in-solns-icon i{

        font-size:24px;

    }

    .in-solns-card-content h3{

        font-size:24px;

    }

    .in-solns-card-content span{

        font-size:14px;

    }

    .in-solns-card-content h5{

        font-size:17px;

    }

    .in-solns-card-content p{

        font-size:14px;

        line-height:1.8;

    }

    .in-solns-card-image img{

        max-width:180px;

    }

    .in-solns-dots{

        width:60px;
        height:50px;

    }

}


/*==================================================
    SMALL MOBILE
==================================================*/

@media (max-width:400px){

    .in-solns-title{

        font-size:26px;

    }

    .in-solns-subtitle{

        font-size:13px;

    }

    .in-solns-text{

        font-size:14px;

    }

    .in-solns-card{

        padding:18px;

    }

    .in-solns-icon{

        width:55px;
        height:55px;
        min-width:55px;

    }

    .in-solns-icon i{

        font-size:22px;

    }

    .in-solns-card-content h3{

        font-size:22px;

    }

    .in-solns-card-content h5{

        font-size:16px;

    }

    .in-solns-card-content p{

        font-size:13px;

    }

    .in-solns-card-image img{

        max-width:160px;

    }

}


/*==================================================
    TOUCH DEVICES
==================================================*/

@media (hover:none){

    .in-solns-card:hover{

        transform:none;

    }

    .in-solns-image:hover img{

        transform:none;

    }

    .in-solns-card:hover .in-solns-icon{

        transform:none;

    }

}





/*==============================
    CUSTOM CURSOR
==============================*/

body{
    cursor:none;
}

.mv-cursor,
.mv-cursor-ring{

    position:fixed;

    top:0;
    left:0;

    pointer-events:none;

    z-index:2147483647;

    border-radius:50%;

    transform:translate(-50%,-50%);

}

.mv-cursor{

    width:8px;
    height:8px;

    background:#2b4573;

    transition:
    width .25s ease,
    height .25s ease,
    background .25s ease;

}

.mv-cursor-ring{

    width:30px;
    height:30px;

    border:1px solid #2b4573;

    transition:
    transform .15s ease-out,
    width .25s ease,
    height .25s ease,
    border-color .25s ease;

}

@media(max-width:991px){

    body{

        cursor:auto;

    }

    .mv-cursor,
    .mv-cursor-ring{

        display:none;

    }

}

/*=====================================
    HIDE CURSOR ON TABLET & MOBILE
======================================*/

@media (max-width:1199px){

    body{
        cursor:auto !important;
    }

    .mv-cursor,
    .mv-cursor-ring{
        display:none !important;
    }

}



/*==================================================
    GET A QUOTE POPUP CSS
==================================================*/


/*==================================================
    GET A QUOTE POPUP
==================================================*/

.mv-quote-overlay{

    position:fixed;

    inset:0;

    display:flex;

    justify-content:center;

    align-items:center;

    background:rgba(7,18,40,.72);

    backdrop-filter:blur(8px);

    -webkit-backdrop-filter:blur(8px);

    padding:20px;

    overflow-y:auto;

    z-index:999999;

    opacity:0;

    visibility:hidden;

    transition:.4s;

}

.mv-quote-overlay.active{

    opacity:1;

    visibility:visible;

}


/*==================================================
    POPUP
==================================================*/

.mv-quote-popup{

    position:relative;

    width:min(1150px,95vw);

    background:#fff;

    border-radius:24px;

    overflow:hidden;

    max-height:calc(100vh - 40px);

    overflow-y:auto;

    transform:translateY(30px) scale(.97);

    transition:.45s;

}

.mv-quote-overlay.active .mv-quote-popup{

    transform:translateY(0) scale(1);

}


/*==================================================
    WRAPPER
==================================================*/

.mv-quote-wrapper{

    display:grid;

    grid-template-columns:340px 1fr;

}


/*==================================================
    LEFT PANEL
==================================================*/

.mv-quote-left{

    position:relative;

    overflow:hidden;

    background:linear-gradient(135deg,#081a45 0%,#102f6d 100%);

    color:#ffffff;

}


/*==================================================
    DECORATIONS
==================================================*/

.mv-quote-left::before{

    content:"";

    position:absolute;

    width:480px;

    height:480px;

    right:-220px;

    top:-120px;

    border-radius:50%;

    background:rgba(255,255,255,.04);

}

.mv-quote-left::after{

    content:"";

    position:absolute;

    left:-120px;

    bottom:-120px;

    width:320px;

    height:320px;

    border:1px solid rgba(255,255,255,.08);

    transform:rotate(45deg);

}


/*==================================================
    INNER
==================================================*/

.mv-quote-left-inner{

    position:relative;

    z-index:2;

    padding:40px 35px;

    height:100%;

    display:flex;

    flex-direction:column;

}


/*==================================================
    SMALL LINE
==================================================*/

.mv-quote-small-line{

    display:block;

    width:46px;

    height:4px;

    border-radius:50px;

    background:#2f7cff;

    margin-bottom:34px;

}


/*==================================================
    TITLE
==================================================*/

.mv-quote-left h2{

    font-size:42px;

    line-height:1.15;

    font-weight:800;

    color:#ffffff;

    margin-bottom:28px;

}

.mv-quote-left h2 span{

    color:#2f7cff;

}


/*==================================================
    DIVIDER
==================================================*/

.mv-quote-divider{

    width:60px;

    height:4px;

    border-radius:50px;

    background:#2f7cff;

    display:block;

    margin-bottom:34px;

}


/*==================================================
    DESCRIPTION
==================================================*/

.mv-quote-left p{

    font-size:22px;

    line-height:1.8;

    color:rgba(255,255,255,.92);

    margin-bottom:55px;

}


/*==================================================
    FEATURES
==================================================*/

.mv-quote-feature{

    display:flex;

    align-items:center;

    gap:22px;

    padding:18px 0;

    border-bottom:1px solid rgba(255,255,255,.12);

}

.mv-quote-feature:last-child{

    border-bottom:none;

}


/*==================================================
    FEATURE ICON
==================================================*/

.mv-quote-feature-icon{

    width:58px;

    height:58px;

    border-radius:50%;

    background:rgba(47,124,255,.18);

    border:2px solid rgba(47,124,255,.45);

    display:flex;

    justify-content:center;

    align-items:center;

    flex-shrink:0;

    transition:.35s ease;

}

.mv-quote-feature-icon i{

    font-size:30px;

    color:#ffffff;

}

.mv-quote-feature:hover .mv-quote-feature-icon{

    transform:translateY(-4px);

    background:#2f7cff;

    border-color:#2f7cff;

}


/*==================================================
    FEATURE CONTENT
==================================================*/

.mv-quote-feature-content h5{

    font-size:24px;

    font-weight:700;

    color:#ffffff;

    margin-bottom:6px;

}

.mv-quote-feature-content span{

    font-size:18px;

    color:rgba(255,255,255,.82);

}


/*==================================================
    CLOSE BUTTON
==================================================*/

.mv-quote-close{

    position:absolute;

    right:28px;

    top:28px;

    width:56px;

    height:56px;

    border:none;

    border-radius:50%;

    background:#2b4573;

    color:#ffffff;

    cursor:pointer;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:24px;

    transition:.35s ease;

    z-index:50;

}

.mv-quote-close:hover{

    background:#16386f;

    transform:rotate(90deg);

}


/*==================================================
    LEFT ANIMATION
==================================================*/

.mv-quote-left{

    animation:mvQuoteLeft .8s ease;

}

@keyframes mvQuoteLeft{

    from{

        opacity:0;

        transform:translateX(-60px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}



/*==================================================
    RIGHT PANEL
==================================================*/

.mv-quote-right{

    position:relative;

    background:#ffffff;

    padding:40px 45px;

    display:flex;

    flex-direction:column;

    justify-content:center;

}

.mv-quote-right .mv-quote-small-line{

    margin-bottom:28px;

}

.mv-quote-right h2{

    font-size:45px;

    font-weight:800;

    line-height:1.15;

    color:#16386f;

    margin-bottom:20px;

}

.mv-quote-desc{

    font-size:22px;

    color:#667085;

    line-height:1.7;

    margin-bottom:45px;

}


/*==================================================
    FORM
==================================================*/

.mv-quote-right form{

    width:100%;

}

.mv-quote-row{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:28px;

    margin-bottom:30px;

}

.mv-quote-col{

    display:flex;

    flex-direction:column;

}

.mv-quote-right label{

    display:block;

    font-size:17px;

    font-weight:700;

    color:#16386f;

    margin-bottom:14px;

}


/*==================================================
    INPUT
==================================================*/

.mv-quote-input{

    position:relative;

}

.mv-quote-input i{

    position:absolute;

    left:22px;

    top:50%;

    transform:translateY(-50%);

    font-size:22px;

    color:#2b4573;

    transition:.35s;

}

.mv-quote-input input{

    width:100%;

    height:58px;

    padding:0 22px 0 65px;

    border:1px solid #d9e2f1;

    border-radius:14px;

    background:#ffffff;

    font-size:17px;

    color:#1e293b;

    outline:none;

    transition:.35s;

}

.mv-quote-input input::placeholder{

    color:#98a2b3;

}

.mv-quote-input input:focus{

    border-color:#2b4573;

    box-shadow:0 0 0 4px rgba(43,69,115,.08);

}

.mv-quote-input input:focus+i{

    color:#2b4573;

}


/*==================================================
    PHONE
==================================================*/

.mv-quote-phone{

    display:grid;

    grid-template-columns:105px 1fr;

    gap:12px;

}

.mv-quote-phone select{

    width:100%;

    height:72px;

    border:1px solid #d9e2f1;

    border-radius:14px;

    background:#ffffff;

    color:#16386f;

    font-size:17px;

    padding:0 18px;

    outline:none;

    cursor:pointer;

    transition:.35s;

}

.mv-quote-phone select:focus{

    border-color:#2b4573;

    box-shadow:0 0 0 4px rgba(43,69,115,.08);

}


/*==================================================
    TEXTAREA
==================================================*/

.mv-quote-textarea{

    position:relative;

    margin-bottom:28px;

}

.mv-quote-textarea i{

    position:absolute;

    left:22px;

    top:26px;

    font-size:22px;

    color:#2b4573;

}

.mv-quote-textarea textarea{

    width:100%;

    min-height:150px;

    height: 10px;

    resize:none;

    border:1px solid #d9e2f1;

    border-radius:14px;

    background:#ffffff;

    padding:22px 22px 50px 65px;

    font-size:17px;

    color:#1e293b;

    outline:none;

    transition:.35s;

    line-height:1.8;

}

.mv-quote-textarea textarea::placeholder{

    color:#98a2b3;

}

.mv-quote-textarea textarea:focus{

    border-color:#2b4573;

    box-shadow:0 0 0 4px rgba(43,69,115,.08);

}


/*==================================================
    CHARACTER COUNT
==================================================*/

.mv-quote-count{

    position:absolute;

    right:20px;

    bottom:16px;

    font-size:15px;

    font-weight:600;

    color:#667085;

}


/*==================================================
    PRIVACY BOX
==================================================*/

.mv-quote-privacy{

    display:flex;

    align-items:center;

    gap:16px;

    padding:18px 24px;

    background:#f4f8ff;

    border-radius:14px;

    margin-bottom:35px;

}

.mv-quote-privacy i{

    width:44px;

    height:44px;

    border-radius:50%;

    background:#ffffff;

    color:#2b4573;

    display:flex;

    justify-content:center;

    align-items:center;

    font-size:20px;

    flex-shrink:0;

    box-shadow:0 8px 18px rgba(43,69,115,.08);

}

.mv-quote-privacy span{

    color:#2b4573;

    font-size:17px;

    font-weight:500;

}


/*==================================================
    BUTTON
==================================================*/

.mv-quote-btn{

    display:inline-flex;

    align-items:center;

    gap:18px;

    height:64px;

    padding:0 38px;

    border:none;

    border-radius:12px;

    background:#2b4573;

    color:#ffffff;

    font-size:18px;

    font-weight:700;

    cursor:pointer;

    overflow:hidden;

    position:relative;

    transition:.35s;

}

.mv-quote-btn span{

    position:relative;

    z-index:2;

}

.mv-quote-btn i{

    position:relative;

    z-index:2;

    font-size:18px;

    transition:.35s;

}

.mv-quote-btn::before{

    content:"";

    position:absolute;

    inset:0;

    background:#16386f;

    transform:scaleX(0);

    transform-origin:left;

    transition:.35s;

}

.mv-quote-btn:hover::before{

    transform:scaleX(1);

}

.mv-quote-btn:hover i{

    transform:translateX(8px);

}


/*==================================================
    INPUT HOVER
==================================================*/

.mv-quote-input:hover input,
.mv-quote-phone select:hover,
.mv-quote-textarea:hover textarea{

    border-color:#2b4573;

}


/*==================================================
    FADE ANIMATION
==================================================*/

.mv-quote-right{

    animation:mvQuoteRight .8s ease;

}

@keyframes mvQuoteRight{

    from{

        opacity:0;

        transform:translateX(60px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}



/*==================================================
    LARGE DESKTOP
==================================================*/

@media (min-width:1600px){

    .mv-quote-popup{

        max-width:1350px;

    }

}


/*==================================================
    DESKTOP
==================================================*/

@media (max-width:1399px){

    .mv-quote-popup{

        max-width:1180px;

    }

    .mv-quote-wrapper{

        grid-template-columns:340px 1fr;

    }

    .mv-quote-left-inner{

        padding:40px 35px;

    }

    .mv-quote-right{

        padding:55px 55px;

    }

    .mv-quote-left h2,
    .mv-quote-right h2{

       font-size:42px;

    line-height:1.15;

    }

}


/*==================================================
    LAPTOP
==================================================*/

@media (max-width:1199px){

    .mv-quote-overlay{

        padding:25px;

    }

    .mv-quote-popup{

        max-width:100%;

    }

    .mv-quote-wrapper{

        grid-template-columns:320px 1fr;

    }

    .mv-quote-left-inner{

        padding:45px 35px;

    }

    .mv-quote-right{

        padding:40px;

    }

    .mv-quote-left h2,
    .mv-quote-right h2{

        font-size:40px;

    }

    .mv-quote-left p{

        font-size:18px;

    }

    .mv-quote-desc{

        font-size:18px;

        margin-bottom:35px;

    }

    .mv-quote-feature{

        gap:16px;

        padding:18px 0;

    }

    .mv-quote-feature-icon{

        width:60px;
        height:60px;

    }

    .mv-quote-feature-icon i{

        font-size:24px;

    }

    .mv-quote-feature-content h5{

        font-size:20px;

    }

    .mv-quote-feature-content span{

        font-size:15px;

    }

    .mv-quote-input input,
    .mv-quote-phone select{

        height:64px;

        font-size:16px;

    }

    .mv-quote-textarea textarea{

        min-height:170px;

        font-size:16px;

    }

}


@media (max-height:900px){

    .mv-quote-popup{

        max-height:95vh;

        overflow-y:auto;

    }

}


/*==================================================
    TABLET
==================================================*/

@media (max-width:991px){

    .mv-quote-overlay{

        align-items:flex-start;

        overflow-y:auto;

        padding:20px;

    }

    .mv-quote-popup{

        margin:20px 0;

    }

    .mv-quote-wrapper{

        grid-template-columns:1fr;

    }

    .mv-quote-left{

        display:none;

    }

    .mv-quote-right{

        padding:40px 30px;

    }

    .mv-quote-right h2{

        font-size:36px;

    }

    .mv-quote-desc{

        font-size:17px;

    }

    .mv-quote-row{

        grid-template-columns:1fr;

        gap:20px;

    }

}


/*==================================================
    MOBILE LANDSCAPE
==================================================*/

@media (max-width:767px){

    .mv-quote-overlay{

        padding:15px;

    }

    .mv-quote-popup{

        border-radius:18px;

    }

    .mv-quote-right{

        padding:30px 20px;

    }

    .mv-quote-right h2{

        font-size:30px;

        line-height:1.25;

    }

    .mv-quote-desc{

        font-size:16px;

        margin-bottom:28px;

    }

    .mv-quote-small-line{

        margin-bottom:20px;

    }

    .mv-quote-row{

        margin-bottom:20px;

    }

    .mv-quote-phone{

        grid-template-columns:90px 1fr;

    }

    .mv-quote-input input{

        height:58px;

        padding-left:55px;

        font-size:15px;

    }

    .mv-quote-input i{

        left:18px;

        font-size:18px;

    }

    .mv-quote-phone select{

        height:58px;

        font-size:15px;

        padding:0 12px;

    }

    .mv-quote-textarea textarea{

        min-height:150px;

        padding:18px 18px 45px 55px;

        font-size:15px;

    }

    .mv-quote-textarea i{

        left:18px;

        top:22px;

        font-size:18px;

    }

    .mv-quote-privacy{

        padding:15px;

        gap:12px;

    }

    .mv-quote-privacy span{

        font-size:14px;

    }

    .mv-quote-btn{

        width:100%;

        justify-content:center;

        height:56px;

        font-size:16px;

    }

    .mv-quote-close{

        width:46px;
        height:46px;

        right:15px;
        top:15px;

        font-size:18px;

    }

}


/*==================================================
    MOBILE
==================================================*/

@media (max-width:575px){

    .mv-quote-overlay{

        padding:10px;

    }

    .mv-quote-popup{

        border-radius:16px;

    }

    .mv-quote-right{

        padding:25px 18px;

    }

    .mv-quote-right h2{

        font-size:26px;

    }

    .mv-quote-desc{

        font-size:15px;

    }

    .mv-quote-right label{

        font-size:15px;

    }

    .mv-quote-phone{

        grid-template-columns:80px 1fr;

    }

    .mv-quote-input input{

        font-size:14px;

    }

    .mv-quote-phone select{

        font-size:14px;

    }

    .mv-quote-textarea textarea{

        font-size:14px;

    }

    .mv-quote-count{

        font-size:13px;

    }

}


/*==================================================
    SMALL MOBILE
==================================================*/

@media (max-width:400px){

    .mv-quote-right{

        padding:20px 15px;

    }

    .mv-quote-right h2{

        font-size:22px;

    }

    .mv-quote-desc{

        font-size:14px;

    }

    .mv-quote-input input{

        height:54px;

    }

    .mv-quote-phone select{

        height:54px;

    }

    .mv-quote-btn{

        height:52px;

        font-size:15px;

    }

}

@media (max-height:850px){

    .mv-quote-overlay{

        align-items:flex-start;

        padding:20px;

    }

    .mv-quote-popup{

        margin:20px auto;

    }

}








/*==================================================
    CATEGORY PROJECT SECTION
==================================================*/

.cat-project-section{
    position: relative;
    width: 100%;
    padding: 70px 0 80px;
    background: #ffffff;
    overflow: hidden;
}


/*==================================================
    SECTION HEADER
==================================================*/

.cat-project-header{
    width: 100%;
    max-width: 760px;
    margin: 0 auto 28px;
    text-align: center;
}


/* Subtitle */

.cat-project-subtitle{
    position: relative;
    display: inline-block;
    margin-bottom: 10px;

    font-size: 11px;
    line-height: 1;
    font-weight: 700;
    letter-spacing: 3px;
    text-transform: uppercase;

    color: #2b4573;
}


/* Main Heading */

.cat-project-title{
    margin: 0 0 14px;

    font-size: 48px;
    line-height: 1.1;
    font-weight: 800;
    letter-spacing: 1px;
    text-transform: uppercase;

    color: #2b4573;
}


/* Description */

.cat-project-description{
    max-width: 620px;
    margin: 0 auto;

    font-size: 14px;
    line-height: 1.7;
    font-weight: 500;

    color: #687386;
}


/*==================================================
    FILTER WRAPPER
==================================================*/

.cat-project-filter-wrap{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 12px;

    margin: 0 auto 55px;
}


/*==================================================
    FILTER BUTTON
==================================================*/

.cat-project-filter-btn{
    position: relative;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 8px;

    min-height: 44px;
    padding: 0 20px;

    border: 1px solid #d9e1ee;
    border-radius: 7px;

    background: #ffffff;

    color: #2b4573;

    font-family: inherit;
    font-size: 12px;
    line-height: 1;
    font-weight: 600;

    cursor: pointer;

    box-shadow: 0 4px 12px rgba(43, 69, 115, 0.04);

    transition:
        background-color 0.3s ease,
        color 0.3s ease,
        border-color 0.3s ease,
        box-shadow 0.3s ease,
        transform 0.3s ease;
}


/* Filter Icon */

.cat-project-filter-btn i{
    font-size: 11px;
    color: inherit;
}


/* Hover */

.cat-project-filter-btn:hover{
    color: #ffffff;
    background: #2b4573;
    border-color: #2b4573;

    transform: translateY(-2px);

    box-shadow: 0 8px 20px rgba(43, 69, 115, 0.16);
}


/* Active Filter */

.cat-project-filter-btn.cat-project-filter-active{
    color: #ffffff;
    background: #2b4573;
    border-color: #2b4573;

    box-shadow: 0 8px 20px rgba(43, 69, 115, 0.20);
}


/*==================================================
    PROJECT GRID
==================================================*/

.cat-project-grid{
    display: grid;

    grid-template-columns: repeat(3, minmax(0, 1fr));

    gap: 40px 28px;

    width: 100%;

    margin: 0 auto 30px;
}


/*==================================================
    PROJECT CARD BASE
    CARD CONTENT COMES FROM JAVASCRIPT
==================================================*/

.cat-project-card{
    position: relative;

    width: 100%;
    min-width: 0;

    background: #ffffff;

    border: 1px solid #e4e9f1;
    border-radius: 12px;

    overflow: hidden;

    box-shadow:
        0 12px 30px rgba(20, 39, 70, 0.12);

    opacity: 1;
    transform: translateY(0);

    transition:
        transform 0.35s ease,
        box-shadow 0.35s ease,
        border-color 0.35s ease,
        opacity 0.3s ease;
}


/* Card Hover */

.cat-project-card:hover{
    transform: translateY(-7px);

    border-color: rgba(43, 69, 115, 0.22);

    box-shadow:
        0 20px 42px rgba(20, 39, 70, 0.17);
}


/*==================================================
    CARD FILTER ANIMATION STATES
==================================================*/

.cat-project-card.cat-project-hide{
    display: none;
}


.cat-project-card.cat-project-show{
    animation: catProjectCardShow 0.45s ease both;
}


@keyframes catProjectCardShow{

    0%{
        opacity: 0;
        transform: translateY(18px);
    }

    100%{
        opacity: 1;
        transform: translateY(0);
    }

}



/*==================================================
    PROJECT CARD IMAGE
==================================================*/

.cat-project-card-image{
    position: relative;
    width: 100%;
    height: 220px;
    overflow: hidden;
    background: #f4f6fa;
}

.cat-project-card-image img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform .45s ease;
}

.cat-project-card:hover .cat-project-card-image img{
    transform: scale(1.04);
}


/*==================================================
    CATEGORY BADGE
==================================================*/

.cat-project-badge{
    position: absolute;
    top: 14px;
    left: 14px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 28px;
    padding: 0 12px;

    border-radius: 4px;

    background: #2b4573;
    color: #ffffff;

    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .3px;

    z-index: 2;
}


/*==================================================
    PROJECT CARD BODY
==================================================*/

.cat-project-card-body{
    position: relative;
    padding: 24px 22px 22px;
}

.cat-project-card-title{
    margin: 0 0 10px;

    font-size: 20px;
    line-height: 1.35;
    font-weight: 700;

    color: #2b4573;
}

.cat-project-card-description{
    margin: 0 0 20px;

    font-size: 13px;
    line-height: 1.7;

    color: #596577;
}


/*==================================================
    PROJECT CARD FOOTER
==================================================*/

.cat-project-card-footer{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

.cat-project-location{
    display: inline-flex;
    align-items: center;
    gap: 6px;

    font-size: 11px;
    line-height: 1.4;
    font-weight: 500;

    color: #7994c8;
}

.cat-project-location i{
    font-size: 11px;
    color: #2f63ff;
}


/*==================================================
    ARROW BUTTON
==================================================*/

.cat-project-card-arrow{
    width: 38px;
    height: 38px;

    min-width: 38px;

    border-radius: 50%;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    border: 1px solid #d6e0f1;

    background: #f7f9fd;
    color: #2b4573;

    text-decoration: none;

    transition:
        background-color .3s ease,
        color .3s ease,
        border-color .3s ease,
        transform .3s ease;
}

.cat-project-card-arrow i{
    font-size: 12px;
    transition: transform .3s ease;
}

.cat-project-card-arrow:hover{
    background: #2b4573;
    color: #ffffff;
    border-color: #2b4573;

    transform: translateX(2px);
}

.cat-project-card-arrow:hover i{
    transform: translateX(2px);
}


/*==================================================
    CARD CONTENT REVEAL
==================================================*/

.cat-project-card-body{
    transition: transform .35s ease;
}

.cat-project-card:hover .cat-project-card-body{
    transform: translateY(-2px);
}


/*==================================================
    BOTTOM CTA
==================================================*/

.cat-project-cta{
    position: relative;

    display: grid;

    grid-template-columns: 1.15fr 1.4fr auto;

    align-items: center;

    gap: 42px;

    padding: 40px 42px;

    border-radius: 14px;

    background:
        linear-gradient(
            110deg,
            #233f8f 0%,
            #2b4573 48%,
            #3261ff 100%
        );

    overflow: hidden;
}


/*==================================================
    CTA DECORATION
==================================================*/

.cat-project-cta::before{
    content: "";

    position: absolute;

    width: 220px;
    height: 220px;

    right: 18%;
    bottom: -150px;

    border-radius: 50%;

    background: rgba(255,255,255,.05);

    pointer-events: none;
}


/*==================================================
    CTA LEFT CONTENT
==================================================*/

.cat-project-cta-content{
    position: relative;
    z-index: 2;
}

.cat-project-cta-content h3{
    margin: 0 0 10px;

    font-size: 28px;
    line-height: 1.3;
    font-weight: 700;

    color: #ffffff;
}

.cat-project-cta-content p{
    margin: 0;

    max-width: 350px;

    font-size: 14px;
    line-height: 1.6;

    color: rgba(255,255,255,.88);
}


/*==================================================
    CTA FEATURES
==================================================*/

.cat-project-cta-features{
    position: relative;
    z-index: 2;

    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;

    gap: 20px 30px;
}

.cat-project-cta-feature{
    display: inline-flex;
    align-items: center;
    gap: 11px;

    color: #ffffff;
}

.cat-project-cta-icon{
    width: 36px;
    height: 36px;

    min-width: 36px;

    border-radius: 50%;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(255,255,255,.13);
}

.cat-project-cta-icon i{
    font-size: 13px;
    color: #ffffff;
}

.cat-project-cta-feature span{
    font-size: 12px;
    font-weight: 600;
    white-space: nowrap;
}


/*==================================================
    CTA BUTTON
==================================================*/

.cat-project-cta-action{
    position: relative;
    z-index: 2;
}

.cat-project-cta-btn{
    display: inline-flex;
    align-items: center;
    justify-content: center;

    gap: 12px;

    min-width: 150px;
    height: 54px;

    padding: 0 24px;

    border-radius: 30px;

    background: #ffffff;

    color: #2b4573;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background-color .3s ease;
}

.cat-project-cta-btn i{
    font-size: 13px;
    transition: transform .3s ease;
}

.cat-project-cta-btn:hover{
    transform: translateY(-2px);

    box-shadow: 0 8px 20px rgba(0,0,0,.16);

    background: #f5f7fb;
}

.cat-project-cta-btn:hover i{
    transform: translateX(4px);
}


/*==================================================
    SIMPLE SECTION ANIMATION
==================================================*/

.cat-project-header,
.cat-project-filter-wrap,
.cat-project-grid,
.cat-project-cta{
    opacity: 0;
    transform: translateY(20px);

    transition:
        opacity .6s ease,
        transform .6s ease;
}

.cat-project-visible{
    opacity: 1;
    transform: translateY(0);
}



/*==================================================
    LARGE DESKTOP
==================================================*/

@media (min-width: 1400px){

    .cat-project-section{
        padding: 80px 0 90px;
    }

    .cat-project-grid{
        gap: 42px 30px;
    }

    .cat-project-card-image{
        height: 230px;
    }

}


/*==================================================
    DESKTOP / SMALL LAPTOP
==================================================*/

@media (max-width: 1199px){

    .cat-project-section{
        padding: 65px 0 75px;
    }

    .cat-project-title{
        font-size: 42px;
    }

    .cat-project-description{
        font-size: 13px;
    }

    .cat-project-filter-wrap{
        gap: 10px;
        margin-bottom: 45px;
    }

    .cat-project-filter-btn{
        min-height: 42px;
        padding: 0 16px;
        font-size: 11px;
    }

    .cat-project-grid{
        gap: 32px 22px;
    }

    .cat-project-card-image{
        height: 200px;
    }

    .cat-project-card-title{
        font-size: 18px;
    }

    .cat-project-card-description{
        font-size: 12px;
    }

    .cat-project-cta{
        grid-template-columns: 1fr 1.2fr auto;
        gap: 30px;
        padding: 34px 32px;
    }

    .cat-project-cta-content h3{
        font-size: 25px;
    }

}


/*==================================================
    TABLET
==================================================*/

@media (max-width: 991px){

    .cat-project-section{
        padding: 60px 0 70px;
    }

    .cat-project-header{
        margin-bottom: 24px;
    }

    .cat-project-title{
        font-size: 38px;
    }

    .cat-project-description{
        max-width: 560px;
    }

    .cat-project-filter-wrap{
        margin-bottom: 40px;
    }

    .cat-project-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 28px 22px;
    }

    .cat-project-card-image{
        height: 210px;
    }

    .cat-project-cta{
        grid-template-columns: 1fr;
        gap: 22px;
        text-align: center;
    }

    .cat-project-cta-content p{
        margin: 0 auto;
    }

    .cat-project-cta-features{
        justify-content: center;
    }

    .cat-project-cta-action{
        display: flex;
        justify-content: center;
    }

}


/*==================================================
    MOBILE LANDSCAPE / LARGE MOBILE
==================================================*/

@media (max-width: 767px){

    .cat-project-section{
        padding: 55px 0 60px;
    }

    .cat-project-header{
        max-width: 100%;
    }

    .cat-project-subtitle{
        font-size: 10px;
        letter-spacing: 2.4px;
    }

    .cat-project-title{
        font-size: 32px;
    }

    .cat-project-description{
        font-size: 12px;
        line-height: 1.6;
    }

    .cat-project-filter-wrap{
        justify-content: flex-start;
        flex-wrap: nowrap;

        overflow-x: auto;

        padding-bottom: 8px;
        margin-bottom: 32px;

        scrollbar-width: none;
    }

    .cat-project-filter-wrap::-webkit-scrollbar{
        display: none;
    }

    .cat-project-filter-btn{
        flex: 0 0 auto;
        min-height: 40px;
        padding: 0 15px;
    }

    .cat-project-grid{
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .cat-project-card-image{
        height: 230px;
    }

    .cat-project-card-body{
        padding: 22px 20px 20px;
    }

    .cat-project-card-title{
        font-size: 19px;
    }

    .cat-project-cta{
        padding: 25px 20px;
        border-radius: 12px;
    }

    .cat-project-cta-content h3{
        font-size: 21px;
    }

    .cat-project-cta-features{
        flex-direction: column;
        align-items: center;
        gap: 12px;
    }

    .cat-project-cta-btn{
        min-width: 140px;
    }

}


/*==================================================
    MOBILE
==================================================*/

@media (max-width: 575px){

    .cat-project-section{
        padding: 50px 0 55px;
    }

    .cat-project-title{
        font-size: 28px;
        letter-spacing: .5px;
    }

    .cat-project-description{
        max-width: 330px;
    }

    .cat-project-card-image{
        height: 205px;
    }

    .cat-project-badge{
        top: 12px;
        left: 12px;
        min-height: 26px;
        padding: 0 10px;
        font-size: 9px;
    }

    .cat-project-card-title{
        font-size: 18px;
    }

    .cat-project-card-description{
        margin-bottom: 18px;
        font-size: 12px;
    }

    .cat-project-location{
        font-size: 10px;
    }

    .cat-project-card-arrow{
        width: 36px;
        height: 36px;
        min-width: 36px;
    }

    .cat-project-cta-content h3{
        font-size: 20px;
    }

    .cat-project-cta-content p{
        font-size: 11px;
    }

    .cat-project-cta-feature span{
        font-size: 10px;
    }

}


/*==================================================
    SMALL MOBILE
==================================================*/

@media (max-width: 400px){

    .cat-project-title{
        font-size: 25px;
    }

    .cat-project-filter-btn{
        min-height: 38px;
        padding: 0 13px;
        font-size: 10px;
    }

    .cat-project-card-image{
        height: 185px;
    }

    .cat-project-card-body{
        padding: 20px 17px 18px;
    }

    .cat-project-card-title{
        font-size: 17px;
    }

    .cat-project-cta{
        padding: 22px 16px;
    }

}


/*==================================================
    TOUCH DEVICES
==================================================*/

@media (hover: none){

    .cat-project-card:hover{
        transform: none;
    }

    .cat-project-card:hover .cat-project-card-image img{
        transform: none;
    }

    .cat-project-filter-btn:hover{
        transform: none;
    }

    .cat-project-cta-btn:hover{
        transform: none;
    }

}




/*=========================================
    TRUST BY SECTION
==========================================*/

.trust-by-section {
    position: relative;
    width: 100%;
    background: #ffffff;
    padding: 50px 0 55px;
    overflow: hidden;
}


/*=========================================
    HEADING
==========================================*/

.trust-by-heading {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 18px;
    margin-bottom: 24px;
}

.trust-by-heading h2 {
    margin: 0;
    font-size: 21px;
    line-height: 1;
    font-weight: 700;
    color: #2b4573;
    letter-spacing: 1px;
    text-transform: uppercase;
}

.trust-by-heading-line {
    display: block;
    width: 55px;
    height: 2px;
    background: #2b4573;
}


/*=========================================
    CAROUSEL
==========================================*/

.trust-by-carousel {
    position: relative;
    width: 100%;
    overflow: hidden;
}


/* subtle white edge fade */

.trust-by-carousel::before,
.trust-by-carousel::after {
    content: "";
    position: absolute;
    top: 0;
    width: 70px;
    height: 100%;
    z-index: 5;
    pointer-events: none;
}

.trust-by-carousel::before {
    left: 0;
    background: linear-gradient(
        to right,
        #ffffff,
        rgba(255, 255, 255, 0)
    );
}

.trust-by-carousel::after {
    right: 0;
    background: linear-gradient(
        to left,
        #ffffff,
        rgba(255, 255, 255, 0)
    );
}


/*=========================================
    TRACK
==========================================*/

.trust-by-track {
    display: flex;
    align-items: center;
    width: max-content;
    will-change: transform;
}


/*=========================================
    PARTNER ITEM
==========================================*/

.trust-by-item {
    flex: 0 0 250px;
    width: 250px;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    text-align: center;

    padding: 5px 20px;
}


/*=========================================
    LOGO
==========================================*/

.trust-by-logo {
    width: 100%;
    height: 70px;

    display: flex;
    align-items: center;
    justify-content: center;
}

.trust-by-logo img {
    display: block;
    max-width: 190px;
    max-height: 62px;
    width: auto;
    height: auto;
    object-fit: contain;

    transition:
        transform 0.3s ease,
        opacity 0.3s ease;
}


/*=========================================
    PARTNER TYPE
==========================================*/

.trust-by-item p {
    margin: 11px 0 0;

    font-size: 15px;
    line-height: 1.4;
    font-weight: 500;

    color: #686868;
}


/*=========================================
    SIMPLE HOVER
==========================================*/

.trust-by-item:hover .trust-by-logo img {
    transform: scale(1.05);
}


/* Pause scrolling when hovered */

.trust-by-carousel:hover .trust-by-track {
    animation-play-state: paused;
}



/*=========================================
    LARGE DESKTOP
==========================================*/

@media (min-width: 1441px) {

    .trust-by-item {
        flex-basis: 260px;
        width: 260px;
    }

}


/*=========================================
    LAPTOP
    1200px - 1440px
==========================================*/

@media (min-width: 1200px) and (max-width: 1440px) {

    .trust-by-section {
        padding: 22px 0 24px;
    }

    .trust-by-heading {
        margin-bottom: 22px;
    }

    .trust-by-heading h2 {
        font-size: 20px;
    }

    .trust-by-item {
        flex-basis: 230px;
        width: 230px;
    }

    .trust-by-logo {
        height: 65px;
    }

    .trust-by-logo img {
        max-width: 175px;
        max-height: 58px;
    }

    .trust-by-item p {
        font-size: 14px;
    }

}


/*=========================================
    SMALL LAPTOP / TABLET LANDSCAPE
    992px - 1199px
==========================================*/

@media (min-width: 992px) and (max-width: 1199px) {

    .trust-by-section {
        padding: 25px 0;
    }

    .trust-by-heading {
        margin-bottom: 24px;
    }

    .trust-by-heading h2 {
        font-size: 19px;
    }

    .trust-by-heading-line {
        width: 45px;
    }

    .trust-by-item {
        flex-basis: 210px;
        width: 210px;
        padding: 5px 16px;
    }

    .trust-by-logo {
        height: 62px;
    }

    .trust-by-logo img {
        max-width: 165px;
        max-height: 55px;
    }

    .trust-by-item p {
        font-size: 14px;
    }

}


/*=========================================
    TABLET
    768px - 991px
==========================================*/

@media (min-width: 768px) and (max-width: 991px) {

    .trust-by-section {
        padding: 25px 0;
    }

    .trust-by-heading {
        gap: 14px;
        margin-bottom: 22px;
    }

    .trust-by-heading h2 {
        font-size: 18px;
    }

    .trust-by-heading-line {
        width: 38px;
    }

    .trust-by-item {
        flex-basis: 190px;
        width: 190px;
        padding: 5px 14px;
    }

    .trust-by-logo {
        height: 58px;
    }

    .trust-by-logo img {
        max-width: 150px;
        max-height: 52px;
    }

    .trust-by-item p {
        margin-top: 9px;
        font-size: 13px;
    }

}


/*=========================================
    MOBILE
    481px - 767px
==========================================*/

@media (min-width: 481px) and (max-width: 767px) {

    .trust-by-section {
        padding: 22px 0;
    }

    .trust-by-heading {
        gap: 12px;
        margin-bottom: 20px;
    }

    .trust-by-heading h2 {
        font-size: 17px;
    }

    .trust-by-heading-line {
        width: 30px;
    }

    .trust-by-item {
        flex-basis: 170px;
        width: 170px;
        padding: 5px 12px;
    }

    .trust-by-logo {
        height: 54px;
    }

    .trust-by-logo img {
        max-width: 140px;
        max-height: 48px;
    }

    .trust-by-item p {
        margin-top: 8px;
        font-size: 12px;
    }

    .trust-by-carousel::before,
    .trust-by-carousel::after {
        width: 30px;
    }

}


/*=========================================
    SMALL MOBILE
    320px - 480px
==========================================*/

@media (max-width: 480px) {

    .trust-by-section {
        padding: 20px 0;
    }

    .trust-by-heading {
        gap: 10px;
        margin-bottom: 18px;
    }

    .trust-by-heading h2 {
        font-size: 16px;
        letter-spacing: 0.7px;
    }

    .trust-by-heading-line {
        width: 25px;
    }

    .trust-by-item {
        flex-basis: 155px;
        width: 155px;
        padding: 5px 10px;
    }

    .trust-by-logo {
        height: 50px;
    }

    .trust-by-logo img {
        max-width: 125px;
        max-height: 45px;
    }

    .trust-by-item p {
        margin-top: 7px;
        font-size: 11px;
    }

    .trust-by-carousel::before,
    .trust-by-carousel::after {
        width: 20px;
    }

}






.mv-quote-status{
    width:100%;
    margin-top:18px;

    font-size:14px;
    line-height:1.6;
    font-weight:600;
}

.mv-quote-status.success{
    color:#198754;
}

.mv-quote-status.error{
    color:#dc3545;
}

.mv-quote-btn:disabled{
    opacity:.65;
    cursor:not-allowed;
}



.mv-quote-country-code {
    width: 85px;
    min-width: 85px;
    height: 100%;

    padding: 0 12px;

    border: 1px solid #e1e5eb;
    border-radius: 6px;

    background: #ffffff;

    color: #222;
    font-size: 14px;
    font-weight: 500;

    outline: none;

    transition: border-color 0.3s ease;
}

.mv-quote-country-code:focus {
    border-color: #2b4573;
}

.mv-quote-country-code::placeholder {
    color: #999;
}


/* Mobile */

@media (max-width: 767px) {

    .mv-quote-country-code {
        width: 75px;
        min-width: 75px;
        padding: 0 10px;
        font-size: 13px;
    }

}
















.in-about-section {
  --in-about-primary: #2b4573;
  --in-about-dark: #0b2864;
  --in-about-red: #d3222a;
  --in-about-text: #17223b;
  --in-about-muted: #626b7f;
  --in-about-border: #d9dee8;

  position: relative;
  width: 100%;
  overflow: hidden;
  background: #ffffff;
  padding: 105px 0;
  font-family: "Inter", sans-serif;
}

.in-about-section *,
.in-about-section *::before,
.in-about-section *::after {
  box-sizing: border-box;
}

.in-about-container {
  width: min(1480px, calc(100% - 100px));
  min-height: 660px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: minmax(480px, 0.84fr) minmax(600px, 1.16fr);
  align-items: center;
  column-gap: 90px;
}

.in-about-content {
  position: relative;
  z-index: 2;
  opacity: 0;
  transform: translateX(-45px);
  transition:
    opacity 0.8s ease,
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.in-about-content.in-about-visible {
  opacity: 1;
  transform: translateX(0);
}

.in-about-eyebrow {
  margin-bottom: 27px;
}

.in-about-eyebrow-title {
  margin: 0;
  color: var(--in-about-dark);
  font-size: 20px;
  font-weight: 700;
  line-height: 1.4;
}

.in-about-eyebrow-line {
  display: block;
  width: 68px;
  height: 3px;
  margin-top: 17px;
  background: var(--in-about-red);
}

.in-about-title {
  margin: 0;
  color: var(--in-about-dark);
  font-size: clamp(48px, 4vw, 69px);
  font-weight: 800;
  line-height: 1.14;
  letter-spacing: -2.8px;
}

.in-about-title-break {
  display: block;
}

.in-about-title-lines {
  display: flex;
  width: 285px;
  height: 3px;
  margin: 28px 0 24px;
}

.in-about-title-line-blue {
  width: 85%;
  height: 100%;
  background: var(--in-about-dark);
}

/* .in-about-title-line-red {
  flex: 1;
  height: 100%;
  background: var(--in-about-red);
} */

.in-about-description {
  max-width: 590px;
  margin: 0;
  color: #7e8285;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.62;
}

.in-about-statistics {
  display: flex;
  align-items: stretch;
  margin-top: 22px;
}

.in-about-stat-item {
  min-width: 160px;
  padding: 8px 22px 5px 5px;
}

.in-about-stat-item:first-child {
  padding-left: 5px;
}

.in-about-stat-number,
.in-about-stat-year {
  margin: 0 0 4px;
  color: var(--in-about-dark);
  font-size: 35px;
  font-weight: 800;
  line-height: 1.15;
}

.in-about-stat-year {
  margin-top: 8px;
  white-space: nowrap;
  font-size: 25px;
}

.in-about-stat-year-number {
  font-size: 35px;
}

.in-about-stat-label {
  margin: 0;
  color: var(--in-about-muted);
  font-size: 14px;
  line-height: 1.4;
  white-space: nowrap;
}

.in-about-stat-divider {
  width: 1px;
  min-height: 74px;
  background: var(--in-about-border);
}

.in-about-stat-item-year {
  display: flex;
  align-items: flex-start;
  padding-left: 24px;
}

.in-about-button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 170px;
  min-height: 54px;
  margin-top: 36px;
  overflow: hidden;
  border: 2px solid var(--in-about-primary);
  border-radius: 13px;
  color: var(--in-about-dark);
  background: #ffffff;
  text-decoration: none;
  font-size: 16px;
  font-weight: 700;
  transition:
    color 0.3s ease,
    background-color 0.3s ease,
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.in-about-button-text {
  position: relative;
  z-index: 2;
  transform: translateX(0);
  transition: transform 0.3s ease;
}

.in-about-button-arrow {
  position: relative;
  z-index: 2;
  width: 0;
  overflow: hidden;
  opacity: 0;
  font-size: 22px;
  transform: translateX(-8px);
  transition:
    width 0.3s ease,
    opacity 0.3s ease,
    transform 0.3s ease,
    margin-left 0.3s ease;
}

.in-about-button:hover {
  color: #ffffff;
  background: var(--in-about-primary);
  box-shadow: 0 12px 25px rgba(43, 69, 115, 0.18);
  transform: translateY(-3px);
}

.in-about-button:hover .in-about-button-arrow {
  width: 22px;
  margin-left: 8px;
  opacity: 1;
  transform: translateX(0);
}

.in-about-visual {
  position: relative;
  opacity: 0;
  transform: translateX(50px);
  transition:
    opacity 0.9s ease 0.15s,
    transform 0.9s cubic-bezier(0.22, 1, 0.36, 1) 0.15s;
}

.in-about-visual.in-about-visible {
  opacity: 1;
  transform: translateX(0);
}

.in-about-logo-card {
  position: relative;
  width: 100%;
  min-height: 555px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  border-radius: 42px;
  background-color: #ffffff;
  background-image:
    linear-gradient(rgba(43, 69, 115, 0.09) 1px, transparent 1px),
    linear-gradient(90deg, rgba(43, 69, 115, 0.09) 1px, transparent 1px);
  background-size: 40px 62px;
  box-shadow: 0 12px 35px rgba(18, 36, 73, 0.12);
}

.in-about-logo-card::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(255, 255, 255, 0.4),
    transparent 45%,
    rgba(255, 255, 255, 0.3)
  );
  pointer-events: none;
}

.in-about-corner {
  position: absolute;
  z-index: 3;
  width: 42%;
  height: 42%;
  pointer-events: none;
}

.in-about-corner-top-left {
  top: 0;
  left: 0;
  border-top: 3px solid var(--in-about-primary);
  border-left: 3px solid var(--in-about-primary);
  border-top-left-radius: 42px;
}

.in-about-corner-bottom-right {
  right: 0;
  bottom: 0;
  border-right: 3px solid var(--in-about-primary);
  border-bottom: 3px solid var(--in-about-primary);
  border-bottom-right-radius: 42px;
}

/* .in-about-red-line {
  position: absolute;
  z-index: 3;
  width: 3px;
  height: 144px;
  background: var(--in-about-red);
} */

.in-about-red-line-right {
  top: 36%;
  right: 0;
}

.in-about-logo-wrapper {
  position: relative;
  z-index: 2;
  width: 86%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.in-about-logo {
  display: block;
  width: 80%;
  max-width: 700px;
  height: auto;
  object-fit: contain;
  transform: scale(0.92);
  transition: transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.in-about-visual.in-about-visible .in-about-logo {
  transform: scale(1);
}

/* Large Laptop/Desktop: 1400px–1599px */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .in-about-section {
    padding: 90px 0;
  }

  .in-about-container {
    width: min(1320px, calc(100% - 80px));
    grid-template-columns: minmax(450px, 0.86fr) minmax(550px, 1.14fr);
    column-gap: 65px;
  }

  .in-about-title {
    font-size: 58px;
  }

  .in-about-description {
    font-size: 17px;
  }

  .in-about-logo-card {
    min-height: 510px;
  }
}

/* Standard Laptop: 1200px–1399px */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .in-about-section {
    padding: 80px 0;
  }

  .in-about-container {
    width: calc(100% - 70px);
    min-height: 590px;
    grid-template-columns: minmax(430px, 0.9fr) minmax(500px, 1.1fr);
    column-gap: 50px;
  }

  .in-about-title {
    font-size: 51px;
    letter-spacing: -2px;
  }

  .in-about-description {
    max-width: 520px;
    font-size: 16px;
  }

  .in-about-stat-item {
    min-width: 140px;
    padding-right: 17px;
  }

  .in-about-stat-number {
    font-size: 31px;
  }

  .in-about-stat-year {
    font-size: 21px;
  }

  .in-about-stat-year-number {
    font-size: 31px;
  }

  .in-about-logo-card {
    min-height: 465px;
  }
}

/* Small Laptop: 992px–1199px */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .in-about-section {
    padding: 75px 0;
  }

  .in-about-container {
    width: calc(100% - 60px);
    min-height: 530px;
    grid-template-columns: minmax(390px, 0.95fr) minmax(440px, 1.05fr);
    column-gap: 40px;
  }

  .in-about-eyebrow-title {
    font-size: 17px;
  }

  .in-about-title {
    font-size: 44px;
    letter-spacing: -1.7px;
  }

  .in-about-title-lines {
    width: 245px;
    margin: 22px 0 20px;
  }

  .in-about-description {
    font-size: 15px;
  }

  .in-about-stat-item {
    min-width: 120px;
    padding: 6px 13px;
  }

  .in-about-stat-number {
    font-size: 28px;
  }

  .in-about-stat-label {
    font-size: 12px;
  }

  .in-about-stat-year {
    font-size: 18px;
  }

  .in-about-stat-year-number {
    font-size: 27px;
  }

  .in-about-logo-card {
    min-height: 405px;
    border-radius: 35px;
  }

  .in-about-corner-top-left {
    border-top-left-radius: 35px;
  }

  .in-about-corner-bottom-right {
    border-bottom-right-radius: 35px;
  }
}

/* Tablet: 768px–991px */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .in-about-section {
    padding: 80px 0;
  }

  .in-about-container {
    width: calc(100% - 70px);
    min-height: auto;
    grid-template-columns: 1fr;
    row-gap: 60px;
  }

  .in-about-content {
    max-width: 680px;
  }

  .in-about-title {
    font-size: 56px;
  }

  .in-about-description {
    max-width: 640px;
    font-size: 17px;
  }

  .in-about-statistics {
    max-width: 570px;
  }

  .in-about-stat-item {
    flex: 1;
  }

  .in-about-logo-card {
    min-height: 490px;
  }
}

/* Mobile: Up to 767px */

@media only screen and (max-width: 767px) {
  .in-about-section {
    padding: 65px 0;
  }

  .in-about-container {
    width: calc(100% - 36px);
    min-height: auto;
    grid-template-columns: 1fr;
    row-gap: 48px;
  }

  .in-about-content,
  .in-about-visual {
    transform: translateY(30px);
  }

  .in-about-content.in-about-visible,
  .in-about-visual.in-about-visible {
    transform: translateY(0);
  }

  .in-about-eyebrow {
    margin-bottom: 22px;
  }

  .in-about-eyebrow-title {
    font-size: 16px;
  }

  .in-about-eyebrow-line {
    width: 58px;
    margin-top: 13px;
  }

  .in-about-title {
    font-size: clamp(37px, 10.5vw, 52px);
    line-height: 1.14;
    letter-spacing: -1.6px;
  }

  .in-about-title-lines {
    width: 220px;
    margin: 23px 0 20px;
  }

  .in-about-description {
    font-size: 15px;
    line-height: 1.7;
  }

  .in-about-statistics {
    display: grid;
    grid-template-columns: 1fr 1px 1fr;
    row-gap: 18px;
    margin-top: 25px;
  }

  .in-about-stat-item {
    min-width: 0;
    padding: 5px 12px;
  }

  .in-about-stat-item:first-child {
    padding-left: 0;
  }

  .in-about-stat-divider {
    min-height: 64px;
  }

  .in-about-stat-divider:nth-of-type(2) {
    display: none;
  }

  .in-about-stat-item-year {
    grid-column: 1 / -1;
    padding: 0;
    display: none;
  }

  .in-about-stat-number {
    display: inline-block;
    width: max-content;
    font-size: 29px;
    background-image: linear-gradient(90deg, #2b4573, #c4272c);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
  }

  .in-about-stat-label {
    font-size: 12px;
    white-space: normal;
  }

  .in-about-stat-year {
    margin-top: 0;
    font-size: 20px;
  }

  .in-about-stat-year-number {
    font-size: 29px;
  }

  .in-about-button {
    min-width: 155px;
    min-height: 51px;
    margin-top: 28px;
  }

  .in-about-logo-card {
    min-height: 330px;
    border-radius: 28px;
    background-size: 32px 48px;
  }

  .in-about-corner-top-left {
    border-top-left-radius: 28px;
  }

  .in-about-corner-bottom-right {
    border-bottom-right-radius: 28px;
  }

  .in-about-red-line {
    height: 90px;
  }

  .in-about-logo-wrapper {
    width: 87%;
  }
}

/* Small Mobile: Up to 480px */

@media only screen and (max-width: 480px) {
  .in-about-section {
    padding: 55px 0;
  }

  .in-about-container {
    width: calc(100% - 30px);
    row-gap: 42px;
  }

  .in-about-title {
    font-size: clamp(34px, 10vw, 43px);
  }

  .in-about-description {
    font-size: 14px;
  }

  .in-about-logo-card {
    min-height: 275px;
    border-radius: 24px;
  }

  .in-about-corner-top-left {
    border-top-left-radius: 24px;
  }

  .in-about-corner-bottom-right {
    border-bottom-right-radius: 24px;
  }
}

/* Reduced Motion Accessibility */

@media (prefers-reduced-motion: reduce) {
  .in-about-content,
  .in-about-visual,
  .in-about-logo,
  .in-about-button {
    opacity: 1;
    transform: none;
    transition: none;
  }
}








.in-service-section {
  --in-service-blue: #2b4573;
  --in-service-dark-blue: #082b66;
  --in-service-red: #c21f24;
  --in-service-text: #4e5a72;
  --in-service-border: #c9d6e9;
  --in-service-icon-bg: #edf4fd;

  width: 100%;
  overflow: hidden;
  padding: 40px 36px;
  background: #f8fbff;
  font-family: "Inter", sans-serif;
}

.in-service-section *,
.in-service-section *::before,
.in-service-section *::after {
  box-sizing: border-box;
}

.in-service-container {
  width: 100%;
  max-width: 1465px;
  min-height: 945px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 455px minmax(0, 1fr);
  gap: 23px;
}

/* Introduction panel */

.in-service-intro {
  position: relative;
  min-height: 945px;
  overflow: hidden;
  border-radius: 15px;
  color: #ffffff;
  background:
    radial-gradient(
      circle at 65% 44%,
      rgba(15, 91, 161, 0.35),
      transparent 34%
    ),
    linear-gradient(145deg, #052b68 0%, #07336e 55%, #062b63 100%);
  opacity: 0;
  transform: translateX(-35px);
  transition:
    opacity 0.8s ease,
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.in-service-intro.in-service-visible {
  opacity: 1;
  transform: translateX(0);
}

.in-service-intro-content {
  position: relative;
  z-index: 3;
  padding: 90px 42px 40px;
}

.in-service-subtitle {
  display: block;
  margin-bottom: 24px;
  color: #ff2530;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 1px;
}

.in-service-heading {
  margin: 0;
  color: #ffffff;
  font-size: 48px;
  font-weight: 800;
  line-height: 1.13;
  letter-spacing: -1.8px;
}

.in-service-intro-description {
  max-width: 350px;
  margin: 27px 0 0;
  color: #ffffff;
  font-size: 19px;
  font-weight: 400;
  line-height: 1.7;
}

.in-service-explore-button {
  display: inline-flex;
  min-width: 267px;
  min-height: 62px;
  margin-top: 43px;
  padding: 14px 27px;
  align-items: center;
  justify-content: space-between;
  border-radius: 10px;
  color: #ffffff;
  background: linear-gradient(135deg, #ed1426, #f1262e);
  text-decoration: none;
  box-shadow: 0 12px 30px rgba(194, 31, 36, 0.2);
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease,
    background-color 0.3s ease;
}

.in-service-explore-text {
  font-size: 17px;
  font-weight: 700;
}

.in-service-explore-icon {
  width: 23px;
  height: 23px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.in-service-explore-button:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 34px rgba(194, 31, 36, 0.3);
}

.in-service-explore-button:hover .in-service-explore-icon {
  transform: translateX(5px);
}

/* Decorative network */

.in-service-network {
  position: absolute;
  z-index: 1;
  right: -40px;
  bottom: -25px;
  left: -40px;
  height: 400px;
  opacity: 0.75;
  background:
    radial-gradient(
      ellipse at 50% 100%,
      rgba(33, 103, 187, 0.75),
      transparent 66%
    ),
    repeating-linear-gradient(
      9deg,
      transparent 0,
      transparent 33px,
      rgba(93, 156, 218, 0.16) 34px,
      transparent 35px
    ),
    repeating-linear-gradient(
      -8deg,
      transparent 0,
      transparent 39px,
      rgba(93, 156, 218, 0.14) 40px,
      transparent 41px
    );
  border-radius: 50% 50% 0 0;
  transform: perspective(300px) rotateX(47deg) scale(1.35);
  transform-origin: center bottom;
}

.in-service-network::before,
.in-service-network::after {
  content: "";
  position: absolute;
  inset: 18% -20% -20%;
  border-radius: 50%;
  border-top: 1px solid rgba(93, 156, 218, 0.32);
  box-shadow:
    0 -25px 0 rgba(93, 156, 218, 0.12),
    0 -55px 0 rgba(93, 156, 218, 0.09),
    0 -85px 0 rgba(93, 156, 218, 0.07);
}

.in-service-network-line {
  position: absolute;
  bottom: 43%;
  width: 1px;
  background: linear-gradient(
    to top,
    rgba(41, 177, 222, 0.75),
    transparent
  );
}

.in-service-network-line-one {
  left: 18%;
  height: 95px;
}

.in-service-network-line-two {
  left: 35%;
  height: 145px;
}

.in-service-network-line-three {
  left: 52%;
  height: 105px;
}

.in-service-network-line-four {
  left: 66%;
  height: 170px;
}

.in-service-network-line-five {
  left: 80%;
  height: 130px;
}

.in-service-network-line-six {
  left: 91%;
  height: 115px;
}

.in-service-network-dot {
  position: absolute;
  bottom: calc(43% + var(--in-service-dot-height));
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #21b6df;
  box-shadow: 0 0 9px currentColor;
  animation: in-service-dot-pulse 2.2s ease-in-out infinite;
}

.in-service-network-dot-one {
  left: 18%;
  --in-service-dot-height: 95px;
}

.in-service-network-dot-two {
  left: 35%;
  --in-service-dot-height: 145px;
  background: #e72531;
  animation-delay: 0.3s;
}

.in-service-network-dot-three {
  left: 52%;
  --in-service-dot-height: 105px;
  animation-delay: 0.6s;
}

.in-service-network-dot-four {
  left: 66%;
  --in-service-dot-height: 170px;
  background: #d7e7f8;
  animation-delay: 0.9s;
}

.in-service-network-dot-five {
  left: 80%;
  --in-service-dot-height: 130px;
  background: #e72531;
  animation-delay: 1.2s;
}

.in-service-network-dot-six {
  left: 91%;
  --in-service-dot-height: 115px;
  animation-delay: 1.5s;
}

@keyframes in-service-dot-pulse {
  0%,
  100% {
    opacity: 0.45;
    transform: scale(0.8);
  }

  50% {
    opacity: 1;
    transform: scale(1.4);
  }
}

/* Service cards */

.in-service-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 18px;
}

.in-service-card {
  min-width: 0;
  display: flex;
  flex-direction: column;
  padding: 76px 36px 38px;
  border: 1px solid var(--in-service-border);
  border-radius: 15px;
  background: #ffffff;
  opacity: 0;
  transform: translateY(35px);
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.in-service-card:nth-child(2) {
  transition-delay: 0.1s;
}

.in-service-card:nth-child(3) {
  transition-delay: 0.2s;
}

.in-service-card:nth-child(4) {
  transition-delay: 0.3s;
}

.in-service-card.in-service-visible {
  opacity: 1;
  transform: translateY(0);
}

.in-service-card:hover {
  border-color: rgba(43, 69, 115, 0.45);
  box-shadow: 0 15px 35px rgba(43, 69, 115, 0.09);
}

.in-service-card-header {
  display: flex;
  align-items: center;
  gap: 31px;
}

.in-service-icon-box {
  width: 112px;
  height: 115px;
  flex: 0 0 112px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 16px;
  background: var(--in-service-icon-bg);
}

.in-service-card-icon {
  width: 70px;
  height: 70px;
  fill: none;
  stroke: #062b68;
  stroke-width: 2.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.in-service-card-title-wrap {
  min-width: 0;
}

.in-service-number {
  display: block;
  margin-bottom: 15px;
  color: #e51d2a;
  font-size: 25px;
  font-weight: 700;
  line-height: 1;
}

.in-service-card-title {
  margin: 0;
  color: #082b66;
  font-size: 27px;
  font-weight: 700;
  line-height: 1.17;
  letter-spacing: -0.9px;
}

.in-service-card-description {
  max-width: 390px;
  margin: 50px 0 0;
  color: var(--in-service-text);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.65;
}

.in-service-learn-link {
  display: inline-flex;
  width: fit-content;
  margin-top: auto;
  align-items: center;
  gap: 19px;
  color: #082b66;
  text-decoration: none;
}

.in-service-learn-text {
  font-size: 17px;
  font-weight: 700;
}

.in-service-learn-arrow {
  font-size: 29px;
  font-weight: 400;
  line-height: 1;
  transition: transform 0.3s ease;
}

.in-service-learn-link:hover .in-service-learn-arrow {
  transform: translateX(6px);
}

/* Large laptop */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .in-service-section {
    padding: 38px 35px;
  }

  .in-service-container {
    max-width: 1425px;
    min-height: 900px;
    grid-template-columns: 440px minmax(0, 1fr);
  }

  .in-service-intro {
    min-height: 900px;
  }

  .in-service-intro-content {
    padding: 84px 40px 35px;
  }

  .in-service-heading {
    font-size: 45px;
  }

  .in-service-card {
    padding: 70px 34px 36px;
  }

  .in-service-card-title {
    font-size: 25px;
  }
}

/* Standard laptop */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .in-service-section {
    padding: 35px 30px;
  }

  .in-service-container {
    min-height: 810px;
    grid-template-columns: 370px minmax(0, 1fr);
    gap: 18px;
  }

  .in-service-intro {
    min-height: 810px;
  }

  .in-service-intro-content {
    padding: 70px 34px 35px;
  }

  .in-service-heading {
    font-size: 40px;
  }

  .in-service-intro-description {
    font-size: 16px;
  }

  .in-service-explore-button {
    min-width: 235px;
    min-height: 57px;
  }

  .in-service-card {
    padding: 52px 29px 30px;
  }

  .in-service-card-header {
    gap: 23px;
  }

  .in-service-icon-box {
    width: 92px;
    height: 95px;
    flex-basis: 92px;
  }

  .in-service-card-icon {
    width: 59px;
    height: 59px;
  }

  .in-service-card-title {
    font-size: 22px;
  }

  .in-service-number {
    margin-bottom: 11px;
    font-size: 21px;
  }

  .in-service-card-description {
    margin-top: 38px;
    font-size: 16px;
  }
}

/* Small laptop */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .in-service-section {
    padding: 30px 24px;
  }

  .in-service-container {
    min-height: 735px;
    grid-template-columns: 315px minmax(0, 1fr);
    gap: 15px;
  }

  .in-service-intro {
    min-height: 735px;
  }

  .in-service-intro-content {
    padding: 55px 27px 30px;
  }

  .in-service-subtitle {
    margin-bottom: 19px;
    font-size: 13px;
  }

  .in-service-heading {
    font-size: 34px;
  }

  .in-service-intro-description {
    margin-top: 23px;
    font-size: 14px;
  }

  .in-service-explore-button {
    min-width: 210px;
    min-height: 53px;
    margin-top: 32px;
    padding: 12px 20px;
  }

  .in-service-explore-text {
    font-size: 14px;
  }

  .in-service-grid {
    gap: 14px;
  }

  .in-service-card {
    padding: 39px 22px 25px;
  }

  .in-service-card-header {
    gap: 18px;
  }

  .in-service-icon-box {
    width: 78px;
    height: 82px;
    flex-basis: 78px;
  }

  .in-service-card-icon {
    width: 49px;
    height: 49px;
  }

  .in-service-number {
    margin-bottom: 9px;
    font-size: 18px;
  }

  .in-service-card-title {
    font-size: 18px;
    letter-spacing: -0.4px;
  }

  .in-service-card-description {
    margin-top: 30px;
    font-size: 14px;
  }

  .in-service-learn-text {
    font-size: 14px;
  }

  .in-service-learn-arrow {
    font-size: 24px;
  }
}

/* Tablet */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .in-service-section {
    padding: 35px 28px;
  }

  .in-service-container {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .in-service-intro {
    min-height: 590px;
  }

  .in-service-intro-content {
    padding: 65px 45px 40px;
  }

  .in-service-heading {
    font-size: 48px;
  }

  .in-service-intro-description {
    max-width: 420px;
    font-size: 17px;
  }

  .in-service-network {
    right: -20px;
    left: 25%;
    height: 360px;
  }

  .in-service-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
  }

  .in-service-card {
    min-height: 425px;
    padding: 39px 27px 30px;
  }

  .in-service-card-header {
    align-items: flex-start;
    gap: 20px;
  }

  .in-service-icon-box {
    width: 82px;
    height: 85px;
    flex-basis: 82px;
  }

  .in-service-card-icon {
    width: 51px;
    height: 51px;
  }

  .in-service-number {
    font-size: 19px;
  }

  .in-service-card-title {
    font-size: 19px;
  }

  .in-service-card-description {
    margin-top: 34px;
    font-size: 15px;
  }
}

/* Mobile */

@media only screen and (max-width: 767px) {
  .in-service-section {
    padding: 25px 18px;
  }

  .in-service-container {
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .in-service-intro {
    min-height: 650px;
    transform: translateY(30px);
  }

  .in-service-intro.in-service-visible {
    transform: translateY(0);
  }

  .in-service-intro-content {
    padding: 60px 31px 35px;
  }

  .in-service-subtitle {
    margin-bottom: 20px;
    font-size: 13px;
  }

  .in-service-heading {
    font-size: clamp(36px, 10.5vw, 48px);
    letter-spacing: -1.2px;
  }

  .in-service-intro-description {
    max-width: 345px;
    margin-top: 24px;
    font-size: 15px;
    line-height: 1.7;
  }

  .in-service-explore-button {
    min-width: 235px;
    min-height: 56px;
    margin-top: 32px;
    padding: 12px 22px;
  }

  .in-service-explore-text {
    font-size: 15px;
  }

  .in-service-network {
    right: -40px;
    left: -40px;
    bottom: -20px;
    height: 330px;
  }

  .in-service-grid {
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: 18px;
  }

  .in-service-card {
    min-height: 400px;
    padding: 42px 30px 31px;
  }

  .in-service-card-header {
    gap: 22px;
  }

  .in-service-icon-box {
    width: 86px;
    height: 89px;
    flex-basis: 86px;
  }

  .in-service-card-icon {
    width: 54px;
    height: 54px;
  }

  .in-service-number {
    margin-bottom: 10px;
    font-size: 20px;
  }

  .in-service-card-title {
    font-size: 21px;
  }

  .in-service-card-description {
    margin-top: 36px;
    font-size: 15px;
  }
}

/* Small mobile */

@media only screen and (max-width: 480px) {
  .in-service-section {
    padding: 20px 15px;
  }

  .in-service-intro {
    min-height: 610px;
  }

  .in-service-intro-content {
    padding: 70px 25px 30px;
  }

  .in-service-heading {
    font-size: 30px;
  }

  .in-service-card {
    min-height: 380px;
    padding: 35px 23px 27px;
  }

  .in-service-card-header {
    gap: 17px;
  }

  .in-service-icon-box {
    width: 72px;
    height: 75px;
    flex-basis: 72px;
    border-radius: 12px;
  }

  .in-service-card-icon {
    width: 46px;
    height: 46px;
  }

  .in-service-number {
    font-size: 17px;
  }

  .in-service-card-title {
    font-size: 18px;
  }

  .in-service-card-description {
    margin-top: 31px;
    font-size: 14px;
  }
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  .in-service-intro,
  .in-service-card,
  .in-service-network-dot,
  .in-service-explore-button,
  .in-service-explore-icon,
  .in-service-learn-arrow {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }
}


















/* ======================================================
   ACHIEVEMENT SECTION
====================================================== */

.in-achieve-section {
  --in-achieve-blue: #2b4573;
  --in-achieve-red: #c21f24;
  --in-achieve-dark: #031a39;
  --in-achieve-white: #ffffff;
  --in-achieve-line: #b9dcff;

  position: relative;
  width: 100%;
  min-height: 880px;
  overflow: hidden;
  padding: 65px 0 100px;
  color: var(--in-achieve-white);
  background-color: var(--in-achieve-dark);
  background-image: url("images/achievement-bg.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  font-family: "Inter", sans-serif;
}

.in-achieve-section *,
.in-achieve-section *::before,
.in-achieve-section *::after {
  box-sizing: border-box;
}

.in-achieve-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  pointer-events: none;
  background:
    linear-gradient(
      180deg,
      rgba(1, 17, 39, 0.22) 0%,
      rgba(1, 20, 47, 0.1) 48%,
      rgba(1, 18, 42, 0.4) 100%
    ),
    linear-gradient(
      90deg,
      rgba(2, 21, 47, 0.2),
      transparent 48%,
      rgba(2, 21, 47, 0.2)
    );
}

.in-achieve-container {
  position: relative;
  z-index: 2;
  width: min(1700px, calc(100% - 80px));
  margin: 0 auto;
}

/* ======================================================
   HEADER
====================================================== */

.in-achieve-header {
  width: 100%;
  max-width: 1450px;
  margin: 0 auto;
  text-align: center;
  opacity: 0;
  transform: translateY(-25px);
  transition:
    opacity 0.8s ease,
    transform 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.in-achieve-header.in-achieve-visible {
  opacity: 1;
  transform: translateY(0);
}

.in-achieve-subtitle {
  margin: 0 0 14px;
  color: #ef393d;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 6px;
  text-transform: uppercase;
}

.in-achieve-title {
  margin: 0;
  color: var(--in-achieve-white);
  font-size: clamp(44px, 3.25vw, 62px);
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: -2px;
  white-space: nowrap;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.45);
}

.in-achieve-description {
  max-width: 760px;
  margin: 21px auto 0;
  color: rgba(255, 255, 255, 0.94);
  font-size: 19px;
  font-weight: 400;
  line-height: 1.55;
}

.in-achieve-description-break,
.in-achieve-label-break {
  display: block;
}

/* ======================================================
   TIMELINE
====================================================== */

.in-achieve-timeline {
  position: relative;
  width: 100%;
  height: 500px;
  margin-top: 20px;
}

.in-achieve-curve {
  position: absolute;
  top: 105px;
  left: 0;
  z-index: 1;
  width: 100%;
  height: 420px;
  overflow: visible;
}

.in-achieve-curve-glow,
.in-achieve-curve-line {
  fill: none;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.in-achieve-curve-glow {
  stroke: rgba(85, 166, 255, 0.5);
  stroke-width: 15;
  filter: blur(9px);
}

.in-achieve-curve-line {
  stroke: var(--in-achieve-line);
  stroke-width: 3;
  filter: url("#in-achieve-glow");
  stroke-dasharray: 2300;
  stroke-dashoffset: 2300;
  transition: stroke-dashoffset 2.2s ease;
}

.in-achieve-curve-line.in-achieve-draw {
  stroke-dashoffset: 0;
}

/* ======================================================
   ACHIEVEMENT ITEMS
====================================================== */

.in-achieve-item {
  position: absolute;
  z-index: 3;
  width: 230px;
  text-align: center;
  opacity: 0;
  transition:
    opacity 0.7s ease,
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}

.in-achieve-item.in-achieve-visible {
  opacity: 1;
  transform: translateY(0);
}

.in-achieve-item-one {
  top: 20px;
  left: 10.5%;
  transform: translateY(-35px);
}

.in-achieve-item-two {
  top: 235px;
  left: 29%;
  transform: translateY(35px);
}

.in-achieve-item-three {
  top: 55px;
  left: 55%;
  transform: translateY(-35px);
}

.in-achieve-item-four {
  top: 125px;
  right: 7%;
  transform: translateY(-35px);
}

.in-achieve-content {
  position: relative;
}

.in-achieve-number-row {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  line-height: 1;
}

.in-achieve-number {
  color: var(--in-achieve-white);
  font-size: 64px;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -2px;
  text-shadow: 0 4px 8px rgba(0, 0, 0, 0.45);
}

.in-achieve-plus {
  margin: 2px 0 0 7px;
  color: #ed3237;
  font-size: 36px;
  font-weight: 800;
  line-height: 1;
}

.in-achieve-red-divider {
  display: block;
  width: 46px;
  height: 5px;
  margin: 14px auto 13px;
  border-radius: 5px;
  background: #ed3237;
}

.in-achieve-label {
  margin: 0;
  color: var(--in-achieve-white);
  font-size: 21px;
  font-weight: 500;
  line-height: 1.25;
  text-shadow: 0 3px 6px rgba(0, 0, 0, 0.5);
}

/* ======================================================
   CONNECTORS AND POINTS
====================================================== */

.in-achieve-connector {
  display: block;
  width: 3px;
  height: 50px;
  margin: 12px auto 0;
  border-radius: 4px;
  background: var(--in-achieve-white);
  box-shadow: 0 0 10px rgba(160, 210, 255, 0.55);
}

.in-achieve-point {
  position: relative;
  display: block;
  width: 34px;
  height: 34px;
  margin: -1px auto 0;
  border: 3px solid var(--in-achieve-white);
  border-radius: 50%;
  background: rgba(43, 69, 115, 0.75);
  box-shadow:
    0 0 0 9px rgba(56, 133, 218, 0.12),
    0 0 22px rgba(76, 166, 255, 0.55);
}

.in-achieve-point-center {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 12px;
  height: 12px;
  border: 2px solid var(--in-achieve-white);
  border-radius: 50%;
  background: #ed3237;
  transform: translate(-50%, -50%);
}

/* Second item has point above content */

.in-achieve-item-two .in-achieve-point {
  margin: 0 auto -1px;
}

.in-achieve-item-two .in-achieve-connector {
  margin: 0 auto 12px;
}

/* ======================================================
   LARGE DESKTOP: 1600PX AND ABOVE
====================================================== */

@media only screen and (min-width: 1600px) {
  .in-achieve-section {
    min-height: 880px;
  }

  .in-achieve-title {
    font-size: 58px;
  }
}

/* ======================================================
   LARGE LAPTOP: 1400PX–1599PX
====================================================== */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .in-achieve-section {
    min-height: 790px;
    padding: 58px 0 80px;
  }

  .in-achieve-container {
    width: calc(100% - 70px);
  }

  .in-achieve-header {
    max-width: 1250px;
  }

  .in-achieve-title {
    font-size: 50px;
  }

  .in-achieve-description {
    font-size: 18px;
  }

  .in-achieve-timeline {
    height: 450px;
  }

  .in-achieve-curve {
    top: 100px;
  }

  .in-achieve-number {
    font-size: 60px;
  }

  .in-achieve-item-one {
    top: 20px;
    left: 9%;
  }

  .in-achieve-item-two {
    top: 220px;
    left: 28%;
  }

  .in-achieve-item-three {
    top: 58px;
    left: 54%;
  }

  .in-achieve-item-four {
    top: 125px;
    right: 5%;
  }
}

/* ======================================================
   STANDARD LAPTOP: 1200PX–1399PX
====================================================== */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .in-achieve-section {
    min-height: 720px;
    padding: 52px 0 65px;
  }

  .in-achieve-container {
    width: calc(100% - 60px);
  }

  .in-achieve-header {
    max-width: 1100px;
  }

  .in-achieve-subtitle {
    font-size: 16px;
    letter-spacing: 5px;
  }

  .in-achieve-title {
    font-size: 44px;
  }

  .in-achieve-description {
    font-size: 17px;
  }

  .in-achieve-timeline {
    height: 410px;
  }

  .in-achieve-curve {
    top: 90px;
  }

  .in-achieve-number {
    font-size: 55px;
  }

  .in-achieve-plus {
    font-size: 32px;
  }

  .in-achieve-label {
    font-size: 18px;
  }

  .in-achieve-item-one {
    top: 20px;
    left: 7%;
  }

  .in-achieve-item-two {
    top: 205px;
    left: 27%;
  }

  .in-achieve-item-three {
    top: 55px;
    left: 53%;
  }

  .in-achieve-item-four {
    top: 115px;
    right: 3%;
  }
}

/* ======================================================
   SMALL LAPTOP: 992PX–1199PX
====================================================== */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .in-achieve-section {
    min-height: 650px;
    padding: 48px 0 55px;
  }

  .in-achieve-container {
    width: calc(100% - 40px);
  }

  .in-achieve-header {
    max-width: 950px;
  }

  .in-achieve-subtitle {
    font-size: 14px;
    letter-spacing: 4px;
  }

  .in-achieve-title {
    font-size: 37px;
  }

  .in-achieve-description {
    max-width: 650px;
    font-size: 15px;
  }

  .in-achieve-timeline {
    height: 370px;
    margin-top: 10px;
  }

  .in-achieve-curve {
    top: 75px;
  }

  .in-achieve-number {
    font-size: 48px;
  }

  .in-achieve-plus {
    font-size: 28px;
  }

  .in-achieve-red-divider {
    width: 40px;
    height: 4px;
    margin: 11px auto;
  }

  .in-achieve-label {
    font-size: 16px;
  }

  .in-achieve-item {
    width: 180px;
  }

  .in-achieve-connector {
    height: 42px;
  }

  .in-achieve-point {
    width: 30px;
    height: 30px;
  }

  .in-achieve-item-one {
    top: 20px;
    left: 6%;
  }

  .in-achieve-item-two {
    top: 180px;
    left: 28%;
  }

  .in-achieve-item-three {
    top: 48px;
    left: 54%;
  }

  .in-achieve-item-four {
    top: 103px;
    right: 2%;
  }
}

/* ======================================================
   TABLET: 768PX–991PX
====================================================== */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .in-achieve-section {
    min-height: auto;
    padding: 65px 0 75px;
    background-position: center;
  }

  .in-achieve-container {
    width: calc(100% - 60px);
  }

  .in-achieve-header {
    max-width: 720px;
  }

  .in-achieve-subtitle {
    font-size: 15px;
    letter-spacing: 5px;
  }

  .in-achieve-title {
    font-size: 42px;
    line-height: 1.18;
    white-space: normal;
  }

  .in-achieve-description {
    max-width: 620px;
    font-size: 16px;
  }

  .in-achieve-timeline {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 28px;
    height: auto;
    margin-top: 55px;
  }

  .in-achieve-curve {
    display: none;
  }

  .in-achieve-item {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 230px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 28px 20px;
    border: 1px solid rgba(185, 220, 255, 0.18);
    border-radius: 18px;
    background: rgba(6, 34, 70, 0.6);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    transform: translateY(30px);
  }

  .in-achieve-number {
    font-size: 54px;
  }

  .in-achieve-plus {
    font-size: 31px;
  }

  .in-achieve-label {
    font-size: 18px;
  }

  .in-achieve-connector,
  .in-achieve-point {
    display: none;
  }
}

/* ======================================================
   MOBILE: UP TO 767PX
====================================================== */

@media only screen and (max-width: 767px) {
  .in-achieve-section {
    min-height: auto;
    padding: 58px 0 65px;
    background-position: center;
  }

  .in-achieve-container {
    width: calc(100% - 36px);
  }

  .in-achieve-subtitle {
    margin-bottom: 13px;
    font-size: 13px;
    letter-spacing: 4px;
  }

  .in-achieve-title {
    font-size: clamp(32px, 9vw, 42px);
    line-height: 1.2;
    letter-spacing: -1.3px;
    white-space: normal;
  }

  .in-achieve-description {
    margin-top: 18px;
    font-size: 15px;
    line-height: 1.6;
  }

  .in-achieve-description-break {
    display: inline;
  }

  .in-achieve-timeline {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
    height: auto;
    margin-top: 42px;
  }

  .in-achieve-curve {
    display: none;
  }

  .in-achieve-item {
    position: relative;
    inset: auto;
    width: 100%;
    min-height: 190px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 12px;
    border: 1px solid rgba(185, 220, 255, 0.17);
    border-radius: 16px;
    background: rgba(5, 31, 66, 0.68);
    backdrop-filter: blur(5px);
    -webkit-backdrop-filter: blur(5px);
    transform: translateY(25px);
  }

  .in-achieve-number {
    font-size: 45px;
    letter-spacing: -1px;
  }

  .in-achieve-plus {
    margin-left: 4px;
    font-size: 27px;
  }

  .in-achieve-red-divider {
    width: 38px;
    height: 4px;
    margin: 11px auto;
  }

  .in-achieve-label {
    font-size: 16px;
  }

  .in-achieve-connector,
  .in-achieve-point {
    display: none;
  }
}

/* ======================================================
   SMALL MOBILE: UP TO 480PX
====================================================== */

@media only screen and (max-width: 480px) {
  .in-achieve-section {
    padding: 50px 0 55px;
  }

  .in-achieve-container {
    width: calc(100% - 30px);
  }

  .in-achieve-subtitle {
    font-size: 12px;
    letter-spacing: 3px;
  }

  .in-achieve-title {
    font-size: 31px;
  }

  .in-achieve-description {
    font-size: 14px;
  }

  .in-achieve-timeline {
    grid-template-columns: 1fr;
    gap: 15px;
  }

  .in-achieve-item {
    min-height: 175px;
  }

  .in-achieve-number {
    font-size: 48px;
  }

  .in-achieve-label {
    font-size: 17px;
  }
}

/* ======================================================
   EXTRA SMALL MOBILE: UP TO 360PX
====================================================== */

@media only screen and (max-width: 360px) {
  .in-achieve-container {
    width: calc(100% - 24px);
  }

  .in-achieve-title {
    font-size: 28px;
  }

  .in-achieve-description {
    font-size: 13px;
  }

  .in-achieve-item {
    min-height: 165px;
    padding: 22px 10px;
  }

  .in-achieve-number {
    font-size: 44px;
  }

  .in-achieve-plus {
    font-size: 25px;
  }

  .in-achieve-label {
    font-size: 16px;
  }
}

/* ======================================================
   REDUCED MOTION
====================================================== */

@media (prefers-reduced-motion: reduce) {
  .in-achieve-header,
  .in-achieve-item {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .in-achieve-curve-line {
    stroke-dashoffset: 0;
    transition: none;
  }
}






/* ======================================================
   FINAL DESKTOP ALIGNMENT FIX
====================================================== */

@media only screen and (min-width: 992px) {
  .in-achieve-section {
    min-height: 760px;
    padding: 50px 0 70px;
  }

  .in-achieve-container {
    width: min(1600px, calc(100% - 80px));
  }

  .in-achieve-header {
    max-width: 1400px;
  }

  .in-achieve-timeline {
    position: relative;
    width: 100%;
    height: 450px;
    margin-top: 20px;
    transform: none;
  }

  .in-achieve-curve {
    top: 0;
    left: 0;
    width: 100%;
    height: 420px;
    transform: none;
  }

  .in-achieve-item {
    width: 230px;
  }

  .in-achieve-item-one {
    top: 20px;
    left: calc(17.5% - 115px);
  }

  .in-achieve-item-two {
    top: 235px;
    left: calc(36.25% - 115px);
  }

  .in-achieve-item-three {
    top: 55px;
    left: calc(62.5% - 115px);
  }

  .in-achieve-item-four {
    top: 125px;
    right: auto;
    left: calc(88.75% - 115px);
  }
}

/* Large laptop */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .in-achieve-section {
    min-height: 730px;
    padding: 48px 0 60px;
  }

  .in-achieve-container {
    width: calc(100% - 70px);
  }

  .in-achieve-title {
    font-size: 50px;
  }

  .in-achieve-timeline {
    height: 430px;
  }

  .in-achieve-curve {
    top: 0;
  }

  .in-achieve-item-one {
    top: 20px;
  }

  .in-achieve-item-two {
    top: 228px;
  }

  .in-achieve-item-three {
    top: 55px;
  }

  .in-achieve-item-four {
    top: 120px;
  }
}

/* Standard laptop */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .in-achieve-section {
    min-height: 680px;
    padding: 45px 0 55px;
  }

  .in-achieve-container {
    width: calc(100% - 55px);
  }

  .in-achieve-title {
    font-size: 43px;
  }

  .in-achieve-description {
    font-size: 16px;
  }

  .in-achieve-timeline {
    height: 400px;
  }

  .in-achieve-curve {
    top: 0;
    height: 380px;
  }

  .in-achieve-item {
    width: 200px;
  }

  .in-achieve-item-one {
    top: 22px;
    left: calc(17.5% - 100px);
  }

  .in-achieve-item-two {
    top: 216px;
    left: calc(36.25% - 100px);
  }

  .in-achieve-item-three {
    top: 55px;
    left: calc(62.5% - 100px);
  }

  .in-achieve-item-four {
    top: 116px;
    left: calc(88.75% - 100px);
  }

  .in-achieve-number {
    font-size: 54px;
  }

  .in-achieve-plus {
    font-size: 30px;
  }

  .in-achieve-label {
    font-size: 18px;
  }

  .in-achieve-connector {
    height: 45px;
  }
}

/* Small laptop */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .in-achieve-section {
    min-height: 610px;
    padding: 42px 0 45px;
  }

  .in-achieve-container {
    width: calc(100% - 40px);
  }

  .in-achieve-title {
    font-size: 36px;
  }

  .in-achieve-description {
    font-size: 15px;
  }

  .in-achieve-timeline {
    height: 355px;
  }

  .in-achieve-curve {
    top: 0;
    height: 340px;
  }

  .in-achieve-item {
    width: 170px;
  }

  .in-achieve-item-one {
    top: 25px;
    left: calc(17.5% - 85px);
  }

  .in-achieve-item-two {
    top: 188px;
    left: calc(36.25% - 85px);
  }

  .in-achieve-item-three {
    top: 52px;
    left: calc(62.5% - 85px);
  }

  .in-achieve-item-four {
    top: 103px;
    left: calc(88.75% - 85px);
  }

  .in-achieve-number {
    font-size: 46px;
  }

  .in-achieve-plus {
    font-size: 26px;
  }

  .in-achieve-label {
    font-size: 15px;
  }

  .in-achieve-red-divider {
    margin: 10px auto;
  }

  .in-achieve-connector {
    height: 38px;
  }

  .in-achieve-point {
    width: 28px;
    height: 28px;
  }

  .in-achieve-point-center {
    width: 10px;
    height: 10px;
  }
}

/* Home banner CTA only: frosted glass with a soft animated sheen */
.tv-slider-area .tv-banner-glass-btn {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 14px 30px;
  color: #fff;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.18), rgba(43, 69, 115, 0.16));
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 14px;
  box-shadow: 0 8px 30px rgba(3, 19, 48, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.28);
  -webkit-backdrop-filter: blur(12px) saturate(145%);
  backdrop-filter: blur(12px) saturate(145%);
  transition: transform 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease, background 0.35s ease;
  animation: tvBannerGlassPulse 3.2s ease-in-out infinite;
}

.tv-slider-area .tv-banner-glass-btn::before {
  content: "";
  position: absolute;
  z-index: 0;
  top: -80%;
  left: -55%;
  width: 38%;
  height: 260%;
  background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.6), transparent);
  transform: rotate(20deg);
  animation: tvBannerGlassSheen 3.8s ease-in-out infinite;
  pointer-events: none;
}

.tv-slider-area .tv-banner-glass-btn:hover {
  color: #fff;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.28), rgba(54, 98, 163, 0.2));
  border-color: rgba(255, 255, 255, 0.75);
  box-shadow: 0 14px 36px rgba(2, 16, 43, 0.32), 0 0 22px rgba(117, 190, 255, 0.2), inset 0 1px 0 rgba(255, 255, 255, 0.42);
  transform: translateY(-4px) scale(1.025);
  animation-play-state: paused;
}

.tv-slider-area .tv-banner-glass-btn .btn-wrap .btn-text1,
.tv-slider-area .tv-banner-glass-btn .btn-wrap .btn-text2,
.tv-slider-area .tv-banner-glass-btn:hover .btn-wrap .btn-text1,
.tv-slider-area .tv-banner-glass-btn:hover .btn-wrap .btn-text2 {
  color: #fff;
}

@keyframes tvBannerGlassSheen {
  0%, 48% { left: -55%; }
  72%, 100% { left: 125%; }
}

@keyframes tvBannerGlassPulse {
  0%, 100% { box-shadow: 0 8px 30px rgba(3, 19, 48, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.28); }
  50% { box-shadow: 0 10px 34px rgba(3, 19, 48, 0.28), 0 0 18px rgba(117, 190, 255, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.34); }
}

@media (prefers-reduced-motion: reduce) {
  .tv-slider-area .tv-banner-glass-btn,
  .tv-slider-area .tv-banner-glass-btn::before {
    animation: none;
  }
}



















/* =====================================================
   OUR PROJECTS SECTION
===================================================== */

.in-project-section {
  --in-project-blue: #2b4573;
  --in-project-dark-blue: #102e60;
  --in-project-deep-blue: #082957;
  --in-project-red: #c32226;
  --in-project-text: #676a70;
  --in-project-background: #f8f7f5;

  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 62px 0 76px;
  background: var(--in-project-background);
  font-family: "Inter", sans-serif;
}

.in-project-section *,
.in-project-section *::before,
.in-project-section *::after {
  box-sizing: border-box;
}

.in-project-container {
  width: min(1510px, calc(100% - 100px));
  margin: 0 auto;
}

/* =====================================================
   HEADER
===================================================== */

.in-project-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 60px;
  margin-bottom: 42px;
}

.in-project-heading-area {
  max-width: 760px;
}

.in-project-label {
  margin: 0 0 20px;
  color: var(--in-project-red);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 1.1px;
  text-transform: uppercase;
}

.in-project-heading {
  margin: 0;
  color: var(--in-project-dark-blue);
  font-size: 56px;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -2.5px;
}

.in-project-heading-break,
.in-project-description-break {
  display: block;
}

.in-project-description {
  max-width: 720px;
  margin: 14px 0 0;
  color: #7e8285;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.6;
}

.in-project-view-button {
  width: 258px;
  min-height: 54px;
  flex: 0 0 258px;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 25px;
  border: 1px solid var(--in-project-blue);
  color: var(--in-project-dark-blue);
  background: transparent;
  text-decoration: none;
  transition:
    color 0.3s ease,
    background-color 0.3s ease;
}

.in-project-view-button-text {
  font-size: 14px;
  font-weight: 800;
  line-height: 1;
}

.in-project-view-button-icon {
  width: 32px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.in-project-view-button:hover {
  color: #ffffff;
  background: var(--in-project-blue);
}

.in-project-view-button:hover .in-project-view-button-icon {
  transform: translateX(4px);
}

/* =====================================================
   PROJECT LAYOUT
===================================================== */

.in-project-showcase {
  display: grid;
  grid-template-columns: minmax(0, 1.72fr) minmax(430px, 1fr);
  gap: 32px;
  width: 100%;
  min-height: 535px;
}

.in-project-card {
  min-width: 0;
  will-change: opacity, transform, filter;
  backface-visibility: hidden;
  transition:
    opacity 0.65s ease,
    transform 0.65s cubic-bezier(0.22, 1, 0.36, 1),
    filter 0.65s ease;
}

/* .in-project-card {
  opacity: 0;
  transform: translateY(16px) scale(0.975);
  filter: blur(2px);
}

.in-project-card {
  animation: in-project-card-enter 0.7s
    cubic-bezier(0.22, 1, 0.36, 1) both;
} */


/* =====================================================
   PHYSICAL CARD POSITION ROTATION
===================================================== */

.in-project-card {
  opacity: 1;
  visibility: visible;
  filter: none;
  transform: none;
}

/*
 * Temporary visual copies created during rotation.
 * They move above the original cards.
 */
.in-project-moving-card {
  position: fixed;
  z-index: 9999;
  overflow: hidden;
  margin: 0;
  pointer-events: none;
  will-change: transform, opacity;
  transform-origin: top left;
  contain: layout paint;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  transform-style: preserve-3d;
}

/* Image-only copies used by the cyclical project movement. */
.in-project-moving-image {
  position: absolute;
  z-index: 9999;
  overflow: hidden;
  border-radius: 18px;
  pointer-events: none;
  will-change: top, left, width, height;
  contain: strict;
  box-shadow: 0 12px 32px rgba(9, 35, 76, 0.14);
}

.in-project-moving-image-element {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/*
 * Original cards remain hidden only while their
 * moving copies are covering them.
 */
.in-project-card.in-project-rotation-hidden {
  visibility: hidden;
}

/*
 * Disable image hover scaling while cards rotate.
 */
.in-project-showcase.in-project-is-rotating
  .in-project-large-image,
.in-project-showcase.in-project-is-rotating
  .in-project-small-image {
  transform: none;
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  .in-project-moving-card {
    display: none;
  }

  .in-project-card.in-project-rotation-hidden {
    visibility: visible;
  }
}




/* =====================================================
   LARGE PROJECT CARD
===================================================== */

.in-project-card-large {
  position: relative;
  height: 535px;
  overflow: hidden;
  border-radius: 18px;
  background: #dfe3e8;
}

.in-project-large-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.8s ease;
}

.in-project-card-large:hover .in-project-large-image {
  transform: scale(1.025);
}

.in-project-large-overlay {
  position: absolute;
  bottom: 28px;
  left: 22px;
  width: min(405px, calc(100% - 44px));
  min-height: 215px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  padding: 31px 29px 28px;
  border-radius: 17px;
  color: #ffffff;
  background:
    linear-gradient(
      135deg,
      rgba(16, 52, 103, 0.98),
      rgba(7, 40, 87, 0.98)
    );
}

.in-project-large-details {
  min-width: 0;
}

.in-project-large-name {
  margin: 0;
  color: #ffffff;
  font-size: 29px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -0.7px;
  overflow-wrap: anywhere;
}

.in-project-large-category {
  margin: 12px 0 0;
  color: rgba(255, 255, 255, 0.94);
  font-size: 18px;
  font-weight: 400;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.in-project-large-divider {
  display: block;
  width: 130px;
  height: 1px;
  margin: 23px 0;
  background: rgba(255, 255, 255, 0.62);
}

.in-project-location-row {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 12px;
}

.in-project-location-icon {
  width: 21px;
  height: 21px;
  flex: 0 0 21px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.in-project-large-location {
  min-width: 0;
  color: #ffffff;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

.in-project-arrow-button {
  width: 51px;
  height: 51px;
  flex: 0 0 51px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2px;
  border-radius: 50%;
  color: #ffffff;
  background: var(--in-project-red);
  text-decoration: none;
  transition:
    transform 0.3s ease,
    background-color 0.3s ease;
}

.in-project-arrow-icon {
  width: 27px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.in-project-arrow-button:hover {
  transform: translateX(4px);
  background: #a8191d;
}

/* =====================================================
   SMALL PROJECT CARDS
===================================================== */

.in-project-small-list {
  min-width: 0;
  display: grid;
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 31px;
}

.in-project-card-small {
  display: grid;
  grid-template-columns: minmax(235px, 0.98fr) minmax(230px, 0.82fr);
  align-items: center;
  gap: 31px;
  min-height: 252px;
}

.in-project-card-small:first-child {
  padding-bottom: 30px;
  border-bottom: 1px solid #d8d7d4;
}

.in-project-small-image-wrap {
  width: 100%;
  height: 232px;
  overflow: hidden;
  border-radius: 18px;
  background: #dfe3e8;
}

.in-project-small-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  transition: transform 0.8s ease;
}

.in-project-card-small:hover .in-project-small-image {
  transform: scale(1.035);
}

.in-project-small-details {
  min-width: 0;
}

.in-project-small-name {
  margin: 0;
  color: var(--in-project-dark-blue);
  font-size: 26px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.5px;
  overflow-wrap: anywhere;
}

.in-project-small-category {
  margin: 13px 0 20px;
  color: var(--in-project-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.45;
  overflow-wrap: anywhere;
}

.in-project-small-location {
  min-width: 0;
  color: var(--in-project-text);
  font-size: 17px;
  font-weight: 400;
  line-height: 1.4;
  overflow-wrap: anywhere;
}

/* =====================================================
   LARGE DESKTOP: 1600PX AND ABOVE
===================================================== */

@media only screen and (min-width: 1600px) {
  .in-project-container {
    max-width: 1510px;
  }
}

/* =====================================================
   LARGE LAPTOP: 1400PX–1599PX
===================================================== */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .in-project-section {
    padding: 56px 0 68px;
  }

  .in-project-container {
    width: calc(100% - 80px);
  }

  .in-project-heading {
    font-size: 51px;
  }

  .in-project-description {
    font-size: 17px;
  }

  .in-project-showcase {
    grid-template-columns: minmax(0, 1.65fr) minmax(420px, 1fr);
    min-height: 505px;
    gap: 28px;
  }

  .in-project-card-large {
    height: 505px;
  }

  .in-project-small-list {
    gap: 25px;
  }

  .in-project-card-small {
    grid-template-columns: minmax(210px, 1fr) minmax(205px, 0.82fr);
    gap: 26px;
    min-height: 240px;
  }

  .in-project-card-small:first-child {
    padding-bottom: 25px;
  }

  .in-project-small-image-wrap {
    height: 218px;
  }

  .in-project-small-name {
    font-size: 24px;
  }

  .in-project-small-category,
  .in-project-small-location {
    font-size: 16px;
  }
}

/* =====================================================
   STANDARD LAPTOP: 1200PX–1399PX
===================================================== */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .in-project-section {
    padding: 50px 0 62px;
  }

  .in-project-container {
    width: calc(100% - 60px);
  }

  .in-project-header {
    margin-bottom: 35px;
  }

  .in-project-heading-area {
    max-width: 660px;
  }

  .in-project-label {
    margin-bottom: 16px;
    font-size: 15px;
  }

  .in-project-heading {
    font-size: 45px;
  }

  .in-project-description {
    font-size: 16px;
  }

  .in-project-view-button {
    width: 230px;
    min-height: 51px;
    flex-basis: 230px;
    padding: 11px 20px;
  }

  .in-project-view-button-text {
    font-size: 13px;
  }

  .in-project-showcase {
    grid-template-columns: minmax(0, 1.55fr) minmax(385px, 1fr);
    min-height: 465px;
    gap: 25px;
  }

  .in-project-card-large {
    height: 465px;
  }

  .in-project-large-overlay {
    bottom: 23px;
    left: 20px;
    min-height: 195px;
    padding: 26px 25px;
  }

  .in-project-large-name {
    font-size: 25px;
  }

  .in-project-large-category,
  .in-project-large-location {
    font-size: 16px;
  }

  .in-project-large-divider {
    margin: 19px 0;
  }

  .in-project-small-list {
    gap: 22px;
  }

  .in-project-card-small {
    grid-template-columns: minmax(185px, 1fr) minmax(175px, 0.86fr);
    gap: 22px;
    min-height: 221px;
  }

  .in-project-card-small:first-child {
    padding-bottom: 22px;
  }

  .in-project-small-image-wrap {
    height: 200px;
  }

  .in-project-small-name {
    font-size: 21px;
  }

  .in-project-small-category {
    margin: 10px 0 17px;
    font-size: 14px;
  }

  .in-project-small-location {
    font-size: 14px;
  }
}

/* =====================================================
   SMALL LAPTOP: 992PX–1199PX
===================================================== */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .in-project-section {
    padding: 45px 0 55px;
  }

  .in-project-container {
    width: calc(100% - 48px);
  }

  .in-project-header {
    gap: 35px;
    margin-bottom: 32px;
  }

  .in-project-heading-area {
    max-width: 570px;
  }

  .in-project-label {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .in-project-heading {
    font-size: 39px;
  }

  .in-project-description {
    font-size: 14px;
  }

  .in-project-view-button {
    width: 205px;
    min-height: 49px;
    flex-basis: 205px;
    padding: 10px 17px;
  }

  .in-project-view-button-text {
    font-size: 12px;
  }

  .in-project-showcase {
    grid-template-columns: minmax(0, 1.4fr) minmax(335px, 1fr);
    min-height: 420px;
    gap: 21px;
  }

  .in-project-card-large {
    height: 420px;
    border-radius: 15px;
  }

  .in-project-large-overlay {
    bottom: 18px;
    left: 17px;
    width: min(340px, calc(100% - 34px));
    min-height: 175px;
    padding: 22px;
    border-radius: 14px;
  }

  .in-project-large-name {
    font-size: 22px;
  }

  .in-project-large-category,
  .in-project-large-location {
    font-size: 14px;
  }

  .in-project-large-divider {
    width: 105px;
    margin: 16px 0;
  }

  .in-project-arrow-button {
    width: 45px;
    height: 45px;
    flex-basis: 45px;
  }

  .in-project-small-list {
    gap: 18px;
  }

  .in-project-card-small {
    grid-template-columns: minmax(155px, 1fr) minmax(155px, 0.95fr);
    gap: 17px;
    min-height: 201px;
  }

  .in-project-card-small:first-child {
    padding-bottom: 18px;
  }

  .in-project-small-image-wrap {
    height: 182px;
    border-radius: 15px;
  }

  .in-project-small-name {
    font-size: 18px;
  }

  .in-project-small-category {
    margin: 9px 0 14px;
    font-size: 13px;
  }

  .in-project-small-location {
    font-size: 13px;
  }

  .in-project-location-row {
    gap: 8px;
  }

  .in-project-location-icon {
    width: 18px;
    height: 18px;
    flex-basis: 18px;
  }
}

/* =====================================================
   TABLET: 768PX–991PX
===================================================== */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .in-project-section {
    padding: 52px 0 62px;
  }

  .in-project-container {
    width: calc(100% - 50px);
  }

  .in-project-header {
    align-items: flex-end;
    gap: 30px;
    margin-bottom: 38px;
  }

  .in-project-heading-area {
    max-width: 550px;
  }

  .in-project-label {
    margin-bottom: 14px;
    font-size: 14px;
  }

  .in-project-heading {
    font-size: 40px;
  }

  .in-project-description {
    max-width: 560px;
    font-size: 15px;
  }

  .in-project-description-break {
    display: inline;
  }

  .in-project-view-button {
    width: 190px;
    min-height: 48px;
    flex-basis: 190px;
    padding: 10px 15px;
  }

  .in-project-view-button-text {
    font-size: 11px;
  }

  .in-project-view-button-icon {
    width: 27px;
  }

  .in-project-showcase {
    grid-template-columns: 1fr;
    gap: 25px;
    min-height: auto;
  }

  .in-project-card-large {
    height: 480px;
  }

  .in-project-small-list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 22px;
  }

  .in-project-card-small {
    display: block;
    min-height: 0;
  }

  .in-project-card-small:first-child {
    padding-bottom: 0;
    border-bottom: 0;
  }

  .in-project-small-image-wrap {
    height: 235px;
    margin-bottom: 21px;
  }

  .in-project-small-name {
    font-size: 22px;
  }

  .in-project-small-category {
    margin: 10px 0 16px;
    font-size: 15px;
  }

  .in-project-small-location {
    font-size: 15px;
  }
}

/* =====================================================
   MOBILE: UP TO 767PX
===================================================== */

@media only screen and (max-width: 767px) {
  .in-project-section {
    padding: 44px 0 52px;
  }

  .in-project-container {
    width: calc(100% - 36px);
  }

  .in-project-header {
    display: block;
    margin-bottom: 32px;
  }

  .in-project-heading-area {
    max-width: none;
  }

  .in-project-label {
    margin-bottom: 13px;
    font-size: 13px;
  }

  .in-project-heading {
    font-size: clamp(34px, 9vw, 43px);
    line-height: 1.12;
    letter-spacing: -1.5px;
  }

  .in-project-heading-break,
  .in-project-description-break {
    display: inline;
  }

  .in-project-description {
    margin-top: 16px;
    font-size: 15px;
  }

  .in-project-view-button {
    width: 220px;
    min-height: 50px;
    margin-top: 25px;
    padding: 10px 20px;
  }

  .in-project-showcase {
    display: grid;
    grid-template-columns: 1fr;
    gap: 20px;
    min-height: auto;
  }

  .in-project-card-large {
    height: 470px;
    border-radius: 16px;
  }

  .in-project-large-overlay {
    right: 16px;
    bottom: 16px;
    left: 16px;
    width: auto;
    min-height: 188px;
    padding: 25px 22px;
    border-radius: 15px;
  }

  .in-project-large-name {
    font-size: 24px;
  }

  .in-project-large-category,
  .in-project-large-location {
    font-size: 15px;
  }

  .in-project-large-divider {
    width: 110px;
    margin: 18px 0;
  }

  .in-project-arrow-button {
    width: 47px;
    height: 47px;
    flex-basis: 47px;
  }

  .in-project-small-list {
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: none;
    gap: 20px;
  }

  .in-project-card-small {
    display: block;
    min-height: 0;
    padding-bottom: 21px;
    border-bottom: 1px solid #d8d7d4;
  }

  .in-project-card-small:first-child {
    padding-bottom: 21px;
    border-bottom: 1px solid #d8d7d4;
  }

  .in-project-small-image-wrap {
    height: 270px;
    margin-bottom: 20px;
    border-radius: 16px;
  }

  .in-project-small-name {
    font-size: 23px;
  }

  .in-project-small-category {
    margin: 10px 0 15px;
    font-size: 15px;
  }

  .in-project-small-location {
    font-size: 15px;
  }
}

/* =====================================================
   SMALL MOBILE: UP TO 480PX
===================================================== */

@media only screen and (max-width: 480px) {
  .in-project-section {
    padding: 40px 0 47px;
  }

  .in-project-container {
    width: calc(100% - 30px);
  }

  .in-project-heading {
    font-size: 34px;
  }

  .in-project-description {
    font-size: 14px;
  }

  .in-project-card-large {
    height: 420px;
  }

  .in-project-large-overlay {
    min-height: 180px;
    padding: 22px 19px;
  }

  .in-project-large-name {
    font-size: 22px;
  }

  .in-project-large-category,
  .in-project-large-location {
    font-size: 14px;
  }

  .in-project-arrow-button {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }

  .in-project-small-image-wrap {
    height: 235px;
  }

  .in-project-small-name {
    font-size: 21px;
  }

  .in-project-small-category,
  .in-project-small-location {
    font-size: 14px;
  }
}

/* =====================================================
   EXTRA SMALL MOBILE: UP TO 360PX
===================================================== */

@media only screen and (max-width: 360px) {
  .in-project-container {
    width: calc(100% - 24px);
  }

  .in-project-heading {
    font-size: 31px;
  }

  .in-project-card-large {
    height: 390px;
  }

  .in-project-large-overlay {
    right: 12px;
    bottom: 12px;
    left: 12px;
    min-height: 174px;
    padding: 20px 17px;
  }

  .in-project-large-name {
    font-size: 20px;
  }

  .in-project-large-category,
  .in-project-large-location {
    font-size: 13px;
  }

  .in-project-small-image-wrap {
    height: 215px;
  }
}

/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {
  .in-project-card,
  .in-project-large-image,
  .in-project-small-image,
  .in-project-view-button,
  .in-project-view-button-icon,
  .in-project-arrow-button {
    animation: none;
    transition: none;
  }

  .in-project-card.in-project-changing,
  .in-project-card.in-project-entering {
    opacity: 1;
    filter: none;
    transform: none;
  }
}

















.inner-service-section {
  --inner-service-blue: #2b4573;
  --inner-service-dark: #0c2a5b;
  --inner-service-red: #d20f18;
  --inner-service-text: #17243a;
  --inner-service-border: #d8dde5;
  --inner-service-background: #faf9f7;

  width: 100%;
  overflow: hidden;
  padding: 28px 0 34px;
  color: var(--inner-service-text);
  background: var(--inner-service-background);
  font-family: "Inter", sans-serif;
}

.inner-service-section *,
.inner-service-section *::before,
.inner-service-section *::after {
  box-sizing: border-box;
}

.inner-service-container {
  width: min(1500px, calc(100% - 80px));
  margin: 0 auto;
}

/* Tabs */

.inner-service-tabs-wrap {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-bottom: 26px;
  border-bottom: 1px solid #d9dde4;
}

.inner-service-tab {
  position: relative;
  z-index: 2;
  min-height: 55px;
  padding: 10px 16px;
  border: 0;
  color: #687181;
  background: transparent;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.3s ease;
}

.inner-service-tab:hover,
.inner-service-tab-active {
  color: var(--inner-service-blue);
}

.inner-service-tab-indicator {
  position: absolute;
  bottom: -1px;
  left: 0;
  z-index: 3;
  width: 25%;
  height: 3px;
  background: var(--inner-service-red);
  transform: translateX(0);
  transition:
    width 0.4s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.inner-service-tab:focus-visible,
.inner-service-primary-button:focus-visible,
.inner-service-contact-button:focus-visible,
.inner-service-contact-item:focus-visible {
  outline: 3px solid rgba(43, 69, 115, 0.35);
  outline-offset: 4px;
}

/* Hero */

.inner-service-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(500px, 0.85fr);
  align-items: center;
  gap: 48px;
}

.inner-service-hero-image-wrap {
  height: 477px;
  overflow: hidden;
  border-radius: 18px;
  background: #e3e7ec;
  clip-path: inset(0 100% 0 0 round 18px);
}

.inner-service-hero-image-wrap.inner-service-image-revealed {
  animation: inner-service-image-reveal 1s
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes inner-service-image-reveal {
  to {
    clip-path: inset(0 0 0 0 round 18px);
  }
}

.inner-service-hero-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.inner-service-hero-content {
  position: relative;
  display: grid;
  grid-template-columns: 3px minmax(0, 1fr);
  gap: 33px;
  opacity: 0;
  transform: translateY(30px);
}

.inner-service-hero-content.inner-service-content-revealed {
  animation: inner-service-fade-up 0.85s
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes inner-service-fade-up {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.inner-service-hero-accent {
  width: 3px;
  height: 280px;
  margin-top: 2px;
  background: var(--inner-service-red);
}

.inner-service-category {
  margin: 3px 0 22px;
  color: var(--inner-service-red);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
}

.inner-service-title {
  max-width: 620px;
  min-height: 122px;
  margin: 0;
  color: var(--inner-service-dark);
  font-size: 51px;
  font-weight: 800;
  line-height: 1.13;
  letter-spacing: -1.8px;
}

.inner-service-description {
  max-width: 610px;
  min-height: 82px;
  margin: 20px 0 27px;
  font-size: 19px;
  line-height: 1.6;
}

.inner-service-primary-button,
.inner-service-contact-button {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 27px;
  min-height: 56px;
  padding: 13px 20px 13px 25px;
  border-radius: 7px;
  color: #ffffff;
  background: var(--inner-service-red);
  font-size: 17px;
  font-weight: 500;
  text-decoration: none;
  transition: background-color 0.3s ease;
}

.inner-service-primary-button:hover,
.inner-service-contact-button:hover {
  background: #b70c14;
}

.inner-service-button-arrow {
  width: 28px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Expertise */

.inner-service-details-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.25fr) minmax(490px, 0.9fr);
  align-items: stretch;
  gap: 58px;
  margin-top: 53px;
}

.inner-service-expertise-title {
  margin: 0 0 12px;
  color: var(--inner-service-dark);
  font-size: 29px;
  font-weight: 800;
  line-height: 1.2;
}

.inner-service-expertise-description {
  max-width: 740px;
  margin: 0 0 8px;
  color: #1d3153;
  font-size: 14px;
  line-height: 1.55;
}

.inner-service-capabilities {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 23px;
}

.inner-service-capability {
  min-height: 76px;
  display: grid;
  grid-template-columns: 55px minmax(0, 1fr);
  align-items: start;
  gap: 17px;
  padding: 0 23px 20px 0;
  opacity: 1;
  transform: translateY(0);
}

.inner-service-capability:nth-child(odd) {
  border-right: 1px solid #cbd2dc;
}

.inner-service-capability:nth-child(even) {
  padding-left: 28px;
}

.inner-service-capability:nth-child(n + 3) {
  padding-top: 20px;
  border-top: 1px solid #cbd2dc;
}

.inner-service-capability-icon {
  width: 55px;
  height: 55px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--inner-service-red);
  border-radius: 7px;
  color: var(--inner-service-red);
}

.inner-service-capability-icon svg {
  width: 37px;
  height: 37px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.6;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.inner-service-capability-title {
  margin: 0 0 5px;
  color: var(--inner-service-dark);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.25;
}

.inner-service-capability-description {
  margin: 0;
  color: #243656;
  font-size: 12px;
  line-height: 1.45;
}

/* Switching animation */

.inner-service-switch-content {
  transition:
    opacity 0.2s ease,
    transform 0.2s ease;
}

.inner-service-switch-out {
  opacity: 0.35;
  transform: translateY(4px);
}

.inner-service-capability.inner-service-capability-enter {
  opacity: 0;
  transform: translateY(10px);
}

.inner-service-capability.inner-service-capability-visible {
  opacity: 1;
  transform: translateY(0);
  transition:
    opacity 0.3s ease,
    transform 0.3s ease;
}

/* Contact */

.inner-service-contact-card {
  position: relative;
  min-height: 325px;
  overflow: hidden;
  border: 1.5px solid var(--inner-service-blue);
  border-radius: 16px;
  background:
    linear-gradient(
      90deg,
      rgba(255, 255, 255, 0.98) 0%,
      rgba(255, 255, 255, 0.91) 57%,
      rgba(255, 255, 255, 0.28) 100%
    ),
    url("images/contact-blueprint.png") right bottom / 54% auto no-repeat;
  transition:
    transform 0.3s ease,
    box-shadow 0.3s ease;
}

.inner-service-contact-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 10px 25px rgba(43, 69, 115, 0.08);
}

.inner-service-contact-content {
  position: relative;
  z-index: 2;
  width: 67%;
  padding: 30px 0 27px 34px;
}

.inner-service-contact-title {
  margin: 0 0 10px;
  color: var(--inner-service-dark);
  font-size: 23px;
  font-weight: 800;
}

.inner-service-contact-description {
  margin: 0 0 19px;
  color: #273b5e;
  font-size: 13px;
  line-height: 1.55;
}

.inner-service-contact-item {
  width: fit-content;
  display: flex;
  align-items: center;
  gap: 15px;
  margin-top: 11px;
  color: var(--inner-service-dark);
  font-size: 14px;
  font-weight: 700;
  text-decoration: none;
}

.inner-service-contact-icon {
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1.5px solid var(--inner-service-blue);
  border-radius: 50%;
}

.inner-service-contact-icon svg {
  width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.inner-service-contact-button {
  min-height: 45px;
  margin-top: 18px;
  padding: 10px 17px 10px 20px;
  font-size: 14px;
}

/* Process */

.inner-service-process {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin-top: 27px;
}

.inner-service-process-line {
  position: absolute;
  top: 16px;
  left: 12.5%;
  right: 12.5%;
  height: 1px;
  overflow: hidden;
  background: #ecd1d2;
}

.inner-service-process-line-fill {
  display: block;
  width: 100%;
  height: 100%;
  background: var(--inner-service-red);
  transform: scaleX(0);
  transform-origin: left center;
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-line-fill {
  animation: inner-service-line-horizontal 1.3s ease forwards;
}

@keyframes inner-service-line-horizontal {
  to {
    transform: scaleX(1);
  }
}

.inner-service-process-step {
  position: relative;
  z-index: 2;
  padding: 0 22px;
  text-align: center;
  opacity: 0;
  transform: translateY(12px);
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-step {
  animation: inner-service-process-reveal 0.45s ease forwards;
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-step:nth-of-type(1) {
  animation-delay: 0.2s;
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-step:nth-of-type(2) {
  animation-delay: 0.45s;
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-step:nth-of-type(3) {
  animation-delay: 0.7s;
}

.inner-service-process.inner-service-process-visible
  .inner-service-process-step:nth-of-type(4) {
  animation-delay: 0.95s;
}

@keyframes inner-service-process-reveal {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.inner-service-process-number {
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 8px;
  border: 1px solid var(--inner-service-red);
  border-radius: 50%;
  color: var(--inner-service-dark);
  background: var(--inner-service-background);
  font-size: 13px;
  font-weight: 600;
}

.inner-service-process-title {
  margin: 0 0 8px;
  color: var(--inner-service-dark);
  font-size: 14px;
  font-weight: 700;
}

.inner-service-process-description {
  max-width: 190px;
  margin: 0 auto;
  color: #243656;
  font-size: 11px;
  line-height: 1.45;
}

/* Large laptop */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .inner-service-container {
    width: calc(100% - 70px);
  }

  .inner-service-hero-image-wrap {
    height: 450px;
  }

  .inner-service-title {
    font-size: 46px;
  }

  .inner-service-details-layout {
    grid-template-columns: minmax(0, 1.2fr) minmax(460px, 0.9fr);
    gap: 45px;
  }
}

/* Standard laptop */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .inner-service-container {
    width: calc(100% - 60px);
  }

  .inner-service-hero {
    grid-template-columns: minmax(0, 1.1fr) minmax(440px, 0.9fr);
    gap: 38px;
  }

  .inner-service-hero-image-wrap {
    height: 410px;
  }

  .inner-service-hero-content {
    gap: 26px;
  }

  .inner-service-hero-accent {
    height: 255px;
  }

  .inner-service-category {
    font-size: 15px;
  }

  .inner-service-title {
    min-height: 105px;
    font-size: 41px;
  }

  .inner-service-description {
    font-size: 16px;
  }

  .inner-service-details-layout {
    grid-template-columns: minmax(0, 1.15fr) minmax(430px, 0.9fr);
    gap: 35px;
  }
}

/* Small laptop */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .inner-service-container {
    width: calc(100% - 48px);
  }

  .inner-service-tab {
    padding-inline: 8px;
    font-size: 12px;
  }

  .inner-service-hero {
    grid-template-columns: minmax(0, 1fr) minmax(390px, 0.9fr);
    gap: 30px;
  }

  .inner-service-hero-image-wrap {
    height: 370px;
  }

  .inner-service-hero-content {
    gap: 22px;
  }

  .inner-service-hero-accent {
    height: 235px;
  }

  .inner-service-title {
    min-height: 94px;
    font-size: 35px;
  }

  .inner-service-category {
    margin-bottom: 16px;
    font-size: 13px;
  }

  .inner-service-description {
    min-height: 68px;
    margin: 15px 0 22px;
    font-size: 14px;
  }

  .inner-service-details-layout {
    grid-template-columns: 1fr 390px;
    gap: 28px;
  }

  .inner-service-expertise-title {
    font-size: 25px;
  }

  .inner-service-capability {
    grid-template-columns: 47px minmax(0, 1fr);
    gap: 12px;
  }

  .inner-service-capability-icon {
    width: 47px;
    height: 47px;
  }

  .inner-service-capability-title {
    font-size: 13px;
  }

  .inner-service-capability-description {
    font-size: 11px;
  }

  .inner-service-contact-content {
    width: 77%;
    padding-left: 27px;
  }
}

/* Tablet */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .inner-service-container {
    width: calc(100% - 48px);
  }

  .inner-service-tabs-wrap {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .inner-service-tabs-wrap::-webkit-scrollbar {
    display: none;
  }

  .inner-service-tab {
    min-width: 230px;
    flex: 0 0 230px;
    scroll-snap-align: start;
  }

  .inner-service-tab-indicator {
    width: 230px;
  }

  .inner-service-hero {
    grid-template-columns: minmax(0, 1fr) minmax(330px, 0.95fr);
    gap: 24px;
  }

  .inner-service-hero-image-wrap {
    height: 350px;
  }

  .inner-service-hero-content {
    gap: 18px;
  }

  .inner-service-hero-accent {
    height: 240px;
  }

  .inner-service-title {
    min-height: 86px;
    font-size: 31px;
  }

  .inner-service-category {
    margin-bottom: 14px;
    font-size: 12px;
  }

  .inner-service-description {
    min-height: 80px;
    margin: 14px 0 21px;
    font-size: 13px;
  }

  .inner-service-primary-button {
    min-height: 49px;
    padding: 11px 17px;
    font-size: 14px;
  }

  .inner-service-details-layout {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .inner-service-contact-card {
    min-height: 300px;
  }

  .inner-service-contact-content {
    width: 57%;
  }
}

/* Mobile */

@media only screen and (max-width: 767px) {
  .inner-service-section {
    padding: 20px 0 42px;
  }

  .inner-service-container {
    width: calc(100% - 36px);
  }

  .inner-service-tabs-wrap {
    display: flex;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
  }

  .inner-service-tabs-wrap::-webkit-scrollbar {
    display: none;
  }

  .inner-service-tab {
    min-width: 215px;
    flex: 0 0 215px;
    padding: 10px 15px;
    scroll-snap-align: start;
    font-size: 12px;
  }

  .inner-service-tab-indicator {
    width: 215px;
  }

  .inner-service-hero {
    grid-template-columns: 1fr;
    gap: 30px;
  }

  .inner-service-hero-image-wrap {
    width: 100%;
    height: 340px;
    border-radius: 15px;
  }

  .inner-service-hero-content {
    grid-template-columns: 3px minmax(0, 1fr);
    gap: 20px;
  }

  .inner-service-hero-accent {
    height: 100%;
    min-height: 270px;
  }

  .inner-service-title {
    min-height: 0;
    font-size: clamp(33px, 9vw, 43px);
  }

  .inner-service-category {
    margin-bottom: 14px;
    font-size: 13px;
  }

  .inner-service-description {
    min-height: 0;
    margin: 17px 0 23px;
    font-size: 15px;
  }

  .inner-service-primary-button {
    font-size: 15px;
  }

  .inner-service-details-layout {
    grid-template-columns: 1fr;
    gap: 28px;
    margin-top: 44px;
  }

  .inner-service-expertise-title {
    font-size: 27px;
  }

  .inner-service-capabilities {
    grid-template-columns: 1fr;
  }

  .inner-service-capability,
  .inner-service-capability:nth-child(even),
  .inner-service-capability:nth-child(n + 3) {
    padding: 18px 0;
    border-top: 1px solid #cbd2dc;
    border-right: 0;
  }

  .inner-service-capability:first-child {
    border-top: 0;
  }

  .inner-service-contact-card {
    min-height: 355px;
    background:
      linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.98),
        rgba(255, 255, 255, 0.83)
      ),
      url("images/contact-blueprint.png") right bottom / auto 75% no-repeat;
  }

  .inner-service-contact-content {
    width: 88%;
    padding: 29px 24px;
  }

  .inner-service-process {
    grid-template-columns: 1fr;
    gap: 30px;
    margin-top: 42px;
    padding-left: 58px;
  }

  .inner-service-process-line {
    top: 16px;
    bottom: 16px;
    left: 16px;
    right: auto;
    width: 1px;
    height: auto;
  }

  .inner-service-process-line-fill {
    width: 100%;
    height: 100%;
    transform: scaleY(0);
    transform-origin: top center;
  }

  .inner-service-process.inner-service-process-visible
    .inner-service-process-line-fill {
    animation: inner-service-line-vertical 1.3s ease forwards;
  }

  @keyframes inner-service-line-vertical {
    to {
      transform: scaleY(1);
    }
  }

  .inner-service-process-step {
    min-height: 83px;
    padding: 0;
    text-align: left;
  }

  .inner-service-process-number {
    position: absolute;
    top: 0;
    left: -58px;
    margin: 0;
  }

  .inner-service-process-description {
    max-width: 300px;
    margin: 0;
  }
}

/* Small mobile */

@media only screen and (max-width: 480px) {
  .inner-service-container {
    width: calc(100% - 30px);
  }

  .inner-service-hero-image-wrap {
    height: 290px;
  }

  .inner-service-hero-content {
    gap: 16px;
  }

  .inner-service-title {
    font-size: 31px;
  }

  .inner-service-expertise-title {
    font-size: 25px;
  }

  .inner-service-contact-card {
    min-height: 375px;
  }

  .inner-service-contact-content {
    width: 100%;
    padding: 27px 20px;
  }

  .inner-service-contact-item {
    font-size: 12px;
  }
}

/* Touch devices */

@media (hover: none), (pointer: coarse) {
  .inner-service-contact-card:hover {
    transform: none;
    box-shadow: none;
  }
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  .inner-service-hero-image-wrap {
    clip-path: none;
  }

  .inner-service-hero-content,
  .inner-service-capability,
  .inner-service-process-step {
    opacity: 1;
    transform: none;
  }

  .inner-service-hero-image-wrap,
  .inner-service-hero-content,
  .inner-service-capability,
  .inner-service-process-step,
  .inner-service-process-line-fill,
  .inner-service-tab-indicator,
  .inner-service-contact-card {
    animation: none;
    transition: none;
  }

  .inner-service-process-line-fill {
    transform: none;
  }
}















.index-trusted-section {
  --index-trusted-blue: #2b4573;
  --index-trusted-dark-blue: #0a376d;
  --index-trusted-red: #c4272c;
  --index-trusted-text: #687181;
  --index-trusted-border: #d9dde4;
  --index-trusted-background: #fbfbfb;

  position: relative;
  width: 100%;
  min-height: 700px;
  overflow: hidden;
  padding: 120px 0;
  background: var(--index-trusted-background);
  font-family: "Inter", sans-serif;
}

.index-trusted-section *,
.index-trusted-section *::before,
.index-trusted-section *::after {
  box-sizing: border-box;
}

/* Background pattern */

.index-trusted-pattern {
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: 0.55;
  background-image:
    linear-gradient(
      30deg,
      transparent 48.5%,
      rgba(43, 69, 115, 0.07) 49%,
      rgba(43, 69, 115, 0.07) 51%,
      transparent 51.5%
    ),
    linear-gradient(
      150deg,
      transparent 48.5%,
      rgba(43, 69, 115, 0.07) 49%,
      rgba(43, 69, 115, 0.07) 51%,
      transparent 51.5%
    ),
    linear-gradient(
      90deg,
      transparent 48.5%,
      rgba(43, 69, 115, 0.045) 49%,
      rgba(43, 69, 115, 0.045) 51%,
      transparent 51.5%
    );
  background-size: 180px 310px;
  background-position:
    calc(100% + 60px) -110px,
    calc(100% + 60px) -110px,
    calc(100% + 60px) -110px;
  mask-image:
    radial-gradient(
      circle at 95% 4%,
      #000 0,
      transparent 32%
    ),
    radial-gradient(
      circle at 4% 95%,
      #000 0,
      transparent 30%
    );
  -webkit-mask-image:
    radial-gradient(
      circle at 95% 4%,
      #000 0,
      transparent 32%
    ),
    radial-gradient(
      circle at 4% 95%,
      #000 0,
      transparent 30%
    );
  animation: index-trusted-pattern-float 24s ease-in-out infinite alternate;
}

@keyframes index-trusted-pattern-float {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    transform: translate3d(-18px, 12px, 0);
  }
}

/* Main layout */

.index-trusted-container {
  position: relative;
  z-index: 2;
  width: min(1580px, calc(100% - 100px));
  margin: 0 auto;
  display: grid;
  grid-template-columns: 480px minmax(0, 1fr);
  align-items: center;
  gap: 65px;
}

/* Left content */

.index-trusted-content {
  min-width: 0;
}

.index-trusted-label {
  margin: 0 0 28px;
  color: var(--index-trusted-red);
  font-size: 17px;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 3.2px;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(20px);
}

.index-trusted-heading {
  margin: 0;
  color: var(--index-trusted-dark-blue);
  font-size: 47px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: -1.9px;
  opacity: 0;
  transform: translateY(25px);
}

.index-trusted-heading-break {
  display: block;
}

.index-trusted-delayed-content {
  opacity: 0;
  transform: translateY(20px);
}

.index-trusted-description {
  max-width: 440px;
  margin: 23px 0 27px;
  color: var(--index-trusted-text);
  font-size: 20px;
  font-weight: 400;
  line-height: 1.65;
}

.index-trusted-project-link {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 8px;
  border-bottom: none;
  color: var(--index-trusted-dark-blue);
  font-size: 16px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none;
}

.index-trusted-project-arrow {
  width: 24px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.7;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 0.3s ease;
}

.index-trusted-project-link:hover
  .index-trusted-project-arrow {
  transform: translateX(5px);
}

/* Statistic */

.index-trusted-statistic {
  position: relative;
  margin-top: 38px;
  padding-top: 25px;
  opacity: 0;
  transform: translateY(20px);
}

.index-trusted-statistic::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 275px;
  height: 1px;
  background: #dadddf;
}

.index-trusted-number-row {
  display: flex;
  align-items: flex-start;
  line-height: 1;
}

.index-trusted-number,
.index-trusted-plus {
  color: var(--index-trusted-red);
  font-size: 58px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -2px;
}

.index-trusted-plus {
  margin-left: 2px;
}

.index-trusted-statistic-label {
  margin: 12px 0 0;
  color: var(--index-trusted-dark-blue);
  font-size: 18px;
  font-weight: 600;
  line-height: 1.3;
}

/* Logo grid */

.index-trusted-logo-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 15px;
}

.index-trusted-logo-card {
  min-width: 0;
  height: 135px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 25px 22px;
  overflow: hidden;
  border: 1px solid var(--index-trusted-border);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.9);
  opacity: 0;
  transform: translateY(20px);
  transition:
    transform 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease,
    opacity 0.5s ease;
}

.index-trusted-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: 88px;
  object-fit: contain;
  transition: transform 0.3s ease;
}

.index-trusted-logo-card:hover {
  z-index: 2;
  border-color: rgba(43, 69, 115, 0.55);
  box-shadow: 0 10px 25px rgba(43, 69, 115, 0.09);
  transform: translateY(-4px);
}

.index-trusted-logo-card:hover .index-trusted-logo {
  transform: scale(1.04);
}

/* Entrance animation states */

.index-trusted-section.index-trusted-visible
  .index-trusted-label,
.index-trusted-section.index-trusted-visible
  .index-trusted-heading {
  animation: index-trusted-fade-up 0.7s
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.index-trusted-section.index-trusted-visible
  .index-trusted-heading {
  animation-delay: 60ms;
}

.index-trusted-section.index-trusted-visible
  .index-trusted-delayed-content {
  animation: index-trusted-fade-up 0.7s
    cubic-bezier(0.22, 1, 0.36, 1) 150ms forwards;
}

.index-trusted-section.index-trusted-visible
  .index-trusted-statistic {
  animation: index-trusted-fade-up 0.7s
    cubic-bezier(0.22, 1, 0.36, 1) 280ms forwards;
}

.index-trusted-section.index-trusted-visible
  .index-trusted-logo-card {
  animation: index-trusted-logo-reveal 0.55s
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

@keyframes index-trusted-fade-up {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes index-trusted-logo-reveal {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* Large desktop */

@media only screen and (min-width: 1600px) {
  .index-trusted-section {
    min-height: 720px;
  }
}

/* Large laptop */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .index-trusted-section {
    padding: 100px 0;
  }

  .index-trusted-container {
    width: calc(100% - 80px);
    grid-template-columns: 440px minmax(0, 1fr);
    gap: 52px;
  }

  .index-trusted-heading {
    font-size: 43px;
  }

  .index-trusted-description {
    font-size: 18px;
  }

  .index-trusted-logo-card {
    height: 145px;
    padding: 22px 18px;
  }

  .index-trusted-logo {
    max-height: 78px;
  }
}

/* Standard laptop */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .index-trusted-section {
    min-height: 620px;
    padding: 85px 0;
  }

  .index-trusted-container {
    width: calc(100% - 60px);
    grid-template-columns: 375px minmax(0, 1fr);
    gap: 40px;
  }

  .index-trusted-label {
    margin-bottom: 21px;
    font-size: 14px;
  }

  .index-trusted-heading {
    font-size: 37px;
  }

  .index-trusted-description {
    margin-top: 18px;
    font-size: 16px;
  }

  .index-trusted-statistic {
    margin-top: 30px;
    padding-top: 21px;
  }

  .index-trusted-number,
  .index-trusted-plus {
    font-size: 50px;
  }

  .index-trusted-statistic-label {
    font-size: 16px;
  }

  .index-trusted-logo-grid {
    gap: 12px;
  }

  .index-trusted-logo-card {
    height: 125px;
    padding: 20px 16px;
    border-radius: 10px;
  }

  .index-trusted-logo {
    max-height: 68px;
  }
}

/* Small laptop */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .index-trusted-section {
    min-height: 560px;
    padding: 70px 0;
  }

  .index-trusted-container {
    width: calc(100% - 48px);
    grid-template-columns: 315px minmax(0, 1fr);
    gap: 30px;
  }

  .index-trusted-label {
    margin-bottom: 18px;
    font-size: 12px;
    letter-spacing: 2.3px;
  }

  .index-trusted-heading {
    font-size: 31px;
    letter-spacing: -1px;
  }

  .index-trusted-description {
    margin: 16px 0 20px;
    font-size: 14px;
  }

  .index-trusted-project-link {
    font-size: 14px;
  }

  .index-trusted-statistic {
    margin-top: 25px;
    padding-top: 18px;
  }

  .index-trusted-statistic::before {
    width: 220px;
  }

  .index-trusted-number,
  .index-trusted-plus {
    font-size: 44px;
  }

  .index-trusted-statistic-label {
    font-size: 14px;
  }

  .index-trusted-logo-grid {
    gap: 10px;
  }

  .index-trusted-logo-card {
    height: 105px;
    padding: 17px 13px;
  }

  .index-trusted-logo {
    max-height: 58px;
  }
}

/* Tablet */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .index-trusted-section {
    min-height: auto;
    padding: 70px 0;
  }

  .index-trusted-container {
    width: calc(100% - 50px);
    grid-template-columns: 1fr;
    gap: 45px;
  }

  .index-trusted-content {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 210px;
    column-gap: 35px;
  }

  .index-trusted-label,
  .index-trusted-heading,
  .index-trusted-delayed-content {
    grid-column: 1;
  }

  .index-trusted-statistic {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    margin-top: 0;
    padding: 23px;
    border-left: 1px solid #dadddf;
  }

  .index-trusted-statistic::before {
    display: none;
  }

  .index-trusted-heading {
    font-size: 40px;
  }

  .index-trusted-description {
    font-size: 16px;
  }

  .index-trusted-logo-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
  }

  .index-trusted-logo-card {
    height: 130px;
  }

  .index-trusted-logo {
    max-height: 70px;
  }
}

/* Mobile */

@media only screen and (max-width: 767px) {
  .index-trusted-section {
    min-height: auto;
    padding: 58px 0;
  }

  .index-trusted-container {
    width: calc(100% - 36px);
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .index-trusted-label {
    margin-bottom: 16px;
    font-size: 12px;
    letter-spacing: 2.5px;
  }

  .index-trusted-heading {
    font-size: clamp(32px, 9vw, 42px);
    line-height: 1.22;
    letter-spacing: -1.2px;
  }

  .index-trusted-description {
    margin: 18px 0 22px;
    font-size: 15px;
    line-height: 1.6;
  }

  .index-trusted-project-link {
    font-size: 14px;
  }

  .index-trusted-statistic {
    margin-top: 30px;
    padding-top: 22px;
  }

  .index-trusted-statistic::before {
    width: 230px;
  }

  .index-trusted-number,
  .index-trusted-plus {
    font-size: 49px;
  }

  .index-trusted-statistic-label {
    margin-top: 8px;
    font-size: 15px;
  }

  .index-trusted-logo-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .index-trusted-logo-card {
    height: 120px;
    padding: 20px 15px;
    border-radius: 10px;
  }

  .index-trusted-logo {
    max-height: 65px;
  }
}

/* Small mobile */

@media only screen and (max-width: 420px) {
  .index-trusted-container {
    width: calc(100% - 30px);
  }

  .index-trusted-heading {
    font-size: 31px;
  }

  .index-trusted-logo-card {
    height: 105px;
    padding: 17px 12px;
  }

  .index-trusted-logo {
    max-height: 56px;
  }
}

/* Touch devices */

@media (hover: none), (pointer: coarse) {
  .index-trusted-logo-card:hover {
    border-color: var(--index-trusted-border);
    box-shadow: none;
    transform: translateY(0);
  }

  .index-trusted-logo-card:hover
    .index-trusted-logo {
    transform: none;
  }
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  .index-trusted-pattern {
    animation: none;
  }

  .index-trusted-label,
  .index-trusted-heading,
  .index-trusted-delayed-content,
  .index-trusted-statistic,
  .index-trusted-logo-card {
    opacity: 1;
    transform: none;
    animation: none;
    transition: none;
  }

  .index-trusted-logo,
  .index-trusted-project-arrow {
    transition: none;
  }
}















   :root{
    --bg:#FFFFFF;
    --bg2:#F7F9FC;
    --primary:#2b4573;
    --accent:#c4272c;
    --ink:#172033;
    --dim:#2b4573;
    --glass:rgba(43,69,115,0.045);
    --border:rgba(43,69,115,0.16);
  }
  /* *{box-sizing:border-box;margin:0;padding:0;}
  body{
    font-family:'Inter',sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.65;
    overflow-x:hidden;
  } */
  .inner-service-mono{font-family:'JetBrains Mono',monospace;}
  a{text-decoration:none;color:inherit;}
  /* svg{display:block;} */

  /* ambient background grid + glow */
  .inner-service-ambient{
    position:fixed;inset:0;z-index:-1;
    background:
      radial-gradient(60% 45% at 25% -5%, rgba(43,69,115,0.16), transparent 60%),
      radial-gradient(50% 40% at 90% 10%, rgba(196,39,44,0.14), transparent 60%),
      var(--bg);
  }
  .inner-service-ambient::after{
    content:"";
    position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(43,69,115,0.055) 1px, transparent 1px),
      linear-gradient(90deg, rgba(43,69,115,0.055) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(70% 60% at 50% 0%, black, transparent 75%);
  }

  .inner-service-nav{
    display:flex;justify-content:space-between;align-items:center;
    padding:26px 6vw;
    max-width:1280px;margin:0 auto;
    font-size:13px;
  }
  .inner-service-nav .inner-service-crumb{color:var(--dim);}
  .inner-service-nav .inner-service-crumb b{color:var(--primary);font-weight:500;}
  .inner-service-status-pill{
    display:flex;align-items:center;gap:8px;
    font-family:'JetBrains Mono',monospace;
    font-size:11px;
    color:var(--dim);
    border:1px solid var(--border);
    padding:6px 12px;
    border-radius:999px;
    background:var(--glass);
  }
  .inner-service-status-pill .inner-service-dot{
    width:6px;height:6px;border-radius:50%;
    background:#c4272c;
    box-shadow:0 0 8px #c4272c;
    animation:pulse 2s infinite;
  }
  @keyframes pulse{0%,100%{opacity:1;}50%{opacity:0.4;}}

  /* HERO */
  .inner-service-hero1{
    max-width:1280px;margin:0 auto;
    padding:64px 6vw 90px;
    text-align:center;
    position:relative;
  }
  .inner-service-core{
    width:220px;height:220px;
    margin:0 auto 8px;
    position:relative;
    display:flex;align-items:center;justify-content:center;
  }
  .inner-service-ring{
    position:absolute;border-radius:50%;
    border:1px solid rgba(43,69,115,0.35);
  }
  .inner-service-ring1{width:220px;height:220px;animation:spin 22s linear infinite, ringBreathe 9s ease-in-out infinite;}
  .inner-service-ring2{width:170px;height:170px;border-color:rgba(196,39,44,0.35);animation:spin 16s linear infinite reverse, ringBreathe 9s ease-in-out 1.5s infinite;}
  .inner-service-ring3{width:120px;height:120px;border-color:rgba(43,69,115,0.5);animation:ringBreathe 9s ease-in-out 3s infinite;}
  @keyframes spin{to{transform:rotate(360deg);}}
  @keyframes ringBreathe{
    0%,100%{scale:1;}
    50%{scale:1.045;}
  }
  .inner-service-core-glow{
    width:64px;height:64px;border-radius:50%;
    background:radial-gradient(circle, rgba(43,69,115,0.9), rgba(196,39,44,0.5) 60%, transparent 75%);
    filter:blur(2px);
    box-shadow:0 0 60px 20px rgba(43,69,115,0.25);
  }
  .inner-service-eyebrow{
    font-family:'JetBrains Mono',monospace;
    font-size:12px;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--primary);
    margin:18px 0 20px;
  }
  h1{
    font-family:'Sora',sans-serif;
    font-weight:800;
    font-size:clamp(34px,5.6vw,68px);
    letter-spacing:-0.02em;
    max-width:900px;
    margin:0 auto 22px;
    background:linear-gradient(180deg, #172033 20%, #536078 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
  }
  h1 .inner-service-grad{
    background:linear-gradient(90deg, var(--primary), var(--accent));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .inner-service-hero1 p{
    max-width:560px;margin:0 auto 40px;
    color:#7e8285;
    font-size:16px;
  }
  .inner-service-hero1-ctas{display:flex;gap:16px;justify-content:center;flex-wrap:wrap;margin-bottom:56px;}
  .inner-service-btn-glow,
  .inner-service-btn-glow{
    background:linear-gradient(90deg, var(--primary), var(--accent));
    color:#FFFFFF;
    padding:15px 30px;
    border-radius:8px;
    font-weight:700;
    font-size:14.5px;
    box-shadow:0 10px 28px rgba(43,69,115,0.28);
  }
  .inner-service-btn-outline{
    border:1px solid var(--border);
    background:var(--glass);
    color:var(--ink);
    padding:14px 28px;
    border-radius:8px;
    font-weight:600;
    font-size:14.5px;
  }

  .inner-service-metric-row{
    display:flex;justify-content:center;gap:0;
    max-width:760px;margin:0 auto;
    border:1px solid var(--border);
    border-radius:12px;
    background:var(--glass);
    backdrop-filter:blur(10px);
    overflow:hidden;
  }
  .inner-service-metric{
    flex:1;padding:20px 16px;
    border-right:1px solid var(--border);
  }
  .inner-service-metric:last-child{border-right:none;}
  .inner-service-metric .inner-service-v{
    font-family:'Sora',sans-serif;
    font-weight:700;
    font-size:22px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }
  .inner-service-metric .inner-service-l{font-size:11px;color:var(--dim);margin-top:4px;letter-spacing:0.03em;}

  /* SECTION */
  .inner-service-section1{max-width:1280px;margin:0 auto;padding:100px 6vw;}
  .inner-service-section1-head{text-align:center;max-width:620px;margin:0 auto 56px;}
  .inner-service-section1-head .inner-service-eyebrow{
    margin-bottom:14px;
    opacity:0;
    transform:translateY(10px);
  }
  .inner-service-section1-head .inner-service-eyebrow.inner-service-visible{
    animation:fadeUp .6s ease forwards;
  }
  .inner-service-section1-head .inner-service-eyebrow-line{
    width:0;height:2px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    margin:8px auto 0;
    transition:width .8s ease .3s;
  }
  .inner-service-section1-head.inner-service-visible .inner-service-eyebrow-line{width:34px;}
  .inner-service-section1-head h2{
    font-family:'Sora',sans-serif;
    font-weight:700;
    font-size:clamp(24px,3vw,36px);
    margin-bottom:14px;
    opacity:0;
    transform:translateY(14px);
  }
  .inner-service-section1-head.inner-service-visible h2{
    animation:fadeUp .7s ease .1s forwards;
  }
  .inner-service-section1-head p{
    color:#7e8285;
    font-size:15px;
    opacity:0;
    transform:translateY(14px);
  }
  .inner-service-section1-head.inner-service-visible p{
    animation:fadeUp .7s ease .22s forwards;
  }
  @keyframes fadeUp{
    from{opacity:0;transform:translateY(14px);}
    to{opacity:1;transform:translateY(0);}
  }

  .inner-service-card-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:18px;
  }
  @media (max-width:900px){.inner-service-card-grid{grid-template-columns:1fr 1fr;}}
  @media (max-width:520px){.inner-service-card-grid{grid-template-columns:1fr;}}
  .inner-service-glass-card{
    padding:28px 22px;
    border-radius:14px;
    border:1px solid var(--border);
    background:linear-gradient(180deg, rgba(255,255,255,0.98), rgba(247,249,252,0.92));
    backdrop-filter:blur(8px);
    transition:border-color .3s, transform .3s, box-shadow .3s;
    position:relative;
    overflow:hidden;
    opacity:0;
    transform:translateY(28px) scale(0.96);
    will-change:transform;
    transform-style:preserve-3d;
  }
  .inner-service-glass-card.inner-service-visible{
    animation:cardIn .8s cubic-bezier(.2,.7,.3,1) forwards;
  }
  .inner-service-card-grid > .inner-service-glass-card:nth-child(1){transition-delay:0s;}
  .inner-service-card-grid > .inner-service-glass-card.inner-service-visible:nth-child(1){animation-delay:0s;}
  .inner-service-card-grid > .inner-service-glass-card.inner-service-visible:nth-child(2){animation-delay:0.12s;}
  .inner-service-card-grid > .inner-service-glass-card.inner-service-visible:nth-child(3){animation-delay:0.24s;}
  .inner-service-card-grid > .inner-service-glass-card.inner-service-visible:nth-child(4){animation-delay:0.36s;}
  @keyframes cardIn{
    from{opacity:0;transform:translateY(28px) scale(0.96);}
    to{opacity:1;transform:translateY(0) scale(1);}
  }
  .inner-service-glass-card::before{
    content:"";
    position:absolute;inset:0;
    border-radius:14px;
    padding:1.5px;
    background:linear-gradient(120deg, rgba(43,69,115,0.55), rgba(196,39,44,0.55), rgba(43,69,115,0.55));
    background-size:260% 260%;
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    opacity:0;
    transition:opacity .4s;
    animation:borderSweep 5s linear infinite;
    pointer-events:none;
  }
  .inner-service-glass-card.inner-service-visible::before{opacity:0.55;}
  @keyframes borderSweep{
    0%{background-position:0% 50%;}
    100%{background-position:200% 50%;}
  }
  .inner-service-glass-card:hover{
    border-color:rgba(43,69,115,0.6);
    box-shadow:0 18px 44px -14px rgba(43,69,115,0.24);
  }
  .inner-service-glass-card:hover::before{opacity:0.9;}
  .inner-service-glass-card .inner-service-icon-wrap{
    width:46px;height:46px;
    border-radius:10px;
    background:linear-gradient(135deg, rgba(43,69,115,0.18), rgba(196,39,44,0.18));
    border:1px solid var(--border);
    display:flex;align-items:center;justify-content:center;
    margin-bottom:18px;
    transition:transform .4s cubic-bezier(.2,.7,.3,1), box-shadow .4s;
    animation:iconFloat 3s ease-in-out infinite, iconGlow 3.2s ease-in-out infinite;
  }
  .inner-service-glass-card:nth-child(2) .inner-service-icon-wrap{animation-delay:.4s, .4s;}
  .inner-service-glass-card:nth-child(3) .inner-service-icon-wrap{animation-delay:.8s, .8s;}
  .inner-service-glass-card:nth-child(4) .inner-service-icon-wrap{animation-delay:1.2s, 1.2s;}
  @keyframes iconFloat{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-6px);}
  }
  @keyframes iconGlow{
    0%,100%{box-shadow:0 0 0 rgba(43,69,115,0);}
    50%{box-shadow:0 0 16px rgba(43,69,115,0.4);}
  }
  .inner-service-glass-card:hover .inner-service-icon-wrap{
    animation-play-state:paused;
    transform:rotate(-6deg) scale(1.1);
    box-shadow:0 0 24px rgba(43,69,115,0.55);
  }
  .inner-service-glass-card:hover .inner-service-icon-wrap svg{
    animation:iconWiggle .5s ease;
  }
  @keyframes iconWiggle{
    0%,100%{transform:rotate(0);}
    30%{transform:rotate(8deg);}
    60%{transform:rotate(-6deg);}
  }
  .inner-service-glass-card h3{font-family:'Sora',sans-serif;font-size:16px;font-weight:600;margin-bottom:10px;}
  .inner-service-glass-card p{font-size:13px;color:#7e8285;}

  .inner-service-particle{
    position:absolute;
    width:3px;height:3px;
    border-radius:50%;
    background:var(--primary);
    box-shadow:0 0 8px 2px rgba(43,69,115,0.7);
    opacity:0;
    animation:floatUp 7s ease-in infinite;
    pointer-events:none;
  }
  .inner-service-capabilities-section{position:relative;}
  .inner-service-particle-1{left:8%;bottom:10%;animation-delay:0s;}
  .inner-service-particle-2{left:22%;bottom:0%;animation-delay:1.5s;}
  .inner-service-particle-3{left:47%;bottom:6%;animation-delay:3s;}
  .inner-service-particle-4{left:68%;bottom:2%;animation-delay:2s;}
  .inner-service-particle-5{left:85%;bottom:12%;animation-delay:4.2s;}
  .inner-service-particle-6{left:93%;bottom:4%;animation-delay:0.8s;}
  @keyframes floatUp{
    0%{opacity:0;transform:translateY(0);}
    10%{opacity:0.8;}
    90%{opacity:0.4;}
    100%{opacity:0;transform:translateY(-260px);}
  }

  /* PROCESS */
  .inner-service-process-section{padding-top:0;}
  .inner-service-process-flow{
    display:flex;justify-content:center;align-items:flex-start;
    max-width:900px;margin:0 auto;
    position:relative;
  }
  .inner-service-flow-line{
    position:absolute;top:34px;left:15%;right:15%;
    height:2px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    opacity:0.3;
  }
  .inner-service-flow-pulse{
    position:absolute;top:31px;width:8px;height:8px;border-radius:50%;
    background:var(--primary);
    box-shadow:0 0 12px 3px rgba(43,69,115,0.7);
    animation:travel 4s linear infinite;
  }
  @keyframes travel{
    0%{left:15%;}
    100%{left:82%;}
  }
  .inner-service-p-step{flex:1;text-align:center;position:relative;z-index:1;padding:0 12px;}
  .inner-service-p-circle{
    width:68px;height:68px;border-radius:50%;
    margin:0 auto 18px;
    background:var(--bg2);
    border:1.5px solid rgba(43,69,115,0.5);
    display:flex;align-items:center;justify-content:center;
    box-shadow:0 0 24px rgba(43,69,115,0.15);
  }
  .inner-service-p-step h3{font-family:'Sora',sans-serif;font-weight:600;font-size:16px;margin-bottom:10px;}
  .inner-service-p-step p{font-size:13px;color:#7e8285;max-width:24ch;margin:0 auto;}
  @media (max-width:760px){
    .inner-service-process-flow{flex-direction:column;gap:36px;align-items:center;}
    .inner-service-flow-line,.inner-service-flow-pulse{display:none;}
  }

  /* CONTACT */
  .inner-service-contact{
    max-width:950px;
    margin:0 auto 100px;
    padding:52px 44px;
    border-radius:20px;
    border:1px solid var(--border);
    background:
      radial-gradient(80% 120% at 0% 0%, rgba(43,69,115,0.12), transparent 60%),
      radial-gradient(80% 120% at 100% 100%, rgba(196,39,44,0.12), transparent 60%),
      var(--bg2);
    display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:30px;
  }
  .inner-service-contact h2{font-family:'Sora',sans-serif;font-size:24px;margin-bottom:10px;}
  .inner-service-contact > div:first-child p{color:#7e8285;font-size:14px;max-width:38ch;margin-bottom:22px;}
  .inner-service-contact-info{display:flex;gap:30px;flex-wrap:wrap;}
  .inner-service-ci .inner-service-l{font-size:11px;color:var(--dim);margin-bottom:4px;}
  .inner-service-ci .inner-service-v{font-family:'JetBrains Mono',monospace;font-weight:500;font-size:14px;
    background:linear-gradient(90deg, var(--primary), var(--accent));
    -webkit-background-clip:text;background-clip:text;color:transparent;
  }

  @media (min-width:601px) and (max-width:900px){
    .inner-service-contact{
      width:auto;
      margin-left:32px;
      margin-right:32px;
    }
  }

  @media (max-width:600px){
    .inner-service-hero1{
      padding-left:20px;
      padding-right:20px;
    }
    .inner-service-metric-row{
      display:grid;
      grid-template-columns:repeat(2,minmax(0,1fr));
      width:100%;
    }
    .inner-service-metric{
      min-width:0;
      padding:18px 10px;
      border-bottom:1px solid var(--border);
    }
    .inner-service-metric:nth-child(2){border-right:none;}
    .inner-service-metric:nth-child(3),
    .inner-service-metric:nth-child(4){border-bottom:none;}
    .inner-service-metric .inner-service-v{
      font-size:clamp(17px,5.5vw,22px);
      overflow-wrap:anywhere;
    }
    .inner-service-contact{
      margin-left:20px;
      margin-right:20px;
      padding:36px 24px;
    }
    .inner-service-contact-info{
      width:100%;
      gap:18px;
    }
    .inner-service-ci{
      min-width:0;
    }
    .inner-service-ci .inner-service-v{
      overflow-wrap:anywhere;
    }
  }

/* Index about title: gradient from i-service-sample.php */
.index-about-gradient-title{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* Contact page content: reuse the i-service-sample blue-to-red gradient */
.mst-contact-info-section,
.mst-enquiry-section{
  --mst-contact-gradient:linear-gradient(90deg, #2b4573, #c4272c);
}

.mst-contact-subtitle,
.mst-contact-title,
.mst-contact-title span,
.mst-enquiry-subtitle p,
.mst-enquiry-heading h2 span{
  background:var(--mst-contact-gradient);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.mst-contact-subtitle-line,
.mst-contact-card::before,
.mst-contact-card-icon,
.mst-contact-card:hover .mst-contact-card-icon,
.mst-enquiry-subtitle span,
.mst-enquiry-heading-line,
.mst-enquiry-form-wrapper::before,
.mst-enquiry-button,
.mst-enquiry-button:hover{
  background:var(--mst-contact-gradient);
}

.mst-contact-card-content a:hover{
  color:#c4272c;
}

/* About page section headings: Minerva blue-to-red gradient */
.mst-partners-heading h2,
.mst-faq-heading h2{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

/* Services page cards: blue-to-red gradient accents */
.tv-service-page-area .service-section-title,
.tv-service-page-area .tv-normal-btn,
.tv-service-page-area .tv-normal-btn:hover,
.tv-service-page-area .tv-normal-btn i,
.tv-service-page-area .service-icon i{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.tv-service-page-area .single-service-item.gray-bg .service-icon{
  background:linear-gradient(
    135deg,
    rgba(43, 69, 115, 0.16),
    rgba(196, 39, 44, 0.16)
  );
}

.tv-service-page-area .single-service-item:hover .service-icon,
.tv-service-page-area .single-service-item.gray-bg:hover .service-icon{
  background:linear-gradient(135deg, #2b4573, #c4272c);
}

.tv-service-page-area .single-service-item:hover .service-icon i{
  background:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
  color:#ffffff;
}

/* Index screenshot elements: blue-to-red service gradient */
.in-about-stat-number,
.in-about-stat-year,
.in-about-stat-year-number,
.in-service-card-title,
.in-service-learn-text,
.in-service-learn-arrow,
.in-project-heading,
.index-trusted-heading,
.cta-form h2{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

.in-about-button,
.in-project-view-button{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  border-color:transparent;
  color:#ffffff;
}

.in-about-button:hover,
.in-project-view-button:hover{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  color:#ffffff;
}

.cta-form .tv-btn-secondary .btn-text1,
.cta-form .tv-btn-secondary .btn-text2{
  background:linear-gradient(90deg, #2b4573, #c4272c);
  -webkit-background-clip:text;
  background-clip:text;
  color:transparent;
}

  /* Wider layout for the detailed sample service page */
  .inner-service-sample-page .inner-service-hero1,
  .inner-service-sample-page .inner-service-section1{
    width:calc(100% - 48px);
    max-width:1440px;
    padding-left:32px;
    padding-right:32px;
  }
  .inner-service-sample-page .inner-service-hero1 p{
    max-width:920px;
    line-height:1.8;
  }
  .inner-service-sample-page .inner-service-metric-row{
    max-width:1120px;
  }
  .inner-service-sample-page .inner-service-section1-head{
    max-width:900px;
  }
  .inner-service-sample-page .inner-service-section1-head p{
    line-height:1.8;
  }
  .inner-service-sample-page .inner-service-card-grid{
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:24px;
  }
  .inner-service-sample-page .inner-service-glass-card{
    min-height:220px;
    padding:34px 30px;
  }
  .inner-service-sample-page .inner-service-glass-card p{
    font-size:14px;
    line-height:1.7;
  }
  .inner-service-sample-page .inner-service-process-flow{
    max-width:1180px;
  }
  .inner-service-sample-page .inner-service-p-step p{
    max-width:27ch;
    font-size:14px;
    line-height:1.65;
  }
  .inner-service-sample-page .inner-service-contact{
    width:calc(100% - 48px);
    max-width:1320px;
    padding:58px 64px;
  }
  .inner-service-sample-page .inner-service-contact > div:first-child p{
    max-width:62ch;
    line-height:1.7;
  }

  @media (max-width:900px){
    .inner-service-sample-page .inner-service-card-grid{
      grid-template-columns:repeat(2,minmax(0,1fr));
    }
  }

  @media (max-width:600px){
    .inner-service-sample-page .inner-service-hero1,
    .inner-service-sample-page .inner-service-section1{
      width:100%;
      padding-left:20px;
      padding-right:20px;
    }
    .inner-service-sample-page .inner-service-card-grid{
      grid-template-columns:1fr;
    }
    .inner-service-sample-page .inner-service-glass-card{
      min-height:0;
      padding:28px 22px;
    }
    .inner-service-sample-page .inner-service-contact{
      width:auto;
      margin-left:20px;
      margin-right:20px;
      padding:36px 24px;
    }
  }














  @import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

.updated-about-section {
  --updated-about-blue: #2b4573;
  --updated-about-dark-blue: #153b70;
  --updated-about-red: #c4272c;
  --updated-about-white: #ffffff;

  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 43px 0;
  background: #fafafa;
  font-family: "Inter", sans-serif;
}

.updated-about-section *,
.updated-about-section *::before,
.updated-about-section *::after {
  box-sizing: border-box;
}

.updated-about-container {
  width: min(1610px, calc(100% - 80px));
  min-height: 760px;
  display: grid;
  grid-template-columns: minmax(520px, 0.74fr) 28px minmax(0, 1.03fr);
  align-items: stretch;
  margin: 0 auto;
}

/* =====================================================
   LEFT CONTENT PANEL
===================================================== */

.updated-about-content-panel {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border-radius: 16px 55px 55px 0;
  color: var(--updated-about-white);
  background:
    linear-gradient(
      130deg,
      #244d82 0%,
      #2b4573 38%,
      #193e70 72%,
      #2b548b 100%
    );
  background-size: 220% 220%;
  opacity: 0;
  transform: translateX(-40px);
}

.updated-about-section.updated-about-visible
  .updated-about-content-panel {
  animation:
    updated-about-panel-reveal 700ms
      cubic-bezier(0.22, 1, 0.36, 1) forwards,
    updated-about-gradient-move 18s ease-in-out
      700ms infinite alternate;
}

@keyframes updated-about-panel-reveal {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes updated-about-gradient-move {
  from {
    background-position: 0% 50%;
  }

  to {
    background-position: 100% 50%;
  }
}

.updated-about-content-inner {
  min-height: 760px;
  display: flex;
  flex-direction: column;
  padding: 83px 98px 70px 78px;
}

/* About label */

.updated-about-label {
  margin: 0 0 27px;
  color: #ff292d;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: 4px;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(18px);
}

.updated-about-section.updated-about-visible
  .updated-about-label {
  animation: updated-about-fade-up 600ms
    cubic-bezier(0.22, 1, 0.36, 1) 180ms forwards;
}

/* Heading */

.updated-about-heading {
  margin: 0;
  color: var(--updated-about-white);
  font-size: 54px;
  font-weight: 700;
  line-height: 1.12;
  letter-spacing: -2px;
  text-shadow: 0 2px 3px rgba(0, 0, 0, 0.13);
}

.updated-about-heading-line {
  display: block;
  opacity: 0;
  transform: translateY(22px);
}

.updated-about-section.updated-about-visible
  .updated-about-heading-line {
  animation: updated-about-fade-up 650ms
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.updated-about-section.updated-about-visible
  .updated-about-heading-line:nth-child(1) {
  animation-delay: 280ms;
}

.updated-about-section.updated-about-visible
  .updated-about-heading-line:nth-child(2) {
  animation-delay: 360ms;
}

.updated-about-section.updated-about-visible
  .updated-about-heading-line:nth-child(3) {
  animation-delay: 440ms;
}

.updated-about-section.updated-about-visible
  .updated-about-heading-line:nth-child(4) {
  animation-delay: 520ms;
}

/* Description */

.updated-about-description {
  max-width: 510px;
  margin: 24px 0 0;
  color: rgba(255, 255, 255, 0.96);
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  opacity: 0;
  transform: translateY(20px);
}

.updated-about-section.updated-about-visible
  .updated-about-description {
  animation: updated-about-fade-up 650ms
    cubic-bezier(0.22, 1, 0.36, 1) 720ms forwards;
}

@keyframes updated-about-fade-up {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* =====================================================
   STATISTICS
===================================================== */

.updated-about-statistics {
  position: relative;
  display: grid;
  grid-template-columns:
    minmax(130px, 0.85fr)
    minmax(180px, 1.25fr)
    minmax(150px, 1fr);
  margin-top: auto;
  padding-top: 27px;
}

.updated-about-statistics::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 1px;
  background: rgba(255, 255, 255, 0.48);
}

.updated-about-statistic {
  min-width: 0;
  padding: 0 30px;
  opacity: 0;
  transform: translateY(22px);
}

.updated-about-statistic:first-child {
  padding-left: 0;
}

.updated-about-statistic:last-child {
  padding-right: 0;
}

.updated-about-statistic + .updated-about-statistic {
  border-left: 1px solid rgba(255, 255, 255, 0.42);
}

.updated-about-section.updated-about-visible
  .updated-about-statistic {
  animation: updated-about-fade-up 600ms
    cubic-bezier(0.22, 1, 0.36, 1) forwards;
}

.updated-about-section.updated-about-visible
  .updated-about-statistic:nth-child(1) {
  animation-delay: 850ms;
}

.updated-about-section.updated-about-visible
  .updated-about-statistic:nth-child(2) {
  animation-delay: 970ms;
}

.updated-about-section.updated-about-visible
  .updated-about-statistic:nth-child(3) {
  animation-delay: 1090ms;
}

.updated-about-statistic-value {
  display: flex;
  align-items: flex-start;
  color: var(--updated-about-white);
  font-size: 34px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: -1px;
}

.updated-about-counter-symbol {
  margin-left: 1px;
}

.updated-about-statistic-label {
  margin: 14px 0 0;
  color: rgba(255, 255, 255, 0.95);
  font-size: 13px;
  font-weight: 400;
  line-height: 1.35;
  white-space: nowrap;
}

/* =====================================================
   RED VERTICAL LINE
===================================================== */

.updated-about-separator {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
}

.updated-about-separator-line {
  display: block;
  width: 7px;
  height: 430px;
  border-radius: 8px;
  background: var(--updated-about-red);
  box-shadow: 0 0 7px rgba(196, 39, 44, 0.2);
  transform: scaleY(0);
  transform-origin: top center;
}

.updated-about-section.updated-about-visible
  .updated-about-separator-line {
  animation: updated-about-line-grow 800ms
    cubic-bezier(0.22, 1, 0.36, 1) 500ms forwards;
}

@keyframes updated-about-line-grow {
  to {
    transform: scaleY(1);
  }
}

/* =====================================================
   RIGHT IMAGE
===================================================== */

.updated-about-image-panel {
  min-width: 0;
  min-height: 760px;
  overflow: hidden;
  margin: 0;
  border-radius: 17px 20px 20px 17px;
  background: #dce3eb;
  clip-path: inset(0 0 0 100% round 17px);
}

.updated-about-section.updated-about-visible
  .updated-about-image-panel {
  animation: updated-about-image-reveal 900ms
    cubic-bezier(0.22, 1, 0.36, 1) 120ms forwards;
}

@keyframes updated-about-image-reveal {
  to {
    clip-path: inset(0 0 0 0 round 17px);
  }
}

.updated-about-image {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 760px;
  object-fit: cover;
  object-position: center;
  transition: transform 600ms
    cubic-bezier(0.22, 1, 0.36, 1);
}

.updated-about-image-panel:hover
  .updated-about-image {
  transform: scale(1.025);
}

/* =====================================================
   LARGE DESKTOP
===================================================== */

@media only screen and (min-width: 1600px) {
  .updated-about-container {
    max-width: 1610px;
    min-height: 532px;
    grid-template-columns:
      minmax(520px, 660px)
      28px
      minmax(0, 785px);
    justify-content: center;
  }

  .updated-about-content-inner {
    min-height: 532px;
    padding: 38px 70px 35px 60px;
  }

  .updated-about-label {
    margin-bottom: 18px;
  }

  .updated-about-heading {
    font-size: 42px;
    line-height: 1.08;
  }

  .updated-about-description {
    max-width: 560px;
    margin-top: 17px;
    font-size: 14px;
    line-height: 1.5;
  }

  .updated-about-statistics {
    padding-top: 20px;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 532px;
  }

  .updated-about-separator-line {
    height: 300px;
  }
}

/* =====================================================
   LARGE LAPTOP: 1400PX–1599PX
===================================================== */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .updated-about-section {
    padding: 40px 0;
  }

  .updated-about-container {
    width: calc(100% - 70px);
    min-height: 760px;
    grid-template-columns: minmax(500px, 0.76fr) 26px minmax(0, 1.04fr);
  }

  .updated-about-content-inner {
    min-height: 760px;
    padding: 70px 78px 58px 66px;
  }

  .updated-about-heading {
    font-size: 49px;
  }

  .updated-about-description {
    font-size: 15px;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 760px;
  }

  .updated-about-separator-line {
    height: 430px;
  }

  .updated-about-statistic {
    padding-inline: 24px;
  }

  .updated-about-statistic-value {
    font-size: 31px;
  }
}

/* =====================================================
   STANDARD LAPTOP: 1200PX–1399PX
===================================================== */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .updated-about-section {
    padding: 35px 0;
  }

  .updated-about-container {
    width: calc(100% - 60px);
    min-height: 680px;
    grid-template-columns: minmax(450px, 0.8fr) 22px minmax(0, 1.05fr);
  }

  .updated-about-content-panel {
    border-radius: 15px 46px 46px 0;
  }

  .updated-about-content-inner {
    min-height: 680px;
    padding: 58px 60px 48px 55px;
  }

  .updated-about-label {
    margin-bottom: 22px;
    font-size: 12px;
    letter-spacing: 3.3px;
  }

  .updated-about-heading {
    font-size: 43px;
  }

  .updated-about-description {
    max-width: 450px;
    margin-top: 20px;
    font-size: 14px;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 680px;
  }

  .updated-about-separator-line {
    width: 6px;
    height: 385px;
  }

  .updated-about-statistics {
    grid-template-columns:
      minmax(100px, 0.8fr)
      minmax(155px, 1.2fr)
      minmax(135px, 1fr);
  }

  .updated-about-statistic {
    padding-inline: 19px;
  }

  .updated-about-statistic-value {
    font-size: 28px;
  }

  .updated-about-statistic-label {
    font-size: 11px;
  }
}

/* =====================================================
   SMALL LAPTOP: 992PX–1199PX
===================================================== */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .updated-about-section {
    padding: 30px 0;
  }

  .updated-about-container {
    width: calc(100% - 48px);
    min-height: 590px;
    grid-template-columns: minmax(390px, 0.88fr) 18px minmax(0, 1fr);
  }

  .updated-about-content-panel {
    border-radius: 14px 40px 40px 0;
  }

  .updated-about-content-inner {
    min-height: 590px;
    padding: 48px 45px 40px;
  }

  .updated-about-label {
    margin-bottom: 18px;
    font-size: 10px;
    letter-spacing: 2.7px;
  }

  .updated-about-heading {
    font-size: 36px;
    letter-spacing: -1.2px;
  }

  .updated-about-description {
    margin-top: 17px;
    font-size: 12px;
    line-height: 1.6;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 590px;
  }

  .updated-about-separator-line {
    width: 5px;
    height: 335px;
  }

  .updated-about-statistics {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding-top: 21px;
  }

  .updated-about-statistic {
    padding-inline: 13px;
  }

  .updated-about-statistic-value {
    font-size: 24px;
  }

  .updated-about-statistic-label {
    margin-top: 9px;
    font-size: 9px;
  }
}

/* =====================================================
   TABLET: 768PX–991PX
===================================================== */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .updated-about-section {
    padding: 35px 0;
  }

  .updated-about-container {
    width: calc(100% - 50px);
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .updated-about-content-panel {
    min-height: 610px;
    border-radius: 17px 50px 50px 17px;
  }

  .updated-about-content-inner {
    min-height: 610px;
    padding: 58px 62px 50px;
  }

  .updated-about-heading {
    max-width: 560px;
    font-size: 48px;
  }

  .updated-about-description {
    max-width: 570px;
    font-size: 15px;
  }

  .updated-about-separator {
    display: none;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 570px;
  }

  .updated-about-image-panel {
    border-radius: 17px;
  }

  .updated-about-statistics {
    max-width: 600px;
  }
}

/* =====================================================
   MOBILE: UP TO 767PX
===================================================== */

@media only screen and (max-width: 767px) {
  .updated-about-section {
    padding: 25px 0 40px;
  }

  .updated-about-container {
    width: calc(100% - 36px);
    min-height: auto;
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .updated-about-content-panel {
    min-height: auto;
    border-radius: 15px 38px 38px 15px;
  }

  .updated-about-content-inner {
    min-height: auto;
    padding: 47px 30px 38px;
  }

  .updated-about-label {
    margin-bottom: 20px;
    font-size: 10px;
    line-height: 1.6;
    letter-spacing: 2.5px;
  }

  .updated-about-heading {
    font-size: clamp(35px, 10vw, 46px);
    line-height: 1.13;
    letter-spacing: -1.3px;
  }

  .updated-about-description {
    max-width: none;
    margin-top: 22px;
    font-size: 14px;
    line-height: 1.65;
  }

  .updated-about-statistics {
    grid-template-columns: 1fr;
    gap: 0;
    margin-top: 45px;
    padding-top: 19px;
  }

  .updated-about-statistic,
  .updated-about-statistic:first-child,
  .updated-about-statistic:last-child {
    padding: 17px 0;
  }

  .updated-about-statistic + .updated-about-statistic {
    border-top: 1px solid rgba(255, 255, 255, 0.3);
    border-left: 0;
  }

  .updated-about-statistic-value {
    font-size: 29px;
  }

  .updated-about-statistic-label {
    margin-top: 8px;
    font-size: 12px;
  }

  .updated-about-separator {
    display: none;
  }

  .updated-about-image-panel {
    min-height: 430px;
    border-radius: 15px;
  }

  .updated-about-image {
    min-height: 430px;
  }
}

/* =====================================================
   SMALL MOBILE: UP TO 480PX
===================================================== */

@media only screen and (max-width: 480px) {
  .updated-about-container {
    width: calc(100% - 30px);
  }

  .updated-about-content-inner {
    padding: 42px 25px 32px;
  }

  .updated-about-heading {
    font-size: 34px;
  }

  .updated-about-description {
    font-size: 13px;
  }

  .updated-about-image-panel,
  .updated-about-image {
    min-height: 360px;
  }
}

/* =====================================================
   TOUCH DEVICES
===================================================== */

@media (hover: none), (pointer: coarse) {
  .updated-about-image-panel:hover
    .updated-about-image {
    transform: none;
  }
}

/* =====================================================
   REDUCED MOTION
===================================================== */

@media (prefers-reduced-motion: reduce) {
  .updated-about-content-panel,
  .updated-about-label,
  .updated-about-heading-line,
  .updated-about-description,
  .updated-about-statistic {
    opacity: 1;
    transform: none;
    animation: none;
  }

  .updated-about-separator-line {
    transform: scaleY(1);
    animation: none;
  }

  .updated-about-image-panel {
    clip-path: none;
    animation: none;
  }

  .updated-about-content-panel,
  .updated-about-image,
  .updated-about-separator-line {
    transition: none;
  }
}
/*==================================================
    POWER + COOLING DETAIL PAGE BRAND GRADIENT
    Breadcrumb/header/footer are intentionally excluded.
==================================================*/
.solution-detail-gradient-page .mv-inner-hero,
.solution-detail-gradient-page .solution-section {
  --solution-detail-primary: #2b4573;
  --solution-detail-accent: #c4272c;
  --solution-detail-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --solution-detail-gradient-diagonal: linear-gradient(135deg, #2b4573 0%, #c4272c 100%);
}

.solution-detail-gradient-page .mv-inner-subtitle,
.solution-detail-gradient-page .mv-inner-title {
  color: var(--solution-detail-primary);
  background: var(--solution-detail-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.solution-detail-gradient-page .mv-inner-divider,
.solution-detail-gradient-page .solution-card .title-line,
.solution-detail-gradient-page .solution-card h3::after {
  background: var(--solution-detail-gradient);
}

.solution-detail-gradient-page .mv-primary-btn,
.solution-detail-gradient-page .solution-icon,
.solution-detail-gradient-page .card-number {
  background: var(--solution-detail-gradient-diagonal);
  color: #ffffff;
}

.solution-detail-gradient-page .mv-primary-btn:hover,
.solution-detail-gradient-page .solution-card:hover .solution-icon {
  background: linear-gradient(135deg, #c4272c 0%, #2b4573 100%);
  color: #ffffff;
}

.solution-detail-gradient-page .mv-outline-btn {
  border-color: var(--solution-detail-accent);
  color: var(--solution-detail-primary);
}

.solution-detail-gradient-page .mv-outline-btn:hover {
  border-color: transparent;
  background: var(--solution-detail-gradient);
  color: #ffffff;
}

.solution-detail-gradient-page .mv-shape-one,
.solution-detail-gradient-page .mv-shape-two,
.solution-detail-gradient-page .mv-shape-three {
  background: var(--solution-detail-gradient-diagonal);
}

.solution-detail-gradient-page .mv-dot-pattern {
  background-image: radial-gradient(rgba(196, 39, 44, .42) 1.5px, transparent 1.5px);
}

.solution-detail-gradient-page .solution-card:hover {
  border-color: var(--solution-detail-accent);
}

.solution-detail-gradient-page .solution-card:hover h3,
.solution-detail-gradient-page .learn-btn,
.solution-detail-gradient-page .learn-btn i {
  color: var(--solution-detail-primary);
}

.solution-detail-gradient-page .solution-card:hover .learn-btn,
.solution-detail-gradient-page .solution-card:hover .learn-btn i {
  color: var(--solution-detail-accent);
}

/* Cooling layout is isolated so its two-card/mobile rules cannot alter Power. */
.solution-cooling-page .solution-two-wrapper {
  width: 100%;
}

@media only screen and (max-width: 767px) {
  .solution-cooling-page .auto-container,
  .solution-cooling-page .mv-inner-hero-wrapper,
  .solution-cooling-page .mv-inner-content,
  .solution-cooling-page .mv-inner-image,
  .solution-cooling-page .mv-image-box {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .solution-cooling-page .mv-inner-title {
    font-size: clamp(27px, 9vw, 38px);
    line-height: 1.18;
    overflow-wrap: break-word;
    word-break: normal;
  }

  .solution-cooling-page .mv-inner-subtitle {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 100%;
    line-height: 1.5;
    white-space: normal;
  }

.solution-cooling-page .solution-two-wrapper .solution-grid {
    grid-template-columns: 1fr;
  }
}

/*==================================================
    UPS / DIESEL / LV / PDU / CHILLED / DX GRADIENT
    Scoped to content sections; breadcrumb is excluded.
==================================================*/
.solution-product-gradient-page .inner-soln-section,
.solution-product-gradient-page .in-solns-section {
  --product-brand-primary: #2b4573;
  --product-brand-accent: #c4272c;
  --product-brand-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --product-brand-gradient-diagonal: linear-gradient(135deg, #2b4573 0%, #c4272c 100%);
}

.solution-product-gradient-page .inner-soln-subtitle,
.solution-product-gradient-page .inner-soln-title,
.solution-product-gradient-page .inner-soln-product-heading h2,
.solution-product-gradient-page .in-solns-subtitle,
.solution-product-gradient-page .in-solns-title {
  color: var(--product-brand-primary);
  background: var(--product-brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.solution-product-gradient-page .inner-soln-subtitle::before,
.solution-product-gradient-page .inner-soln-divider,
.solution-product-gradient-page .inner-soln-card-line,
.solution-product-gradient-page .in-solns-subtitle::before,
.solution-product-gradient-page .in-solns-divider,
.solution-product-gradient-page .in-solns-card-line {
  background: var(--product-brand-gradient);
}

.solution-product-gradient-page .inner-soln-product-icon,
.solution-product-gradient-page .in-solns-icon {
  background: var(--product-brand-gradient-diagonal);
  color: #ffffff;
}

.solution-product-gradient-page .inner-soln-product-icon i,
.solution-product-gradient-page .in-solns-icon i {
  color: #ffffff;
}

.solution-product-gradient-page .inner-soln-product-card:hover .inner-soln-product-icon,
.solution-product-gradient-page .in-solns-card:hover .in-solns-icon {
  background: linear-gradient(135deg, #c4272c 0%, #2b4573 100%);
  color: #ffffff;
}

.solution-product-gradient-page .inner-soln-product-card:hover,
.solution-product-gradient-page .in-solns-card:hover {
  border-color: var(--product-brand-accent);
}

.solution-product-gradient-page .inner-soln-product-card:hover h3,
.solution-product-gradient-page .in-solns-card:hover h3 {
  color: var(--product-brand-accent);
}

.solution-product-gradient-page .inner-soln-image::after,
.solution-product-gradient-page .in-solns-image::after,
.solution-product-gradient-page .in-solns-card-image::after {
  background: linear-gradient(135deg, rgba(43, 69, 115, .28), rgba(196, 39, 44, .28));
}

/*==================================================
    RACK / DCIM / CABLING / SECURITY / FIRE / INTERIOR
    Gradient is scoped to content sections only.
==================================================*/
.solution-system-gradient-page .mv-safety-section,
.solution-system-gradient-page .mv-benefit-section {
  --system-brand-primary: #2b4573;
  --system-brand-accent: #c4272c;
  --system-brand-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --system-brand-gradient-diagonal: linear-gradient(135deg, #2b4573 0%, #c4272c 100%);
}

.solution-system-gradient-page .mv-section-subtitle,
.solution-system-gradient-page .mv-section-title {
  color: var(--system-brand-primary);
  background: var(--system-brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.solution-system-gradient-page .mv-title-divider,
.solution-system-gradient-page .mv-title-divider::before,
.solution-system-gradient-page .mv-content-divider,
.solution-system-gradient-page .mv-content-divider::before {
  background: var(--system-brand-gradient);
}

.solution-system-gradient-page .mv-badge,
.solution-system-gradient-page .mv-feature-icon,
.solution-system-gradient-page .mv-benefit-icon {
  background: var(--system-brand-gradient-diagonal);
  color: #ffffff;
}

.solution-system-gradient-page .mv-feature-icon i,
.solution-system-gradient-page .mv-benefit-icon i {
  color: #ffffff;
}

.solution-system-gradient-page .mv-solution-card:hover .mv-badge,
.solution-system-gradient-page .mv-solution-card:hover .mv-feature-icon,
.solution-system-gradient-page .mv-benefit-card:hover .mv-benefit-icon {
  background: linear-gradient(135deg, #c4272c 0%, #2b4573 100%);
  color: #ffffff;
}

.solution-system-gradient-page .mv-solution-card:hover,
.solution-system-gradient-page .mv-benefit-card:hover {
  border-color: var(--system-brand-accent);
}

.solution-system-gradient-page .mv-solution-card:hover h3,
.solution-system-gradient-page .mv-benefit-card:hover .mv-benefit-title {
  color: var(--system-brand-accent);
}

.solution-system-gradient-page .mv-solution-image::after {
  background: linear-gradient(135deg, rgba(43, 69, 115, .30), rgba(196, 39, 44, .30));
}

/*==================================================
    PROJECT PAGE BRAND GRADIENT
    Scoped to the project section; breadcrumb is excluded.
==================================================*/
.project-gradient-page .cat-project-section {
  --project-brand-primary: #2b4573;
  --project-brand-accent: #c4272c;
  --project-brand-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --project-brand-gradient-diagonal: linear-gradient(135deg, #2b4573 0%, #c4272c 100%);
}

.project-gradient-page .cat-project-subtitle,
.project-gradient-page .cat-project-title,
.project-gradient-page .cat-project-card-title {
  color: var(--project-brand-primary);
  background: var(--project-brand-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.project-gradient-page .cat-project-filter-btn:hover,
.project-gradient-page .cat-project-filter-btn.cat-project-filter-active,
.project-gradient-page .cat-project-badge,
.project-gradient-page .cat-project-card-arrow:hover {
  background: var(--project-brand-gradient-diagonal);
  border-color: var(--project-brand-accent);
  color: #ffffff;
}

.project-gradient-page .cat-project-card:hover {
  border-color: var(--project-brand-accent);
}

.project-gradient-page .cat-project-location i {
  color: var(--project-brand-accent);
}

.project-gradient-page .cat-project-card-arrow {
  border-color: rgba(196, 39, 44, .28);
  color: var(--project-brand-primary);
}

.project-gradient-page .cat-project-cta {
  background: linear-gradient(110deg, #2b4573 0%, #71384f 52%, #c4272c 100%);
}

.project-gradient-page .cat-project-cta-btn {
  color: var(--project-brand-primary);
}

.project-gradient-page .cat-project-cta-btn:hover {
  color: var(--project-brand-accent);
}

/*==================================================
    GSMOPA PROJECT DETAIL BRAND GRADIENT
    Scoped below the breadcrumb to project content only.
==================================================*/
.project-detail-gradient-page .tv-project-details {
  --project-detail-primary: #2b4573;
  --project-detail-accent: #c4272c;
  --project-detail-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --project-detail-gradient-diagonal: linear-gradient(135deg, #2b4573 0%, #c4272c 100%);
}

.project-detail-gradient-page .tv-project-details .tv-project-content h2 {
  color: var(--project-detail-primary);
  background: var(--project-detail-gradient);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.project-detail-gradient-page .tv-project-details .project-thumbnail,
.project-detail-gradient-page .tv-project-details .tv-blog-details-thumb-img > div {
  box-sizing: border-box;
  padding: 0;
  border: 3px solid transparent;
  border-radius: 50px 0 50px 0;
  background:
    linear-gradient(#ffffff, #ffffff) padding-box,
    var(--project-detail-gradient-diagonal) border-box;
  overflow: hidden;
  line-height: 0;
}

.project-detail-gradient-page .tv-project-details .project-thumbnail img,
.project-detail-gradient-page .tv-project-details .tv-blog-details-thumb-img img {
  display: block;
  width: 100%;
  max-width: 100%;
  border-radius: 47px 0 47px 0;
}

.project-detail-gradient-page .tv-project-details .tv-project-sidebar-details {
  background: var(--project-detail-gradient-diagonal);
  color: #ffffff;
}

.project-detail-gradient-page .tv-project-details .tv-project-sidebar-details h4,
.project-detail-gradient-page .tv-project-details .tv-project-sidebar-details .tv-project-list-item li span,
.project-detail-gradient-page .tv-project-details .tv-project-sidebar-details .tv-project-list-item li span.name {
  color: #ffffff;
}

.project-detail-gradient-page .tv-project-details .tv-project-list-item li {
  border-bottom-color: rgba(255, 255, 255, .2);
}

/*==================================================
    SITE HEADER BRAND GRADIENT
==================================================*/
.gradient-site-header {
  --header-brand-primary: #2b4573;
  --header-brand-accent: #c4272c;
  --header-brand-gradient: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  --header-brand-gradient-reverse: linear-gradient(90deg, #c4272c 0%, #2b4573 100%);
}

.gradient-site-header .tv-header-menu nav a {
  color: var(--header-brand-primary);
  background-image: var(--header-brand-gradient);
  background-repeat: no-repeat;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.gradient-site-header .tv-header-menu nav li:hover > a,
.gradient-site-header .tv-header-menu nav a:focus-visible {
  background-image: var(--header-brand-gradient-reverse);
}

.gradient-site-header .tv-header-menu nav li.has-dropdown::after {
  color: var(--header-brand-accent);
}

.gradient-site-header .tv-header-menu nav .submenu li a::before {
  background: var(--header-brand-gradient);
}

.gradient-site-header .tv-btn-primary {
  background: var(--header-brand-gradient);
  box-shadow: 0 10px 24px rgba(43, 69, 115, .18);
}

.gradient-site-header .tv-btn-primary:hover,
.gradient-site-header .tv-btn-primary:focus-visible {
  background: var(--header-brand-gradient-reverse);
}

.gradient-site-header .tv-btn-primary .btn-wrap .btn-text1,
.gradient-site-header .tv-btn-primary .btn-wrap .btn-text2,
.gradient-site-header .tv-btn-primary:hover .btn-wrap .btn-text1,
.gradient-site-header .tv-btn-primary:hover .btn-wrap .btn-text2 {
  color: #ffffff;
  -webkit-text-fill-color: #ffffff;
}

.gradient-site-header .tv-header-bar button span {
  background: #c21f24;
  border-color: transparent;
  color: #ffffff;
  box-shadow: 0 8px 20px rgba(43, 69, 115, .16);
}

.gradient-site-header .tv-header-bar button:hover span,
.gradient-site-header .tv-header-bar button:focus-visible span {
  background: #c21f24;
  color: #ffffff;
}

/* The desktop menu is cloned here for the mobile off-canvas navigation. */
.tv-offcanvas-area .tv-menu-mobile a {
  color: #2b4573;
  background-image: linear-gradient(90deg, #2b4573 0%, #c4272c 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

/* Keep desktop navigation readable on the white header. */
.gradient-site-header .tv-header-menu > nav > ul > li > a {
  color: var(--header-brand-primary);
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: currentColor;
}

/* Keep mobile primary navigation readable on the dark off-canvas panel. */
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content > ul > li > a {
  color: #ffffff;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: currentColor;
}

.gradient-site-header .tv-header-menu > nav > ul > li:hover > a,
.gradient-site-header .tv-header-menu > nav > ul > li > a:hover,
.gradient-site-header .tv-header-menu > nav > ul > li > a:focus-visible,
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content > ul > li > a:hover,
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content > ul > li > a:focus-visible {
  color: #c4272b;
  background: none;
  -webkit-text-fill-color: currentColor;
}

/* Keep mobile dropdown item text clearly readable on the dark panel. */
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content ul ul a,
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content ul ul a:hover,
.tv-offcanvas-area .tv-menu-mobile .tv-menu-content ul ul a:focus-visible {
  color: #ffffff;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  -webkit-text-fill-color: #ffffff;
}

.gradient-site-header .tv-header-menu > nav > ul > li.has-dropdown::after {
  color: var(--tv-common-black);
}

.gradient-site-header .tv-header-menu > nav > ul > li.has-dropdown:hover::after {
  color: #c4272b;
}

















.index--service--section {
  --index--service--blue: #2b4573;
  --index--service--dark-blue: #082e74;
  --index--service--red: #e51d2a;
  --index--service--border: #d5ddea;
  --index--service--background: #f8f7f5;
  --index--service--icon-background: #f8eeee;

  position: relative;
  width: 100%;
  overflow: hidden;
  padding: 58px 0 75px;
  background: var(--index--service--background);
  font-family: "Inter", sans-serif;
}

.index--service--section *,
.index--service--section *::before,
.index--service--section *::after {
  box-sizing: border-box;
}

.index--service--container {
  width: min(1240px, calc(100% - 80px));
  margin: 0 auto;
}

/* Header */

.index--service--header {
  margin-bottom: 47px;
  text-align: center;
  opacity: 0;
  transform: translateY(25px);
  transition:
    opacity 700ms ease,
    transform 700ms cubic-bezier(0.22, 1, 0.36, 1);
}

.index--service--section.index--service--visible
  .index--service--header {
  opacity: 1;
  transform: translateY(0);
}

.index--service--label {
  margin: 0 0 19px;
  color: var(--index--service--red);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: 8px;
  text-transform: uppercase;
}

.index--service--heading {
  margin: 0;
  color: #092f88;
  font-size: clamp(43px, 4vw, 61px);
  font-weight: 800;
  line-height: 1.12;
  letter-spacing: -2.3px;
}

/* Grid */

.index--service--grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px 16px;
}

/* Cards */

.index--service--card {
  min-width: 0;
  min-height: 315px;
  display: flex;
  flex-direction: column;
  padding: 41px 23px 26px;
  border: 1px solid var(--index--service--border);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.62);
  opacity: 0;
  transform: translateY(25px);
  transition:
    opacity 550ms ease,
    transform 350ms ease,
    border-color 350ms ease,
    box-shadow 350ms ease,
    background-color 350ms ease;
}

.index--service--section.index--service--visible
  .index--service--card {
  opacity: 1;
  transform: translateY(0);
}

.index--service--card-top {
  min-height: 105px;
  display: grid;
  grid-template-columns: 91px minmax(0, 1fr);
  align-items: start;
  gap: 27px;
}

.index--service--icon-box {
  width: 91px;
  height: 98px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 11px;
  background:
    linear-gradient(
      135deg,
      #f1f4fa 0%,
      var(--index--service--icon-background) 100%
    );
}

.index--service--icon {
  width: 59px;
  height: 59px;
  fill: none;
  stroke: #c32227;
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.index--service--title-wrap {
  min-width: 0;
  padding-top: 10px;
}

.index--service--number {
  display: block;
  margin-bottom: 17px;
  color: var(--index--service--red);
  font-size: 23px;
  font-weight: 700;
  line-height: 1;
}

.index--service--title {
  margin: 0;
  color: var(--index--service--dark-blue);
  font-size: 19px;
  font-weight: 700;
  line-height: 1.35;
  letter-spacing: -0.5px;
  overflow-wrap: anywhere;
}

.index--service--description {
  margin: 35px 0 24px;
  color: #7e8085;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
}

.index--service--link {
  width: fit-content;
  display: inline-flex;
  align-items: center;
  gap: 20px;
  margin-top: auto;
  color: var(--index--service--dark-blue);
  font-size: 16px;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
}

.index--service--arrow {
  width: 27px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 300ms ease;
}

.index--service--link:hover {
  color: #c32227;
}

.index--service--link:hover
  .index--service--arrow {
  transform: translateX(6px);
}

.index--service--card:hover {
  border-color: rgba(229, 29, 42, 0.65);
  background: #ffffff;
  box-shadow: 0 12px 28px rgba(229, 29, 42, 0.12);
  transform: translateY(-4px);
}

/* Large desktop */

@media only screen and (min-width: 1600px) {
  .index--service--container {
    max-width: 1240px;
  }
}

/* Large laptop */

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
  .index--service--section {
    padding: 55px 0 68px;
  }

  .index--service--container {
    width: min(1240px, calc(100% - 70px));
  }

  .index--service--heading {
    font-size: 56px;
  }
}

/* Standard laptop */

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
  .index--service--section {
    padding: 50px 0 62px;
  }

  .index--service--container {
    width: calc(100% - 60px);
  }

  .index--service--header {
    margin-bottom: 40px;
  }

  .index--service--heading {
    font-size: 49px;
  }

  .index--service--card {
    min-height: 300px;
    padding: 34px 19px 23px;
  }

  .index--service--card-top {
    grid-template-columns: 78px minmax(0, 1fr);
    gap: 20px;
  }

  .index--service--icon-box {
    width: 78px;
    height: 86px;
  }

  .index--service--icon {
    width: 52px;
    height: 52px;
  }

  .index--service--number {
    margin-bottom: 13px;
    font-size: 20px;
  }

  .index--service--title {
    font-size: 17px;
  }

  .index--service--description {
    margin-top: 28px;
    font-size: 14px;
  }

  .index--service--link {
    font-size: 14px;
  }
}

/* Small laptop */

@media only screen and (min-width: 992px) and (max-width: 1199px) {
  .index--service--section {
    padding: 46px 0 58px;
  }

  .index--service--container {
    width: calc(100% - 48px);
  }

  .index--service--label {
    margin-bottom: 15px;
    font-size: 15px;
    letter-spacing: 6px;
  }

  .index--service--heading {
    font-size: 42px;
  }

  .index--service--header {
    margin-bottom: 35px;
  }

  .index--service--grid {
    gap: 15px 13px;
  }

  .index--service--card {
    min-height: 276px;
    padding: 29px 15px 21px;
  }

  .index--service--card-top {
    min-height: 90px;
    grid-template-columns: 66px minmax(0, 1fr);
    gap: 14px;
  }

  .index--service--icon-box {
    width: 66px;
    height: 75px;
  }

  .index--service--icon {
    width: 45px;
    height: 45px;
  }

  .index--service--title-wrap {
    padding-top: 6px;
  }

  .index--service--number {
    margin-bottom: 11px;
    font-size: 17px;
  }

  .index--service--title {
    font-size: 14px;
  }

  .index--service--description {
    margin: 24px 0 19px;
    font-size: 12px;
  }

  .index--service--link {
    gap: 14px;
    font-size: 12px;
  }

  .index--service--arrow {
    width: 23px;
  }
}

/* Tablet */

@media only screen and (min-width: 768px) and (max-width: 991px) {
  .index--service--section {
    padding: 48px 0 58px;
  }

  .index--service--container {
    width: calc(100% - 50px);
  }

  .index--service--label {
    font-size: 14px;
    letter-spacing: 6px;
  }

  .index--service--heading {
    font-size: 42px;
  }

  .index--service--grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px;
  }

  .index--service--card {
    min-height: 310px;
    padding: 35px 26px 25px;
  }

  .index--service--card-top {
    grid-template-columns: 83px minmax(0, 1fr);
    gap: 25px;
  }

  .index--service--icon-box {
    width: 83px;
    height: 90px;
  }

  .index--service--icon {
    width: 54px;
    height: 54px;
  }

  .index--service--description {
    margin-top: 30px;
    font-size: 15px;
  }
}

/* Mobile */

@media only screen and (max-width: 767px) {
  .index--service--section {
    padding: 43px 0 52px;
  }

  .index--service--container {
    width: calc(100% - 36px);
  }

  .index--service--header {
    margin-bottom: 32px;
  }

  .index--service--label {
    margin-bottom: 13px;
    font-size: 12px;
    letter-spacing: 5px;
  }

  .index--service--heading {
    font-size: clamp(34px, 9vw, 43px);
    line-height: 1.16;
    letter-spacing: -1.3px;
  }

  .index--service--grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .index--service--card {
    min-height: 290px;
    padding: 32px 25px 24px;
  }

  .index--service--card-top {
    min-height: 98px;
    grid-template-columns: 80px minmax(0, 1fr);
    gap: 23px;
  }

  .index--service--icon-box {
    width: 80px;
    height: 87px;
  }

  .index--service--icon {
    width: 52px;
    height: 52px;
  }

  .index--service--number {
    margin-bottom: 12px;
    font-size: 20px;
  }

  .index--service--title {
    font-size: 18px;
  }

  .index--service--description {
    margin: 28px 0 21px;
    font-size: 15px;
  }

  .index--service--link {
    font-size: 15px;
  }
}

/* Small mobile */

@media only screen and (max-width: 480px) {
  .index--service--container {
    width: calc(100% - 30px);
  }

  .index--service--heading {
    font-size: 33px;
  }

  .index--service--card {
    min-height: 275px;
    padding: 28px 20px 22px;
  }

  .index--service--card-top {
    grid-template-columns: 70px minmax(0, 1fr);
    gap: 18px;
  }

  .index--service--icon-box {
    width: 70px;
    height: 77px;
  }

  .index--service--icon {
    width: 47px;
    height: 47px;
  }

  .index--service--title {
    font-size: 16px;
  }

  .index--service--description {
    font-size: 14px;
  }
}

/* Touch devices */

@media (hover: none), (pointer: coarse) {
  .index--service--card:hover {
    border-color: var(--index--service--border);
    background: rgba(255, 255, 255, 0.62);
    box-shadow: none;
    transform: translateY(0);
  }
}

/* Reduced motion */

@media (prefers-reduced-motion: reduce) {
  .index--service--header,
  .index--service--card {
    opacity: 1;
    transform: none;
    transition: none;
  }

  .index--service--arrow {
    transition: none;
  }
}














/* Industry Section CSS */
.industry-area {
    background: #edf4fc;
    overflow: hidden;
}
.industry-container {
    position: relative;
    width: 100%;
    max-width: 1440px;
    aspect-ratio: 1147 / 1371;
    margin: 0 auto;
    color: #103e7c;
    text-align: center;
    background: url("../img/industry/industry-bg1.png") center / 100% 100% no-repeat;
}
.industry-header {
    position: absolute;
    top: 3%;
    left: 5%;
    width: 90%;
    z-index: 2;
}
.industry-eyebrow {
    margin: 0 0 12px;
    color: #df1725;
    font-size: clamp(12px, 1.2vw, 17px);
    font-weight: 700;
    letter-spacing: 2px;
}
.industry-heading {
    margin: 0 0 14px;
    color: #103e7c;
    font-size: clamp(34px, 4.4vw, 62px);
    font-weight: 700;
    line-height: 1.06;
}
.industry-description {
    max-width: 1050px;
    margin: 0 auto;
    color: #46536a;
    font-size: clamp(16px, 1.6vw, 21px);
    line-height: 1.5;
}
.industry-connections {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
}
.industry-wire-glow { stroke: #fff; stroke-width: 10; filter: drop-shadow(0 0 7px #50dfff); }
.industry-wire { stroke: #35a9e5; stroke-width: 2; }
.industry-signal { fill: #ec1532; filter: drop-shadow(0 0 5px #ff6177); }
.industry-sector {
    position: absolute;
    z-index: 2;
    width: 23%;
}
.industry-sector--government { top: 20%; left: 4%; }
.industry-sector--healthcare { top: 17%; left: 38.5%; }
.industry-sector--banking { top: 20%; right: 4%; }
.industry-sector--education { top: 65%; left: 4%; }
.industry-sector--telecom { top: 70%; left: 38.5%; }
.industry-sector--enterprise { top: 65%; right: 4%; }
.industry-icon-orb {
    position: relative;
    display: grid;
    place-items: center;
    width: clamp(90px, 10vw, 142px);
    aspect-ratio: 1;
    margin: 0 auto 12px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 25%, #fff 0%, #ffffff90 40%, #dbeafa55 70%, #fff 100%);
    box-shadow: inset 0 0 12px #fff, 0 10px 12px -10px #5a9dc6;
}
.industry-icon-orb::after {
    content: "";
    position: absolute;
    left: -5%;
    bottom: 0;
    width: 110%;
    height: 20%;
    border-radius: 50%;
    background: #ffffffa8;
    box-shadow: 0 5px 2px #afcfe466;
}
.industry-sector-icon {
    position: relative;
    z-index: 1;
    width: 76%;
    height: 76%;
    color: #075399;
    filter: drop-shadow(0 5px 2px #0c44782b);
}
.industry-sector-title {
    margin: 0 0 6px;
    color: #103e7c;
    font-size: clamp(20px, 2.05vw, 29px);
    line-height: 1.2;
    font-weight: 700;
}
.industry-sector-copy {
    max-width: 245px;
    margin: 0 auto;
    color: #46536a;
    font-size: clamp(15px, 1.45vw, 20px);
    line-height: 1.35;
    text-wrap: pretty;
}
.industry-hub {
    position: absolute;
    z-index: 2;
    top: 46%;
    left: 35%;
    width: 30%;
    padding: 10px 4px;
    color: #fff;
    background: radial-gradient(ellipse, #083774c9, transparent 72%);
    text-shadow: 0 2px 6px #04284f;
}
.industry-hub-kicker { font-size: clamp(10px, 1vw, 14px); letter-spacing: 4px; font-weight: 600; }
.industry-hub-title { margin: 5px 0 8px; color: #fff; font-size: clamp(21px, 2.3vw, 33px); font-weight: 700; line-height: 1.15; }
.industry-hub-caption { display: block; font-size: clamp(8px, .85vw, 12px); line-height: 1.4; }
.industry-hub::after { content: ""; display: block; width: 56px; height: 3px; margin: 14px auto 0; background: #e51d32; }
.industry-area.industry-animated .industry-icon-orb { animation: industry-float 4s ease-in-out infinite; }
.industry-area.industry-animated .industry-sector:nth-child(even) .industry-icon-orb { animation-delay: -2s; }
.industry-area.industry-animated .industry-signal { animation: industry-pulse 2.4s ease-in-out infinite; }
@keyframes industry-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
@keyframes industry-pulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }


/* Industry Section CSS - compact layout */
.industry-area { background: #edf4fc url("../img/industry/industry-bg1.png") center / cover no-repeat; }
.industry-container { max-width: 1180px; aspect-ratio: auto; padding: 28px 24px; background: none; }
.industry-header { position: relative; top: auto; left: auto; width: 100%; margin-bottom: 18px; }
.industry-eyebrow { margin-bottom: 8px; font-size: 12px; }
.industry-heading { margin-bottom: 10px; font-size: clamp(28px, 3vw, 40px); line-height: 1.1; }
.industry-description { max-width: 850px; font-size: 15px; }
.industry-stage { position: relative; min-height: 430px; }
.industry-sector { width: 26%; }
.industry-sector--government { top: 0; left: 0; }
.industry-sector--healthcare { top: 145px; left: 0; }
.industry-sector--banking { top: 0; right: 0; }
.industry-sector--education { top: 290px; left: 0; }
.industry-sector--telecom { top: 145px; left: auto; right: 0; }
.industry-sector--enterprise { top: 290px; right: 0; }
.industry-icon-orb { width: 56px; margin-bottom: 6px; }
.industry-sector-title { font-size: 19px; margin-bottom: 4px; }
.industry-sector-copy { max-width: 240px; font-size: 13px; line-height: 1.4; }
.industry-hub { top: 50%; left: 31%; width: 38%; padding: 0; transform: translateY(-50%); background: none; color: #103e7c; text-shadow: none; }
.industry-center-image { display: block; width: 100%; height: auto; max-height: 275px; object-fit: contain; margin: 0 auto 8px; }
.industry-hub-kicker { font-size: 10px; letter-spacing: 3px; }
.industry-hub-title { color: #103e7c; font-size: 20px; margin: 3px 0 6px; }
.industry-hub-title br { display: none; }
.industry-hub-caption { font-size: 9px; }
.industry-hub::after { width: 40px; margin-top: 8px; }
.industry-wire-glow { stroke-width: 6; }
.industry-wire { stroke-width: 1.5; }

/* Industry Section CSS - large desktops */
@media (min-width: 1440px) {
    .industry-container { padding-top: 32px; padding-bottom: 32px; }
}

/* Industry Section CSS - laptops and short desktop screens */
@media (min-width: 1024px) and (max-height: 800px) {
    .industry-container { padding-top: 20px; padding-bottom: 20px; }
    .industry-heading { font-size: 32px; }
    .industry-stage { min-height: 400px; }
    .industry-sector--healthcare, .industry-sector--telecom { top: 135px; }
    .industry-sector--education, .industry-sector--enterprise { top: 270px; }
    .industry-icon-orb { width: 48px; }
    .industry-center-image { max-height: 240px; }
}

/* Industry Section CSS - tablets */
@media (min-width: 768px) and (max-width: 1023px) {
    .industry-container { padding: 28px 20px; }
    .industry-heading { font-size: 30px; }
    .industry-sector { width: 28%; }
    .industry-sector-title { font-size: 17px; }
    .industry-sector-copy { font-size: 12px; }
    .industry-hub { left: 30%; width: 40%; }
    .industry-hub-title { font-size: 17px; }
}

/* Industry Section CSS - mobile and landscape phones */
@media (max-width: 767px) {
    .industry-container { padding: 28px 16px; }
    .industry-heading { font-size: clamp(25px, 5vw, 32px); }
    .industry-heading-break { display: none; }
    .industry-description { font-size: 14px; }
    .industry-stage { min-height: 0; }
    .industry-connections { display: none; }
    .industry-hub { position: relative; top: auto; left: auto; width: 260px; max-width: 100%; margin: 0 auto 20px; transform: none; }
    .industry-center-image { max-height: 170px; width: auto; max-width: 100%; }
    .industry-hub-title { font-size: 18px; }
    .industry-sectors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
    .industry-sector { position: static; width: auto; padding: 12px 8px; border: 1px solid #fff; border-radius: 14px; background: #f7fbffe8; }
    .industry-icon-orb { width: 46px; }
    .industry-sector-title { font-size: 16px; }
    .industry-sector-copy { font-size: 12px; line-height: 1.4; }
}

/* Industry Section CSS - small mobiles */
@media (max-width: 374px) {
    .industry-container { padding-right: 12px; padding-left: 12px; }
    .industry-sectors { gap: 8px; }
    .industry-sector-title { font-size: 15px; }
}

/* Industry Section CSS - reduced motion accessibility */
@media (prefers-reduced-motion: reduce) {
    .industry-area.industry-animated .industry-icon-orb,
    .industry-area.industry-animated .industry-signal { animation: none; }
}