a{text-decoration-thickness:1px!important;text-underline-offset:.1em}:where(.wp-site-blocks :focus){outline-style:solid;outline-width:2px}.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child){margin-bottom:3px}.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content{outline-offset:4px}.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content{outline-offset:0}blockquote,caption,figcaption,h1,h2,h3,h4,h5,h6,p{text-wrap:pretty}.more-link{display:block}:where(pre){overflow-x:auto}html{scroll-behavior:auto!important;-webkit-overflow-scrolling:touch}body{overflow-x:hidden;text-rendering:optimizeSpeed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.elementor-section,.elementor-container,.elementor-widget-wrap,.elementor-element,.elementor-motion-effects-element,.elementor-motion-effects-layer,.elementor-background-video-container,.ekit-wid-con,video,iframe{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);-webkit-backface-visibility:hidden;backface-visibility:hidden;-webkit-perspective:1000px;perspective:1000px}.elementor-section:not(:first-child),.elementor-top-section:not(:first-child){content-visibility:auto;contain-intrinsic-size:1px 600px}.elementor-background-video-container video,video.elementor-background-video-hosted{pointer-events:none!important;will-change:transform;transform:translateZ(0);-webkit-transform:translateZ(0)}
/*# sourceURL=https://capital.digitlayresourcehub.com/wp-content/themes/twentytwentyfive/style.min.css */

/* ========================================================== */


    /* =========================================
   RESET
========================================= */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}


/* =========================================
   GLOBAL
========================================= */

html {
    scroll-behavior: smooth;
}


body {
    font-family: 'Roboto', sans-serif;

    background: #CACACA;

    color: #222;

    overflow-x: hidden;
}


img {
    max-width: 100%;

    display: block;
}


a {
    text-decoration: none;
}


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

.container {

    width: 100%;

    max-width: 1320px;

    margin: auto;

    padding: 0 15px;

}


/* =========================================
   ABOUT SECTION
========================================= */

.about-section {

    position: relative;

    padding: 100px 0;

    background: #fff;

    overflow: hidden;

}


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

.about-top {

    text-align: center;

    margin-bottom: 70px;

}


/* =========================================
   SUBTITLE
========================================= */

.about-subtitle {

    display: inline-flex;

    align-items: center;

    gap: 10px;

    margin-bottom: 18px;

    font-family: 'Roboto', sans-serif;

    font-size: 18px;

    font-weight: 500;

    color: #7A7A7A;

}


.about-subtitle img {

    width: 18px;

    height: 18px;

}


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

.about-title {

    max-width: 820px;

    margin: auto;

    font-family: 'Roboto', sans-serif;

    font-size: 48px;

    font-weight: 500;

    line-height: 1.15;

    color: #1E1E1E;

}


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

.about-intro {

    max-width: 760px;

    margin: 22px auto 0;

    font-family: 'Roboto', sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 30px;

    color: #6F6F6F;

}


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

.about-wrapper {

    display: grid;

    grid-template-columns:
        1fr 1.15fr 1fr;

    gap: 22px;

    align-items: stretch;

}


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

.about-card {

    background: #F6F7FA;

    border-radius: 32px;

    padding: 40px;

    min-height: 430px;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    position: relative;

    border: 1px solid transparent;

    transition:
        transform .35s ease,
        box-shadow .35s ease;

    will-change: transform;

    backface-visibility: hidden;

    transform: translateZ(0);

}


/* =========================================
   CARD HOVER
========================================= */

.about-card:hover {

    transform:
        translate3d(0, -10px, 0);

    box-shadow:
        0 25px 45px rgba(0,0,0,.08);

}


.about-card:hover .about-heading {

    color: #0057A8;

}


.about-card:hover .about-number {

    color: #0066D6;

}


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

.about-icon {

    width: 68px;

    height: 68px;

    border-radius: 18px;

    background: #fff;

    display: flex;

    align-items: center;

    justify-content: center;

    margin-bottom: 50px;

    box-shadow:
        0 10px 25px rgba(0,0,0,.05);

    transition:
        transform .35s ease;

}


.about-card:hover .about-icon {

    transform:
        rotate(8deg)
        scale(1.05);

}


.about-icon img {

    width: 34px;

}


/* =========================================
   NUMBER
========================================= */

.about-number {

    font-family: 'Roboto', sans-serif;

    font-size: 48px;

    font-weight: 700;

    color: #004D99;

    line-height: 1;

    margin-bottom: 20px;

    transition:
        color .35s ease;

}


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

.about-heading {

    font-family: 'Roboto', sans-serif;

    font-size: 22px;

    font-weight: 700;

    line-height: 1.35;

    color: #1E1E1E;

    min-height: 60px;

    display: flex;

    align-items: flex-start;

    margin-bottom: 18px;

    transition:
        color .35s ease;

}


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

.about-text {

    flex: 1;

    font-family: 'Roboto', sans-serif;

    font-size: 16px;

    font-weight: 400;

    line-height: 28px;

    color: #727272;

}


/* =========================================
   CENTER IMAGE
========================================= */

.about-image {

    position: relative;

    overflow: hidden;

    border-radius: 32px;

    height: 430px;

}


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

.about-image > img {

    width: 100%;

    height: 100%;

    object-fit: cover;

    transition:
        transform .8s ease;

}


/* =========================================
   IMAGE HOVER
========================================= */

.about-image:hover > img {

    transform:
        scale(1.08);

}


/* =========================================
   IMAGE OVERLAY
========================================= */

.image-overlay {

    position: absolute;

    left: 25px;

    bottom: 25px;

    display: flex;

    align-items: center;

    gap: 15px;

    padding: 18px 22px;

    border-radius: 18px;

    background:
        rgba(18,82,146,.35);

    backdrop-filter:
        blur(18px);

    -webkit-backdrop-filter:
        blur(18px);

    border:
        1px solid rgba(255,255,255,.15);

}


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

.overlay-icon {

    width: 106px;

    height: 40px;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    flex-shrink: 0;

}


.overlay-icon img {

    width: 60px;

}


/* =========================================
   OVERLAY CONTENT
========================================= */

.overlay-content h3 {

    font-family: 'Roboto', sans-serif;

    font-size: 36px;

    font-weight: 700;

    color: #fff;

    margin-bottom: 4px;

}


.overlay-content p {

    font-family: 'Roboto', sans-serif;

    font-size: 16px;

    font-weight: 500;

    color: #fff;

}


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

.about-bottom {

    max-width: 980px;

    margin: 60px auto 0;

    text-align: center;

}


.about-bottom p {

    font-family: 'Roboto', sans-serif;

    font-size: 17px;

    font-weight: 400;

    line-height: 30px;

    color: #6F6F6F;

    margin-bottom: 35px;

}


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

.about-btn {
    display: inline-flex !important;
    align-items: stretch !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    border: none !important;
    outline: none !important;
    height: 52px !important;
    box-shadow: 0 4px 14px rgba(0, 87, 168, 0.15) !important;
    transition: all 0.35s ease !important;
    cursor: pointer !important;
}

.about-btn .btn-text {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 0 28px !important;
    background: #0057A8 !important;
    background-color: #0057A8 !important;
    color: #ffffff !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    border-radius: 8px 0 0 8px !important;
    border: none !important;
    text-decoration: none !important;
    transition: background-color 0.35s ease, color 0.35s ease !important;
    box-sizing: border-box !important;
}

.about-btn .btn-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    background: #EDF4FB !important;
    background-color: #EDF4FB !important;
    border-radius: 0 8px 8px 0 !important;
    border: none !important;
    transition: background-color 0.35s ease !important;
    box-sizing: border-box !important;
}

.about-btn .btn-icon img {
    width: 16px !important;
    height: auto !important;
    max-width: 16px !important;
    display: block !important;
    filter: none !important;
    transition: transform 0.35s ease, filter 0.35s ease !important;
}

.about-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 62, 121, 0.25) !important;
    text-decoration: none !important;
}

.about-btn:hover .btn-text {
    background: #003E79 !important;
    background-color: #003E79 !important;
    color: #ffffff !important;
}

.about-btn:hover .btn-icon {
    background: #0057A8 !important;
    background-color: #0057A8 !important;
}

.about-btn:hover .btn-icon img {
    transform: translateX(5px) !important;
    filter: brightness(0) invert(1) !important;
}

/* =========================================
   IMAGE SHINE
========================================= */

.about-image::before {

    content: "";

    position: absolute;

    top: 0;

    left: -120%;

    width: 60%;

    height: 100%;

    background:
        linear-gradient(
            120deg,
            transparent,
            rgba(255,255,255,.35),
            transparent
        );

    transform:
        skewX(-25deg);

    transition:
        left 1s ease;

    z-index: 2;

    pointer-events: none;

}


.about-image:hover::before {

    left: 160%;

}


/* =========================================
   DASHED LINES
========================================= */

.about-card.left-card::after {

    content: "";

    position: absolute;

    top: 50%;

    right: -82px;

    width: 82px;

    border-top:
        2px dashed #1E88E5;

    transform:
        translateY(-50%);

}


.about-card.right-card::before {

    content: "";

    position: absolute;

    top: 50%;

    left: -82px;

    width: 82px;

    border-top:
        2px dashed #1E88E5;

    transform:
        translateY(-50%);

}


/* =========================================
   SCROLL ANIMATION
   DUPLICATES REMOVED
========================================= */

.reveal,
.fade-left,
.fade-right,
.zoom {

    opacity: 0;

    will-change:
        transform,
        opacity;

    transition:
        opacity .8s ease,
        transform .8s cubic-bezier(.22,.61,.36,1);

}


/* Starting position */

.reveal {

    transform:
        translate3d(0,60px,0);

}


.fade-left {

    transform:
        translate3d(-60px,0,0);

}


.fade-right {

    transform:
        translate3d(60px,0,0);

}


.zoom {

    transform:
        scale(.9);

}


/* Active */

.reveal.active,
.fade-left.active,
.fade-right.active,
.zoom.active {

    opacity: 1;

    transform:
        translate3d(0,0,0)
        scale(1);

}


/* =========================================
   TABLET 1199px
   SAME VALUES
========================================= */

@media (max-width:1199px) {

    .container {

        max-width: 1140px;

    }


    .about-wrapper {

        gap: 18px;

    }


    .about-title {

        font-size: 42px;

    }


    .about-intro {

        max-width: 700px;

        font-size: 16px;

        line-height: 28px;

    }


    .about-card {

        padding: 35px;

        min-height: 400px;

    }


    .about-icon {

        width: 64px;

        height: 64px;

        margin-bottom: 40px;

    }


    .about-number {

        font-size: 44px;

    }


    .about-heading {

        font-size: 20px;

        min-height: 56px;

    }


    .about-text {

        font-size: 15px;

        line-height: 26px;

    }


    .about-image {

        height: 400px;

    }

}


/* =========================================
   TABLET 991px
========================================= */

@media (max-width:991px) {

    .about-section {

        padding: 80px 0;

    }


    .about-wrapper {

        grid-template-columns: 1fr;

        gap: 30px;

    }


    .about-card {

        min-height: auto;

        padding: 35px;

    }


    .about-image {

        height: 500px;

        order: 2;

    }


    .left-card {

        order: 1;

    }


    .right-card {

        order: 3;

    }


    .about-card.left-card::after,
    .about-card.right-card::before {

        display: none;

    }


    .about-bottom {

        margin-top: 45px;

    }

}


/* =========================================
   MOBILE 767px
========================================= */

@media (max-width:767px) {

    .about-section {

        padding: 70px 0;

    }


    .container {

        padding: 0 20px;

    }


    .about-top {

        margin-bottom: 45px;

    }


    .about-title {

        font-size: 34px;

        line-height: 1.25;

    }


    .about-intro {

        font-size: 15px;

        line-height: 28px;

        margin-top: 18px;

    }


    .about-card {

        padding: 28px;

        border-radius: 24px;

    }


    .about-icon {

        width: 60px;

        height: 60px;

        margin-bottom: 35px;

    }


    .about-icon img {

        width: 30px;

    }


    .about-number {

        font-size: 42px;

    }


    .about-heading {

        font-size: 22px;

        min-height: auto;

    }


    .about-text {

        font-size: 15px;

        line-height: 28px;

    }


    .about-image {

        height: 380px;

        border-radius: 24px;

    }


    .image-overlay {

        left: 15px;

        right: 15px;

        bottom: 15px;

        padding: 15px;

        gap: 12px;

    }


    .overlay-icon {

        width: 48px;

        height: 48px;

    }


    .overlay-icon img {

        width: 28px;

    }


    .overlay-content h3 {

        font-size: 28px;

    }


    .overlay-content p {

        font-size: 14px;

    }


    .about-bottom p {

        font-size: 15px;

        line-height: 28px;

    }


    .btn-text {

        padding: 14px 22px;

        font-size: 15px;

    }


    .btn-icon {

        width: 50px;

        height: 50px;

    }


    .fade-left,
    .fade-right {

        transform:
            translate3d(0,40px,0);

    }

}


/* =========================================
   SMALL MOBILE 480px
========================================= */

@media (max-width:480px) {

    .about-section {

        padding: 60px 0;

    }


    .container {

        padding: 0 15px;

    }


    .about-title {

        font-size: 28px;

    }


    .about-intro {

        font-size: 14px;

        line-height: 26px;

    }


    .about-card {

        padding: 22px;

        border-radius: 20px;

    }


    .about-icon {

        width: 54px;

        height: 54px;

        border-radius: 14px;

        margin-bottom: 28px;

    }


    .about-icon img {

        width: 26px;

    }


    .about-number {

        font-size: 38px;

    }


    .about-heading {

        font-size: 20px;

    }


    .about-text {

        font-size: 14px;

        line-height: 26px;

    }


    .about-image {

        height: 300px;

        border-radius: 20px;

    }


    .image-overlay {

        padding: 12px;

    }


    .overlay-icon {

        width: 42px;

        height: 42px;

    }


    .overlay-content h3 {

        font-size: 22px;

    }


    .overlay-content p {

        font-size: 13px;

    }


    .about-bottom p {

        font-size: 14px;

        line-height: 26px;

    }


    .btn-text {

        font-size: 14px;

        padding: 12px 18px;

    }


    .btn-icon {

        width: 46px;

        height: 46px;

    }

}


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

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

    .reveal,
    .fade-left,
    .fade-right,
    .zoom {

        opacity: 1 !important;

        transform: none !important;

        transition: none !important;

    }

}

/* ========================================================== */

/*==================================================
GOOGLE FONTS
==================================================*/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600&family=Montserrat:wght@400;500&display=swap');

/*==================================================
RESET
==================================================*/
*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

html{
    scroll-behavior:smooth;
}

body{
    margin:0;
    font-family:'Roboto';
    background:transparent;
    overflow-x:hidden;
}
.section-heading{
    overflow:hidden;
}

.heading-subtitle,
.section-heading h2,
.section-heading p{
    will-change: transform, opacity;
}

.heading-subtitle span {
    font-family: 'Roboto';
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #6A6A6A;
}
img{
    max-width:100%;
    display:block;
}

a{
    text-decoration:none;
}

.section-heading{

    overflow:hidden;

}

.heading-subtitle,
.heading-subtitle,
.section-heading h2,
.section-heading p{

    opacity:0;
    will-change:transform,opacity;

}

/* Initial Position */

.heading-subtitle{
    transform:translateX(-80px);
    transition:all .8s ease;
}

.section-heading h2{
    transform:translateX(80px);
    transition:all 1s ease;
}

.section-heading p{
    transform:translateY(40px);
    transition:all .8s ease;
}

/* Active */

.section-heading.active .heading-subtitle{
    opacity:1;
    transform:translateX(0);
}

.section-heading.active h2{
    opacity:1;
    transform:translateX(0);
    transition-delay:.15s;
}

.section-heading.active p{
    opacity:1;
    transform:translateY(0);
    transition-delay:.3s;
}

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

.product-slider{
    width:100%;
    padding:70px 10px 40px;
    overflow:hidden;
    
}

/* Fix Swiper Layout */

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

.product-slider .swiper-wrapper{
    display:flex !important;
    align-items:stretch;
}

.product-slider .swiper-slide{
    flex-shrink:0;
    height:auto;
    padding:0;
}

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

.section-heading{
    max-width:900px;
    margin:0 auto 55px;
    text-align:center;
}

.heading-subtitle{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;
    margin-bottom:15px;
}

.heading-subtitle img{
    width:18px;
    height:18px;
}

.heading-subtitle span{
    font-family:'Roboto';
    font-size:14px;
    font-weight:400;
    color:#6A6A6A;
}

.section-heading h2{
    font-family:'Montserrat';
    font-size:48px;
    font-weight:500;
    color:#1F1F1F;
    line-height:1.15;
    margin-bottom:18px;
}

.section-heading p{
    max-width:760px;
    margin:auto;
    font-family:'Roboto';
    font-size:16px;
    font-weight:400;
    color:#5F5F5F;
    line-height:1.7;
}

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

.product-card{
    background:linear-gradient(180deg,#F6FBFF 0%,#EAF4FA 100%);
    border-radius:22px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    height:100%;
    min-height:480px;
    transition:all .45s cubic-bezier(.22,.61,.36,1);
   
}

.product-card:hover{
    transform:translateY(-8px);
    box-shadow:
    rgba(50,50,93,.30) 0 18px 35px,
    rgba(0,0,0,.12) 0 10px 20px;
}

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

.product-img{
    width:100%;
    height:240px;
    overflow:hidden;
}

.product-img img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:transform .7s ease;
}

.product-card:hover .product-img img{
    transform:scale(1.08);
}

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

.product-content{
    padding:22px;
    display:flex;
    flex-direction:column;
    flex:1;
}

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

.product-content h3{
    font-family:'Roboto';
    font-size:22px;
    font-weight:500;
    color:#1F1F1F;
    line-height:1.35;
    margin-bottom:12px;
    min-height:60px;
    transition:.35s;
}

.product-card:hover h3{
    color:#005B96;
}

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

.product-content p{
    font-family:'Roboto';
    font-size:16px;
    font-weight:400;
    color:#4B4B4B;
    line-height:1.7;
    margin-bottom:28px;
    flex:1;

    display:-webkit-box;
    -webkit-line-clamp:3;
    -webkit-box-orient:vertical;
    overflow:hidden;
}

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

.read-more-btn{
    display:inline-flex;
    align-items:center;
    margin-top:auto;
    border-radius:6px;
    overflow:hidden;
    transition:all .45s cubic-bezier(.22,.61,.36,1);
}

.read-more-btn span{
    background:#005B96;
    color:#fff;
    padding:17px 20px;
    font-family:'Roboto';
    font-size:13px;
    font-weight:500;
    line-height:1;
    transition:all .45s cubic-bezier(.22,.61,.36,1);
}

.btn-arrow{
    width:42px;
    height:42px;
    background:#fff;
    border:1px solid #E5E5E5;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all .45s cubic-bezier(.22,.61,.36,1);
}

.btn-arrow img{
    width:16px;
    height:16px;
    transition:all .45s cubic-bezier(.22,.61,.36,1);
}

.read-more-btn:hover{
    transform:translateY(-3px);
}

.read-more-btn:hover span{
    letter-spacing:.5px;
}

.read-more-btn:hover .btn-arrow{
    transform:translateY(-5px);
    box-shadow:0 12px 25px rgba(0,0,0,.12);
}

.read-more-btn:hover .btn-arrow img{
    transform:translateX(6px);
}

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

@media (max-width:1200px){

    .section-heading h2{
        font-size:48px;
    }

    .product-card{
        min-height:460px;
    }

}

@media (max-width:1024px){

    .product-slider{
        padding:60px 15px;
    }

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

    .product-img{
        height:220px;
    }

    .product-card{
        min-height:450px;
    }

}

@media (max-width:767px){

    .product-slider{
        padding:50px 15px;
    }

    .section-heading{
        margin-bottom:40px;
    }

    .heading-subtitle img{
        width:16px;
        height:16px;
    }

    .heading-subtitle span{
        font-size:13px;
    }

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

    .section-heading p{
        font-size:15px;
        line-height:1.6;
    }

    .product-card{
        min-height:auto;
    }

    .product-img{
        height:220px;
    }

    .product-content{
        padding:18px;
    }

    .product-content h3{
        font-size:20px;
        min-height:auto;
    }

    .product-content p{
        font-size:15px;
        -webkit-line-clamp:unset;
        display:block;
    }

}

@media (max-width:575px){

    .product-slider{
        padding:45px 10px;
    }

    .section-heading{
        margin-bottom:30px;
    }

    .section-heading h2{
        font-size:28px;
    }

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

    .product-img{
        height:200px;
    }

    .product-content{
        padding:16px;
    }

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

    .product-content p{
        font-size:14px;
        line-height:1.6;
    }

    .read-more-btn span{
        padding:10px 16px;
        font-size:12px;
    }

    .btn-arrow{
        width:38px;
        height:38px;
    }

    .btn-arrow img{
        width:14px;
        height:14px;
    }

}

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

.section-heading{
    overflow:hidden;
}

.heading-subtitle,
.section-heading h2,
.section-heading p{

    opacity:0;
    will-change:transform,opacity;

}

.heading-subtitle{

    transform:translateX(-80px);
    transition:all .8s ease;

}

.section-heading h2{

    transform:translateX(80px);
    transition:all .9s ease;

}

.section-heading p{

    transform:translateY(40px);
    transition:all .8s ease;

}

/* Active */

.section-heading.active .heading-subtitle{

    opacity:1;
    transform:translateX(0);

}

.section-heading.active h2{

    opacity:1;
    transform:translateX(0);
    transition-delay:.15s;

}

.section-heading.active p{

    opacity:1;
    transform:translateY(0);
    transition-delay:.3s;

}

/* ========================================================== */

/*==================================================
IMPORT FONT
==================================================*/

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600;700&display=swap');

/*==================================================
RESET
==================================================*/

.why-section,
.why-section *{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

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

.why-section{

    position:relative;

    width:100%;

    overflow:hidden;

    padding:0px 0;

    font-family:'Roboto';

}

/*==================================================
BACKGROUND VIDEO
==================================================*/

.why-video{

    position:absolute;

    top:0;

    left:0;

    width:100%;

    height:100%;

    object-fit:cover;

    object-position:center center;

    z-index:1;

    pointer-events:none;

}

/*==================================================
OVERLAY
==================================================*/

.why-overlay{

    position:absolute;

    inset:0;

    background:rgba(5,18,36,.60);

    z-index:2;

}

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

.why-container{

    position:relative;

    z-index:5;

    width:100%;

    max-width:1600px;

    margin:0 auto;

    padding: 100px;

    display:grid;

    grid-template-columns:520px 1fr;

    gap:24px;

    align-items:stretch;

}

/*==================================================
LEFT CARD
==================================================*/

.why-left-card{

    position:relative;

    background:#D5ECF6;

    border-radius:20px;

    padding:45px;

    overflow:hidden;

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

}

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

.why-left-card h2{

    font-size:48px;

    font-weight:500;

    line-height:1.2;

    color:#323232;

    margin-bottom:22px;

}

/*==================================================
PARAGRAPH
==================================================*/

.why-left-card p{

    font-size:14px;

    line-height:1.8;

    color:#58626D;

    max-width:360px;

}

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

.why-btn{

    display:inline-flex;

    align-items:center;

    text-decoration:none;

    margin-top:35px;

    width:max-content;

}

.btn-text{

    background:#0094E8;

    color:#fff;

    height:48px;

    padding:0 24px;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:10px 0 0 10px;

    font-size:15px;

    font-weight:500;

}

.btn-arrow{

    width:48px;

    height:48px;

    background:#fff;

    display:flex;

    align-items:center;

    justify-content:center;

    border-radius:0 10px 10px 0;

}

.btn-arrow img{

    width:14px;

}

/*==================================================
LIGHTNING IMAGE
==================================================*/

.why-shape{

    position:absolute;

    right:0;

    bottom:0;

    width:180px;

    pointer-events:none;

}

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

.why-left-card{

    transition:.35s;

}

.why-left-card:hover{

    transform:translateY(-6px);

    box-shadow:0 20px 45px rgba(0,0,0,.18);

}

/*=========================================
RIGHT GRID
=========================================*/

.why-right-grid{

    display:grid;

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

    gap:24px;

}

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

.why-card{

    background:#ffffff;

    border-radius:20px;

    padding:35px;

    position:relative;

    overflow:hidden;

    min-height:220px;

    transition:.35s ease;

    box-shadow:0 12px 30px rgba(0,0,0,.08);

    display:flex;

    flex-direction:column;

    justify-content:flex-start;

}

.why-card:hover{

    transform:translateY(-8px);

    box-shadow:0 20px 45px rgba(0,0,0,.18);

}

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

.why-icon{

    width:46px;

    height:56px;

    object-fit:contain;

    margin-bottom:24px;

    transition:.35s;

}

.why-card:hover .why-icon{

    transform:scale(1.08);

}

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

.why-card h3{

    font-size:25px;

    font-weight:500;

    color:#323232;

    line-height:1.25;

    margin-bottom:15px;

}

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

.why-card p{

    font-size:14px;

    line-height:1.8;

    color:#5C6670;

}



/*=========================================
LIGHT EFFECT
=========================================*/

.why-card::before{

    content:"";

    position:absolute;

    top:-60%;

    left:-60%;

    width:220px;

    height:220px;

    border-radius:50%;

    background:rgba(213,236,246,.45);

    transition:.45s;

}

.why-card:hover::before{

    transform:scale(1.3);

}

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

.why-btn{

    transition:.35s;

}

.btn-text{

    transition:.35s;

}

.btn-arrow{

    transition:.35s;

}

.btn-arrow img{

    transition:.35s;

}

.why-btn:hover .btn-text{

    background:#0078D4;

}

.why-btn:hover .btn-arrow{

    background:#0094E8;

}

.why-btn:hover .btn-arrow img{

    filter:brightness(0) invert(1);

    transform:translateX(4px);

}

/*=========================================
ELECTRIC CANVAS
=========================================*/

#electricCanvas{

    position:absolute;

    left:0;

    top:0;

    width:100%;

    height:100%;

    pointer-events:none;

    z-index:3;

    opacity:.8;

}

