/* =========================================================
       PRODUCTS
    ========================================================= */
.products-section {
    position: relative;
    overflow: hidden;
    background: linear-gradient( 180deg, #ffffff 0%, #f5fafb 100% );
}


.products-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 25px;
}


/* ---------- Product Card ---------- */

.vishar-product-card {
    position: relative;
    overflow: hidden;
    background: rgba(255,255,255,.75);
    border: 2px solid rgba(15,76,92,.12);
    border-radius: 28px;
    backdrop-filter: blur(20px);
    transition: .35s ease;
}


    .vishar-product-card:hover {
        transform: translateY(-10px);
        box-shadow: 0 30px 70px rgba(15,76,92,.15);
    }


/* ---------- Visual ---------- */

.vishar-product-visual {
    height: 270px;
    position: relative;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    background: linear-gradient( 135deg, #0F4C5C, #2B6A78 55%, #18B6A3 );
}


.vishar-product-card-kaf
.vishar-product-visual {
    background: linear-gradient( 135deg, #0F4C5C, #176879 55%, #D4A017 );
}


/* ---------- Glow ---------- */

.vishar-product-glow {
    position: absolute;
    width: 260px;
    height: 260px;
    border-radius: 50%;
    background: #18B6A3;
    opacity: .25;
    filter: blur(80px);
    right: -70px;
    top: -90px;
}


.vishar-product-card-kaf
.vishar-product-glow {
    background: #D4A017;
}


/* =========================================================
       PETRONET MOCKUP
    ========================================================= */

.vishar-product-window {
    position: relative;
    z-index: 2;
    width: 78%;
    background: rgba(255,255,255,.95);
    border-radius: 18px;
    overflow: hidden;
    box-shadow: 0 30px 60px rgba(0,0,0,.2);
    transform: perspective(800px) rotateX(4deg) rotateY(-5deg);
    transition: .4s ease;
}


.vishar-product-card:hover
.vishar-product-window {
    transform: perspective(800px) rotateX(0) rotateY(0) translateY(-5px);
}


.vishar-product-window-top {
    height: 38px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 14px;
    background: #f2f6f7;
    border-bottom: 1px solid #e3eaec;
}


    .vishar-product-window-top span {
        font-family: var(--font-mono);
        font-size: 9px;
        color: #0F4C5C;
    }


.window-dots {
    display: flex;
    gap: 5px;
}


    .window-dots i {
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #ccd7da;
    }


        .window-dots i:first-child {
            background: #D4A017;
        }


        .window-dots i:nth-child(2) {
            background: #18B6A3;
        }


/* Dashboard */

.vishar-product-dashboard {
    padding: 16px;
    background: #eef5f6;
}


.dashboard-header {
    display: flex;
    gap: 7px;
    margin-bottom: 14px;
}


    .dashboard-header span {
        height: 7px;
        border-radius: 4px;
        background: #c9d8dc;
    }


        .dashboard-header span:nth-child(1) {
            width: 35%;
        }


        .dashboard-header span:nth-child(2) {
            width: 20%;
        }


        .dashboard-header span:nth-child(3) {
            width: 12%;
        }


.dashboard-main {
    display: flex;
    gap: 12px;
}


.dashboard-sidebar {
    width: 30px;
    display: flex;
    flex-direction: column;
    gap: 9px;
}


    .dashboard-sidebar i {
        width: 100%;
        height: 8px;
        border-radius: 4px;
        background: #d4e0e2;
    }


        .dashboard-sidebar i:first-child {
            background: #18B6A3;
        }


.dashboard-content {
    flex: 1;
}


.dashboard-line {
    width: 80%;
    height: 9px;
    background: #cbd9dc;
    border-radius: 5px;
    margin-bottom: 8px;
}


    .dashboard-line.large {
        width: 60%;
        background: #0F4C5C;
    }


    .dashboard-line.short {
        width: 40%;
        background: #18B6A3;
    }


.dashboard-boxes {
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 7px;
    margin-top: 15px;
}


    .dashboard-boxes span {
        height: 55px;
        border-radius: 7px;
        background: #fff;
        border: 1px solid #dce6e8;
    }


        .dashboard-boxes span:first-child {
            border-top: 3px solid #18B6A3;
        }


        .dashboard-boxes span:nth-child(2) {
            border-top: 3px solid #D4A017;
        }


/* =========================================================
       KAF MOCKUP
    ========================================================= */

.kaf-interface {
    position: relative;
    z-index: 2;
    width: 72%;
    padding: 20px;
    border-radius: 20px;
    background: rgba(255,255,255,.95);
    box-shadow: 0 30px 60px rgba(15,76,92,.25);
    transform: rotate(-3deg);
    transition: .4s ease;
}


.vishar-product-card:hover
.kaf-interface {
    transform: rotate(0) translateY(-5px);
}


.kaf-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 14px;
    border-bottom: 1px solid #e6eeee;
}


    .kaf-top span {
        font-size: 22px;
        font-weight: 800;
        color: #0F4C5C;
    }


    .kaf-top small {
        font-family: var(--font-mono);
        font-size: 8px;
        color: #889;
    }


.kaf-table {
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 8px;
    margin-top: 18px;
}


.kaf-table-item {
    height: 55px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background: #eef5f6;
    color: #6C7A80;
    font-family: var(--font-mono);
    font-size: 11px;
}


    .kaf-table-item.active {
        background: #18B6A3;
        color: white;
        box-shadow: 0 8px 20px rgba(24,182,163,.25);
    }


.kaf-order {
    margin-top: 15px;
}


    .kaf-order div {
        height: 8px;
        background: #d9e4e6;
        border-radius: 5px;
        margin-bottom: 8px;
    }


        .kaf-order div:first-child {
            width: 80%;
            background: #0F4C5C;
        }


        .kaf-order div:nth-child(2) {
            width: 60%;
        }


        .kaf-order div:nth-child(3) {
            width: 40%;
            background: #D4A017;
        }


/* =========================================================
       PRODUCT CONTENT
    ========================================================= */

.vishar-product-content {
    padding: 28px;
}


.vishar-product-number {
    font-family: var(--font-mono);
    font-size: 11px;
    color: #18B6A3;
    margin-bottom: 10px;
    direction: ltr;
    text-align: right;
}


.vishar-product-card-kaf
.vishar-product-number {
    color: #D4A017;
}


.vishar-product-content h3 {
    color: #0F4C5C;
    font-size: 25px;
    margin-bottom: 12px;
}


.vishar-product-content p {
    color: #667;
    font-size: 14px;
    line-height: 2;
    max-width: 500px;
}


.vishar-product-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 20px;
}


    .vishar-product-tags span {
        padding: 5px 11px;
        border-radius: 20px;
        background: rgba(24,182,163,.10);
        color: #0F4C5C;
        font-size: 11px;
    }