.why-container{

    position:relative;

    z-index:5;

}

/*=========================================
TABLET
=========================================*/

@media(max-width:1024px){

.why-container{

grid-template-columns:1fr;

padding:0 30px;

}

.why-right-grid{

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

}

.why-left-card{

padding:35px;

}

.why-left-card h2{

font-size:40px;

}

.why-card{

padding:28px;

min-height:200px;

}

}

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

@media(max-width:767px){

.why-section{

padding:60px 0;

}

.why-container{

padding:0 18px;

grid-template-columns:1fr;

gap:18px;

}

.why-right-grid{

grid-template-columns:1fr;

gap:18px;

}

.why-left-card{

padding:25px;

}

.why-left-card h2{

font-size:30px;

margin-bottom:18px;

}

.why-left-card p{

font-size:15px;

max-width:100%;

}

.why-card{

padding:22px;

min-height:auto;

}

.why-card h3{

font-size:24px;

}

.why-card p{

font-size:15px;

}

.why-icon{

width:46px;

height:46px;

margin-bottom:18px;

}

.btn-text{

height:44px;

padding:0 18px;

font-size:14px;

}

.btn-arrow{

width:44px;

height:44px;

}

.why-shape{

width:110px;

}

}

/*=========================================
LARGE SCREEN
=========================================*/

@media(min-width:1600px){

.why-container{

max-width:1700px;

}

.why-left-card{

padding:55px;

}

.why-left-card h2{

font-size:56px;

}

.why-card{

padding:40px;

}

.why-card h3{

font-size:34px;

}

}

/*=========================================
PREMIUM ENHANCEMENTS
=========================================*/

.why-section{
    isolation:isolate;
}

.why-video{
    filter:brightness(.55) contrast(1.1) saturate(1.1);
    transform:scale(1.03);
}

.why-overlay{
    background:linear-gradient(
        180deg,
        rgba(5,18,36,.45) 0%,
        rgba(5,18,36,.60) 40%,
        rgba(5,18,36,.75) 100%
    );
}

.why-left-card,
.why-card{
    backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
}

.why-card{
    border:1px solid rgba(255,255,255,.25);
}

.why-card:hover{
    border-color:#0094E8;
}

.why-btn{
    overflow:hidden;
}

.why-btn:hover{
    transform:translateY(-2px);
}

.btn-arrow{
    border-left:1px solid rgba(0,0,0,.08);
}

.why-card h3,
.why-left-card h2{
    letter-spacing:-0.5px;
}

.why-card p,
.why-left-card p{
    text-wrap:pretty;
}

.why-card,
.why-left-card,
.why-icon,
.why-btn,
.btn-arrow,
.btn-text{
    transition:all .35s ease;
}

/*=========================================
FIX IMAGE DISTORTION
=========================================*/

.why-icon img,
.why-shape{
    display:block;
    max-width:100%;
    height:auto;
}

/*=========================================
VIDEO ALWAYS SECTION HEIGHT
=========================================*/

.why-section{
    position:relative;
}

.why-video,
.why-overlay,
#electricCanvas{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
}

/*=========================================
STACKING ORDER
=========================================*/

.why-video{
    z-index:1;
}

.why-overlay{
    z-index:2;
}

#electricCanvas{
    z-index:3;
}

.why-container{
    position:relative;
    z-index:5;
}

/*=========================================
WHY SECTION SCROLL ANIMATION
=========================================*/

.why-left-card h2,
.why-left-card p,
.why-left-card .read-more-btn{

    opacity:0;

    transition:all .9s ease;

}

.why-left-card h2{

    transform:translateX(-80px);

}

.why-left-card p{

    transform:translateX(-60px);

    transition-delay:.15s;

}

.why-left-card .read-more-btn{

    transform:translateY(35px);

    transition-delay:.3s;

}

/* Active */

.why-left-card.active h2{

    opacity:1;

    transform:translateX(0);

}

.why-left-card.active p{

    opacity:1;

    transform:translateX(0);

}

.why-left-card.active .read-more-btn{

    opacity:1;

    transform:translateY(0);

}

/* ========================================================== */

/*=========================================
FLOATING WRAPPER
=========================================*/

.floating-wrapper{

    position:fixed;

    right:18px;

    top:50%;

    transform:translateY(-50%);

    display:flex;

    flex-direction:column;

    gap:8px;

    z-index:9999;

}

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

.float-item{

    position:relative;

    width:67px !important;

    height:65px !important;

    display:flex;

    align-items:center;

    justify-content:center;

    overflow:hidden;

    background:#0d7db8;

    color:#fff;

    border-radius:40px;

    text-decoration:none;

    box-shadow:0 10px 25px rgba(13,125,184,.28);

    transition:
    width .35s ease,
    transform .35s ease,
    box-shadow .35s ease,
    padding .35s ease,
    background .35s ease;

}

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

.float-item:hover{

    width:180px !important;

    justify-content:flex-start;

    padding-left:18px;

    transform:translateX(-8px);

    box-shadow:0 16px 35px rgba(13,125,184,.38);

    z-index:10;

}

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

.float-item i{

    font-size:20px;

    flex-shrink:0;

    transition:.35s ease;

}

.float-item:hover i{

    transform:scale(1.12) rotate(8deg);

}

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

.float-item span{

    position:absolute;

    left:52px;

    white-space:nowrap;

    font-size:13px;

    font-weight:500;

    color:#fff;

    opacity:0;

    pointer-events:none;

    transition:
    opacity .25s ease,
    left .35s ease;

}

.float-item:hover span{

    opacity:1;

    left:48px;

}

/*=========================================
SHINE EFFECT
=========================================*/

.float-item::before{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:40%;
    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.35),
        transparent
    );

    transform:skewX(-25deg);

    opacity:0;

    transition:left .7s ease, opacity .3s ease;

}

.float-item:hover::before{

    left:170%;

    opacity:1;

}

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

.float-item:nth-child(1){

    background:#0d7db8;

}

.float-item:nth-child(2){

    background:#0b72a8;

}

.float-item:nth-child(3){

    background:#095f8d;

}

.float-item:nth-child(1):hover{

    background:#1490d2;

}

.float-item:nth-child(2):hover{

    background:#1185c3;

}

.float-item:nth-child(3):hover{

    background:#0f72aa;

}

/*=========================================
ACTIVE
=========================================*/

.float-item:active{

    transform:translateX(-8px) scale(.96);

}

/*=========================================
TABLET
=========================================*/

@media(max-width:992px){

.floating-wrapper{

    gap:8px;

}

.float-item{

    width:52px;
    height:52px;

}

.float-item:hover{

    width:165px;

}

.float-item i{

    font-size:18px;

}

.float-item span{

    font-size:12px;

}

}

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

@media(max-width:768px){

.floating-wrapper{

    left:50%;

    right:auto;

    top:auto;

    bottom:15px;

    transform:translateX(-50%);

    flex-direction:row;

    gap:10px;

}

.float-item{

    width:50px;

    height:50px;

    border-radius:50%;

}

.float-item:hover{

    width:50px;

    padding-left:0;

    justify-content:center;

    transform:none;

}

.float-item span{

    display:none;

}

.float-item::before{

    display:none;

}

}

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

@media(max-width:400px){

.gt_float_switcher .gt-selected{

    margin-top:-3px;

}

.elementor-19 .elementor-element.elementor-element-0842368.elementor-element{

    --align-self:center;

    margin-top:-7px;

}

}

/* ========================================================== */

.tracking-section{
background:#eaf3f8;
padding:120px 6%;
}

.tracking-wrapper{
max-width:1400px;
margin:auto;
display:flex;
align-items:center;
gap:120px;
}

/* IMAGE AREA */

.image-area{
position:relative;
width:640px;
}

/* MAIN IMAGE */

.img-main{
width:640px;
height:420px;
object-fit:cover;
border-radius:28px;
display:block;
}

/* SMALL OVERLAP IMAGE */

.img-overlap{
position:absolute;

width:180px;
height:190px;

object-fit:cover;

right:-50px;
bottom:-40px;

border-radius:20px;
border:8px solid #fff;

box-shadow:0 20px 40px rgba(0,0,0,0.15);

z-index:5;
}

/* CONTENT */

.content-area{
max-width:520px;
}

.content-area h2{
font-size:48px;
line-height:1.2;
margin-bottom:15px;
color:#2d3748;
}

.content-area p{
color:#6b7280;
margin-bottom:40px;
}

/* STATS */

.stats{
display:flex;
gap:20px;
}

.stat-box{
flex:1;
background:#f3f4f6;
padding:28px;
border-radius:20px;
text-align:center;
}

.stat-box h3{
font-size:28px;
margin-bottom:6px;
}

.stat-box p{
font-size:14px;
color:#6b7280;
}

/* RESPONSIVE */

@media(max-width:992px){

.tracking-wrapper{
flex-direction:column;
text-align:center;
}

.image-area{
width:120%;
}

.img-main{
width:120%;
height:auto;
}

.img-overlap{
right:20px;
bottom:-30px;
}

.stats{
justify-content:center;
}
	

}

/* ========================================================== */

/* SECTION */
.tracking-section
 {
    position: relative;
    width: 100%;
    background:#eaf3f800 !important;
    padding: 120px 0;
    overflow: hidden;
}

/* background pattern */



/* container */

.tracking-container{
  position:relative;
  display:flex;
  gap:40px;
  align-items:center;
  padding:0 6%;
}

/* big image */

.tracking-left{
  flex:2;
}

.tracking-left img{
  width:100%;
  height:460px;
  object-fit:cover;
  border-radius:28px;
}

/* right image */

.tracking-right{
  flex:1;
}

.tracking-right img{
  width:100%;
  height:460px;
  object-fit:cover;
  border-radius:28px;
}

/* floating card */

.tracking-card{
  position:absolute;
  bottom:-60px;
  right:8%;
  width:420px;
  background:#d7e3ec;
  padding:35px;
  border-radius:25px;
  box-shadow:0 25px 50px rgba(0,0,0,.15);
}

.tracking-card h2{
  font-size:26px;
  line-height:1.3;
  margin-bottom:15px;
}

.tracking-card p{
  font-size:15px;
  color:#4a5568;
  line-height:1.6;
}

/* slider nav */

.tracking-nav{
  position:absolute;
  bottom:25px;
  left:50%;
  transform:translateX(-50%);
  background:#5f5f5f;
  padding:10px 18px;
  border-radius:30px;
  display:flex;
  align-items:center;
  gap:15px;
  color:#fff;
}

.tracking-nav .arrow{
  cursor:pointer;
  font-size:18px;
}

.tracking-nav .page{
  font-size:14px;
}

/* RESPONSIVE */

@media(max-width:992px){

  .tracking-container{
    flex-direction:column;
  }

  .tracking-left img,
  .tracking-right img{
    height:320px;
  }

  .tracking-card{
    position:relative;
    bottom:0;
    right:0;
    width:100%;
    margin-top:-40px;
  }

}

@media(max-width:576px){

  .tracking-left img,
  .tracking-right img{
    height:240px;
  }

  .tracking-card h2{
    font-size:20px;
  }

}

.tracking-section{
    position:relative;
    width:100%;
    background:#eaf3f8;
    padding:120px 0;
    overflow:hidden;
}

----------
/* SECTION */

.stats-section{
position:relative;
padding:120px 5%;
background:#eaf3f8;
overflow:hidden;
}

/* background pattern */

.stats-section::before{
content:"";
position:absolute;
top:0;
left:0;
width:400px;
height:400px;
background:url("https://capital.digitlayresourcehub.com/wp-content/uploads/2026/03/shape10-3.png") no-repeat;
background-size:contain;
opacity:.2;
}

.stats-section::after{
content:"";
position:absolute;
bottom:0;
right:0;
width:400px;
height:400px;
background:url("https://capital.digitlayresourcehub.com/wp-content/uploads/2026/03/shape10-3.png") no-repeat;
background-size:contain;
opacity:.2;
transform:rotate(180deg);
}

/* container */

.stats-container{
max-width:1400px;
margin:auto;
background:#c9ddea;
border-radius:40px;
padding:70px 40px;
display:flex;
align-items:center;
justify-content:space-between;
gap:20px;
}

/* stat */

.stat-item{
flex:1;
text-align:center;
opacity:0;
transform:translateY(40px);
transition:all .6s ease;
}

.stat-item.show{
opacity:1;
transform:translateY(0);
}

.stat-item h2{
font-size:46px;
font-weight:600;
color:#4a4a4a;
margin-bottom:10px;
}

.stat-item p{
font-size:18px;
color:#5f6b73;
}

/* divider */

.divider{
width:1px;
height:80px;
background:#6c889a;
opacity:.5;
}

/* hover */

.stat-item:hover{
transform:translateY(-6px);
}

/* responsive */

@media(max-width:1024px){

.stat-item h2{
font-size:36px;
}

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

}

@media(max-width:768px){

.stats-container{
flex-direction:column;
text-align:center;
}

.divider{
display:none;
}

.stat-item{
padding:20px 0;
}

}

@media(max-width:480px){

.stat-item h2{
font-size:28px;
}

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

}


------------------
.certification-section{
padding:120px 6%;
background:#f5f7f9;
}

.cert-container{
display:flex;
gap:60px;
align-items:center;
max-width:1400px;
margin:auto;
}

/* LEFT */

.cert-left{
flex:1;
}

.cert-left h2{
font-size:40px;
line-height:1.2;
color:#fff;
margin-bottom:20px;
}

.cert-left p{
font-size:16px;
color:#fff;
line-height:1.6;
max-width:420px;
}

/* SLIDER */

.cert-slider{
flex:2;
overflow:hidden;
}

.cert-track{
display:flex;
gap:30px;
transition:0.6s ease;
}

/* CARD */

.cert-card{
min-width:260px;
background:#065074;
padding:40px 20px;
border-radius:20px;
text-align:center;
}

.cert-card img{
width:120px;
margin-bottom:20px;
}

.cert-card h3{
font-size:22px;
color:#fff;
margin-bottom:8px;
}

.cert-card p{
font-size:14px;
color:#fff;
}

/* RESPONSIVE */

@media(max-width:992px){

.cert-container{
flex-direction:column;
}

.cert-left h2{
font-size:36px;
}

.cert-card{
min-width:220px;
}

}

.cert-slider{
flex:2;
overflow:hidden;
}

.cert-track{
display:flex;
gap:30px;
width:max-content;

animation:scrollSlider 20s linear infinite;
}

.cert-card{
min-width:260px;
background:#065074;
padding:40px 20px;
border-radius:20px;
text-align:center;
}

/* smooth infinite animation */

@keyframes scrollSlider{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}

.cert-slider{
flex:2;
overflow:hidden;
position:relative;
}

.cert-track{
display:flex;
gap:30px;
width:max-content;
animation:scrollSlider 20s linear infinite;
align-items:center;
}

/* default card */

.cert-card{
min-width:260px;
background:#c9ddea;
padding:40px 20px;
border-radius:20px;
text-align:center;

transform:scale(.85);
transition:all .4s ease;
position:relative;
z-index:1;
}

/* center card */

.cert-card.active{
transform:scale(1.15);
z-index:10; /* bring to front */
}

/* image */

.cert-card img{
width:120px;
margin-bottom:20px;
}

/* infinite animation */

@keyframes scrollSlider{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}

.features-section{
max-width:600px;
margin:auto;
padding:0px 20px;
}

/* item */

.feature-item{
display:flex;
align-items:center;
gap:16px;
margin-bottom:-10px;
}

/* icon */

.feature-icon{
width:40px;
height:40px;
border-radius:10px;
display:flex;
align-items:center;
justify-content:center;
flex-shrink:0;
}

.feature-icon
 {
    margin-top: 15px;
}

.feature-content p {
    line-height: 6px;
}

.feature-icon img{
width:40px;
height:42px !important;
}

/* text */

.feature-content h4{
font-size:18px;
font-weight:400;
color:#2d3748;
margin-bottom:4px;
font-family:'IBM Plex Sans', sans-serif;
}

.feature-content p{
font-size:15px;
color:#6b7280;
}

/* hover */

.feature-item:hover .feature-icon{
background:#c4dced;
transform:scale(1.05);
transition:0.3s;
}

/* responsive */

@media(max-width:600px){

.feature-content h4{
font-size:16px;
}

.feature-content p{
font-size:14px;
}

}


.cert-card {
    min-width: 260px;
    background: #065074;
}


----------------------

/* SECTION */

.why-section{

background:#0e4c68;
padding:120px 6%;

/* grid background */

background-image:
linear-gradient(rgba(255,255,255,0.06) 1px, transparent 1px),
linear-gradient(90deg, rgba(255,255,255,0.06) 1px, transparent 1px);

background-size:120px 120px;

}

.why-container{

max-width:1400px;
margin:auto;

display:flex;
gap:80px;
align-items:center;

}

/* LEFT */

.why-left{
flex:1;
color:white;
}

.why-left h2{
font-size:48px;
line-height:1.2;
margin-bottom:20px;
}

.why-left span{
font-weight:700;
}

.why-left p{
color:#cfe6f1;
margin-bottom:30px;
max-width:420px;
}

/* BUTTON */

.btn{

display:inline-block;
padding:12px 22px;

background:#1aa3d8;
color:white;

border-radius:8px;
text-decoration:none;

transition:0.3s;
}

.btn:hover{
background:#148ab7;
transform:translateY(-3px);
}

/* LINE */

.line{
width:250px;
height:1px;
background:#cfe6f1;
margin-top:40px;
opacity:.5;
}

/* RIGHT CARDS */

.why-cards{

flex:1.3;

display:grid;
grid-template-columns:repeat(2,1fr);
gap:30px;

}
@media (max-width: 400px){
.why-cards {
    padding-right: 15px;
    padding-left: 15px;
}
}
/* CARD */

.card{

padding:30px;

border-radius:16px;

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

border:1px solid rgba(255,255,255,0.25);

backdrop-filter:blur(8px);

color:white;

position:relative;

transition:.4s;

}

/* hover animation */

.card:hover{
transform:translateY(-8px);
box-shadow:0 20px 40px rgba(0,0,0,.25);
}

/* icon */

.icon{
font-size:28px;
margin-bottom:10px;
}

/* card text */

.card h3{
margin-bottom:10px;
font-size:19px;
}

.card p{
font-size:13px;
color:#cfe6f1;
}

/* corner line animation */

.card::before,
.card::after{

content:"";
position:absolute;
width:60px;
height:60px;
border:1px solid rgba(255,255,255,.4);

transition:.4s;

}

.card::before{
top:0;
left:0;
border-right:none;
border-bottom:none;
}

.card::after{
bottom:0;
right:0;
border-left:none;
border-top:none;
}

.card:hover::before{
width:100%;
height:100%;
opacity:.2;
}

.card:hover::after{
width:100%;
height:100%;
opacity:.2;
}

/* RESPONSIVE */

@media(max-width:1000px){

.why-container{
flex-direction:column;
text-align:center;
}

.why-cards{
grid-template-columns:1fr;
}

}

.card::before, .card::after {
    border: none;

}

.why-left h2 {
    font-size: 40px !important;
}

.why-left p {
    font-size: 16px !important;
}


.btn {
    font-size: 16px !important;
}

 .elementor-element-e571208{
overflow:hidden;
border-radius:20px;
}

 .elementor-element-e571208 img{
transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}

.elementor-element-e571208:hover img{
transform: scale(1.1);
}

 .elementor-element-e571208{
overflow:hidden;
border-radius:20px;
}

 .elementor-element-e571208 img{
transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}

.elementor-element-e571208:hover img{
transform: scale(1.1);
}


----------
.elementor-element-653e98f{
overflow:hidden;
border-radius:20px;
}

.elementor-element-653e98f img{
transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}

.elementor-element-653e98f:hover img{
transform: scale(1.1);
}

----------

 .elementor-element-4eb4686{
overflow:hidden;
border-radius:20px;
}

 .elementor-element-4eb4686 img{
transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}

.elementor-element-4eb4686:hover img{
transform: scale(1.1);
}

 .elementor-element-4eb4686{
overflow:hidden;
border-radius:20px;
}

 .elementor-element-4eb4686 img{
transition: transform .6s cubic-bezier(.25,.46,.45,.94);
}

.elementor-element-4eb4686:hover img{
transform: scale(1.1);
}
---------


.elementor-19 .elementor-element.elementor-element-938d182{
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;

transition: all .3s ease;
}

.elementor-19 .elementor-element.elementor-element-938d182:hover{
box-shadow: rgba(50, 50, 93, 0.35) 0px 20px 40px -5px,
rgba(0, 0, 0, 0.4) 0px 10px 20px -10px;

transform: translateY(-6px);
}

.elementor-widget-image img{
	padding: 0;
    margin: 0;
    width: 100%;
}
----------


.elementor-19 .elementor-element.elementor-element-40ff718{
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;

transition: all .3s ease;
}

.elementor-19 .elementor-element.elementor-element-40ff718:hover{
box-shadow: rgba(50, 50, 93, 0.35) 0px 20px 40px -5px,
rgba(0, 0, 0, 0.4) 0px 10px 20px -10px;

transform: translateY(-6px);
}
---------

.elementor-19 .elementor-element.elementor-element-78d1ccb {
box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px,
rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;

transition: all .3s ease;
}

.elementor-19 .elementor-element.elementor-element-78d1ccb:hover{
box-shadow: rgba(50, 50, 93, 0.35) 0px 20px 40px -5px,
rgba(0, 0, 0, 0.4) 0px 10px 20px -10px;

transform: translateY(-6px);
}