.vishar-product-card-kaf
.vishar-product-tags span {
    background: rgba(212,160,23,.10);
}


.vishar-product-link {
    display: flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
    margin-top: 22px;
    color: #0F4C5C;
    font-size: 13px;
    font-weight: 700;
    transition: .3s ease;
}


    .vishar-product-link span {
        color: #D4A017;
        font-size: 18px;
        transition: .3s ease;
    }


    .vishar-product-link:hover {
        color: #18B6A3;
    }


        .vishar-product-link:hover span {
            transform: translateX(-5px);
        }


/* =========================================================
       RESPONSIVE
    ========================================================= */

@media(max-width: 992px) {

    .products-grid {
        grid-template-columns: 1fr;
    }
}


@media(max-width:768px) {

    .products-grid {
        gap: 20px;
    }

    .vishar-product-visual {
        height: 230px;
    }

    .vishar-product-window {
        width: 82%;
    }

    .kaf-interface {
        width: 78%;
    }

    .vishar-product-content {
        padding: 24px;
    }
}


/* =========================================================
       SERVICES
    ========================================================= */
.services-section {
    position: relative;
    overflow: hidden;
    background: linear-gradient( 180deg, #f9faeb 0%, #e6f2f5 100% );
}


.services-layout {
    display: grid;
    grid-template-columns: .85fr 1.15fr;
    gap: 50px;
    align-items: start;
}


/* =========================================================
       INTRO
    ========================================================= */

.services-intro {
    position: sticky;
    top: 100px;
    padding: 35px;
    background: linear-gradient( 145deg, #0F4C5C, #176879 );
    border-radius: 28px;
    overflow: hidden;
    color: white;
    box-shadow: 0 30px 70px rgba(15,76,92,.18);
}


    .services-intro::before {
        content: "";
        position: absolute;
        width: 280px;
        height: 280px;
        right: -120px;
        top: -120px;
        border-radius: 50%;
        background: #18B6A3;
        opacity: .18;
        filter: blur(60px);
    }


.services-number {
    position: relative;
    font-family: var(--font-mono);
    color: #D4A017;
    font-size: 12px;
    margin-bottom: 60px;
    direction: ltr;
}


.services-intro h3 {
    position: relative;
    color: white;
    font-size: 30px;
    line-height: 1.7;
    margin-bottom: 20px;
}


    .services-intro h3 span {
        color: #70D9C8;
    }


.services-intro p {
    position: relative;
    color: rgba(255,255,255,.72);
    font-size: 14px;
    line-height: 2.1;
}


.services-line {
    position: relative;
    width: 55px;
    height: 2px;
    background: #D4A017;
    margin: 35px 0 18px;
}


.services-label {
    position: relative;
    font-family: var(--font-mono);
    color: rgba(255,255,255,.5);
    font-size: 9px;
    direction: ltr;
}


/* =========================================================
       SERVICE LIST
    ========================================================= */

.services-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
}


.service-item {
    position: relative;
    display: grid;
    grid-template-columns: 45px 48px 1fr 25px;
    align-items: center;
    gap: 18px;
    padding: 20px 22px;
    background: rgba(255,255,255,.78);
    border: 1px solid rgba(15,76,92,.1);
    border-radius: 20px;
    backdrop-filter: blur(15px);
    transition: .3s ease;
}


    .service-item:hover {
        transform: translateX(-7px);
        background: rgba(255,255,255,.95);
        border-color: rgba(24,182,163,.35);
        box-shadow: 0 20px 45px rgba(15,76,92,.1);
    }


/* number */

.service-item-number {
    font-family: var(--font-mono);
    font-size: 10px;
    color: #a3afb2;
    direction: ltr;
    transition: .3s ease;
}


.service-item:hover
.service-item-number {
    color: #D4A017;
}


/* icon */

.service-item-icon {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 14px;
    background: rgba(24,182,163,.1);
    color: #0F4C5C;
    font-family: var(--font-mono);
    font-size: 17px;
    transition: .3s ease;
}


.service-item:hover
.service-item-icon {
    background: #0F4C5C;
    color: white;
    transform: rotate(-5deg);
}


/* content */

.service-item-content h3 {
    color: #0F4C5C;
    font-size: 16px;
    margin-bottom: 4px;
}


.service-item-content p {
    color: #718084;
    font-size: 12.5px;
    line-height: 1.9;
}


/* arrow */

.service-item-arrow {
    color: #D4A017;
    font-size: 19px;
    opacity: .45;
    transition: .3s ease;
}


.service-item:hover
.service-item-arrow {
    opacity: 1;
    transform: translateX(-5px);
}


/* =========================================================
       RESPONSIVE
    ========================================================= */

@media(max-width:992px) {

    .services-layout {
        grid-template-columns: 1fr;
        gap: 25px;
    }


    .services-intro {
        position: relative;
        top: auto;
    }
}


@media(max-width:768px) {

    .services-intro {
        padding: 28px;
        border-radius: 24px;
    }


        .services-intro h3 {
            font-size: 26px;
        }


    .services-number {
        margin-bottom: 35px;
    }


    .service-item {
        grid-template-columns: 35px 45px 1fr;
        gap: 12px;
        padding: 17px;
    }


    .service-item-arrow {
        display: none;
    }


    .service-item-icon {
        width: 45px;
        height: 45px;
    }


    .service-item-content h3 {
        font-size: 15px;
    }


    .service-item-content p {
        font-size: 12px;
    }
}


/* =========================================================
       MOBILE RESPONSIVE
       VISHAR HOME PAGE
    ========================================================= */
/* =========================================================
       TABLET
    ========================================================= */
@media (max-width: 992px) {
    /* ---------- HERO ---------- */

    .enterprise-hero {
        min-height: auto;
        padding: 90px 0 70px;
    }

    .hero-grid {
        grid-template-columns: 1fr;
        gap: 60px;
    }

    .hero-content {
        text-align: center;
        max-width: 760px;
        margin: 0 auto;
    }

        .hero-content .lead {
            margin-left: auto;
            margin-right: auto;
        }

    .hero-actions {
        justify-content: center;
        flex-wrap: wrap;
    }

    .company-trust {
        justify-content: center;
    }
    /* ---------- ENTERPRISE VISUAL ---------- */

    .enterprise-visual {
        width: 100%;
        max-width: 680px;
        margin: 0 auto;
    }

    .system-card {
        width: 90%;
        margin: 0 auto;
    }
    /* ---------- PRODUCTS ---------- */

    .products-grid {
        grid-template-columns: 1fr;
    }

    .vishar-product-card {
        max-width: 760px;
        width: 100%;
        margin: 0 auto;
    }
    /* ---------- SERVICES ---------- */

    .services-layout {
        grid-template-columns: 1fr;
        gap: 30px;
    }

    .services-intro {
        position: relative;
        top: auto;
    }
    /* ---------- INSIGHTS ---------- */

    .insights-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}


/* =========================================================
       MOBILE
    ========================================================= */

@media (max-width: 768px) {
    /* =====================================================
           GENERAL
        ===================================================== */

    .container {
        width: calc(100% - 32px);
        max-width: none;
    }

    .section-head {
        margin-bottom: 35px;
    }

        .section-head h2 {
            font-size: 27px;
            line-height: 1.7;
        }

        .section-head p {
            font-size: 13px;
            line-height: 2;
        }
    /* =====================================================
           HERO
        ===================================================== */

    .enterprise-hero {
        padding: 65px 0 55px;
        overflow: hidden;
    }

    .hero-grid {
        display: flex;
        flex-direction: column;
        gap: 45px;
    }

    .hero-content {
        width: 100%;
        text-align: center;
    }
    /* badge */

    .hero-badge {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        font-size: 11px;
        padding: 8px 13px;
        margin-bottom: 20px;
    }
    /* title */

    .hero-content h1 {
        font-size: clamp(29px, 8vw, 42px);
        line-height: 1.65;
        margin-bottom: 18px;
    }

        .hero-content h1 br {
            display: none;
        }

        .hero-content h1 span {
            display: inline;
        }
    /* description */

    .hero-content .lead {
        width: 100%;
        max-width: 540px;
        font-size: 13px;
        line-height: 2.15;
    }
    /* buttons */

    .hero-actions {
        display: flex;
        flex-direction: column;
        width: 100%;
        gap: 10px;
        margin-top: 25px;
    }

        .hero-actions .btn {
            width: 100%;
            min-height: 48px;
        }
    /* trust */

    .company-trust {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
        width: 100%;
        margin-top: 35px;
    }

        .company-trust > div {
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 4px;
        }

        .company-trust strong {
            font-size: 22px;
        }

        .company-trust span {
            font-size: 10px;
            white-space: nowrap;
        }
    /* =====================================================
           ENTERPRISE VISUAL
        ===================================================== */

    .enterprise-visual {
        width: 100%;
        min-height: 330px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .system-card {
        width: 100%;
        max-width: 500px;
        padding: 18px;
        border-radius: 22px;
    }

    *,
    *::before,
    *::after {
        box-sizing: border-box;
    }
    /* top */

    .card-top {
        gap: 8px;
        flex-wrap: wrap;
    }

        .card-top span {
            font-size: 11px;
        }

        .card-top small {
            font-size: 8px;
        }
    /* architecture */

    .architecture {
        margin-top: 20px;
    }

    .node.main {
        padding: 14px;
        border-radius: 15px;
    }

        .node.main span {
            font-size: 13px;
        }

        .node.main small {
            font-size: 8px;
        }
    /* modules */

    .nodes {
        grid-template-columns: repeat(2, 1fr);
        gap: 9px;
        margin-top: 12px;
    }

    .module {
        min-height: 75px;
        padding: 10px 7px;
        border-radius: 13px;
    }

        .module .icon {
            font-size: 15px;
        }

        .module strong {
            font-size: 10px;
        }

        .module small {
            font-size: 7px;
        }
    /* online */

    .online {
        margin-top: 15px;
        font-size: 9px;
    }
    /* =====================================================
           PRODUCTS
        ===================================================== */

    .products-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .products-grid {
        grid-template-columns: 1fr;
        gap: 18px;
    }

    .vishar-product-card {
        border-radius: 22px;
        border-width: 1px;
    }
    /* visual */

    .vishar-product-visual {
        height: 205px;
    }

    .vishar-product-window {
        width: 84%;
        border-radius: 14px;
        transform: perspective(800px) rotateX(2deg) rotateY(-2deg);
    }

    .vishar-product-window-top {
        height: 30px;
        padding: 0 10px;
    }

        .vishar-product-window-top span {
            font-size: 7px;
        }

    .window-dots {
        gap: 4px;
    }

        .window-dots i {
            width: 6px;
            height: 6px;
        }
    /* dashboard */

    .vishar-product-dashboard {
        padding: 10px;
    }

    .dashboard-header {
        margin-bottom: 9px;
    }

        .dashboard-header span {
            height: 5px;
        }

    .dashboard-main {
        gap: 8px;
    }

    .dashboard-sidebar {
        width: 22px;
        gap: 6px;
    }

        .dashboard-sidebar i {
            height: 6px;
        }

    .dashboard-line {
        height: 6px;
        margin-bottom: 6px;
    }

    .dashboard-boxes {
        gap: 5px;
        margin-top: 10px;
    }

        .dashboard-boxes span {
            height: 38px;
        }
    /* product content */

    .vishar-product-content {
        padding: 22px 20px 24px;
    }

    .vishar-product-number {
        font-size: 9px;
        margin-bottom: 8px;
    }

    .vishar-product-content h3 {
        font-size: 22px;
        margin-bottom: 9px;
    }

    .vishar-product-content p {
        font-size: 12.5px;
        line-height: 2;
    }

    .vishar-product-tags {
        gap: 6px;
        margin-top: 15px;
    }

        .vishar-product-tags span {
            font-size: 10px;
            padding: 4px 9px;
        }

    .vishar-product-link {
        font-size: 12px;
        margin-top: 17px;
    }
    /* =====================================================
           KAF
        ===================================================== */

    .kaf-interface {
        width: 82%;
        padding: 14px;
        border-radius: 15px;
    }

    .kaf-top {
        padding-bottom: 10px;
    }

        .kaf-top span {
            font-size: 18px;
        }

        .kaf-top small {
            font-size: 7px;
        }

    .kaf-table {
        gap: 5px;
        margin-top: 12px;
    }

    .kaf-table-item {
        height: 40px;
        border-radius: 7px;
        font-size: 8px;
    }

    .kaf-order {
        margin-top: 10px;
    }

        .kaf-order div {
            height: 6px;
            margin-bottom: 5px;
        }
    /* =====================================================
           SERVICES
        ===================================================== */

    .services-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .services-layout {
        display: flex;
        flex-direction: column;
        gap: 20px;
    }
    /* intro */

    .services-intro {
        padding: 25px 22px;
        border-radius: 22px;
    }

    .services-number {
        font-size: 10px;
        margin-bottom: 30px;
    }

    .services-intro h3 {
        font-size: 24px;
        line-height: 1.7;
    }

    .services-intro p {
        font-size: 12.5px;
        line-height: 2;
    }

    .services-line {
        margin: 25px 0 15px;
    }

    .services-label {
        font-size: 8px;
    }
    /* service items */

    .services-list {
        gap: 9px;
    }

    .service-item {
        display: grid;
        grid-template-columns: 28px 42px minmax(0, 1fr);
        gap: 10px;
        padding: 14px;
        border-radius: 16px;
    }

    .service-item-number {
        font-size: 8px;
    }

    .service-item-icon {
        width: 42px;
        height: 42px;
        border-radius: 11px;
        font-size: 14px;
    }

    .service-item-content {
        min-width: 0;
    }

        .service-item-content h3 {
            font-size: 13px;
            line-height: 1.7;
            margin-bottom: 3px;
        }

        .service-item-content p {
            font-size: 10.5px;
            line-height: 1.8;
        }

    .service-item-arrow {
        display: none;
    }
    /* =====================================================
           INSIGHTS
        ===================================================== */

    .insights-section {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .insights-grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 14px;
    }

    .insight-card {
        min-width: 0;
        border-radius: 20px;
    }

        .insight-card.featured {
            grid-column: auto;
        }

    .insight-content {
        padding: 20px;
    }

    .insight-top {
        padding: 13px 20px;
    }

        .insight-top span {
            font-size: 9px;
        }

    .insight-content .tag {
        font-size: 9px;
    }

    .insight-content h3 {
        font-size: 16px;
        line-height: 1.8;
    }

    .insight-content p {
        font-size: 11px;
        line-height: 2;
    }

    .insight-meta {
        font-size: 9px;
        gap: 10px;
    }
    /* =====================================================
           SWIPER
        ===================================================== */

    .vishar-slider {
        overflow: hidden;
    }

        .vishar-slider .swiper {
            width: 100%;
        }

        .vishar-slider .swiper-slide {
            width: 100%;
        }
}


/* =========================================================
       SMALL MOBILE
    ========================================================= */

@media (max-width: 480px) {

    .container {
        width: calc(100% - 24px);
    }
    /* HERO */

    .enterprise-hero {
        padding-top: 50px;
    }

    .hero-content h1 {
        font-size: 28px;
        line-height: 1.7;
    }

    .hero-content .lead {
        font-size: 12px;
        line-height: 2.1;
    }

    .hero-actions {
        margin-top: 20px;
    }

        .hero-actions .btn {
            min-height: 46px;
            font-size: 12px;
        }
    /* TRUST */

    .company-trust {
        margin-top: 28px;
    }

        .company-trust strong {
            font-size: 20px;
        }

        .company-trust span {
            font-size: 9px;
        }
    /* VISUAL */

    .enterprise-visual {
        min-height: 290px;
    }

    .system-card {
        padding: 13px;
        border-radius: 18px;
    }

    .card-top span {
        font-size: 9px;
    }

    .card-top small {
        font-size: 7px;
    }

    .node.main {
        padding: 11px;
    }

        .node.main span {
            font-size: 11px;
        }

    .nodes {
        gap: 6px;
    }

    .module {
        min-height: 64px;
        padding: 7px 5px;
    }

        .module strong {
            font-size: 8px;
        }

        .module small {
            font-size: 6px;
        }

    .online {
        font-size: 7px;
    }
    /* PRODUCTS */

    .products-section {
        padding-top: 45px;
        padding-bottom: 45px;
    }

    .vishar-product-visual {
        height: 180px;
    }

    .vishar-product-window {
        width: 88%;
    }

    .vishar-product-content {
        padding: 18px;
    }

        .vishar-product-content h3 {
            font-size: 20px;
        }

        .vishar-product-content p {
            font-size: 11.5px;
        }
    /* SERVICES */

    .services-intro {
        padding: 22px 18px;
    }

        .services-intro h3 {
            font-size: 21px;
        }

        .services-intro p {
            font-size: 11.5px;
        }

    .service-item {
        grid-template-columns: 25px 38px minmax(0, 1fr);
        padding: 12px;
        gap: 8px;
    }

    .service-item-icon {
        width: 38px;
        height: 38px;
        font-size: 12px;
    }

    .service-item-content h3 {
        font-size: 12px;
    }

    .service-item-content p {
        font-size: 9.5px;
    }
    /* INSIGHTS */

    .insights-section {
        padding-top: 45px;
        padding-bottom: 45px;
    }

    .insight-content {
        padding: 17px;
    }

        .insight-content h3 {
            font-size: 14px;
        }

        .insight-content p {
            font-size: 10px;
        }
}