.elementor-19 .elementor-element.elementor-element-3747303:hover{
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.elementor-19 .elementor-element.elementor-element-8aea68f:hover{
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}
.elementor-19 .elementor-element.elementor-element-63ee324:hover{
	box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.elementor-element-8c38a99{
    padding: 0;
    margin: 0;
    width: 50%;
}

.elementor-element-ff5eff1{
    padding: 0;
    margin: 0;
    width: 50%;
}


----
.cert-track{
display:flex;
gap:30px;
width:max-content;
animation: sliderMove 20s linear infinite;
}

/* Hover par slider pause */

.cert-slider:hover .cert-track{
animation-play-state: paused;
}

@keyframes sliderMove{

0%{
transform: translateX(0);
}

100%{
transform: translateX(-50%);
}

}

.btn-icon {
    width: 56px;
    height: 50px !important;
}
.read-more-btn {
    display: inline-flex;
    align-items: center;
    margin-top: 20px !important;
}
.gt_float_switcher .gt-selected .gt-current-lang {
    padding: 10px 15px;
    color: #333;
    font-weight: bold;
    font-size: 18px;
    border-radius: -13px;
}


.floating-wrapper {
    margin-right: -22px;
}

.gt_float_switcher {
    box-shadow: none !important;
}

.cert-card.active {
    transform: scale(1);
    z-index: 10;
}

.btn {
    font-size: 13px !important;
}

.float-item i {
    font-size: 16px;
    margin-bottom: 10px;
}

@media (max-width: 480px){

.cert-left p{
 margin-left: 10px;
}
}

@media (max-width: 480px){

    .cert-left h2 {
padding-left: 10px;
}
}

.gt_float_switcher .gt-selected {
    margin-top: -3px;
}

.float-item i {
    font-size: 24px;
    margin-bottom: 10px;
}

.float-item {
    width: 75px;
    height: 73px;
}

.legrand-slider{
padding:60px;
background:#f3f3f3;
}

.slider-wrapper{
overflow:hidden;
position:relative;
cursor:grab;
}

.slider-track{
display:flex;
gap:30px;
overflow-x:auto;
scroll-behavior:smooth;
}

.slider-track::-webkit-scrollbar{
display:none;
}

.project-card{
min-width:420px;
height:360px;
border-radius:8px;
overflow:hidden;
position:relative;
flex-shrink:0;
}

.project-card img{
width:100%;
height:100%;
object-fit:cover;
transition:transform .4s ease;
}

/* circle title */

.circle-title{
position:absolute;
top:20px;
left:20px;
background:white;
width:140px;
height:140px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
font-weight:600;
font-size:14px;
}

/* overlay */

.card-overlay{
position:absolute;
bottom:0;
left:0;
right:0;
padding:25px;
color:white;
background:linear-gradient(transparent, rgba(0,0,0,.85));
opacity:0;
transform:translateY(20px);
transition:.3s;
}

.tag{
background:#444;
padding:5px 12px;
border-radius:20px;
font-size:12px;
display:inline-block;
margin-bottom:10px;
}

.btn{
display:inline-block;
margin-top:10px;
padding:8px 18px;
border:1px solid white;
border-radius:30px;
color:white;
text-decoration:none;
font-size:13px;
}

.location{
font-size:12px;
margin-top:10px;
}

/* hover */

.project-card:hover img{
transform:scale(1.08);
}

.project-card:hover .card-overlay{
opacity:1;
transform:translateY(0);
}

/* drag cursor */

.drag-circle{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
width:80px;
height:80px;
background:white;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
opacity:0;
pointer-events:none;
}

.slider-wrapper:hover .drag-circle{
opacity:1;
}

/* arrows */

.slider-nav{
margin-top:40px;
display:flex;
gap:15px;
}

.slider-nav button{
width:50px;
height:50px;
border-radius:50%;
border:1px solid #bbb;
background:white;
cursor:pointer;
}
.slider-wrapper{
overflow:hidden;
position:relative;
cursor:grab;
}

.slider-track{
display:flex;
gap:30px;
overflow-x:auto;
scroll-behavior:smooth;
cursor:grab;
user-select:none;
}

.slider-track:active{
cursor:grabbing;
}

.slider-track::-webkit-scrollbar{
display:none;
}

/* drag circle */

.drag-circle{
position:absolute;
width:80px;
height:80px;
background:white;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-weight:600;
pointer-events:none;
opacity:0;
transition:opacity .2s;
}

.slider-wrapper:hover .drag-circle{
opacity:1;
}

.legrand-slider{
padding:60px;
background:#f5f5f5;
}

.slider-track{
display:flex;
gap:30px;
overflow-x:auto;
scroll-behavior:smooth;
cursor:grab;
}

.slider-track::-webkit-scrollbar{
display:none;
}

.project-card{
min-width:380px;
height:340px;
border-radius:10px;
overflow:hidden;
position:relative;
flex-shrink:0;
}

.project-card img{
width:100%;
height:100%;
object-fit:cover;
transition:.4s;
}

.overlay{
position:absolute;
bottom:0;
left:0;
right:0;
padding:20px;
background:linear-gradient(transparent,rgba(0,0,0,.8));
color:white;
opacity:0;
transition:.3s;
}

.project-card:hover img{
transform:scale(1.08);
}

.project-card:hover .overlay{
opacity:1;
}

.slider-nav{
margin-top:30px;
display:flex;
gap:10px;
}

.slider-nav button{
width:50px;
height:50px;
border-radius:50%;
border:1px solid #aaa;
background:white;
cursor:pointer;
}

.btn {
    border-radius: 8px;
	border: none;
}

@media (max-width: 600px) {
    .feature-content p {
        font-size: 14px;
        line-height: 16px;
    }
}




.about-card.left-card::after {
   display:none;
}

.about-card.right-card::before {
  display:none;
}

.feature-item {
    display: flex;
    align-items: center;
    gap: 16px;
    margin-bottom: 0px;
}

.features-section {
    max-width: 600px;
    margin: 10px 0px;
    padding: 0px 20px;
}

.feature-content h4 {
    font-size: 18px;
    font-weight: 400;
    color: #2d3748;
    margin-bottom: 14px;
    font-family:'Roboto';
}

.elementor-19 .elementor-element.elementor-element-1932d19 {
    --display: flex;
    --flex-direction: column;
    --container-widget-width: 100%;
    --container-widget-height: initial;
    --container-widget-flex-grow: 0;
    --container-widget-align-self: initial;
    --flex-wrap-mobile: wrap;
    --overflow: hidden;
    --padding-top: 0px;
    --padding-bottom:0px;
    --padding-left: 0px;
    --padding-right: 0px;
}


.btn {
    padding: 8px 18px !important;
    font-weight: 300 !important;
}

/* ========================================================== */

@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:fallback;src:url('https://capital.digitlayresourcehub.com/wp-content/themes/twentytwentyfive/assets/fonts/manrope/Manrope-VariableFont_wght.woff2') format('woff2');}
@font-face{font-family:"Fira Code";font-style:normal;font-weight:300 700;font-display:fallback;src:url('https://capital.digitlayresourcehub.com/wp-content/themes/twentytwentyfive/assets/fonts/fira-code/FiraCode-VariableFont_wght.woff2') format('woff2');}

/* ========================================================== */

.elementor-48 .elementor-element.elementor-element-4d4bcd6{--display:flex;--position:fixed;--min-height:0px;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overflow:hidden;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;top:0px;}.elementor-48 .elementor-element.elementor-element-4d4bcd6:not(.elementor-motion-effects-element-type-background), .elementor-48 .elementor-element.elementor-element-4d4bcd6 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}.elementor-48 .elementor-element.elementor-element-4d4bcd6.e-con{--flex-grow:0;--flex-shrink:0;}body:not(.rtl) .elementor-48 .elementor-element.elementor-element-4d4bcd6{left:0px;}body.rtl .elementor-48 .elementor-element.elementor-element-4d4bcd6{right:0px;}.elementor-48 .elementor-element.elementor-element-089f535{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--margin-top:-5px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-48 .elementor-element.elementor-element-089f535.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-48 .elementor-element.elementor-element-4cf8651{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-48 .elementor-element.elementor-element-4cf8651 img{width:80%;}.elementor-48 .elementor-element.elementor-element-149696a{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-48 .elementor-element.elementor-element-149696a.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-navigation-menu .menu-item a.hfe-menu-item.elementor-button{background-color:var( --e-global-color-accent );font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-widget-navigation-menu .menu-item a.hfe-menu-item.elementor-button:hover{background-color:var( --e-global-color-accent );}.elementor-widget-navigation-menu a.hfe-menu-item, .elementor-widget-navigation-menu a.hfe-sub-menu-item{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );}.elementor-widget-navigation-menu .menu-item a.hfe-menu-item, .elementor-widget-navigation-menu .sub-menu a.hfe-sub-menu-item{color:var( --e-global-color-text );}.elementor-widget-navigation-menu .menu-item a.hfe-menu-item:hover,
								.elementor-widget-navigation-menu .sub-menu a.hfe-sub-menu-item:hover,
								.elementor-widget-navigation-menu .menu-item.current-menu-item a.hfe-menu-item,
								.elementor-widget-navigation-menu .menu-item a.hfe-menu-item.highlighted,
								.elementor-widget-navigation-menu .menu-item a.hfe-menu-item:focus{color:var( --e-global-color-accent );}.elementor-widget-navigation-menu .hfe-nav-menu-layout:not(.hfe-pointer__framed) .menu-item.parent a.hfe-menu-item:before,
								.elementor-widget-navigation-menu .hfe-nav-menu-layout:not(.hfe-pointer__framed) .menu-item.parent a.hfe-menu-item:after{background-color:var( --e-global-color-accent );}.elementor-widget-navigation-menu .hfe-nav-menu-layout:not(.hfe-pointer__framed) .menu-item.parent .sub-menu .hfe-has-submenu-container a:after{background-color:var( --e-global-color-accent );}.elementor-widget-navigation-menu .hfe-pointer__framed .menu-item.parent a.hfe-menu-item:before,
								.elementor-widget-navigation-menu .hfe-pointer__framed .menu-item.parent a.hfe-menu-item:after{border-color:var( --e-global-color-accent );}
							.elementor-widget-navigation-menu .sub-menu li a.hfe-sub-menu-item,
							.elementor-widget-navigation-menu nav.hfe-dropdown li a.hfe-sub-menu-item,
							.elementor-widget-navigation-menu nav.hfe-dropdown li a.hfe-menu-item,
							.elementor-widget-navigation-menu nav.hfe-dropdown-expandible li a.hfe-menu-item,
							.elementor-widget-navigation-menu nav.hfe-dropdown-expandible li a.hfe-sub-menu-item{font-family:var( --e-global-typography-accent-font-family ), Sans-serif;font-weight:var( --e-global-typography-accent-font-weight );}.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-menu-item{padding-left:10px;padding-right:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-sub-menu-item{padding-left:calc( 10px + 20px );padding-right:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__layout-vertical .menu-item ul ul a.hfe-sub-menu-item{padding-left:calc( 10px + 40px );padding-right:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__layout-vertical .menu-item ul ul ul a.hfe-sub-menu-item{padding-left:calc( 10px + 60px );padding-right:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__layout-vertical .menu-item ul ul ul ul a.hfe-sub-menu-item{padding-left:calc( 10px + 80px );padding-right:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-menu-item, .elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-sub-menu-item{padding-top:10px;padding-bottom:10px;}.elementor-48 .elementor-element.elementor-element-0830a6c ul.sub-menu{width:220px;}.elementor-48 .elementor-element.elementor-element-0830a6c .sub-menu a.hfe-sub-menu-item,
						 .elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown li a.hfe-menu-item,
						 .elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown li a.hfe-sub-menu-item,
						 .elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown-expandible li a.hfe-menu-item,
						 .elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown-expandible li a.hfe-sub-menu-item{padding-top:15px;padding-bottom:15px;}.elementor-48 .elementor-element.elementor-element-0830a6c > .elementor-widget-container{margin:12px 0px 0px -72px;}.elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle{margin:0 auto;}.elementor-48 .elementor-element.elementor-element-0830a6c a.hfe-menu-item, .elementor-48 .elementor-element.elementor-element-0830a6c a.hfe-sub-menu-item{font-family:"Montserrat", Sans-serif;font-size:14px;font-weight:500;}.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-menu-item:hover,
								.elementor-48 .elementor-element.elementor-element-0830a6c .sub-menu a.hfe-sub-menu-item:hover,
								.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item.current-menu-item a.hfe-menu-item,
								.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-menu-item.highlighted,
								.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item a.hfe-menu-item:focus{color:#005BAC;}.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item.current-menu-item a.hfe-menu-item,
								.elementor-48 .elementor-element.elementor-element-0830a6c .menu-item.current-menu-ancestor a.hfe-menu-item{color:#005BAC;}.elementor-48 .elementor-element.elementor-element-0830a6c .sub-menu,
								.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown,
								.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown-expandible,
								.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown .menu-item a.hfe-menu-item,
								.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown .menu-item a.hfe-sub-menu-item{background-color:#fff;}.elementor-48 .elementor-element.elementor-element-0830a6c .sub-menu li.menu-item:not(:last-child),
						.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown li.menu-item:not(:last-child),
						.elementor-48 .elementor-element.elementor-element-0830a6c nav.hfe-dropdown-expandible li.menu-item:not(:last-child){border-bottom-style:solid;border-bottom-color:#c4c4c4;border-bottom-width:1px;}.elementor-48 .elementor-element.elementor-element-3a6d707{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-48 .elementor-element.elementor-element-3a6d707.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-48 .elementor-element.elementor-element-b3cec03{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) -40px;}@media(min-width:768px){.elementor-48 .elementor-element.elementor-element-089f535{--width:28.68%;}.elementor-48 .elementor-element.elementor-element-149696a{--width:51.154%;}.elementor-48 .elementor-element.elementor-element-3a6d707{--width:16.695%;}}

/* ========================================================== */

/* =========================================
   CAPITAL FULL SCREEN VIDEO BANNER
========================================= */

.capital-home-video-hero {
    position: relative;

    width: 100%;
    width: 100vw;
    height: calc(100vh - 76px);
    height: var(--capital-hero-height, calc(100vh - 76px));
    min-height: 380px;

    margin: 0 !important;
    padding: 0 !important;

    overflow: hidden;

    background: #000;

    isolation: isolate;
}


/* =========================================
   VIDEO
========================================= */

.capital-home-video {
    position: relative;

    width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;

    display: block;

    margin: 0 !important;
    padding: 0 !important;

    object-fit: cover !important;
    object-position: center top !important;

    transform: none !important;

    z-index: 1;

    border: 0 !important;
    outline: 0 !important;
}


/* =========================================
   OVERLAY
========================================= */

.capital-video-overlay {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    background: rgba(0, 0, 0, 0.10);

    z-index: 2;

    pointer-events: none;
}


/* =========================================
   LARGE DESKTOP
========================================= */

@media (min-width: 1600px) {

    .capital-home-video-hero {
        height: var(--capital-hero-height, calc(100vh - 76px)) !important;
        max-height: calc(100vh - 76px) !important;
    }

    .capital-home-video {
        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center top !important;

        transform: none !important;
    }

}


/* =========================================
   DESKTOP / MAC / LAPTOP
========================================= */

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

    .capital-home-video-hero {
        height: var(--capital-hero-height, calc(100vh - 76px)) !important;
        max-height: calc(100vh - 76px) !important;
    }

    .capital-home-video {
        width: 100% !important;
        height: 100% !important;

        object-fit: cover !important;
        object-position: center top !important;

        transform: none !important;
    }

}


/* =========================================
   TABLET
========================================= */

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

    .capital-home-video-hero {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .capital-home-video {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center top !important;
        transform: none !important;
    }

}


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

@media (max-width: 767px) {

    .capital-home-video-hero {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
    }

    .capital-home-video {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center top !important;
        transform: none !important;
    }

}


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

@media (max-width: 480px) {

    .capital-home-video {
        transform: none !important;
    }

}


/* =========================================
   SAFARI / IOS VIDEO CONTROLS
========================================= */

.capital-home-video::-webkit-media-controls {
    display: none !important;
}

.capital-home-video::-webkit-media-controls-start-playback-button {
    display: none !important;
}

.capital-home-video::-webkit-media-controls-panel {
    display: none !important;
}


/* =========================================
   ELEMENTOR SPACING RESET
========================================= */

.capital-home-video-hero,
.capital-home-video-hero * {
    box-sizing: border-box;
}


/* =========================================
   FALLBACK FOR OLDER BROWSERS
========================================= */

@supports not (height: 100dvh) {

    @media (min-width: 1025px) {
        .capital-home-video-hero {
            height: var(--capital-hero-height, calc(100vh - 76px)) !important;
        }
    }

}

/* ========================================================== */

/* =========================================================
   CAPITAL POWER SYSTEMS
   WHY SECTION - FULL UPDATED CSS
========================================================= */


/* =========================================================
   FONT
========================================================= */

@import url(
    'https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap'
);


/* =========================================================
   RESET
========================================================= */

.why-section,
.why-section *,
.why-section *::before,
.why-section *::after {
    box-sizing: border-box;
}


.why-section {
    position: relative;

    width: 100%;

    margin: 0;
    padding: 0;

    overflow: hidden;

    isolation: isolate;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    -webkit-font-smoothing: antialiased;
}


/* =========================================================
   BACKGROUND VIDEO
========================================================= */

.why-video {
    position: absolute;

    top: 0;
    left: 0;

    width: 100%;
    height: 100%;

    object-fit: cover;

    object-position: center center;

    z-index: 1;

    pointer-events: none;

    filter:
        brightness(.55)
        contrast(1.08)
        saturate(1.05);

    transform: scale(1.03);
}


/* =========================================================
   VIDEO OVERLAY
========================================================= */

.why-overlay {
    position: absolute;

    inset: 0;

    z-index: 2;

    background:
        linear-gradient(
            180deg,
            rgba(5,18,36,.45) 0%,
            rgba(5,18,36,.60) 45%,
            rgba(5,18,36,.75) 100%
        );

    pointer-events: none;
}


/* =========================================================
   ELECTRIC CANVAS
========================================================= */

#electricCanvas {
    position: absolute;

    inset: 0;

    width: 100%;
    height: 100%;

    z-index: 3;

    pointer-events: none;

    opacity: .8;
}


/* =========================================================
   MAIN CONTAINER
========================================================= */

.why-container {
    position: relative;

    z-index: 5;

    width: 100%;

    max-width: 1600px;

    margin: 0 auto;

    padding: 100px;

    display: grid;

    grid-template-columns:
        520px minmax(0, 1fr);

    gap: 24px;

    align-items: stretch;
}


/* =========================================================
   LEFT CARD
========================================================= */

.why-left-card {
    position: relative;

    min-width: 0;

    background: #D5ECF6;

    border-radius: 20px;

    padding: 45px;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    transition:
        transform .35s ease,
        box-shadow .35s ease;
}


/* =========================================================
   LEFT CARD HOVER
========================================================= */

.why-left-card:hover {
    transform:
        translateY(-6px);

    box-shadow:
        0 20px 45px
        rgba(0,0,0,.18);
}


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

.why-left-card h2 {
    position: relative;

    z-index: 2;

    margin: 0 0 22px;

    padding: 0;

    color: #323232;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    font-size: 48px;

    line-height: 1.2;

    font-weight: 500;

    opacity: 1;

    visibility: visible;

    transform: none;
}


/* =========================================================
   LEFT PARAGRAPH
========================================================= */

.why-left-card p {
    position: relative;

    z-index: 2;

    max-width: 360px;

    margin: 0;

    padding: 0;

    color: #58626D;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    font-size: 16px;

    line-height: 1.8;

    font-weight: 400;

    opacity: 1;

    visibility: visible;

    transform: none;
}


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

.read-more-btn {
    position: relative;

    z-index: 5;

    display: inline-flex;

    align-items: center;

    width: max-content;

    margin-top: 35px;

    padding: 0;

    text-decoration: none;

    opacity: 1;

    visibility: visible;

    transform: none;

    transition:
        transform .35s ease;
}


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

.read-more-btn > span {
    height: 48px;

    padding:
        0 24px;

    display: flex;

    align-items: center;

    justify-content: center;

    background: #0094E8;

    color: #ffffff;

    border-radius:
        10px 0 0 10px;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    font-size: 15px;

    line-height: 1;

    font-weight: 500;

    white-space: nowrap;

    transition:
        background .35s ease;
}


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

.read-more-btn .btn-arrow {
    width: 48px;
    height: 48px;

    display: flex;

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

    background: #ffffff;

    border-left:
        1px solid
        rgba(0,0,0,.08);

    border-radius:
        0 10px 10px 0;

    transition:
        background .35s ease;
}


.read-more-btn .btn-arrow img {
    width: 14px;
    height: auto;

    display: block;

    transition:
        transform .35s ease,
        filter .35s ease;
}


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

.read-more-btn:hover {
    transform:
        translateY(-3px);
}


.read-more-btn:hover > span {
    background: #0078D4;
}


.read-more-btn:hover .btn-arrow {
    background: #0094E8;
}


.read-more-btn:hover .btn-arrow img {
    filter:
        brightness(0)
        invert(1);

    transform:
        translateX(4px);
}


/* =========================================================
   LIGHTNING SHAPE
========================================================= */

.why-shape {
    position: absolute;

    right: 0;
    bottom: 0;

    z-index: 1;

    width: 180px;

    height: auto;

    display: block;

    max-width: 100%;

    pointer-events: none;

    opacity: 1;

    visibility: visible;

    transform: none;

    transition:
        opacity .8s ease,
        transform .8s ease;
}


/* =========================================================
   RIGHT GRID
========================================================= */

.why-right-grid {
    min-width: 0;

    display: grid;

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

    gap: 24px;
}


/* =========================================================
   RIGHT CARD
========================================================= */

.why-card {
    position: relative;

    min-width: 0;

    min-height: 220px;

    padding: 35px;

    overflow: hidden;

    display: flex;

    flex-direction: column;

    justify-content: flex-start;

    background: #ffffff;

    border:
        1px solid
        rgba(255,255,255,.25);

    border-radius: 20px;

    box-shadow:
        0 12px 30px
        rgba(0,0,0,.08);

    opacity: 1;

    visibility: visible;

    transform: translateY(0);

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


/* =========================================================
   RIGHT CARD HOVER
========================================================= */

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

    border-color:
        #0094E8;

    box-shadow:
        0 20px 45px
        rgba(0,0,0,.18);
}


/* =========================================================
   CARD LIGHT EFFECT
========================================================= */

.why-card::before {
    content: "";

    position: absolute;

    top: -60%;
    left: -60%;

    width: 220px;
    height: 220px;

    border-radius: 50%;

    background:
        rgba(213,236,246,.45);

    pointer-events: none;

    transition:
        transform .45s ease;
}


.why-card:hover::before {
    transform:
        scale(1.3);
}


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

.why-icon {
    position: relative;

    z-index: 2;

    width: 46px;
    height: 56px;

    display: block;

    object-fit: contain;

    margin:
        0 0 24px;

    flex-shrink: 0;

    opacity: 1;

    visibility: visible;

    transition:
        transform .35s ease;
}


.why-card:hover .why-icon {
    transform:
        scale(1.08);
}


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

.why-card h3 {
    position: relative;

    z-index: 2;

    margin:
        0 0 15px;

    padding: 0;

    color: #323232;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    font-size: 25px;

    line-height: 1.25;

    font-weight: 500;

    opacity: 1;

    visibility: visible;
}


/* =========================================================
   CARD PARAGRAPH
========================================================= */

.why-card p {
    position: relative;

    z-index: 2;

    margin: 0;

    padding: 0;

    color: #5C6670;

    font-family:
        'Roboto',
        Arial,
        sans-serif;

    font-size: 16px;

    line-height: 1.8;

    font-weight: 400;

    opacity: 1;

    visibility: visible;
}


/* =========================================================
   SCROLL ANIMATION
   SAFE VERSION

   IMPORTANT:
   Does NOT hide left text.
========================================================= */

.why-js-heading {
    opacity: 1 !important;

    visibility: visible !important;

    transform:
        translateX(-45px);

    transition:
        opacity .7s ease,
        transform .7s ease;
}


.why-js-paragraph {
    opacity: 1 !important;

    visibility: visible !important;

    transform:
        translateX(-30px);

    transition:
        opacity .7s ease .12s,
        transform .7s ease .12s;
}


.why-js-button {
    opacity: 1 !important;

    visibility: visible !important;

    transform:
        translateY(20px);

    transition:
        opacity .7s ease .25s,
        transform .7s ease .25s;
}


/* =========================================================
   BEFORE VISIBLE
========================================================= */

.why-section:not(.why-visible)
.why-js-heading {
    opacity: 0 !important;

    visibility: hidden;

    transform:
        translateX(-45px);
}


.why-section:not(.why-visible)
.why-js-paragraph {
    opacity: 0 !important;

    visibility: hidden;

    transform:
        translateX(-30px);
}


.why-section:not(.why-visible)
.why-js-button {
    opacity: 0 !important;

    visibility: hidden;

    transform:
        translateY(20px);
}


/* =========================================================
   AFTER VISIBLE
========================================================= */

.why-section.why-visible
.why-js-heading {
    opacity: 1 !important;

    visibility: visible;

    transform:
        translateX(0);
}


.why-section.why-visible
.why-js-paragraph {
    opacity: 1 !important;

    visibility: visible;

    transform:
        translateX(0);
}


.why-section.why-visible
.why-js-button {
    opacity: 1 !important;

    visibility: visible;

    transform:
        translateY(0);
}


/* =========================================================
   SHAPE ANIMATION
========================================================= */

.why-js-shape {
    opacity: 1;

    visibility: visible;

    transform:
        translateY(20px);

    transition:
        opacity .8s ease,
        transform .8s ease;
}


.why-section:not(.why-visible)
.why-js-shape {
    opacity: 0;

    visibility: hidden;

    transform:
        translateY(20px);
}


.why-section.why-visible
.why-js-shape {
    opacity: 1;

    visibility: visible;

    transform:
        translateY(0);
}


/* =========================================================
   RIGHT CARD SCROLL ANIMATION
========================================================= */

.why-js-card {
    opacity: 1 !important;

    visibility: visible !important;

    transform:
        translateY(25px);

    transition:
        transform .6s ease var(--card-delay),
        box-shadow .35s ease,
        border-color .35s ease;
}


.why-section.why-visible
.why-js-card {
    opacity: 1 !important;

    visibility: visible !important;

    transform:
        translateY(0);
}


/* =========================================================
   TABLET
========================================================= */

@media (max-width: 1200px) {

    .why-container {
        padding:
            70px 50px;

        grid-template-columns:
            430px minmax(0, 1fr);

        gap: 20px;
    }


    .why-left-card {
        padding: 38px;
    }


    .why-left-card h2 {
        font-size: 42px;
    }


    .why-card {
        padding: 28px;

        min-height: 210px;
    }


    .why-card h3 {
        font-size: 23px;
    }

}


/* =========================================================
   TABLET / SMALL LAPTOP
========================================================= */

@media (max-width: 1024px) {

    .why-container {
        grid-template-columns: 1fr;

        padding:
            70px 30px;

        gap: 24px;
    }


    .why-left-card {
        padding: 40px;
    }


    .why-left-card p {
        max-width: 650px;
    }


    .why-right-grid {
        grid-template-columns:
            repeat(2, minmax(0, 1fr));
    }


    .why-card {
        min-height: 200px;
    }

}


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

@media (max-width: 767px) {

    .why-section {
        padding:
            60px 0;
    }


    .why-video {
        transform:
            scale(1.01);

        object-position:
            center center;
    }


    .why-container {
        width: 100%;

        padding:
            0 18px;

        grid-template-columns: 1fr;

        gap: 18px;
    }


    /* LEFT CARD */

    .why-left-card {
        width: 100%;

        padding: 28px 25px;

        border-radius: 18px;
    }


    .why-left-card h2 {
        font-size: 34px;

        line-height: 1.2;

        margin-bottom: 18px;
    }


    .why-left-card p {
        max-width: 100%;

        font-size: 15px;

        line-height: 1.75;
    }


    /* BUTTON */

    .read-more-btn {
        margin-top: 28px;
    }


    .read-more-btn > span {
        height: 44px;

        padding:
            0 18px;

        font-size: 14px;
    }


    .read-more-btn .btn-arrow {
        width: 44px;
        height: 44px;
    }


    /* SHAPE */

    .why-shape {
        width: 110px;
    }


    /* RIGHT GRID */

    .why-right-grid {
        width: 100%;

        grid-template-columns: 1fr;

        gap: 18px;
    }


    /* RIGHT CARD */

    .why-card {
        width: 100%;

        min-height: auto;

        padding: 25px;

        border-radius: 18px;
    }


    .why-icon {
        width: 46px;
        height: 46px;

        margin-bottom: 18px;
    }


    .why-card h3 {
        font-size: 23px;

        margin-bottom: 12px;
    }


    .why-card p {
        font-size: 15px;

        line-height: 1.75;
    }


    /* MOBILE ANIMATION */

    .why-js-heading {
        transform:
            translateY(25px);
    }


    .why-js-paragraph {
        transform:
            translateY(20px);
    }


    .why-js-button {
        transform:
            translateY(20px);
    }


    .why-section:not(.why-visible)
    .why-js-heading {
        transform:
            translateY(25px);
    }


    .why-section:not(.why-visible)
    .why-js-paragraph {
        transform:
            translateY(20px);
    }


    .why-section.why-visible
    .why-js-heading,
    .why-section.why-visible
    .why-js-paragraph {
        transform:
            translateY(0);
    }

}


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

@media (max-width: 480px) {

    .why-section {
        padding:
            50px 0;
    }


    .why-container {
        padding:
            0 15px;
    }


    .why-left-card {
        padding:
            24px 20px;
    }


    .why-left-card h2 {
        font-size: 30px;

        line-height: 1.2;
    }


    .why-left-card p {
        font-size: 15px;

        line-height: 1.7;
    }


    .why-card {
        padding:
            22px;
    }


    .why-card h3 {
        font-size: 22px;
    }


    .why-card p {
        font-size: 15px;
    }


    .why-shape {
        width: 95px;
    }

}


/* =========================================================
   LARGE DESKTOP
========================================================= */

@media (min-width: 1600px) {

    .why-container {
        max-width: 1700px;

        padding:
            110px;
    }


    .why-left-card {
        padding: 55px;
    }


    .why-left-card h2 {
        font-size: 56px;
    }


    .why-card {
        padding: 40px;
    }


    .why-card h3 {
        font-size: 28px;
    }

}


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

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

    .why-section *,
    .why-section *::before,
    .why-section *::after {

        transition: none !important;

        animation: none !important;
    }


    .why-js-heading,
    .why-js-paragraph,
    .why-js-button,
    .why-js-shape,
    .why-js-card {

        opacity: 1 !important;

        visibility: visible !important;

        transform: none !important;
    }

}

/* ========================================================== */

/*=========================================
FONT
=========================================*/

@import url('https://fonts.googleapis.com/css2?family=Roboto :wght@300;400;500;600;700&display=swap');

/*=========================================
RESET
=========================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Roboto' ;
}

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

.insights-section{

    position:relative;

    overflow:hidden;

    background:#F7F8FB;

    padding:100px 0;

}

.mouseCanvas{

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    pointer-events:none;

}

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

.insights-container{

    width:1400px;

    max-width:95%;

    margin:auto;

    display:flex;

    align-items:center;

    gap:60px;

    position:relative;

    z-index:2;

}

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

.insights-left{

    width:360px;

    flex-shrink:0;

}

.insights-subtitle{

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#005BAC;

    font-size:15px;

    font-weight:600;

    margin-bottom:18px;

}

.insights-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: #005BAC;
    font-size: 15px;
    font-weight: 600;
    margin-bottom: 18px;
    margin-left: -25px;
}

.insights-subtitle img{

    width:16px;

}

.insights-left h2{

    font-size:45px;

    line-height:1.1;

    color:#1E1E1E;

    font-weight:500;

    margin-bottom:25px;

}

.insights-left p{

    font-size:17px;

    line-height:1.8;

    color:#666;

}

.insights-btn{

    display:inline-flex;

    align-items:center;

    gap:10px;

    margin-top:35px;

    padding:15px 28px;

    background:#005BAC;

    color:#fff;

    text-decoration:none;

    border-radius:8px;

    transition:.35s;

}

.insights-btn:hover{

    background:#0079df;

}

.insights-btn img{

    width:16px;

    transition:.35s;

}

.insights-btn:hover img{

    transform:translateX(5px);

}
/*=========================================
SLIDER
=========================================*/

.insights-slider{

    flex:1;

    position:relative;

    overflow:hidden;

}

.insights-track{

    display:flex;

    align-items:stretch;

    gap:30px;

    transition:transform .6s ease;

    will-change:transform;

}

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

.insight-card{

    position:relative;

    flex:0 0 300px;

    display:flex;

    flex-direction:column;

    background:#ffffff;

    border-radius:22px;

    overflow:hidden;

    text-decoration:none;

    color:#222;

    box-shadow:0 15px 40px rgba(0,0,0,.08);

    transition:.35s ease;

}

.insight-card:hover{

    transform:translateY(-10px);

    box-shadow:0 30px 60px rgba(0,0,0,.15);

}

/*=========================================
IMAGE WRAPPER
=========================================*/

.insight-image{

    position:relative;

    width:100%;

    height:auto;

    overflow:hidden;

    padding:0;

    margin:0;

    line-height:0;

    background:transparent;

    flex-shrink:0;

}

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

.insight-image img{

    display:block;

    width:100%;

    height:auto;

    object-fit:cover;

    object-position:center center;

    transition:transform .7s ease;

    margin:0;

    padding:0;

    border:0;

}

.insight-card:hover .insight-image img{

    transform:scale(1.08);

}

/*=========================================
IMAGE OVERLAY
=========================================*/

.insight-image::before{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,0,0,.28),
        transparent 60%
    );

    z-index:2;

    pointer-events:none;

}

/*=========================================
REMOVE GAP
=========================================*/

.insight-card img{

    vertical-align:middle;

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

.insight-content{

    display:flex;

    flex-direction:column;

    justify-content:space-between;

    flex:1;

    padding:14px;

    background:#fff;

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

.insight-content h3{

    margin:0;

    font-size:20px;

    font-weight:400;

    line-height:1.35;

    color:#1F1F1F;

    transition:.35s;

}

.insight-card:hover h3{

    color:#005BAC;

}

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

.read-more{

    margin-top:15px;

    display:inline-flex;

    align-items:center;

    gap:10px;

    color:#005BAC;

    font-size:15px;

    font-weight:400;

    transition:.35s;

}

.read-more svg{

    width:18px;

    height:18px;

    transition:.35s;

}

.insight-card:hover .read-more{

    gap:16px;

}

.insight-card:hover .read-more svg{

    transform:translateX(6px);

}

/*=========================================
LINK RESET
=========================================*/

.insight-card,
.insight-card:hover{

    text-decoration:none;

}

/*=========================================
CONTENT SPACING
=========================================*/

.insight-content>*:last-child{

    margin-bottom:0;

}
/*=========================================
CARD HOVER EFFECT
=========================================*/

.insight-card{

    cursor:pointer;

    will-change:transform;

    transition:
        transform .4s ease,
        box-shadow .4s ease;

}

.insight-card:hover{

    transform:translateY(-12px);

    box-shadow:0 30px 60px rgba(0,0,0,.18);

}

/*=========================================
SHINE EFFECT
=========================================*/

.insight-card::before{

    content:"";

    position:absolute;

    top:0;

    left:-120%;

    width:60%;

    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.45),
        transparent
    );

    transform:skewX(-25deg);

    transition:1s;

    z-index:5;

}

.insight-card:hover::before{

    left:160%;

}

/*=========================================
IMAGE OVERLAY
=========================================*/

.insight-image::after{

    content:"";

    position:absolute;

    inset:0;

    background:linear-gradient(
        to top,
        rgba(0,91,172,.28),
        transparent 65%
    );

    opacity:0;

    transition:.35s;

}

.insight-card:hover .insight-image::after{

    opacity:1;

}

/*=========================================
IMAGE HOVER
=========================================*/

.insight-card:hover .insight-image img{

    transform:scale(1.08);

}

/*=========================================
TEXT ANIMATION
=========================================*/

.insight-content h3{

    transition:.35s;

}

.insight-card:hover h3{

    color:#005BAC;

}

.read-more{

    transition:.35s;

}

.read-more svg{

    transition:.35s;

}

.insight-card:hover .read-more{

    gap:16px;

}

.insight-card:hover .read-more svg{

    transform:translateX(6px);

}

/*=========================================
ENTRY ANIMATION
=========================================*/

.insight-card{

    opacity:0;

    transform:translateY(40px);

    animation:cardFade .8s ease forwards;

}

.insight-card:nth-child(1){

    animation-delay:.1s;

}

.insight-card:nth-child(2){

    animation-delay:.2s;

}

.insight-card:nth-child(3){

    animation-delay:.3s;

}

.insight-card:nth-child(4){

    animation-delay:.4s;

}

.insight-card:nth-child(5){

    animation-delay:.5s;

}

.insight-card:nth-child(6){

    animation-delay:.6s;

}

/*=========================================
KEYFRAMES
=========================================*/

@keyframes cardFade{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}

/*=========================================
TABLET
=========================================*/

@media(max-width:1024px){

    .insights-container{

        flex-direction:column;

        align-items:flex-start;

        gap:50px;

    }

    .insights-left{

        width:100%;

    }

    .insight-card{

        flex:0 0 320px;

    }

    .insight-image{

        height:220px;

    }

}

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

@media(max-width:767px){

    .insights-section{

        padding:70px 0;

    }

    .insights-container{

        padding:0 18px;

    }

    .insights-left h2{

        font-size:34px;

    }

    .insights-left p{

        font-size:15px;

    }

    .insight-card{

        flex:0 0 280px;

    }

    .insight-image{

        height:190px;

    }

    .insight-content{

        padding:20px;

    }

    .insight-content h3{

        font-size:22px;

    }

}

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

@media(max-width:480px){

    .insight-card{

        flex:0 0 250px;

    }

    .insight-image{

        height:170px;

    }

    .meta{

        font-size:10px;

    }

    .insight-content h3{

        font-size:18px;

    }

}
.insights-section{

    position:relative;

    overflow:hidden;

    background:#F7F8FB;

}

/* Background Tower Image */

.insights-section::after{

    content:"";

    position:absolute;

    left:0;

    bottom:0;

    width:520px;      /* image width */

    height:260px;     /* image height */

    background:url("https://capital.digitlayresourcehub.com/wp-content/uploads/2026/07/Frame-1948756101-scaled.png") no-repeat left bottom;

    background-size:contain;

    opacity:.35;

    pointer-events:none;

    z-index:1;

}

/* Keep content above image */

.insights-container{

    position:relative;

    z-index:2;

}

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

.insights-left h2,
.insights-left p,
.insights-left .read-more-btn{

    opacity:0;
    transition:all .8s ease;

}

.insights-left h2{

    transform:translateX(-80px);

}

.insights-left p{

    transform:translateX(-60px);
    transition-delay:.15s;

}

.insights-left .read-more-btn{

    transform:translateY(35px);
    transition-delay:.3s;

}

.insights-left.active h2{

    opacity:1;
    transform:translateX(0);

}

.insights-left.active p{

    opacity:1;
    transform:translateX(0);

}

.insights-left.active .read-more-btn{

    opacity:1;
    transform:translateY(0);

}

/* ========================================================== */

/* Follow Us on LinkedIn — original size and hover */
.insights-left .read-more-btn{
    display:inline-flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:0 !important;
    margin-top:35px !important;
    padding:0 !important;
    width:auto !important;
    height:58px !important;
    min-height:58px !important;
    background:#0099e5 !important;
    color:#fff !important;
    text-decoration:none !important;
    border-radius:8px !important;
    overflow:hidden !important;
    transition:background .35s ease, transform .35s ease !important;
}

.insights-left .read-more-btn > span{
    display:flex !important;
    align-items:center !important;
    height:58px !important;
    padding:15px 28px !important;
    background:#0099e5 !important;
    color:#fff !important;
    font-size:16px !important;
    font-weight:600 !important;
    line-height:1 !important;
    white-space:nowrap !important;
}

.insights-left .read-more-btn .btn-arrow{
    width:58px !important;
    min-width:58px !important;
    height:58px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    background:#fff !important;
}

.insights-left .read-more-btn .btn-arrow img{
    display:block !important;
    width:16px !important;
    height:auto !important;
    transition:transform .35s ease !important;
}

.insights-left .read-more-btn:hover{
    background:#0079df !important;
}

.insights-left .read-more-btn:hover > span{
    background:#0079df !important;
}

.insights-left .read-more-btn:hover .btn-arrow img{
    transform:translateX(5px) !important;
}

/* ========================================================== */

.insights-left .read-more-btn .btn-arrow img{
    filter:none !important;
    opacity:1 !important;
}

.insights-left .read-more-btn:hover .btn-arrow img{
    filter:none !important;
    opacity:1 !important;
    transform:translateX(5px) !important;
}

/* ========================================================== */

/* Cards slightly shorter while keeping the complete image visible */
.insights-section .insight-card{
    min-height:0 !important;
}

.insights-section .insight-image{
    height:auto !important;
    padding:0 !important;
    overflow:hidden !important;
}

.insights-section .insight-image img{
    width:100% !important;
    height:auto !important;
    max-height:none !important;
    object-fit:contain !important;
    object-position:center center !important;
}

.insights-section .insight-content{
    padding:11px 14px 12px !important;
}

.insights-section .insight-content h3{
    margin-top:0 !important;
    margin-bottom:0 !important;
}

.insights-section .read-more{
    margin-top:10px !important;
}

/* ========================================================== */

/*=====================================
RESET
=====================================*/

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
}

body{
    font-family:'Roboto',sans-serif;
    overflow-x:hidden;
}

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

.powering-section{

    position:relative;

    width:100%;

    min-height:720px;

    overflow:hidden;

    display:flex;

    align-items:center;

}

/*=====================================
BACKGROUND VIDEO
=====================================*/

.powering-video{

    position:absolute;

    inset:0;

    width:100%;

    height:100%;

    object-fit:cover;

    z-index:1;

    transform:scale(1.05);

}

/*=====================================
OVERLAY
=====================================*/

.powering-overlay{

    position:absolute;

    inset:0;

    background:linear-gradient(
        90deg,
        rgba(0,0,0,.45),
        rgba(0,0,0,.18),
        rgba(0,0,0,.35)
    );

    z-index:2;

}

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

.powering-container{

    position:relative;

    z-index:5;

    width:100%;

    max-width:1400px;

    margin:0 auto;

    display:flex;

    justify-content:flex-start;

    align-items:center;

    padding-left:7%;

    padding-right:30px;

}

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

.powering-card{

    width:100%;

    max-width:560px;

    padding:40px;

    border-radius:20px;

    background:rgba(255,255,255,.12);

    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);

    border:1px solid rgba(255,255,255,.18);

    box-shadow:
        0 25px 60px rgba(0,0,0,.30);

    transition:.45s ease;

}

/*=====================================
CARD HOVER
=====================================*/

.powering-card:hover{

    transform:translateY(-8px);

    box-shadow:
        0 35px 80px rgba(0,0,0,.35);

}

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

.powering-title{

    font-size:42px;

    font-weight:700;

    color:#fff;

    line-height:1.2;

    margin-bottom:35px;

    letter-spacing:.3px;

}

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

.powering-stats{

    display:grid;

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

    gap:20px 30px;

    margin-bottom:30px;

}

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

.power-item{

    border-bottom:1px solid rgba(255,255,255,.20);

    padding-bottom:15px;

}

/*=====================================
NUMBER
=====================================*/

.power-item h3{

    font-size:24px;

    font-weight:700;

    color:#ffffff;

    margin-bottom:6px;

    line-height:1;

    white-space:nowrap;

}

/*=====================================
LABEL
=====================================*/

.power-item span{

    display:block;

    font-size:13px;

    color:rgba(255,255,255,.85);

    line-height:1.5;

}

/*=====================================
INTERNATIONAL
=====================================*/

.international-text{

    font-size:20px !important;

    font-weight:700;

    color:#ffffff;

    line-height:1;

    white-space:nowrap;

}

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

.powering-desc{

    margin-top:10px;

    color:rgba(255,255,255,.92);

    font-size:16px;

    line-height:1.8;

    padding-bottom:0;

}

/*=====================================
NUMBER HOVER
=====================================*/

.power-item h3{

    transition:.3s ease;

}

.power-item:hover h3{

    color:#7fd3ff;

}

.power-item:hover{

    border-color:rgba(255,255,255,.45);

}

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

.reveal-card{

    opacity:0;

    transform:translateX(-80px);

    transition:all .9s ease;

}

.reveal-card.active{

    opacity:1;

    transform:translateX(0);

}

.reveal-title,
.reveal-stats,
.reveal-text{

    opacity:0;

    transform:translateY(35px);

    transition:all .8s ease;

}

.reveal-title{

    transition-delay:.15s;

}

.reveal-stats{

    transition-delay:.30s;

}

.reveal-text{

    transition-delay:.45s;

}

.reveal-title.active,
.reveal-stats.active,
.reveal-text.active{

    opacity:1;

    transform:translateY(0);

}

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

@media(max-width:1200px){

.powering-card{

    max-width:520px;

}

.powering-title{

    font-size:36px;

}

}

/*=====================================
TABLET
=====================================*/

@media(max-width:991px){

.powering-section{

    min-height:auto;

    padding:90px 0;

}

.powering-container{

    padding:0 30px;

    justify-content:center;

}

.powering-card{

    max-width:100%;

    padding:35px;

}

.powering-title{

    font-size:34px;

}

.powering-stats{

    gap:18px;

}

.power-item h3{

    font-size:22px;

}

.international-text{

    font-size:18px !important;

}

}

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

@media(max-width:767px){

.powering-section{

    padding:70px 0;

}

.powering-container{

    padding:0 20px;

}

.powering-card{

    padding:28px 22px;

    border-radius:16px;

}

.powering-title{

    font-size:28px;

    margin-bottom:25px;

}

.powering-stats{

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

    gap:16px;

}

.power-item{

    padding-bottom:12px;

}

.power-item h3{

    font-size:20px;

}

.international-text{

    font-size:17px !important;

}

.power-item span{

    font-size:12px;

}

.powering-desc{

    font-size:14px;

    line-height:1.7;

}

}

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

@media(max-width:480px){

.powering-title{

    font-size:24px;

}

.powering-stats{

    grid-template-columns:1fr;

}

.power-item h3{

    font-size:20px;

}

.international-text{

    font-size:18px !important;

}

.powering-desc{

    font-size:13px;

}

}

/* ========================================================== */

/*==================================================
GOOGLE FONT
==================================================*/
@import url('https://fonts.googleapis.com/css2?family=Roboto :wght@300;400;500;600;700&display=swap');

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

.capital-product-slider{

    width:100%;
    padding:0px 0;
    background:#ffffff;
    overflow:hidden;
    font-family:'Roboto';

}

.capital-product-slider *,
.capital-product-slider *::before,
.capital-product-slider *::after{

    box-sizing:border-box;

}

.capital-product-slider .capital-container{

    width:1320px;
    max-width:calc(100% - 40px);
    margin:auto;

}

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

.capital-product-slider .capital-heading{

    max-width:900px;
    margin:0 auto 40px;
    text-align:center;

}

.capital-product-slider .capital-subtitle{

    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    margin-bottom:16px;

}

.capital-product-slider .capital-subtitle img{

    width:15px;
    height:15px;
    display:block;

}

.capital-product-slider .capital-subtitle span{

    font-size:18px;
    font-weight:500;
    color:#5F6673;

}

.capital-product-slider .capital-heading h2{

    margin:0 0 18px;

    font-size:54px;
    font-weight:600;
    line-height:1.15;

    color:#343434;

}

.capital-product-slider .capital-heading p{

    max-width:850px;
    margin:0 auto;

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

    color:#666666;

}

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

.capital-product-slider .capitalSwiper{

    overflow:hidden;

}

.capital-product-slider .swiper-slide{

    display:flex;

}

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

.capital-product-slider .capital-card{

    display:grid;

    grid-template-columns:1fr 1fr;

    gap:18px;

    width:100%;

    height:470px;

    background:#D5ECF6;

    padding:14px;

    border-radius:22px;

}

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

.capital-product-slider .capital-image{

    width:100%;
    height:100%;

}

.capital-product-slider .capital-image img{

    width:100%;
    height:100%;

    object-fit:cover;

    border-radius:18px;

    display:block;

}

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

.capital-product-slider .capital-content{

    background:#ffffff;

    border-radius:18px;

    padding:45px;

    display:flex;

    flex-direction:column;

    justify-content:space-between;

}

.capital-product-slider .capital-content h3{

    margin:0 0 18px;

    font-size:22px;

    font-weight:600;

    color:#232323;

    line-height:1.3;

}

.capital-product-slider .capital-content p{

    margin:0;

    font-size:17px;

    line-height:1.8;

    color:#5E6673;

}

/*==================================================
VIEW ALL BUTTON
==================================================*/

.capital-product-slider .capital-btn{

    display:inline-flex;

    align-items:center;

    text-decoration:none;

    margin-top:auto;

    width:max-content;

}

.capital-product-slider .capital-btn-text{

    display:flex;

    align-items:center;

    justify-content:center;

    padding:0 26px;

    height:46px;

    background:#00A3F4;

    color:#ffffff;

    font-size:14px;

    font-weight:500;

    transition:.35s ease;

}

.capital-product-slider .capital-btn-icon{

    width:46px;

    height:46px;

    background:#ffffff;

    border:1px solid #E5E7EB;

    display:flex;

    align-items:center;

    justify-content:center;

    transition:.35s ease;

}

.capital-product-slider .capital-btn-icon img{

    width:14px;

    transition:.35s ease;

}

.capital-product-slider .capital-btn:hover .capital-btn-text{

    background:#0089CF;

}

.capital-product-slider .capital-btn:hover .capital-btn-icon{

    background:#00A3F4;

}

.capital-product-slider .capital-btn:hover .capital-btn-icon img{

    filter:brightness(0) invert(1);

    transform:translateX(4px);

}

/*==================================================
NAVIGATION
==================================================*/
.capital-product-slider .swiper-button-prev,
.capital-product-slider .swiper-button-next {
    width: 56px !important;
    height: 56px !important;
    border-radius: 50% !important;
    background: #ffffff !important;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.12) !important;
    color: #005BAC !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    z-index: 25 !important;
    margin-top: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    transition: all 0.35s ease !important;
    box-sizing: border-box !important;
}

.capital-product-slider .swiper-button-prev {
    left: 20px !important;
    right: auto !important;
}

.capital-product-slider .swiper-button-next {
    right: 20px !important;
    left: auto !important;
}

/* Bulletproof CSS Chevron Arrows - No font or CDN dependency */
.capital-product-slider .swiper-button-prev:after {
    content: '' !important;
    font-size: 0 !important;
    line-height: 0 !important;
    width: 14px !important;
    height: 14px !important;
    border-top: 3.5px solid #005BAC !important;
    border-left: 3.5px solid #005BAC !important;
    transform: rotate(-45deg) !important;
    display: block !important;
    margin-left: 5px !important;
    box-sizing: border-box !important;
    transition: border-color 0.35s ease !important;
}

.capital-product-slider .swiper-button-next:after {
    content: '' !important;
    font-size: 0 !important;
    line-height: 0 !important;
    width: 14px !important;
    height: 14px !important;
    border-top: 3.5px solid #005BAC !important;
    border-right: 3.5px solid #005BAC !important;
    transform: rotate(45deg) !important;
    display: block !important;
    margin-right: 5px !important;
    box-sizing: border-box !important;
    transition: border-color 0.35s ease !important;
}

.capital-product-slider .swiper-button-prev:hover,
.capital-product-slider .swiper-button-next:hover {
    background: #005BAC !important;
    box-shadow: 0 10px 25px rgba(0, 91, 172, 0.35) !important;
    transform: translateY(-50%) scale(1.06) !important;
}

.capital-product-slider .swiper-button-prev:hover:after,
.capital-product-slider .swiper-button-next:hover:after {
    border-color: #ffffff !important;
}

.capital-product-slider .swiper-button-disabled {
    opacity: 0.35 !important;
    cursor: not-allowed !important;
    pointer-events: none !important;
}

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

.capital-product-slider .swiper-pagination{

    position:relative;

    margin-top:28px;

}

.capital-product-slider .swiper-pagination-bullet{

    width:12px;

    height:12px;

    background:#C8D8E8;

    opacity:1;

    transition:.35s;

}

.capital-product-slider .swiper-pagination-bullet-active{

    width:34px;

    border-radius:20px;

    background:#0094E8;

}

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

.capital-product-slider .capital-card{

    transition:.4s ease;

}

.capital-product-slider .capital-card:hover{

    transform:translateY(-6px);

    box-shadow:0 25px 50px rgba(0,0,0,.10);

}

.capital-product-slider .capital-image{

    overflow:hidden;

}

.capital-product-slider .capital-image img{

    transition:transform .7s ease;

}

.capital-product-slider .capital-card:hover .capital-image img{

    transform:scale(1.05);

}

/*==================================================
TABLET
==================================================*/

@media only screen and (max-width:1024px){

.capital-product-slider{

padding:50px 0;

}

.capital-product-slider .capital-container{

max-width:calc(100% - 30px);

}

.capital-product-slider .capital-heading{

margin-bottom:30px;

}

.capital-product-slider .capital-heading h2{

font-size:42px;

}

.capital-product-slider .capital-heading p{

font-size:16px;

}

.capital-product-slider .capital-card{

grid-template-columns:1fr;

height:auto;

gap:15px;

padding:15px;

}

.capital-product-slider .capital-image{

height:350px;

}

.capital-product-slider .capital-image img{

height:100%;

}

.capital-product-slider .capital-content{

padding:35px;

}

.capital-product-slider .capital-content h3{

font-size:30px;

margin-bottom:15px;

}

.capital-product-slider .capital-content p{

font-size:16px;

line-height:1.7;

}

.capital-product-slider .swiper-button-prev,
.capital-product-slider .swiper-button-next {
    display: flex !important;
    width: 44px !important;
    height: 44px !important;
}

.capital-product-slider .swiper-button-prev {
    left: 10px !important;
}

.capital-product-slider .swiper-button-next {
    right: 10px !important;
}

.capital-product-slider .swiper-button-prev:after,
.capital-product-slider .swiper-button-next:after {
    width: 11px !important;
    height: 11px !important;
    border-width: 3px !important;
}

}

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

@media only screen and (max-width:767px){

.capital-product-slider{

padding:40px 0;

}

.capital-product-slider .capital-container{

max-width:calc(100% - 20px);

}

.capital-product-slider .capital-heading{

margin-bottom:25px;

}

.capital-product-slider .capital-subtitle{

margin-bottom:12px;

}

.capital-product-slider .capital-heading h2{

font-size:32px;

line-height:1.25;

}

.capital-product-slider .capital-heading p{

font-size:15px;

line-height:1.7;

}

.capital-product-slider .capital-card{

grid-template-columns:1fr;

padding:12px;

gap:12px;

border-radius:18px;

}

.capital-product-slider .capital-image{

height:220px;

}

.capital-product-slider .capital-image img{

height:100%;

border-radius:14px;

}

.capital-product-slider .capital-content{

padding:22px;

border-radius:14px;

}

.capital-product-slider .capital-content h3{

font-size:24px;

margin-bottom:14px;

}

.capital-product-slider .capital-content p{

font-size:15px;

line-height:1.7;

margin-bottom:25px;

}

.capital-product-slider .capital-btn-text{

height:42px;

padding:0 18px;

font-size:13px;

}

.capital-product-slider .capital-btn-icon{

width:42px;

height:42px;

}

.capital-product-slider .capital-btn-icon img{

width:13px;

}

.capital-product-slider .swiper-pagination{

margin-top:20px;

}

.capital-product-slider .swiper-button-prev,
.capital-product-slider .swiper-button-next {
    display: flex !important;
    width: 40px !important;
    height: 40px !important;
}

.capital-product-slider .swiper-button-prev {
    left: 8px !important;
}

.capital-product-slider .swiper-button-next {
    right: 8px !important;
}

.capital-product-slider .swiper-button-prev:after,
.capital-product-slider .swiper-button-next:after {
    width: 10px !important;
    height: 10px !important;
    border-width: 2.5px !important;
}

}

/*==================================================
LARGE DESKTOP
==================================================*/

@media only screen and (min-width:1600px){

.capital-product-slider .capital-container{

max-width:1440px;

}

.capital-product-slider .capital-card{

height:520px;

}

.capital-product-slider .capital-heading h2{

font-size:60px;

}

.capital-product-slider .capital-content{

padding:60px;

}

.capital-product-slider .capital-content h3{

font-size:28px;

}

.capital-product-slider .capital-content p{

font-size:18px;

}

}

/*==================================================
ELEMENTOR FIX
==================================================*/

.capital-product-slider .swiper-slide{

height:auto !important;

display:flex !important;

}

.capital-product-slider .swiper-wrapper{

align-items:stretch;

}

.capital-product-slider .capital-card{

width:100%;

}

.capital-product-slider .capital-image,
.capital-product-slider .capital-content{

height:100%;

}

.capital-product-slider img{

max-width:100%;

display:block;

}

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

.capital-subtitle,
.capital-heading h2,
.capital-heading p{

    opacity:0;

    transform:translateX(-80px);

}

.capital-heading.active .capital-subtitle{

    animation:capitalSlideLeft .8s ease forwards;

}

.capital-heading.active h2{

    animation:capitalSlideLeft .8s ease .2s forwards;

}

.capital-heading.active p{

    animation:capitalSlideLeft .8s ease .4s forwards;

}

@keyframes capitalSlideLeft{

    from{

        opacity:0;
        transform:translateX(-80px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

/* ========================================================== */

*{
box-sizing:border-box;
}

body{
margin:0;
font-family:'Roboto';
background:#f5f5f5;
}

/* SECTION */

.legrand-section{
max-width:1200px;
margin:auto;
padding:40px 20px;
}

/* GRID */

.card-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
}

/* Only Desktop */

@media (min-width: 992px) {
.card-grid{
margin-left:-42px;
}
}

/* CARD */

.project-card{
position:relative;
height:360px;
border-radius:16px;
overflow:hidden;
cursor:pointer;
}


/* IMAGE */

.project-card img{
position:absolute;
inset:0;
width:100%;
height:100%;
object-fit:cover;
z-index:1;
transition:transform .7s cubic-bezier(.22,.61,.36,1);
}

/* OVERLAY */

.overlay{
position:absolute;
inset:0;
z-index:2;
padding:24px;
display:flex;
flex-direction:column;
justify-content:flex-end;
color:#fff;
opacity:1;
background:linear-gradient(
180deg,
rgba(0,0,0,0.15) 0%,
rgba(0,0,0,0.50) 55%,
rgba(0,0,0,0.90) 100%
);
}

/* CONTENT */

.content{
transform:translateY(calc(100% - 45px));
transition:transform .45s ease;
}

/* TITLE */

.overlay h3{
font-size:20px;
line-height:1.4;
font-family:'Roboto';
font-weight:500;
margin: 0;

}

/* PARAGRAPH */

.overlay p{
font-size:14px;
line-height:1.6;
margin-top:10px;
font-family:'Roboto';
font-weight:400;
opacity:0;
transition:opacity .4s ease;
}

/* BUTTON */

.legrand-btn{
display:inline-block;
margin-top:10px;
padding:8px 20px;
background:#fff;
color:#000;
font-size:14px;
border-radius:25px;
text-decoration:none;
font-family:'Roboto';
font-weight:500;
opacity:0;
transition:opacity .4s ease;
}

/* HOVER */

.project-card:hover img{
transform:scale(1.08);
}

.project-card:hover .overlay{
background:linear-gradient(
180deg,
rgba(0,0,0,0.35) 0%,
rgba(0,0,0,0.70) 55%,
rgba(0,0,0,0.95) 100%
);
}

/* WHOLE CONTENT SLIDE */

.project-card:hover .content{
transform:translateY(0);


}


.project-card:hover p,
.project-card:hover .legrand-btn{
opacity:1;
}

/* RESPONSIVE */

@media(max-width:900px){
.card-grid{
grid-template-columns:repeat(2,1fr);
}
}

@media(max-width:600px){
.card-grid{
grid-template-columns:1fr;
}
}

/*=========================================
WHY CHOOSE MOUSE EFFECT SUPPORT
=========================================*/

/* Card */

.project-card{

    position:relative;

    overflow:hidden;

    isolation:isolate;

}

/* Canvas */

.cardCanvas{

    position:absolute;

    top:0;
    left:0;

    width:100%;
    height:100%;

    pointer-events:none;

    z-index:3;

}

/* Image */

.project-card img{

    position:absolute;

    inset:0;

    width:100%;
    height:100%;

    object-fit:cover;

    z-index:1;

    transition:
    transform .7s cubic-bezier(.22,.61,.36,1);

}

/* Overlay */

.overlay{

    position:absolute;

    inset:0;

    z-index:10;

}

/* Content */

.content{

    position:relative;

    z-index:12;

}

/* Shine Effect */

.project-card::before{

    content:"";

    position:absolute;

    top:-40%;

    left:-170%;

    width:70%;

    height:220%;

    background:linear-gradient(

        120deg,

        transparent,

        rgba(255,255,255,.45),

        transparent

    );

    transform:rotate(25deg);

    transition:1s;

    pointer-events:none;

    z-index:20;

}

.project-card:hover::before{

    left:180%;

}

/* Blue Glow */

.project-card::after{

    content:"";

    position:absolute;

    inset:0;

    border-radius:16px;

    border:1px solid rgba(0,180,255,.25);

    box-shadow:

    inset 0 0 22px rgba(0,170,255,.10),

    0 0 35px rgba(0,170,255,.18);

    opacity:0;

    transition:.45s;

    pointer-events:none;

    z-index:15;

}

.project-card:hover::after{

    opacity:1;

}

/* Lift */

.project-card{

    transition:

    transform .45s,

    box-shadow .45s;

}

.project-card:hover{

    transform:translateY(-6px);

    box-shadow:

    0 18px 40px rgba(0,0,0,.25);

}

/* Keep Layers */

.project-card img{

    z-index:1;

}

.cardCanvas{

    z-index:5;

}

.overlay{

    z-index:10;

}

.content{

    z-index:12;

}

/* Optional: Cursor */

.project-card{

    cursor:pointer;

}

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

.knowledge-heading{

    max-width:900px;

    margin:0 auto 60px;

    text-align:center;

}

.knowledge-subtitle{

    display:inline-flex;

    align-items:center;
  

    gap:8px;

    margin-bottom:18px;

}

.knowledge-subtitle span {
    font-size: 18px !important;
    font-weight: 500 !important;
    color: #5F6673;
    font-family: 'Roboto', sans-serif;
}

.knowledge-subtitle img{

    width:16px;

}

.knowledge-subtitle span{

    font-size:13px;

    font-weight:500;

    color:#5F6673;

    font-family:'Roboto',sans-serif;

}

.knowledge-heading h2{

    margin:0 0 20px;

    font-size:48px;

    font-weight:600;

    line-height:1.15;

    color:#343434;

    font-family:'Roboto',sans-serif;

}

.knowledge-heading p{

    max-width:860px;

    margin:auto;

    font-size:16px;

    line-height:1.8;

    color:#666;

    font-family:'Roboto',sans-serif;

}


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

.knowledge-subtitle,
.knowledge-heading h2,
.knowledge-heading p{

    opacity:0;

    transform:translateX(-80px);

}

.knowledge-heading.active .knowledge-subtitle{

    animation:knowledgeSlide .8s ease forwards;

}

.knowledge-heading.active h2{

    animation:knowledgeSlide .8s ease .2s forwards;

}

.knowledge-heading.active p{

    animation:knowledgeSlide .8s ease .4s forwards;

}

@keyframes knowledgeSlide{

    from{

        opacity:0;

        transform:translateX(-80px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

.legrand-section{

    max-width:1200px;
    margin:auto;
    padding:80px 20px;

}

.knowledge-heading{

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

    margin:0 auto 60px;

    text-align:center;

}

/* ========================================================== */

/*=========================================
GOOGLE FONT
=========================================*/

@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;600;700&display=swap');

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

.certificate-section{

    position:relative;

    overflow:hidden;

    padding:90px 0;

    background:#F8F9FB;

    font-family:'Roboto';

}

/*=========================================
BACKGROUND PATTERN
=========================================*/

.certificate-section::before{

    content:"";

    position:absolute;

    inset:0;

    background-image:
    radial-gradient(circle at center, rgba(0,0,0,0.03) 1px, transparent 1px),
    repeating-conic-gradient(
        from 0deg,
        rgba(0,0,0,.04) 0deg,
        rgba(0,0,0,.04) .5deg,
        transparent .5deg,
        transparent 8deg
    );

    background-size:18px 18px,100% 100%;

    opacity:.45;

    pointer-events:none;

}

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

.certificate-container{

    position:relative;

    z-index:2;

    width:100%;

    max-width:1320px;

    margin:auto;

    padding:0 20px;

}

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

.certificate-heading{

    text-align:center;

    margin-bottom:65px;

}

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

.certificate-subtitle{

    display:inline-flex;

    align-items:center;

    gap:8px;

    color:#555;

    font-size:18px;

    font-weight:500;

    margin-bottom:18px;

}

.certificate-subtitle img{

    width:14px;

    height:14px;

    object-fit:contain;

}

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

.certificate-heading h2{

    font-size:48px;

    line-height:1.18;

    font-weight:500;

    color:#202020;

    letter-spacing:-1px;

    margin:0;

    max-width:850px;

    margin-inline:auto;

}

.certificate-card{

    text-decoration:none;

    color:inherit;

}

.certificate-card:hover{

    text-decoration:none;

}

.certificate-card:visited{

    color:inherit;

}

.certificate-card:focus-visible{

    outline:2px solid #0094E8;

    outline-offset:5px;

}

/*=========================================
SMALL DESKTOP
=========================================*/

@media(max-width:1200px){

.certificate-heading h2{

font-size:46px;

}

}

/*=========================================
TABLET
=========================================*/

@media(max-width:991px){

.certificate-section{

padding:70px 0;

}

.certificate-heading{

margin-bottom:50px;

}

.certificate-heading h2{

font-size:38px;

}

}

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

@media(max-width:767px){

.certificate-section{

padding:55px 0;

}

.certificate-heading{

margin-bottom:40px;

}

.certificate-heading h2{

font-size:30px;

line-height:1.3;

}

.certificate-subtitle{

font-size:14px;

}

}

/*=========================================
CERTIFICATE GRID
=========================================*/

.certificate-grid{

    display:grid;

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

    gap:30px;

    align-items:start;

}

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

.certificate-card{

    display:flex;

    flex-direction:column;

    align-items:center;

    justify-content:flex-start;

    text-align:center;

    transition:all .35s ease;

    cursor:pointer;

}

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

.certificate-card img{

    width:135px;

    height:auto;

    display:block;

    transition:transform .35s ease;

}

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

.certificate-card h3{

    margin-top:22px;

    font-size:24px;

    line-height:1.35;

    font-weight:500;

    color:#005A9C;

}

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

.certificate-card:hover{

    transform:translateY(-8px);

}

.certificate-card:hover img{

    transform:scale(1.08);

}

.certificate-card:hover h3{

    color:#0094E8;

}

/*=========================================
TABLET
=========================================*/

@media(max-width:1024px){

.certificate-grid{

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

gap:35px 25px;

}

.certificate-card img{

width:120px;

}

.certificate-card h3{

font-size:22px;

}

}

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

@media(max-width:767px){

.certificate-grid{

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

gap:30px 20px;

}

.certificate-card img{

width:105px;

}

.certificate-card h3{

font-size:18px;

margin-top:16px;

}

}

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

@media(max-width:480px){

.certificate-grid{

grid-template-columns:1fr;

gap:28px;

}

.certificate-card img{

width:100px;

}

.certificate-card h3{

font-size:18px;

}

}
/*=========================================
PREMIUM CARD EFFECT
=========================================*/

.certificate-card{

    position:relative;

    overflow:hidden;

    border-radius:18px;

    padding:15px;

}

.certificate-card::before{

    content:"";

    position:absolute;

    left:-100%;

    top:0;

    width:100%;

    height:100%;

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.45),
        transparent
    );

    transition:.8s;

}

.certificate-card:hover::before{

    left:100%;

}

/*=========================================
IMAGE SHADOW
=========================================*/

.certificate-card img{

    filter:drop-shadow(0 12px 18px rgba(0,0,0,.15));

}

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

.certificate-card h3{

    transition:.35s;

}

/*=========================================
CENTER ALIGNMENT
=========================================*/

.certificate-grid{

    justify-items:center;

}

/*=========================================
HOVER SCALE
=========================================*/

.certificate-card:hover img{

    transform:scale(1.08) rotate(2deg);

}

/*=========================================
BACKGROUND IMPROVEMENT
=========================================*/

.certificate-section{

    background:
        radial-gradient(circle at center,#ffffff 0%,#f8f9fb 65%,#eef2f7 100%);

}

/*=========================================
DECORATIVE TOP LINES
=========================================*/

.certificate-section::after{

    content:"";

    position:absolute;

    top:0;

    left:50%;

    transform:translateX(-50%);

    width:1200px;

    height:180px;

    background:
    repeating-linear-gradient(
        100deg,
        transparent 0,
        transparent 18px,
        rgba(0,0,0,.05) 19px,
        transparent 20px
    );

    opacity:.35;

    pointer-events:none;

}

/*=========================================
BOTTOM LINES
=========================================*/

.certificate-section::before{

    opacity:.22;

}

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

.certificate-card{

    animation:cardFade .8s ease both;

}

.certificate-card:nth-child(2){

    animation-delay:.1s;

}

.certificate-card:nth-child(3){

    animation-delay:.2s;

}

.certificate-card:nth-child(4){

    animation-delay:.3s;

}

.certificate-card:nth-child(5){

    animation-delay:.4s;

}

@keyframes cardFade{

from{

opacity:0;

transform:translateY(40px);

}

to{

opacity:1;

transform:translateY(0);

}

}

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

.certificate-subtitle,
.certificate-heading h2{

    opacity:0;
    transform:translateX(-80px);

}

.certificate-heading.active .certificate-subtitle{

    animation:certificateSlide .8s ease forwards;

}

.certificate-heading.active h2{

    animation:certificateSlide .8s ease .2s forwards;

}

@keyframes certificateSlide{

    from{

        opacity:0;
        transform:translateX(-80px);

    }

    to{

        opacity:1;
        transform:translateX(0);

    }

}

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

.certificate-card{

    opacity:0;

    transform:translateY(70px);

    transition:

        opacity .8s ease,

        transform .8s ease;

}

.certificate-grid.active .certificate-card{

    opacity:1;

    transform:translateY(0);

}

.certificate-grid.active .certificate-card:nth-child(1){

    transition-delay:.1s;

}

.certificate-grid.active .certificate-card:nth-child(2){

    transition-delay:.2s;

}

.certificate-grid.active .certificate-card:nth-child(3){

    transition-delay:.3s;

}

.certificate-grid.active .certificate-card:nth-child(4){

    transition-delay:.4s;

}

.certificate-grid.active .certificate-card:nth-child(5){

    transition-delay:.5s;

}

/* ========================================================== */

.certificate-subtitle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    color: #555;
    font-size: 18px !important;
    font-weight: 500 !important;
    margin-bottom: 18px;
}

/* ========================================================== */

/*=========================================
TEXT ANIMATION
=========================================*/

.feature-title,
.feature-text{

    opacity:0;

    transform:translateX(-80px);

}

.reveal-section.active .feature-item:nth-child(1) .feature-title{

    animation:featureSlide .8s ease forwards;

}

.reveal-section.active .feature-item:nth-child(1) .feature-text{

    animation:featureSlide .8s ease .2s forwards;

}

.reveal-section.active .feature-item:nth-child(2) .feature-title{

    animation:featureSlide .8s ease .3s forwards;

}

.reveal-section.active .feature-item:nth-child(2) .feature-text{

    animation:featureSlide .8s ease .5s forwards;

}

.reveal-section.active .feature-item:nth-child(3) .feature-title{

    animation:featureSlide .8s ease .6s forwards;

}

.reveal-section.active .feature-item:nth-child(3) .feature-text{

    animation:featureSlide .8s ease .8s forwards;

}

@keyframes featureSlide{

    from{

        opacity:0;

        transform:translateX(-80px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

/* ========================================================== */

/*=========================================
TEXT ANIMATION
=========================================*/

.feature-title,
.feature-text{

    opacity:0;

    transform:translateX(-80px);

}

.reveal-section.active .feature-item:nth-child(1) .feature-title{

    animation:featureSlide .8s ease forwards;

}

.reveal-section.active .feature-item:nth-child(1) .feature-text{

    animation:featureSlide .8s ease .2s forwards;

}

.reveal-section.active .feature-item:nth-child(2) .feature-title{

    animation:featureSlide .8s ease .3s forwards;

}

.reveal-section.active .feature-item:nth-child(2) .feature-text{

    animation:featureSlide .8s ease .5s forwards;

}

.reveal-section.active .feature-item:nth-child(3) .feature-title{

    animation:featureSlide .8s ease .6s forwards;

}

.reveal-section.active .feature-item:nth-child(3) .feature-text{

    animation:featureSlide .8s ease .8s forwards;

}

@keyframes featureSlide{

    from{

        opacity:0;

        transform:translateX(-80px);

    }

    to{

        opacity:1;

        transform:translateX(0);

    }

}

/* ========================================================== */

.elementor-391 .elementor-element.elementor-element-c725494{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overflow:hidden;--padding-top:80px;--padding-bottom:20px;--padding-left:0px;--padding-right:0px;}.elementor-391 .elementor-element.elementor-element-c725494:not(.elementor-motion-effects-element-type-background), .elementor-391 .elementor-element.elementor-element-c725494 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#B6E9FF;}.elementor-391 .elementor-element.elementor-element-ec22ebe{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-ec22ebe.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-image .widget-image-caption{color:var( --e-global-color-text );font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-391 .elementor-element.elementor-element-dc2ccbc{margin:-10px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:start;}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-391 .elementor-element.elementor-element-d3e9751{margin:-14px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 13px;font-family:"Roboto", Sans-serif;font-size:14px;font-weight:300;color:#000000;}.elementor-391 .elementor-element.elementor-element-d3e9751.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-widget-icon-list .elementor-icon-list-item:not(:last-child):after{border-color:var( --e-global-color-text );}.elementor-widget-icon-list .elementor-icon-list-icon i{color:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-icon svg{fill:var( --e-global-color-primary );}.elementor-widget-icon-list .elementor-icon-list-item > .elementor-icon-list-text, .elementor-widget-icon-list .elementor-icon-list-item > a{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );}.elementor-widget-icon-list .elementor-icon-list-text{color:var( --e-global-color-secondary );}.elementor-391 .elementor-element.elementor-element-7e594ab{margin:-16px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 6px;padding:7px 7px 7px 7px;--e-icon-list-icon-size:22px;--e-icon-list-icon-align:left;--e-icon-list-icon-margin:0 calc(var(--e-icon-list-icon-size, 1em) * 0.25) 0 0;--icon-vertical-offset:0px;}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:last-child){padding-block-end:calc(0px/2);}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-items:not(.elementor-inline-items) .elementor-icon-list-item:not(:first-child){margin-block-start:calc(0px/2);}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item{margin-inline:calc(0px/2);}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-items.elementor-inline-items{margin-inline:calc(-0px/2);}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-items.elementor-inline-items .elementor-icon-list-item:after{inset-inline-end:calc(-0px/2);}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-icon i{color:#6EC1E400;transition:color 0.3s;}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-icon svg{fill:#6EC1E400;transition:fill 0.3s;}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-icon{padding-inline-end:5px;}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-item > .elementor-icon-list-text, .elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-item > a{font-family:"Roboto", Sans-serif;font-size:14px;font-weight:400;}.elementor-391 .elementor-element.elementor-element-7e594ab .elementor-icon-list-text{color:#000000;transition:color 0.3s;}.elementor-391 .elementor-element.elementor-element-656cd9f{margin:-11px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 8px;padding:7px 7px 7px 7px;--e-icon-list-icon-size:22px;--e-icon-list-icon-align:left;--e-icon-list-icon-margin:0 calc(var(--e-icon-list-icon-size, 1em) * 0.25) 0 0;--icon-vertical-offset:0px;}.elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-icon i{color:#6EC1E400;transition:color 0.3s;}.elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-icon svg{fill:#6EC1E400;transition:fill 0.3s;}.elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-icon{padding-inline-end:5px;}.elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-item > .elementor-icon-list-text, .elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-item > a{font-family:"Roboto", Sans-serif;font-size:14px;font-weight:400;}.elementor-391 .elementor-element.elementor-element-656cd9f .elementor-icon-list-text{color:#000000;transition:color 0.3s;}.elementor-391 .elementor-element.elementor-element-285a9d8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-285a9d8.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-391 .elementor-element.elementor-element-0b46bbb{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 74px;}.elementor-391 .elementor-element.elementor-element-0b46bbb .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:600;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-640988d{margin:-31px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 75px;padding:10px 0px 0px 0px;font-family:"Montserrat", Sans-serif;font-size:16px;font-weight:400;line-height:30px;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-bded86f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-f77c3b5 .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:600;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-122fbbe{margin:-31px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:10px 0px 0px 0px;font-family:"Montserrat", Sans-serif;font-size:16px;font-weight:400;line-height:30px;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-8dbc1a1{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-654a96d .elementor-heading-title{font-family:"Montserrat", Sans-serif;font-size:18px;font-weight:600;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-088d26d{margin:-31px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:10px 0px 0px 0px;font-family:"Montserrat", Sans-serif;font-size:16px;font-weight:400;line-height:30px;color:#1F1F1F;}.elementor-391 .elementor-element.elementor-element-710b4c5{--grid-template-columns:repeat(0, auto);text-align:right;--icon-size:20px;--grid-column-gap:5px;--grid-row-gap:0px;}.elementor-391 .elementor-element.elementor-element-710b4c5 .elementor-social-icon{background-color:#FDFDFD00;border-style:solid;border-width:1px 1px 1px 1px;border-color:#000000;}.elementor-391 .elementor-element.elementor-element-710b4c5 .elementor-social-icon i{color:#000000;}.elementor-391 .elementor-element.elementor-element-710b4c5 .elementor-social-icon svg{fill:#000000;}.elementor-391 .elementor-element.elementor-element-e60601f{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-e60601f:not(.elementor-motion-effects-element-type-background), .elementor-391 .elementor-element.elementor-element-e60601f > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#B6E9FF;}.elementor-widget-divider{--divider-color:var( --e-global-color-secondary );}.elementor-widget-divider .elementor-divider__text{color:var( --e-global-color-secondary );font-family:var( --e-global-typography-secondary-font-family ), Sans-serif;font-weight:var( --e-global-typography-secondary-font-weight );}.elementor-widget-divider.elementor-view-stacked .elementor-icon{background-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon{color:var( --e-global-color-secondary );border-color:var( --e-global-color-secondary );}.elementor-widget-divider.elementor-view-framed .elementor-icon, .elementor-widget-divider.elementor-view-default .elementor-icon svg{fill:var( --e-global-color-secondary );}.elementor-391 .elementor-element.elementor-element-f6201bd{--divider-border-style:solid;--divider-color:#2DC8FF;--divider-border-width:1px;margin:-37px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-391 .elementor-element.elementor-element-f6201bd .elementor-divider-separator{width:100%;}.elementor-391 .elementor-element.elementor-element-f6201bd .elementor-divider{padding-block-start:15px;padding-block-end:15px;}.elementor-391 .elementor-element.elementor-element-a6c19b0{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--overflow:hidden;--margin-top:-31px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;}.elementor-391 .elementor-element.elementor-element-a6c19b0:not(.elementor-motion-effects-element-type-background), .elementor-391 .elementor-element.elementor-element-a6c19b0 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#B6E9FF;}.elementor-391 .elementor-element.elementor-element-f9661e8{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-b5a5734{margin:-14px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;font-family:"Montserrat", Sans-serif;font-size:14px;font-weight:300;color:#000000;}.elementor-391 .elementor-element.elementor-element-b5a5734.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-391 .elementor-element.elementor-element-0bdea69{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-884139e{margin:-14px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:center;font-family:"Montserrat", Sans-serif;font-size:14px;font-weight:300;color:#000000;}.elementor-391 .elementor-element.elementor-element-884139e.elementor-element{--flex-grow:0;--flex-shrink:0;}.elementor-391 .elementor-element.elementor-element-a3a2175{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-391 .elementor-element.elementor-element-4e44c1e{margin:-14px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;text-align:end;font-family:"Montserrat", Sans-serif;font-size:14px;font-weight:300;color:#000000;}.elementor-391 .elementor-element.elementor-element-4e44c1e.elementor-element{--flex-grow:0;--flex-shrink:0;}@media(min-width:768px){.elementor-391 .elementor-element.elementor-element-ec22ebe{--width:25%;}.elementor-391 .elementor-element.elementor-element-285a9d8{--width:25%;}.elementor-391 .elementor-element.elementor-element-bded86f{--width:25%;}.elementor-391 .elementor-element.elementor-element-8dbc1a1{--width:25%;}.elementor-391 .elementor-element.elementor-element-f9661e8{--width:50%;}.elementor-391 .elementor-element.elementor-element-0bdea69{--width:50%;}.elementor-391 .elementor-element.elementor-element-a3a2175{--width:50%;}}@media(max-width:1024px) and (min-width:768px){.elementor-391 .elementor-element.elementor-element-ec22ebe{--width:261.75px;}.elementor-391 .elementor-element.elementor-element-285a9d8{--width:220.094px;}}@media(max-width:1024px){.elementor-391 .elementor-element.elementor-element-d3e9751{width:var( --container-widget-width, 241.75px );max-width:241.75px;--container-widget-width:241.75px;--container-widget-flex-grow:0;}.elementor-391 .elementor-element.elementor-element-b5a5734{width:var( --container-widget-width, 290.75px );max-width:290.75px;--container-widget-width:290.75px;--container-widget-flex-grow:0;}.elementor-391 .elementor-element.elementor-element-884139e{width:var( --container-widget-width, 241.75px );max-width:241.75px;--container-widget-width:241.75px;--container-widget-flex-grow:0;}.elementor-391 .elementor-element.elementor-element-4e44c1e{width:var( --container-widget-width, 288.75px );max-width:288.75px;--container-widget-width:288.75px;--container-widget-flex-grow:0;}}@media(max-width:767px){.elementor-391 .elementor-element.elementor-element-0b46bbb{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 17px;}.elementor-391 .elementor-element.elementor-element-640988d{margin:-33px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-f77c3b5{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-122fbbe{margin:-34px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-654a96d{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-088d26d{margin:-32px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-710b4c5{margin:-18px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 18px;}.elementor-391 .elementor-element.elementor-element-710b4c5.elementor-element{--align-self:flex-start;}.elementor-391 .elementor-element.elementor-element-b5a5734{width:var( --container-widget-width, 306.75px );max-width:306.75px;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;--container-widget-width:306.75px;--container-widget-flex-grow:0;}.elementor-391 .elementor-element.elementor-element-884139e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 5px;text-align:start;}.elementor-391 .elementor-element.elementor-element-4e44c1e{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 5px;text-align:start;}}

/* ==========================================================
   CLEAN & ROBUST RESPONSIVE HEADER (Tablet & Mobile <= 1024px)
   Direct Hamburger Controller + Contact Us + Translate
========================================================== */

@media (max-width: 1024px) {
    /* Ensure Header Container does NOT clip fixed or absolute dropdowns */
    .elementor-48,
    .elementor-48 .elementor-element.elementor-element-4d4bcd6,
    .elementor-48 .elementor-element.elementor-element-149696a,
    .elementor-48 .elementor-element.elementor-element-0830a6c,
    .elementor-48 .elementor-element.elementor-element-0830a6c > .elementor-widget-container,
    .elementor-48 .hfe-nav-menu {
        overflow: visible !important;
        transform: none !important;
        -webkit-transform: none !important;
        perspective: none !important;
        -webkit-perspective: none !important;
        contain: none !important;
    }

    /* Fixed Top Header Bar */
    .elementor-48 .elementor-element.elementor-element-4d4bcd6 {
        --width: 100% !important;
        width: 100% !important;
        max-width: 100vw !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        right: 0 !important;
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: space-between !important;
        padding: 10px 20px !important;
        min-height: 64px !important;
        box-sizing: border-box !important;
        background: #ffffff !important;
        box-shadow: 0 2px 12px rgba(0, 0, 0, 0.07) !important;
        z-index: 99999 !important;
    }

    /* Logo Container */
    .elementor-48 .elementor-element.elementor-element-089f535 {
        --width: auto !important;
        width: auto !important;
        max-width: 60% !important;
        flex: 0 1 auto !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .elementor-48 .elementor-element.elementor-element-4cf8651 {
        margin: 0 !important;
        padding: 0 !important;
        display: flex !important;
        align-items: center !important;
    }

    .elementor-48 .elementor-element.elementor-element-4cf8651 img {
        max-height: 42px !important;
        width: auto !important;
        max-width: 100% !important;
        object-fit: contain !important;
        display: block !important;
    }

    /* Navigation Container */
    .elementor-48 .elementor-element.elementor-element-149696a {
        --width: auto !important;
        width: auto !important;
        flex: 0 0 auto !important;
        margin: 0 !important;
        display: flex !important;
        align-items: center !important;
        justify-content: flex-end !important;
    }

    .elementor-48 .elementor-element.elementor-element-0830a6c > .elementor-widget-container {
        margin: 0 !important;
        padding: 0 !important;
    }

    /* Hamburger Toggle Button */
    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle {
        width: 44px !important;
        height: 44px !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        background: #F0F6FB !important;
        border: 1.5px solid #D5E4F2 !important;
        border-radius: 10px !important;
        color: #005BAC !important;
        margin: 0 !important;
        cursor: pointer !important;
        transition: all 0.2s ease !important;
        box-sizing: border-box !important;
        position: relative !important;
        z-index: 1000001 !important;
    }

    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle:hover {
        background: #E2EFF9 !important;
        border-color: #005BAC !important;
    }

    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle.is-menu-open {
        background: #005BAC !important;
        color: #ffffff !important;
        border-color: #005BAC !important;
    }

    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle svg {
        width: 20px !important;
        height: 20px !important;
        fill: currentColor !important;
        pointer-events: none !important;
    }

    /* Transform into X (Close) when active */
    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle.is-menu-open svg {
        display: none !important;
    }
    .elementor-48 .elementor-element.elementor-element-0830a6c .hfe-nav-menu__toggle.is-menu-open:after {
        content: '\2715' !important;
        font-size: 20px !important;
        font-weight: 700 !important;
        line-height: 1 !important;
        color: #ffffff !important;
        display: block !important;
        pointer-events: none !important;
    }

    /* Hide Top Bar Contact Us Button & Floating Translate on <= 1024px */
    .elementor-48 .elementor-element.elementor-element-3a6d707 {
        display: none !important;
    }

    #gt_float_wrapper,
    .gt_float_switcher {
        display: none !important;
    }

    /* =========================================
       HAMBURGER DROPDOWN (Closed vs Open)
    ========================================= */

    /* Closed State (Default) */
    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal:not(.is-menu-open) {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        pointer-events: none !important;
    }

    /* Open State */
    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal.is-menu-open {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        height: auto !important;
        position: fixed !important;
        top: 64px !important;
        left: 0 !important;
        right: 0 !important;
        width: 100vw !important;
        max-width: 100vw !important;
        max-height: calc(100vh - 64px) !important;
        overflow-y: auto !important;
        -webkit-overflow-scrolling: touch !important;
        background: #ffffff !important;
        box-shadow: 0 15px 35px rgba(0, 0, 0, 0.14) !important;
        border-top: 1px solid #E8EEF5 !important;
        padding: 16px 22px 30px 22px !important;
        box-sizing: border-box !important;
        z-index: 1000000 !important;
        pointer-events: auto !important;
    }

    /* Navigation Links */
    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal ul.hfe-nav-menu {
        display: flex !important;
        flex-direction: column !important;
        visibility: visible !important;
        opacity: 1 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        list-style: none !important;
    }

    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal ul.hfe-nav-menu li.menu-item {
        width: 100% !important;
        border-bottom: 1px solid #EEF3F8 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal ul.hfe-nav-menu li.menu-item a.hfe-menu-item {
        display: flex !important;
        align-items: center !important;
        padding: 13px 4px !important;
        font-family: "Montserrat", sans-serif !important;
        font-size: 16px !important;
        font-weight: 600 !important;
        color: #1E293B !important;
        text-decoration: none !important;
        transition: all 0.2s ease !important;
    }

    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal ul.hfe-nav-menu li.menu-item a.hfe-menu-item:hover,
    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal ul.hfe-nav-menu li.menu-item.current-menu-item a.hfe-menu-item {
        color: #005BAC !important;
        padding-left: 6px !important;
    }

    /* Mobile Menu Extras (Contact Us & Translate inside Hamburger) */
    .hfe-mobile-menu-extras {
        display: flex !important;
        flex-direction: column !important;
        gap: 16px !important;
        margin-top: 22px !important;
        padding-top: 20px !important;
        border-top: 2px solid #E8EEF5 !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }

    /* Contact Us Button inside Hamburger */
    .hfe-mobile-contact-wrap {
        width: 100% !important;
    }

    .hfe-mobile-contact-btn {
        width: 100% !important;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        gap: 10px !important;
        padding: 13px 20px !important;
        background: linear-gradient(135deg, #005BAC 0%, #0082E6 100%) !important;
        color: #ffffff !important;
        font-family: "Montserrat", sans-serif !important;
        font-size: 15px !important;
        font-weight: 600 !important;
        text-decoration: none !important;
        border-radius: 10px !important;
        box-shadow: 0 4px 15px rgba(0, 91, 172, 0.28) !important;
        box-sizing: border-box !important;
        transition: all 0.3s ease !important;
    }

    .hfe-mobile-contact-btn:hover,
    .hfe-mobile-contact-btn:active {
        background: #004582 !important;
        color: #ffffff !important;
        transform: translateY(-1px) !important;
        box-shadow: 0 6px 20px rgba(0, 91, 172, 0.38) !important;
    }

    .hfe-mobile-contact-btn svg {
        width: 18px !important;
        height: 18px !important;
        fill: currentColor !important;
        flex-shrink: 0 !important;
    }

    /* Translate Switcher inside Hamburger */
    .hfe-mobile-translate-wrap {
        width: 100% !important;
        background: #F8FAFC !important;
        border: 1.5px solid #E2E8F0 !important;
        border-radius: 12px !important;
        padding: 14px 16px !important;
        box-sizing: border-box !important;
    }

    .hfe-mobile-translate-header {
        display: flex !important;
        align-items: center !important;
        gap: 8px !important;
        margin-bottom: 10px !important;
        color: #1E293B !important;
        font-family: "Montserrat", sans-serif !important;
        font-size: 14px !important;
        font-weight: 600 !important;
    }

    .hfe-mobile-translate-header svg {
        width: 18px !important;
        height: 18px !important;
        stroke: #005BAC !important;
        flex-shrink: 0 !important;
    }

    .hfe-mobile-lang-box {
        position: relative !important;
        width: 100% !important;
    }

    .hfe-mobile-lang-select {
        width: 100% !important;
        height: 44px !important;
        padding: 0 36px 0 14px !important;
        background: #ffffff !important;
        border: 1.5px solid #CBD5E1 !important;
        border-radius: 8px !important;
        color: #1E293B !important;
        font-family: "Montserrat", sans-serif !important;
        font-size: 14px !important;
        font-weight: 500 !important;
        cursor: pointer !important;
        outline: none !important;
        box-sizing: border-box !important;
        -webkit-appearance: none !important;
        -moz-appearance: none !important;
        appearance: none !important;
        transition: border-color 0.2s ease !important;
    }

    .hfe-mobile-lang-select:focus {
        border-color: #005BAC !important;
        box-shadow: 0 0 0 3px rgba(0, 91, 172, 0.12) !important;
    }

    .hfe-mobile-lang-chevron {
        position: absolute !important;
        right: 14px !important;
        top: 50% !important;
        transform: translateY(-60%) rotate(45deg) !important;
        width: 7px !important;
        height: 7px !important;
        border-right: 2px solid #64748B !important;
        border-bottom: 2px solid #64748B !important;
        pointer-events: none !important;
    }
}

/* On Desktop (> 1024px): Ensure mobile extras are completely hidden */
@media (min-width: 1025px) {
    .hfe-mobile-menu-extras {
        display: none !important;
    }
}

/* =========================================
   GOOGLE TRANSLATE MOBILE HEADER STABILITY
========================================= */
body {
    top: 0 !important;
}

.goog-te-banner-frame,
.goog-te-banner-frame.skiptranslate,
iframe.goog-te-banner-frame,
.goog-te-balloon-frame {
    display: none !important;
    visibility: hidden !important;
    height: 0 !important;
    width: 0 !important;
}

#goog-gt-tt,
.goog-tooltip,
.goog-tooltip:hover {
    display: none !important;
}

.goog-text-highlight {
    background-color: transparent !important;
    box-shadow: none !important;
}

/* Prevent translation of dropdown & language elements */
.notranslate {
    -webkit-transform: none;
    transform: none;
}


/* ==========================================================
   DESKTOP HEADER NAVIGATION MENU: HOVER, CLICK & NORMAL STATES
   Prevents white/washed-out text on click / focus / active
========================================================== */
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-sub-menu-item,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-sub-menu-item {
    color: #1E293B !important;
    background-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
    transition: color 0.2s ease !important;
}

/* Hover, Click, Active, Focus, and Current Active States */
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item:hover,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item:active,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item:focus,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item:focus-visible,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item.highlighted,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item.current-menu-item a.hfe-menu-item,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item.current_page_item a.hfe-menu-item,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.hfe-nav-menu li.menu-item.current-menu-ancestor a.hfe-menu-item,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item:hover,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item:active,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item:focus,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item:focus-visible,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item a.hfe-menu-item.highlighted,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item.current-menu-item a.hfe-menu-item,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item.current_page_item a.hfe-menu-item,
.elementor-widget-navigation-menu ul.hfe-nav-menu li.menu-item.current-menu-ancestor a.hfe-menu-item {
    color: #005BAC !important;
    background-color: transparent !important;
    outline: none !important;
    box-shadow: none !important;
    text-decoration: none !important;
}

/* Submenu dropdown hover & active */
.elementor-48 .elementor-element.elementor-element-0830a6c ul.sub-menu li.menu-item a.hfe-sub-menu-item:hover,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.sub-menu li.menu-item a.hfe-sub-menu-item:active,
.elementor-48 .elementor-element.elementor-element-0830a6c ul.sub-menu li.menu-item a.hfe-sub-menu-item:focus {
    color: #005BAC !important;
    background-color: #F0F6FB !important;
}


/* ==========================================================
   DESKTOP HEADER PERMANENT DISPLAY & VISIBILITY (min-width: 1025px)
   Guarantees desktop menu is NEVER hidden or disabled on click
========================================================== */
@media (min-width: 1025px) {
    .elementor-48 .elementor-element-0830a6c nav,
    .elementor-48 .elementor-element-0830a6c nav.hfe-nav-menu__layout-horizontal,
    .elementor-48 .elementor-element-0830a6c .hfe-nav-menu,
    .elementor-48 .elementor-element-0830a6c ul.hfe-nav-menu {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        height: auto !important;
        position: static !important;
        transform: none !important;
    }

    .elementor-48 .elementor-element-0830a6c ul.hfe-nav-menu li.menu-item,
    .elementor-48 .elementor-element-0830a6c ul.hfe-nav-menu li.menu-item a.hfe-menu-item {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        pointer-events: auto !important;
        cursor: pointer !important;
    }
}


/* ==========================================================
   GLOBAL HEADER CONTACT US BUTTON (HOMEPAGE, SOLUTIONS, TECHNOLOGY, ALL PAGES)
   Guarantees identical, pristine Home Page button design across all pages
========================================================== */
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn,
header .elementor-element-b3cec03 a.btn,
header #masthead .elementor-element-b3cec03 a.btn,
.elementor-48 .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn,
.elementor-48 .elementor-element-b3cec03 a.btn,
header a.btn[href*="contact-us"],
.elementor-48 a.btn[href*="contact-us"],
body header a.btn,
body .elementor-48 .elementor-element-3a6d707 a.btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    min-width: 0 !important;
    width: auto !important;
    max-width: none !important;
    min-height: 0 !important;
    height: auto !important;
    box-sizing: border-box !important;
    margin: 10px 0 0 0 !important;
    padding: 8px 18px !important;
    background: #1aa3d8 !important;
    background-color: #1aa3d8 !important;
    color: #ffffff !important;
    border: none !important;
    border-width: 0 !important;
    border-style: none !important;
    border-color: transparent !important;
    border-radius: 8px !important;
    font-family: 'Roboto', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size: 13px !important;
    font-weight: 300 !important;
    line-height: normal !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    white-space: nowrap !important;
    text-decoration: none !important;
    box-shadow: none !important;
    outline: none !important;
    transform: none !important;
    transition: background-color 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease !important;
    cursor: pointer !important;
}

/* Hover state */
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn:hover,
header .elementor-element-b3cec03 a.btn:hover,
header #masthead .elementor-element-b3cec03 a.btn:hover,
.elementor-48 .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn:hover,
.elementor-48 .elementor-element-b3cec03 a.btn:hover,
header a.btn[href*="contact-us"]:hover,
.elementor-48 a.btn[href*="contact-us"]:hover,
body header a.btn:hover,
body .elementor-48 .elementor-element-3a6d707 a.btn:hover {
    background: #148ab7 !important;
    background-color: #148ab7 !important;
    border: none !important;
    border-color: transparent !important;
    color: #ffffff !important;
    transform: translateY(-3px) !important;
    box-shadow: 0 4px 12px rgba(20, 138, 183, 0.35) !important;
    gap: 8px !important;
}

/* Focus, Active, Focus-Visible states */
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn:active,
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn:focus,
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn:focus-visible,
header .elementor-element-b3cec03 a.btn:active,
header .elementor-element-b3cec03 a.btn:focus,
header a.btn[href*="contact-us"]:active,
header a.btn[href*="contact-us"]:focus,
body header a.btn:active,
body header a.btn:focus {
    background: #148ab7 !important;
    background-color: #148ab7 !important;
    color: #ffffff !important;
    transform: translateY(0) !important;
    outline: none !important;
    box-shadow: none !important;
}

/* Phone icon inside header Contact Us button */
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn i,
header .elementor-element-b3cec03 a.btn i,
header a.btn[href*="contact-us"] i,
.elementor-48 a.btn[href*="contact-us"] i,
body header a.btn i {
    display: inline-block !important;
    font-size: 13px !important;
    color: #ffffff !important;
    margin-left: 4px !important;
    line-height: 1 !important;
    transform: none !important;
    transition: transform 0.3s ease !important;
}

/* Remove any pseudo-elements added by conflicting page styles */
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn::before,
header .elementor-element-3a6d707 .elementor-element-b3cec03 a.btn::after,
header .elementor-element-b3cec03 a.btn::before,
header .elementor-element-b3cec03 a.btn::after,
header a.btn[href*="contact-us"]::before,
header a.btn[href*="contact-us"]::after,
body header a.btn::before,
body header a.btn::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
    height: 0 !important;
    border: 0 !important;
    background: none !important;
}

/* ==========================================================================
   CAPITAL POWERS - ENQUIRE NOW POPUP MODAL & FORM STYLES
   ========================================================================== */

/* Cursor pointer on floating Enquire Now button */
.floating-wrapper a.float-item {
    cursor: pointer !important;
}

/* Modal Backdrop (All Modals) */
.capital-modal-backdrop {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999999 !important;
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.3s cubic-bezier(0.16, 1, 0.3, 1), visibility 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-sizing: border-box !important;
}

.capital-modal-backdrop.is-active {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

/* Backdrop Blur Overlay */
.capital-modal-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(11, 27, 54, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 1;
}

/* Modal Dialog Box */
.capital-modal-dialog {
    position: relative;
    z-index: 2;
    width: 92%;
    max-width: 680px;
    max-height: 90vh;
    background: #ffffff;
    border-radius: 16px;
    box-shadow: 0 25px 60px -15px rgba(0, 0, 0, 0.35), 0 0 0 1px rgba(0, 91, 172, 0.08);
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 34px 38px 36px 38px;
    box-sizing: border-box;
    transform: translateY(24px) scale(0.96);
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
}

.capital-modal-backdrop.is-active .capital-modal-dialog {
    transform: translateY(0) scale(1);
}

/* Custom Scrollbar for Modal Dialog */
.capital-modal-dialog::-webkit-scrollbar {
    width: 6px;
}
.capital-modal-dialog::-webkit-scrollbar-track {
    background: #f1f5f9;
    border-radius: 4px;
}
.capital-modal-dialog::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 4px;
}
.capital-modal-dialog::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Close Button */
.capital-modal-close {
    position: absolute;
    top: 18px;
    right: 20px;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    background: #f1f5f9;
    border: none;
    font-size: 24px;
    line-height: 1;
    color: #475569;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.2s ease, color 0.2s ease, transform 0.2s ease;
    padding: 0;
    z-index: 10;
}

.capital-modal-close:hover {
    background: #fee2e2;
    color: #dc2626;
    transform: rotate(90deg);
}

/* Header */
.capital-modal-header {
    margin-bottom: 22px;
    padding-right: 36px;
}

.capital-modal-badge {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #005BAC;
    background: rgba(0, 91, 172, 0.08);
    padding: 4px 12px;
    border-radius: 20px;
    margin-bottom: 8px;
}

.capital-modal-title {
    font-size: 26px !important;
    font-weight: 700 !important;
    color: #0b1f44 !important;
    margin: 0 0 6px 0 !important;
    line-height: 1.25 !important;
}

.capital-modal-subtitle {
    font-size: 13.5px !important;
    color: #64748b !important;
    margin: 0 !important;
    line-height: 1.5 !important;
}

/* Form Grid */
.capital-form-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px 16px;
    box-sizing: border-box;
}

.capital-form-group {
    display: flex;
    flex-direction: column;
    box-sizing: border-box;
}

.capital-col-full {
    grid-column: 1 / -1;
}

/* Labels */
.capital-form-group label {
    font-size: 12.5px !important;
    font-weight: 600 !important;
    color: #1e293b !important;
    margin-bottom: 6px !important;
    display: block !important;
    text-align: left !important;
}

.capital-form-group label .cap-req {
    color: #ef4444;
    font-weight: 700;
    margin-left: 2px;
}

.capital-form-group label .cap-opt {
    color: #94a3b8;
    font-weight: 400;
    font-size: 11.5px;
    margin-left: 4px;
}

/* Inputs, Selects, Textareas */
.capital-form-group input[type="text"],
.capital-form-group input[type="email"],
.capital-form-group input[type="tel"],
.capital-form-group select,
.capital-form-group textarea {
    width: 100% !important;
    box-sizing: border-box !important;
    font-family: inherit !important;
    font-size: 13.5px !important;
    color: #0f172a !important;
    background-color: #f8fafc !important;
    border: 1.5px solid #e2e8f0 !important;
    border-radius: 8px !important;
    padding: 10px 14px !important;
    line-height: 1.4 !important;
    transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease !important;
    outline: none !important;
    margin: 0 !important;
}

.capital-form-group input::placeholder,
.capital-form-group textarea::placeholder {
    color: #94a3b8 !important;
    opacity: 1;
}

.capital-form-group input:focus,
.capital-form-group select:focus,
.capital-form-group textarea:focus {
    background-color: #ffffff !important;
    border-color: #005BAC !important;
    box-shadow: 0 0 0 3px rgba(0, 91, 172, 0.12) !important;
}

/* Custom Select Arrow */
.capital-form-group select {
    appearance: none !important;
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23475569' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") !important;
    background-repeat: no-repeat !important;
    background-position: right 12px center !important;
    background-size: 14px 14px !important;
    padding-right: 34px !important;
    cursor: pointer !important;
}

.capital-form-group textarea {
    resize: vertical !important;
    min-height: 74px !important;
    max-height: 160px !important;
}

/* File Upload Dropzone */
.capital-file-dropzone {
    position: relative;
    border: 2px dashed #cbd5e1;
    border-radius: 10px;
    background: #f8fafc;
    padding: 16px 20px;
    text-align: center;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease;
    box-sizing: border-box;
}

.capital-file-dropzone:hover,
.capital-file-dropzone.is-dragover {
    border-color: #005BAC;
    background: rgba(0, 91, 172, 0.04);
}

.capital-file-dropzone input[type="file"] {
    position: absolute;
    inset: 0;
    width: 100% !important;
    height: 100% !important;
    opacity: 0;
    cursor: pointer;
    z-index: 2;
}

.capital-file-placeholder {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    pointer-events: none;
}

.capital-file-placeholder svg {
    margin-bottom: 2px;
}

.capital-file-text {
    font-size: 13px;
    color: #334155;
}

.capital-file-text strong {
    color: #005BAC;
}

.capital-file-hint {
    font-size: 11.5px;
    color: #94a3b8;
}

.capital-file-selected {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: #ffffff;
    border: 1px solid #005BAC;
    border-radius: 6px;
    padding: 8px 12px;
}

.capital-file-name {
    font-size: 12.5px;
    font-weight: 500;
    color: #005BAC;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 85%;
    text-align: left;
}

.capital-file-remove {
    background: #fee2e2;
    border: none;
    border-radius: 50%;
    width: 22px;
    height: 22px;
    font-size: 16px;
    line-height: 1;
    color: #dc2626;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 3;
    transition: background 0.2s ease;
}

.capital-file-remove:hover {
    background: #fca5a5;
}

/* Error Message Box */
.capital-form-error {
    margin-top: 14px;
    padding: 10px 14px;
    border-radius: 8px;
    background: #fef2f2;
    border: 1px solid #fecaca;
    color: #b91c1c;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
}

/* Modal Footer & Submit Button */
.capital-modal-footer {
    margin-top: 22px;
    text-align: center;
}

.capital-submit-btn {
    width: 100% !important;
    height: 48px !important;
    background: linear-gradient(135deg, #005BAC 0%, #0087db 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 15px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 14px rgba(0, 91, 172, 0.35) !important;
    padding: 0 20px !important;
    text-decoration: none !important;
}

.capital-submit-btn:hover {
    background: linear-gradient(135deg, #004b8f 0%, #0074be 100%) !important;
    box-shadow: 0 6px 20px rgba(0, 91, 172, 0.45) !important;
    transform: translateY(-1px);
}

.capital-submit-btn:active {
    transform: translateY(0);
}

.capital-submit-btn:disabled {
    opacity: 0.7 !important;
    cursor: not-allowed !important;
    transform: none !important;
}

@keyframes cap-spin {
    to { transform: rotate(360deg); }
}

.capital-btn-spinner svg {
    animation: cap-spin 0.8s linear infinite;
    display: inline-block;
    vertical-align: middle;
}

.capital-submit-note {
    font-size: 12px !important;
    color: #64748b !important;
    margin-top: 10px !important;
    margin-bottom: 0 !important;
    line-height: 1.4 !important;
}

/* Success Confirmation Screen */
.capital-enquiry-success {
    text-align: center;
    padding: 30px 16px;
}

.capital-success-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #ecfdf5;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 16px;
}

.capital-enquiry-success h3 {
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #0b1f44 !important;
    margin-bottom: 8px !important;
}

.capital-enquiry-success p {
    font-size: 14px !important;
    color: #475569 !important;
    max-width: 440px !important;
    margin: 0 auto 24px auto !important;
    line-height: 1.5 !important;
}

.capital-btn-done {
    display: inline-block;
    padding: 10px 32px;
    background: #005BAC;
    color: #ffffff;
    border: none;
    border-radius: 8px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s ease;
}

.capital-btn-done:hover {
    background: #004b8f;
}

/* Responsive Mobile Layout */
@media (max-width: 768px) {
    .capital-modal-dialog {
        width: 94%;
        max-height: 94vh;
        padding: 24px 18px 24px 18px;
        border-radius: 12px;
    }

    .capital-modal-header {
        margin-bottom: 16px;
        padding-right: 32px;
    }

    .capital-modal-title {
        font-size: 21px !important;
    }

    .capital-modal-subtitle {
        font-size: 12.5px !important;
    }

    .capital-form-grid {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .capital-col-full {
        grid-column: auto;
    }

    .capital-submit-btn {
        height: 46px !important;
        font-size: 14px !important;
    }

    .capital-modal-close {
        top: 14px;
        right: 14px;
        width: 32px;
        height: 32px;
        font-size: 20px;
    }
}

/* ==========================================================================
   CAPITAL POWERS - DOWNLOADS MODAL & BROCHURE STYLES
   ========================================================================== */

.capital-download-dialog {
    max-width: 650px !important;
}

.capital-brochure-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin: 14px 0 22px 0;
}

.capital-brochure-card {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 16px 20px;
    background: #f8fafc;
    border: 1.5px solid #e2e8f0;
    border-radius: 12px;
    transition: all 0.25s ease;
    box-sizing: border-box;
}

.capital-brochure-card:hover {
    background: #ffffff;
    border-color: #005BAC;
    box-shadow: 0 8px 24px rgba(0, 91, 172, 0.1);
    transform: translateY(-2px);
}

.capital-brochure-icon {
    width: 48px;
    height: 48px;
    border-radius: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.capital-icon-water {
    background: #e0f2fe;
}
.capital-icon-gas {
    background: #ffedd5;
}
.capital-icon-power {
    background: #e0e7ff;
}

.capital-brochure-info {
    flex: 1 1 auto;
    min-width: 0;
    text-align: left;
}

.capital-brochure-title {
    font-size: 15.5px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    margin: 0 0 3px 0 !important;
    line-height: 1.3 !important;
}

.capital-brochure-desc {
    font-size: 12.5px !important;
    color: #64748b !important;
    margin: 0 0 5px 0 !important;
    line-height: 1.4 !important;
}

.capital-brochure-meta {
    display: inline-block;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #005BAC !important;
    background: rgba(0, 91, 172, 0.08);
    padding: 2px 8px;
    border-radius: 4px;
}

.capital-brochure-actions {
    flex-shrink: 0;
}

.capital-brochure-btn {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 9px 16px !important;
    background: #005BAC !important;
    color: #ffffff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    border-radius: 8px !important;
    text-decoration: none !important;
    transition: all 0.2s ease !important;
    box-shadow: 0 3px 10px rgba(0, 91, 172, 0.25) !important;
    white-space: nowrap !important;
}

.capital-brochure-btn:hover {
    background: #004582 !important;
    color: #ffffff !important;
    box-shadow: 0 5px 16px rgba(0, 91, 172, 0.4) !important;
    transform: translateY(-1px);
}

.capital-btn-download-all {
    width: 100% !important;
    height: 48px !important;
    background: linear-gradient(135deg, #0b72a8 0%, #005BAC 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 8px !important;
    font-size: 14.5px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px !important;
    cursor: pointer !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 14px rgba(11, 114, 168, 0.3) !important;
}

.capital-btn-download-all:hover {
    background: linear-gradient(135deg, #095f8d 0%, #004582 100%) !important;
    box-shadow: 0 6px 18px rgba(11, 114, 168, 0.45) !important;
    transform: translateY(-1px);
}

/* Desktop Flyout on Hover */
@media (min-width: 769px) {
    .floating-wrapper {
        overflow: visible !important;
    }
    .float-downloads-container {
        position: relative;
    }
    .float-downloads-flyout {
        position: absolute;
        right: calc(100% + 14px);
        top: 50%;
        transform: translateY(-50%) translateX(10px);
        background: #ffffff;
        border: 1px solid #e2e8f0;
        border-radius: 14px;
        box-shadow: 0 16px 40px rgba(0, 0, 0, 0.16), 0 0 0 1px rgba(0, 91, 172, 0.06);
        padding: 12px;
        min-width: 260px;
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s ease;
        z-index: 10001;
    }
    .float-downloads-container:hover .float-downloads-flyout,
    .float-downloads-flyout:hover {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        transform: translateY(-50%) translateX(0);
    }
    .float-flyout-header {
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.8px;
        color: #005BAC;
        padding: 4px 10px 8px 10px;
        border-bottom: 1px solid #f1f5f9;
        margin-bottom: 6px;
    }
    .float-flyout-item {
        display: flex;
        align-items: center;
        gap: 10px;
        padding: 9px 10px;
        border-radius: 8px;
        color: #1e293b !important;
        font-size: 13px !important;
        font-weight: 500 !important;
        text-decoration: none !important;
        transition: background 0.18s ease, color 0.18s ease;
    }
    .float-flyout-item:hover {
        background: #f0f7ff;
        color: #005BAC !important;
    }
    .float-flyout-item i {
        font-size: 14px;
        width: 18px;
        text-align: center;
        color: #005BAC;
    }
    .float-flyout-item span.flyout-size {
        margin-left: auto;
        font-size: 11px;
        color: #94a3b8;
    }
}

@media (max-width: 768px) {
    .float-downloads-flyout {
        display: none !important;
    }
    .capital-brochure-card {
        flex-direction: column;
        align-items: flex-start;
        gap: 12px;
        padding: 14px;
    }
    .capital-brochure-actions {
        width: 100%;
    }
    .capital-brochure-btn {
        width: 100% !important;
        justify-content: center !important;
        box-sizing: border-box !important;
    }
}

/* =========================================================
   CERTIFICATE MODAL VIEWER FIX (CENTERING & RESPONSIVE SLIDER)
========================================================= */

/* True Viewport Fixed Centering */
.certificate-modal {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 9999999 !important;
    display: none;
    align-items: center !important;
    justify-content: center !important;
    padding: 20px !important;
    box-sizing: border-box !important;
    transform: none !important;
}

.certificate-modal.is-open {
    display: flex !important;
}

.certificate-modal-backdrop {
    position: absolute !important;
    inset: 0 !important;
    background: rgba(10, 20, 30, 0.85) !important;
    backdrop-filter: blur(6px) !important;
    -webkit-backdrop-filter: blur(6px) !important;
}

.certificate-modal-dialog {
    position: relative !important;
    z-index: 2 !important;
    width: min(1040px, 94vw) !important;
    height: min(88vh, 860px) !important;
    margin: auto !important;
    display: flex !important;
    flex-direction: column !important;
    transform: none !important;
}

.certificate-modal-content {
    position: relative !important;
    width: 100% !important;
    height: 100% !important;
    background: #ffffff !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 25px 80px rgba(0, 0, 0, 0.55) !important;
    display: flex !important;
    flex-direction: column !important;
}

.certificate-modal-top {
    height: 52px !important;
    padding: 0 54px 0 20px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    background: #f8fafc !important;
    border-bottom: 1px solid #e2e8f0 !important;
    font-family: 'Roboto', Arial, sans-serif !important;
    flex-shrink: 0 !important;
}

.certificate-modal-title {
    color: #0f172a !important;
    font-size: 17px !important;
    font-weight: 600 !important;
}

.certificate-modal-counter {
    color: #005BAC !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    background: rgba(0, 91, 172, 0.08) !important;
    padding: 4px 12px !important;
    border-radius: 20px !important;
}

.certificate-pdf-wrap {
    flex: 1 1 0 !important;
    width: 100% !important;
    height: calc(100% - 52px) !important;
    background: #f1f5f9 !important;
}

.certificate-pdf-wrap iframe,
.certificate-pdf-frame {
    width: 100% !important;
    height: 100% !important;
    border: none !important;
    display: block !important;
}

.certificate-modal-close {
    position: absolute !important;
    z-index: 30 !important;
    top: -14px !important;
    right: -14px !important;
    width: 42px !important;
    height: 42px !important;
    border: 2px solid #ffffff !important;
    border-radius: 50% !important;
    background: #005BAC !important;
    color: #ffffff !important;
    font-size: 26px !important;
    line-height: 1 !important;
    display: flex !align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.2s ease, background 0.2s ease !important;
}

.certificate-modal-close:hover {
    background: #e11d48 !important;
    transform: scale(1.08) !important;
}

/* Modal Slider Navigation Arrows */
.certificate-modal-arrow {
    position: absolute !important;
    z-index: 25 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 46px !important;
    height: 46px !important;
    border: 2px solid #ffffff !important;
    border-radius: 50% !important;
    background: #005BAC !important;
    color: #ffffff !important;
    font-size: 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    cursor: pointer !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.35) !important;
    transition: background 0.2s ease, transform 0.2s ease !important;
}

.certificate-modal-arrow:hover {
    background: #004481 !important;
    transform: translateY(-50%) scale(1.1) !important;
}

.certificate-modal-prev {
    left: 12px !important;
}

.certificate-modal-next {
    right: 12px !important;
}

@media (min-width: 1240px) {
    .certificate-modal-prev {
        left: -24px !important;
    }
    .certificate-modal-next {
        right: -24px !important;
    }
}

.certificate-modal-arrow.is-hidden {
    display: none !important;
}

body.certificate-modal-open {
    overflow: hidden !important;
}

@media (max-width: 767px) {
    .certificate-modal {
        padding: 8px !important;
    }
    .certificate-modal-dialog {
        width: 100% !important;
        height: 94vh !important;
    }
    .certificate-modal-close {
        top: -8px !important;
        right: -6px !important;
        width: 36px !important;
        height: 36px !important;
        font-size: 24px !important;
    }
    .certificate-modal-arrow {
        width: 38px !important;
        height: 38px !important;
        font-size: 16px !important;
    }
}

/* =========================================================
   CERTIFICATE LOGOS ALIGNMENT WITH CENTER LOGO
========================================================= */

.certificate-grid {
    display: grid !important;
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 30px !important;
    align-items: center !important;
    justify-items: center !important;
}

.certificate-card {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    text-align: center !important;
    width: 100% !important;
    max-width: 220px !important;
}

.certificate-card img {
    height: 110px !important;
    width: auto !important;
    max-width: 140px !important;
    object-fit: contain !important;
    display: block !important;
    margin: 0 auto !important;
    transition: transform .35s ease !important;
}

.certificate-card h3 {
    min-height: 56px !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    margin-top: 18px !important;
    text-align: center !important;
}

@media (max-width: 1024px) {
    .certificate-grid {
        grid-template-columns: repeat(3, 1fr) !important;
        gap: 32px 20px !important;
    }
    .certificate-card img {
        height: 95px !important;
    }
}

@media (max-width: 767px) {
    .certificate-grid {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 28px 16px !important;
    }
    .certificate-card img {
        height: 85px !important;
    }
}

@media (max-width: 480px) {
    .certificate-grid {
        grid-template-columns: 1fr !important;
    }
}

/* =========================================================
   CAREER PAGE "APPLY NOW" SECTION STYLING
========================================================= */

.capital-career-apply-section {
    position: relative;
    padding: 85px 0 90px;
    background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
    border-top: 1px solid #e2e8f0;
    width: 100%;
}

.capital-apply-wrapper {
    max-width: 860px;
    margin: 0 auto;
    background: #ffffff;
    border-radius: 20px;
    padding: 50px 48px;
    box-shadow: 0 20px 50px rgba(0, 91, 172, 0.08), 0 2px 10px rgba(0, 0, 0, 0.03);
    border: 1px solid rgba(0, 91, 172, 0.12);
}

.capital-apply-header {
    text-align: center;
    margin-bottom: 36px;
}

.capital-apply-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    background: rgba(0, 91, 172, 0.08);
    color: #005BAC;
    padding: 6px 16px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.6px;
    text-transform: uppercase;
    margin-bottom: 14px;
}

.capital-apply-badge img {
    width: 14px;
    height: 14px;
}

.capital-apply-title {
    font-size: 40px !important;
    font-weight: 700 !important;
    color: #0f172a !important;
    line-height: 1.2 !important;
    margin: 0 0 10px 0 !important;
    letter-spacing: -0.5px !important;
}

.capital-apply-subtitle {
    color: #475569 !important;
    font-size: 16px !important;
    line-height: 1.55 !important;
    margin: 0 auto !important;
    max-width: 620px !important;
}

.capital-career-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 24px;
}

.capital-career-apply-section .capital-form-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.capital-career-apply-section .capital-col-full {
    grid-column: 1 / -1;
}

.capital-career-apply-section label {
    font-size: 13.5px;
    font-weight: 600;
    color: #1e293b;
}

.capital-career-apply-section .cap-req {
    color: #e11d48;
    margin-left: 2px;
}

.capital-career-apply-section input[type="text"],
.capital-career-apply-section input[type="email"],
.capital-career-apply-section input[type="tel"],
.capital-career-apply-section textarea {
    width: 100%;
    padding: 12px 16px;
    border: 1.5px solid #cbd5e1;
    border-radius: 10px;
    font-size: 14.5px;
    color: #0f172a;
    background: #f8fafc;
    transition: all 0.2s ease;
    box-sizing: border-box;
    font-family: inherit;
}

.capital-career-apply-section input[type="text"]:focus,
.capital-career-apply-section input[type="email"]:focus,
.capital-career-apply-section input[type="tel"]:focus,
.capital-career-apply-section textarea:focus {
    border-color: #005BAC;
    background: #ffffff;
    box-shadow: 0 0 0 3px rgba(0, 91, 172, 0.14);
    outline: none;
}

.capital-career-apply-section textarea {
    resize: vertical;
    min-height: 100px;
}

.cap-file-input-wrapper {
    position: relative;
    overflow: hidden;
    display: block;
    width: 100%;
}

.cap-file-input-wrapper input[type="file"] {
    width: 100%;
    padding: 10px 14px;
    border: 1.5px dashed #005BAC;
    border-radius: 10px;
    background: #f0f7ff;
    cursor: pointer;
    font-size: 13px;
    color: #0f172a;
    box-sizing: border-box;
}

.cap-file-hint {
    font-size: 11.5px;
    color: #64748b;
    margin-top: 4px;
}

.capital-career-submit-wrap {
    text-align: center;
    margin-top: 10px;
}

.capital-career-btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px 52px;
    background: linear-gradient(135deg, #005BAC 0%, #01ADEF 100%);
    color: #ffffff;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: 0.5px;
    border: none;
    border-radius: 50px !important;
    cursor: pointer;
    transition: all 0.3s ease;
    box-shadow: 0 8px 24px rgba(0, 91, 172, 0.35);
}

.capital-career-btn-submit:hover {
    background: linear-gradient(135deg, #004888 0%, #006ec4 100%);
    box-shadow: 0 8px 25px rgba(0, 91, 172, 0.45);
    transform: translateY(-2px);
}

.capital-career-btn-submit:disabled {
    opacity: 0.65;
    cursor: not-allowed;
    transform: none;
}

.capital-career-disclaimer {
    font-size: 12px;
    color: #64748b;
    margin-top: 14px;
}

.capital-career-status {
    margin-top: 20px;
    padding: 14px 18px;
    border-radius: 10px;
    font-size: 14.5px;
    line-height: 1.5;
    text-align: center;
}

.capital-career-status.is-success {
    background: #ecfdf5;
    color: #065f46;
    border: 1px solid #a7f3d0;
}

.capital-career-status.is-error {
    background: #fef2f2;
    color: #991b1b;
    border: 1px solid #fecaca;
}

@media (max-width: 768px) {
    .capital-career-apply-section {
        padding: 55px 16px 60px;
    }
    .capital-apply-wrapper {
        padding: 30px 20px;
        border-radius: 16px;
    }
    .capital-apply-title {
        font-size: 30px !important;
    }
    .capital-career-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .capital-career-btn-submit {
        width: 100%;
    }
}

/* =========================================================
   BANNER LEFT ALIGNMENT UNDER HEADER LOGO ROUND ICON
========================================================= */
:root {
    --capital-banner-left: clamp(38px, 3.024vw, 60px);
}

@media (min-width: 992px) {
    .capital-solutions-banner-container,
    .capital-technology-banner-container,
    .capital-about-banner-container,
    .capital-media-banner-container {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        margin: 0 !important;
        padding-left: var(--capital-banner-left, clamp(38px, 3.024vw, 60px)) !important;
        padding-right: clamp(20px, 3vw, 40px) !important;
        box-sizing: border-box !important;
        display: flex !important;
        align-items: center !important;
    }

    .capital-solutions-banner-content,
    .capital-technology-banner-content,
    .capital-about-banner-content {
        padding-left: 0 !important;
        margin-left: 0 !important;
        max-width: 780px !important;
        width: 58% !important;
        box-sizing: border-box !important;
    }

    .capital-media-banner-content {
        padding-left: 0 !important;
        margin-left: 0 !important;
        max-width: 560px !important;
        width: 42% !important;
        box-sizing: border-box !important;
    }
}

/* =========================================================
   ENHANCED BANNER TYPOGRAPHY ACROSS ALL PAGES (+2px)
========================================================= */

/* 1. Solutions Banner */
.capital-solutions-banner-content h1 {
    font-size: 60px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.5px !important;
}

.capital-solutions-banner-content p {
    font-size: 23px !important;
    line-height: 1.6 !important;
}

.capital-solutions-eyebrow {
    font-size: 17px !important;
    letter-spacing: 1.8px !important;
}

/* 2. Technology Banner */
.capital-technology-banner-content h1 {
    font-size: 60px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.5px !important;
}

.capital-technology-banner-content p {
    font-size: 23px !important;
    line-height: 1.6 !important;
}

/* 3. About Us Banner */
.capital-about-banner-content h1 {
    font-size: 60px !important;
    line-height: 1.15 !important;
    letter-spacing: -0.5px !important;
}

.capital-about-banner-content p {
    font-size: 23px !important;
    line-height: 1.6 !important;
}

.capital-about-eyebrow {
    font-size: 17px !important;
    letter-spacing: 1.8px !important;
}

.capital-about-journey span {
    font-size: 18px !important;
}

/* 4. Contact Us Banner */
.cps-banner-content h1,
.contact-hero h1 {
    font-size: 56px !important;
    line-height: 1.18 !important;
}

.cps-banner-content p,
.contact-hero p {
    font-size: 21px !important;
    line-height: 1.65 !important;
}

/* 5. Career Banner */
.career-hero-content h1,
.career-hero h1 {
    font-size: 66px !important;
    letter-spacing: 2px !important;
}

/* 6. Inside Capital Banner */
.capital-media-banner-content h1 {
    font-size: 60px !important;
    line-height: 1.15 !important;
}

.capital-media-banner-content h2 {
    font-size: 30px !important;
    line-height: 1.35 !important;
}

/* Responsive typography adjustments */
@media (max-width: 991px) {
    .capital-solutions-banner-content h1,
    .capital-technology-banner-content h1,
    .capital-about-banner-content h1,
    .capital-media-banner-content h1 {
        font-size: 48px !important;
    }
    .cps-banner-content h1,
    .contact-hero h1 {
        font-size: 46px !important;
    }
    .career-hero-content h1,
    .career-hero h1 {
        font-size: 54px !important;
    }
    .capital-solutions-banner-content p,
    .capital-technology-banner-content p,
    .capital-about-banner-content p,
    .cps-banner-content p,
    .contact-hero p {
        font-size: 19px !important;
    }
}

@media (max-width: 767px) {
    .capital-solutions-banner-content h1,
    .capital-technology-banner-content h1,
    .capital-about-banner-content h1,
    .capital-media-banner-content h1 {
        font-size: 36px !important;
    }
    .cps-banner-content h1,
    .contact-hero h1 {
        font-size: 34px !important;
    }
    .career-hero-content h1,
    .career-hero h1 {
        font-size: 42px !important;
    }
    .capital-solutions-banner-content p,
    .capital-technology-banner-content p,
    .capital-about-banner-content p,
    .cps-banner-content p,
    .contact-hero p {
        font-size: 19px !important;
    }
}

/* =========================================================
   HOME PAGE VIDEO HERO - EXACT FULL VIEWPORT & TOP-PINNED FIT (DESKTOP)
   Header + Hero = exact 100vh on arrival (no scrolling required)
   Zero top crop: video top pinned to top, bottom cropped naturally
========================================================= */
@media (min-width: 1025px) {
    html body.home .elementor-element-1dfc61a,
    html body.home .elementor .capital-home-video-hero,
    html body.home section.capital-home-video-hero,
    html body.home .capital-home-video-hero {
        position: relative !important;
        width: 100vw !important;
        max-width: 100vw !important;
        height: var(--capital-hero-height, calc(100vh - 76px)) !important;
        min-height: 380px !important;
        max-height: var(--capital-hero-height, calc(100vh - 76px)) !important;
        margin: 0 !important;
        padding: 0 !important;
        left: 0 !important;
        right: 0 !important;
        transform: none !important;
        overflow: hidden !important;
        background: #000 !important;
        display: block !important;
        line-height: normal !important;
    }

    html body.home .elementor .capital-home-video-hero video,
    html body.home .elementor .capital-home-video-hero .capital-home-video,
    html body.home section.capital-home-video-hero video,
    html body.home .capital-home-video-hero #capital-home-video {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: 100% !important;
        min-height: 100% !important;
        max-height: 100% !important;
        object-fit: cover !important;
        object-position: center top !important;
        transform: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.home .capital-home-video-hero .capital-video-sound-btn {
        position: absolute !important;
        right: 28px !important;
        bottom: 28px !important;
        z-index: 10 !important;
    }
}

/* =========================================================
   HOME PAGE VIDEO HERO - RESPONSIVE (TABLET & MOBILE <= 1024px)
   Zero black void, natural aspect ratio, sound button positioned
========================================================= */
@media (max-width: 1024px) {
    html body.home .elementor-element-1dfc61a,
    html body.home .elementor .capital-home-video-hero,
    html body.home section.capital-home-video-hero,
    html body.home .capital-home-video-hero {
        position: relative !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        margin: 0 !important;
        padding: 0 !important;
        left: auto !important;
        right: auto !important;
        overflow: hidden !important;
        background: transparent !important;
        display: block !important;
        line-height: 0 !important;
    }

    html body.home .elementor .capital-home-video-hero video,
    html body.home .elementor .capital-home-video-hero .capital-home-video,
    html body.home section.capital-home-video-hero video,
    html body.home .capital-home-video-hero #capital-home-video {
        position: relative !important;
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        object-fit: contain !important;
        object-position: center top !important;
        transform: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    html body.home .capital-home-video-hero .capital-video-sound-btn {
        position: absolute !important;
        right: 14px !important;
        bottom: 14px !important;
        z-index: 10 !important;
    }
}

/* =========================================================
   CAREER PAGE HERO - VERTICAL CENTERING & ALIGNMENT
========================================================= */
html body .capital-careers-page section.career-hero,
html body .capital-careers-page .career-hero,
section.career-hero {
    position: relative !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 500px !important;
    min-height: 480px !important;
    max-height: 520px !important;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    overflow: hidden !important;
    background: #062c49 !important;
    box-sizing: border-box !important;
}

html body .capital-careers-page section.career-hero img.career-hero-bg,
html body .capital-careers-page .career-hero-bg,
.career-hero-bg {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: right center !important;
    margin: 0 !important;
    padding: 0 !important;
    display: block !important;
    z-index: 1 !important;
}

html body .capital-careers-page section.career-hero .career-hero-overlay,
html body .capital-careers-page .career-hero-overlay,
.career-hero-overlay {
    position: absolute !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    height: 100% !important;
    z-index: 2 !important;
    pointer-events: none !important;
    background: linear-gradient(90deg, rgba(255,255,255,0.94) 0%, rgba(255,255,255,0.80) 35%, rgba(255,255,255,0.25) 65%, rgba(0,0,0,0.05) 100%) !important;
}

html body .capital-careers-page section.career-hero .career-hero-content,
html body .capital-careers-page .career-hero-content,
.career-hero-content {
    position: relative !important;
    inset: auto !important;
    top: auto !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    z-index: 3 !important;
    width: 100% !important;
    max-width: 900px !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    padding-left: var(--capital-banner-left, clamp(38px, 3.024vw, 60px)) !important;
    padding-right: 24px !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-start !important;
    justify-content: center !important;
    text-align: left !important;
    line-height: 1.15 !important;
    box-sizing: border-box !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
}

html body .capital-careers-page section.career-hero h1,
html body .capital-careers-page .career-hero h1,
.career-hero h1 {
    margin: 0 !important;
    padding: 0 !important;
    color: #111111 !important;
    font-size: clamp(38px, 4.2vw, 62px) !important;
    line-height: 1.08 !important;
    font-weight: 400 !important;
    letter-spacing: -0.5px !important;
    text-transform: none !important;
    text-align: left !important;
}

html body .capital-careers-page section.career-hero h1 span,
html body .capital-careers-page .career-hero h1 span,
.career-hero h1 span {
    display: block !important;
    margin: 0 !important;
    margin-left: 0 !important;
    padding: 0 !important;
    color: #111111 !important;
    font-weight: 400 !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    text-align: left !important;
}

html body .capital-careers-page section.career-hero h1 strong,
html body .capital-careers-page .career-hero h1 strong,
.career-hero h1 strong {
    display: block !important;
    margin: 0 !important;
    margin-left: 0 !important;
    padding: 0 !important;
    color: #005BAC !important;
    font-weight: 700 !important;
    font-size: inherit !important;
    letter-spacing: inherit !important;
    text-align: left !important;
}

/* Tablet */
@media (max-width: 991px) {
    html body .capital-careers-page section.career-hero,
    html body .capital-careers-page .career-hero,
    section.career-hero {
        height: 420px !important;
        min-height: 400px !important;
        max-height: 440px !important;
    }
    html body .capital-careers-page section.career-hero .career-hero-content,
    html body .capital-careers-page .career-hero-content,
    .career-hero-content {
        padding-left: clamp(24px, 4vw, 36px) !important;
    }
    html body .capital-careers-page section.career-hero h1,
    html body .capital-careers-page .career-hero h1,
    .career-hero h1 {
        font-size: 48px !important;
    }
}

/* Mobile */
@media (max-width: 767px) {
    html body .capital-careers-page section.career-hero,
    html body .capital-careers-page .career-hero,
    section.career-hero {
        height: 360px !important;
        min-height: 340px !important;
        max-height: 380px !important;
    }
    html body .capital-careers-page section.career-hero img.career-hero-bg,
    html body .capital-careers-page .career-hero-bg,
    .career-hero-bg {
        object-position: 72% center !important;
    }
    html body .capital-careers-page section.career-hero .career-hero-content,
    html body .capital-careers-page .career-hero-content,
    .career-hero-content {
        padding-left: 20px !important;
        padding-right: 16px !important;
    }
    html body .capital-careers-page section.career-hero h1,
    html body .capital-careers-page .career-hero h1,
    .career-hero h1 {
        font-size: 38px !important;
    }
}

@media (max-width: 480px) {
    html body .capital-careers-page section.career-hero,
    html body .capital-careers-page .career-hero,
    section.career-hero {
        height: 320px !important;
        min-height: 300px !important;
        max-height: 340px !important;
    }
    html body .capital-careers-page section.career-hero h1,
    html body .capital-careers-page .career-hero h1,
    .career-hero h1 {
        font-size: 32px !important;
    }
}

/* =========================================================
   CAREER APPLY NOW SUBMIT BUTTON ENHANCEMENT
========================================================= */
.capital-career-btn-submit {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    padding: 16px 52px !important;
    background: linear-gradient(135deg, #005BAC 0%, #01ADEF 100%) !important;
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    letter-spacing: 0.5px !important;
    border: none !important;
    border-radius: 50px !important;
    cursor: pointer !important;
    transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1) !important;
    box-shadow: 0 10px 28px rgba(0, 91, 172, 0.42) !important;
}

.capital-career-btn-submit:hover {
    background: linear-gradient(135deg, #004787 0%, #008ece 100%) !important;
    box-shadow: 0 14px 34px rgba(0, 91, 172, 0.55) !important;
    transform: translateY(-2px) !important;
}

.capital-career-btn-submit:active {
    transform: translateY(0) !important;
    box-shadow: 0 6px 18px rgba(0, 91, 172, 0.4) !important;
}

.capital-career-btn-submit .capital-btn-send-icon {
    width: 18px !important;
    height: 18px !important;
    display: inline-block !important;
    stroke: #ffffff !important;
    transition: transform 0.25s ease !important;
    flex-shrink: 0 !important;
}

.capital-career-btn-submit:hover .capital-btn-send-icon {
    transform: translateX(3px) translateY(-1px);
}

/* =========================================================
   REVEAL & SCROLL ANIMATION SAFETY OVERRIDE
   Ensures sections are completely visible
========================================================= */
.reveal.active,
.fade-left.active,
.fade-right.active,
.zoom.active,
.career-reveal-bottom.active,
.career-reveal-left.active,
.career-reveal-right.active {
    opacity: 1 !important;
    transform: none !important;
}


/* =========================================================
   DOWNLOAD MODAL - VIEW & DOWNLOAD ACTION BUTTONS
========================================================= */
.capital-brochure-actions {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    flex-shrink: 0 !important;
    flex-wrap: wrap !important;
}

.capital-brochure-btn.capital-btn-view {
    background: linear-gradient(135deg, #005BAC 0%, #01ADEF 100%) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 50px !important;
    padding: 9px 18px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 7px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
    box-shadow: 0 4px 12px rgba(0, 91, 172, 0.25) !important;
}

.capital-brochure-btn.capital-btn-view:hover {
    background: linear-gradient(135deg, #004582 0%, #0082E6 100%) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 16px rgba(0, 91, 172, 0.35) !important;
}

.capital-brochure-btn.capital-btn-dl {
    background: #f1f5f9 !important;
    color: #005BAC !important;
    border: 1px solid #cbd5e1 !important;
    border-radius: 50px !important;
    padding: 9px 15px !important;
    font-size: 13.5px !important;
    font-weight: 600 !important;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    text-decoration: none !important;
    transition: all 0.25s ease !important;
}

.capital-brochure-btn.capital-btn-dl:hover {
    background: #e2e8f0 !important;
    color: #003c73 !important;
    border-color: #94a3b8 !important;
    transform: translateY(-2px) !important;
}

@media (max-width: 600px) {
    .capital-brochure-actions {
        width: 100% !important;
        justify-content: flex-start !important;
        margin-top: 8px !important;
    }
}

/* =========================================================
   HOMEPAGE FIRST SECTION (ABOUT SECTION) - READ MORE BUTTON FIX
   Guarantees pristine colors, heights, radii and hover states
========================================================= */
html body.home .about-section .about-btn,
html body.home .about-bottom .about-btn,
html body .about-section .about-btn,
html body .about-bottom .about-btn {
    display: inline-flex !important;
    align-items: stretch !important;
    text-decoration: none !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    outline: none !important;
    height: 52px !important;
    box-shadow: 0 4px 14px rgba(0, 87, 168, 0.15) !important;
    transition: all 0.35s ease !important;
    cursor: pointer !important;
}

html body.home .about-section .about-btn .btn-text,
html body.home .about-bottom .about-btn .btn-text,
html body .about-section .about-btn .btn-text,
html body .about-bottom .about-btn .btn-text {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    padding: 0 28px !important;
    background: #0057A8 !important;
    background-color: #0057A8 !important;
    color: #ffffff !important;
    font-family: 'Roboto', sans-serif !important;
    font-size: 16px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
    border-radius: 8px 0 0 8px !important;
    border: none !important;
    text-decoration: none !important;
    transition: background-color 0.35s ease, color 0.35s ease !important;
    box-sizing: border-box !important;
}

html body.home .about-section .about-btn .btn-icon,
html body.home .about-bottom .about-btn .btn-icon,
html body .about-section .about-btn .btn-icon,
html body .about-bottom .about-btn .btn-icon {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 52px !important;
    min-width: 52px !important;
    max-width: 52px !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    background: #EDF4FB !important;
    background-color: #EDF4FB !important;
    border-radius: 0 8px 8px 0 !important;
    border: none !important;
    transition: background-color 0.35s ease !important;
    box-sizing: border-box !important;
}

html body.home .about-section .about-btn .btn-icon img,
html body.home .about-bottom .about-btn .btn-icon img,
html body .about-section .about-btn .btn-icon img,
html body .about-bottom .about-btn .btn-icon img {
    width: 16px !important;
    height: auto !important;
    max-width: 16px !important;
    display: block !important;
    filter: none !important;
    transition: transform 0.35s ease, filter 0.35s ease !important;
}

html body.home .about-section .about-btn:hover,
html body.home .about-bottom .about-btn:hover,
html body .about-section .about-btn:hover,
html body .about-bottom .about-btn:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 62, 121, 0.25) !important;
    text-decoration: none !important;
}

html body.home .about-section .about-btn:hover .btn-text,
html body.home .about-bottom .about-btn:hover .btn-text,
html body .about-section .about-btn:hover .btn-text,
html body .about-bottom .about-btn:hover .btn-text {
    background: #003E79 !important;
    background-color: #003E79 !important;
    color: #ffffff !important;
}

html body.home .about-section .about-btn:hover .btn-icon,
html body.home .about-bottom .about-btn:hover .btn-icon,
html body .about-section .about-btn:hover .btn-icon,
html body .about-bottom .about-btn:hover .btn-icon {
    background: #0057A8 !important;
    background-color: #0057A8 !important;
}

html body.home .about-section .about-btn:hover .btn-icon img,
html body.home .about-bottom .about-btn:hover .btn-icon img,
html body .about-section .about-btn:hover .btn-icon img,
html body .about-bottom .about-btn:hover .btn-icon img {
    transform: translateX(5px) !important;
    filter: brightness(0) invert(1) !important;
}

html body.home .about-section .about-btn:active,
html body.home .about-bottom .about-btn:active,
html body .about-section .about-btn:active,
html body .about-bottom .about-btn:active {
    transform: translateY(0) !important;
    box-shadow: 0 4px 12px rgba(0, 87, 168, 0.2) !important;
}

@media (max-width: 767px) {
    html body.home .about-section .about-btn,
    html body.home .about-bottom .about-btn,
    html body .about-section .about-btn,
    html body .about-bottom .about-btn {
        height: 46px !important;
    }
    html body.home .about-section .about-btn .btn-text,
    html body.home .about-bottom .about-btn .btn-text,
    html body .about-section .about-btn .btn-text,
    html body .about-bottom .about-btn .btn-text {
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
        padding: 0 20px !important;
        font-size: 14px !important;
    }
    html body.home .about-section .about-btn .btn-icon,
    html body.home .about-bottom .about-btn .btn-icon,
    html body .about-section .about-btn .btn-icon,
    html body .about-bottom .about-btn .btn-icon {
        width: 46px !important;
        min-width: 46px !important;
        max-width: 46px !important;
        height: 46px !important;
        min-height: 46px !important;
        max-height: 46px !important;
    }
    html body.home .about-section .about-btn .btn-icon img,
    html body.home .about-bottom .about-btn .btn-icon img,
    html body .about-section .about-btn .btn-icon img,
    html body .about-bottom .about-btn .btn-icon img {
        width: 14px !important;
    }
}

/* =========================================================
   SOLUTIONS PAGE - MOBILE APPLICATION STORE BUTTONS (MATCH HOMEPAGE)
========================================================= */
#applications-solution .app-download-buttons,
.power-track-mobile-apps .app-download-buttons,
.capital-home-store-buttons {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 12px !important;
    margin-top: 18px !important;
    margin-bottom: 8px !important;
    width: 100% !important;
    flex-wrap: wrap !important;
    box-sizing: border-box !important;
}

#applications-solution .app-download-buttons .capital-store-badge-link,
.power-track-mobile-apps .app-download-buttons .capital-store-badge-link,
.capital-home-store-buttons .capital-store-badge-link {
    display: inline-block !important;
    line-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: transparent !important;
    border-radius: 5px !important;
    overflow: hidden !important;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.10) !important;
    transition: transform 0.25s ease, opacity 0.25s ease, box-shadow 0.25s ease !important;
    cursor: pointer !important;
    text-decoration: none !important;
}

#applications-solution .app-download-buttons .capital-store-badge-link:hover,
.power-track-mobile-apps .app-download-buttons .capital-store-badge-link:hover,
.capital-home-store-buttons .capital-store-badge-link:hover {
    transform: translateY(-2px) !important;
    opacity: 0.92 !important;
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.16) !important;
    text-decoration: none !important;
}

#applications-solution .app-download-buttons .capital-store-badge-img,
.power-track-mobile-apps .app-download-buttons .capital-store-badge-img,
.capital-home-store-buttons .capital-store-badge-img {
    height: 38px !important;
    width: auto !important;
    max-width: 128px !important;
    display: block !important;
    object-fit: contain !important;
    border-radius: 5px !important;
    border: none !important;
}

/* Hide legacy custom text button */
#applications-solution .app-store-button,
.power-track-mobile-apps .app-store-button {
    display: none !important;
}

@media (max-width: 767px) {
    #applications-solution .app-download-buttons,
    .power-track-mobile-apps .app-download-buttons,
    .capital-home-store-buttons {
        gap: 10px !important;
        margin-top: 14px !important;
    }

    #applications-solution .app-download-buttons .capital-store-badge-img,
    .power-track-mobile-apps .app-download-buttons .capital-store-badge-img,
    .capital-home-store-buttons .capital-store-badge-img {
        height: 34px !important;
        max-width: 112px !important;
    }
}

/* =========================================================
   INSIDE CAPITAL - FULLY CENTERED RESPONSIVE VIDEO MODAL
========================================================= */
#mediaModal.media-modal {
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    z-index: 99999999 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    box-sizing: border-box !important;
    background: rgba(0, 0, 0, 0.94) !important;
    backdrop-filter: blur(8px) !important;
    -webkit-backdrop-filter: blur(8px) !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.3s ease, visibility 0.3s ease !important;
    margin: 0 !important;
    transform: none !important;
}

#mediaModal.media-modal.open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
}

#mediaModal .media-modal-inner {
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    max-width: 1120px !important;
    max-height: calc(100vh - 60px) !important;
    max-height: calc(100dvh - 60px) !important;
    margin: auto !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    transform: none !important;
    background: #000 !important;
    border-radius: 12px !important;
    overflow: hidden !important;
    box-shadow: 0 24px 60px rgba(0, 0, 0, 0.75) !important;
}

#mediaModal .media-modal-video {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    max-width: min(1120px, calc((100vh - 80px) * 16 / 9)) !important;
    max-width: min(1120px, calc((100dvh - 80px) * 16 / 9)) !important;
    max-height: calc(100vh - 80px) !important;
    max-height: calc(100dvh - 80px) !important;
    aspect-ratio: 16 / 9 !important;
    object-fit: contain !important;
    background: #000 !important;
    border-radius: 12px !important;
    outline: none !important;
    margin: 0 auto !important;
}

#mediaModal .media-close {
    position: fixed !important;
    top: 24px !important;
    right: 24px !important;
    left: auto !important;
    bottom: auto !important;
    width: 44px !important;
    height: 44px !important;
    border: none !important;
    border-radius: 50% !important;
    background: rgba(255, 255, 255, 0.95) !important;
    color: #111 !important;
    font-size: 26px !important;
    line-height: 1 !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    z-index: 100000000 !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.35) !important;
    transition: transform 0.25s ease, background 0.25s ease, color 0.25s ease !important;
}

#mediaModal .media-close:hover {
    transform: rotate(90deg) scale(1.06) !important;
    background: #ef2029 !important;
    color: #fff !important;
}

@media (max-width: 767px) {
    #mediaModal.media-modal {
        padding: 12px !important;
    }
    #mediaModal .media-modal-inner,
    #mediaModal .media-modal-video {
        border-radius: 8px !important;
        max-height: calc(100dvh - 60px) !important;
    }
    #mediaModal .media-close {
        top: 14px !important;
        right: 14px !important;
        width: 38px !important;
        height: 38px !important;
        font-size: 22px !important;
    }
}