/*
Theme Name: OceanWP Child Theme
Theme URI: https://oceanwp.org/
Description: OceanWP WordPress child theme.
Author: OceanWP
Author URI: https://oceanwp.org/
Template: oceanwp
Version: 1.0
*/

/* Parent stylesheet should be loaded from functions.php not using @import */
@import url("https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap");

:root {
    /* Animation durations */
    --dur-slow: 1s;
    --dur-normal: 0.5s;
    --dur-fast: 0.3s;
    --ease-smooth: cubic-bezier(0.19, 1, 0.22, 1);

    /* Spacing scale */
    --space-0: 0;
    --space-1: 0.1rem;
    --space-2: 0.2rem;
    --space-4: 0.4rem;
    --space-5: 0.5rem;
    --space-6: 0.6rem;
    --space-8: 0.8rem;
    --space-10: 1rem;
    --space-12: 1.2rem;
    --space-14: 1.4rem;
    --space-15: 1.5rem;
    --space-16: 1.6rem;
    --space-18: 1.8rem;
    --space-20: 2rem;
    --space-22: 2.2rem;
    --space-24: 2.4rem;
    --space-25: 2.5rem;
    --space-30: 3rem;
    --space-32: 3.2rem;
    --space-36: 3.6rem;
    --space-40: 4rem;
    --space-50: 5rem;
    --space-60: 6rem;
    --space-70: 7rem;
    --space-80: 8rem;
    --space-100: 10rem;
    --space-120: 12rem;
    --space-150: 15rem;
    --space-200: 20rem;
    --space-250: 25rem;
    --space-300: 30rem;
    --space-350: 35rem;

    /* Percentage sizes */
    --size-p5: 5%;
    --size-p10: 10%;
    --size-p15: 15%;
    --size-p20: 20%;
    --size-p25: 25%;
    --size-p30: 30%;
    --size-p50: 50%;
    --size-p60: 60%;
    --size-p75: 75%;
    --size-p80: 80%;
    --size-p100: 100%;

    /* Common shadows */
    --shadow-glass: 0 0.4rem 3rem rgba(0 0 0 / 10%);
    --shadow-card: 0 0 1rem rgba(0 0 0 / 10%);

    /* Glassmorphic base */
    --glass-bg: rgba(255 255 255 / 25%);
    --glass-border: rgba(255 255 255 / 30%);
    --glass-blur: 1rem;

    /* Common border radius */
    --radius-sm: 0.8rem;
    --radius-md: 1.6rem;
    --radius-lg: 2.4rem;
    --radius-xl: 4rem;
    --radius-full: 50%;
}

/* ============================================
   BASE STYLES & UTILITIES
   ============================================ */

body {
    overflow-x: hidden;

    & .elementor a {
        & svg,
        & i {
            transition: transform var(--dur-slow) var(--ease-smooth);
        }

        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
            outline: none !important;
            text-decoration: none !important;

            & svg,
            & i {
                transform: translateX(calc(var(--space-4) * -1));
                transition: transform var(--dur-slow) var(--ease-smooth);
            }
        }
    }

    & #ocean-preloader .preloader-image {
        max-inline-size: var(--space-300);

        & img {
            inline-size: var(--space-200);
        }
    }

    & .site-main {
        margin-block: 0;
    }
}

/* Hidden elements utility */
.section-tech-stack
    .eael-filter-gallery-container
    .eael-gallery-grid-item
    .gallery-item-caption-wrap
    .gallery-item-hoverer-bg,
.section-open-positions
    .career-job-posts
    .eael-adv-accordion
    .eael-accordion-list
    .eael-accordion-header
    :is(.eael-advanced-accordion-icon-opened, .eael-advanced-accordion-icon-closed),
.blog .blog-entry .blog-entry-inner .meta li .owp-sep,
.single.single-post .ocean-single-post-header,
.single.single-post .post-thumbnail,
.eael-simple-menu-toggle-text,
.swiper .swiper-notification,
.tss-meta-info {
    visibility: hidden;
    position: absolute;
    display: none;
    opacity: 0;
    padding: var(--size-0);
    margin: var(--size-0);
    block-size: var(--size-0);
    inline-size: var(--size-0);
    inset: var(--size-0);
}

/* ============================================
   GLASSMORPHIC COMPONENTS
   ============================================ */

.tabs-office-location .eael-advance-tabs .eael-tabs-content,
.glassmorphic-dark-v2,
.glassmorphic-dark,
.glassmorphic {
    box-shadow: var(--shadow-glass);
    border: var(--space-1) solid var(--glass-border);
    background: var(--glass-bg);
    -webkit-backdrop-filter: blur(var(--glass-blur));
    backdrop-filter: blur(var(--glass-blur));
    border-radius: var(--radius-md);
}

.glassmorphic-dark {
    background: rgba(0 0 0 / 50%);
    backdrop-filter: blur(var(--space-20));
    -webkit-backdrop-filter: blur(var(--space-20));
}

.glassmorphic-v2 {
    background: rgba(255 255 255 / 10%);
    border-radius: var(--radius-xl);
}

.glassmorphic-dark-v2 {
    background: rgba(0 0 0 / 10%);
    border-radius: var(--radius-xl);
}

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

.section_def_padding {
    padding-block: var(--space-120);
}

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

.custom_button {
    & .elementor-button {
        & .elementor-button-icon {
            transform: rotate(-45deg);
            transition: transform var(--dur-slow) var(--ease-smooth);
        }

        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
            & .elementor-button-icon {
                transform: rotate(0);
                transition: transform var(--dur-slow) var(--ease-smooth);
            }
        }
    }
}

.elementor-heading-title a {
    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
        border: none !important;
    }
}

.hero-section-title {
    & .elementor-heading-title {
        display: inline-flex;
        align-items: center;
        gap: var(--space-5);
    }
}

/* ============================================
   HERO SECTIONS
   ============================================ */
#footer-widgets,
#footer-widgets .footer-widgets-inner,
.hero-banner-main,
.hero-services-main .services_book_call_wrap,
.hero-careers-main,
.hero-casestudies-main,
.hero-banner-home,
.hero-banner-home .hero-custom-image,
.custom-blog-list .post,
.contact-main,
.services-main,
.testimonials-main,
:is(.blog, .category) .blog-entry .blog-entry-inner,
:is(.services-grid, .home-services-grid, .section-case-studies-list)
    .eael-post-grid
    .eael-grid-post
    .eael-grid-post-holder,
.section-why,
.section-hero-blog,
.section-have-project,
.section-dreams-reality,
.section-hero-career .career-custom-chips,
.section-team-founder .eael-team-item .eael-team-image,
.section-our-story :is(.story-left, .story-left span, .story-right .desc-wrapper),
.section-our-products .our-products-grid-wrap :is(.product_item, .product_item .product_item_meta) {
    position: relative;
    z-index: 1;
}

/* Pseudo-element patterns */
#footer-widgets::before,
.custom-blog-list .post::before,
.contact-main::before,
.testimonials-main::before,
.services-main:is(::before, ::after),
.hero-banner-home::after,
.hero-banner-main::before,
.hero-careers-main::after,
.hero-casestudies-main::after,
.hero-banner-home .hero-custom-image::before,
.hero-banner-main .hero-banner-main-overlay::after,
.hero-services-main .services_book_call_wrap::before,
.section-have-project:is(::before, ::after),
.section-hero-career .career-custom-chips::before,
.section-dreams-reality::before,
.section-dreams-reality::after,
.section-dreams-reality .process-container::before,
.section-dreams-reality .process-container::after,
.section-dreams-reality .process-container .process-item::before,
.section-dreams-reality .process-container .process-item::after,
.section-dreams-reality .process-container .process-item .circle::before,
.section-dreams-reality .process-container .process-item .circle::after,
.section-team-founder .eael-team-item .eael-team-image::after,
.section-our-story :is(.story-left, .story-left span, .story-right .desc-wrapper)::before,
.section-our-story :is(.story-left, .story-left span, .story-right .desc-wrapper)::after,
.section-our-products .our-products-grid-wrap :is(.product_item, .product_item .product_item_meta)::before,
:is(.blog, .category) .blog-entry .blog-entry-inner::before,
:is(.services-grid, .home-services-grid, .section-case-studies-list)
    .eael-post-grid
    .eael-grid-post
    .eael-grid-post-holder::before {
    z-index: -1;
    content: "";
    position: absolute;
}

.hero-banner-home {
    &::after {
        z-index: 0;
        inset: var(--space-0);
        inline-size: var(--size-p100);
        block-size: var(--size-p100);
        background-color: rgba(0 0 0 / 75%);
    }
}

.hero-services-main .services_book_call_wrap {
    max-inline-size: var(--space-350) !important;
    box-shadow: var(--shadow-glass);
    border: var(--space-1) solid var(--glass-border);
    background: rgba(255 255 255 / 5%);
    backdrop-filter: blur(var(--space-10));
    border-radius: var(--radius-sm);

    &::before {
        background-image: radial-gradient(circle at center, rgba(255 255 255, 0.35) 0%, transparent 70%);
        inset-block-start: calc(var(--space-25) * -1);
        inset-inline-start: calc(var(--space-25) * -1);
        inline-size: var(--space-50);
        block-size: var(--space-50);
        z-index: -1;
    }
}

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

.custom-blog-list .post,
.blog .blog-entry .blog-entry-inner,
.category .blog-entry .blog-entry-inner,
.hero-banner-home .hero-custom-image,
.section-our-products .our-products-grid-wrap .product_item,
.section-our-products .our-products-grid-wrap .product_item .product_item_meta,
.section-case-studies-list .eael-post-grid .eael-grid-post .eael-grid-post-holder {
    background:
        linear-gradient(#fff, #fff) padding-box,
        linear-gradient(to right, #449af8, #abf5f4) border-box;
    border: var(--space-1) solid transparent;
    border-radius: var(--radius-lg);
    padding: var(--space-16);
    overflow: hidden;

    &::before {
        inset: var(--space-0);
        background-color: var(--e-global-color-text);
    }
}

/* ============================================
   HEADER STYLES
   ============================================ */

#site-header {
    position: fixed;
    inset-block-start: var(--space-20);

    & .custom-header-wrap {
        border-radius: var(--space-100);

        & .eael-simple-menu-toggle {
            border-radius: var(--radius-sm);
        }

        & .custom_button .elementor-button {
            &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                border-color: transparent;
            }

            & .elementor-button-content-wrapper {
                align-items: center;
            }
        }

        & .rtmega-menu-area {
            position: relative;
            &.rtmega-menu-mobile-button-wrapper {
                z-index: 9998;
            }
            &.menu-wrapper {
                z-index: 9999;
            }

            & .desktop-menu-area,
            & .mobile-menu-area {
                & ul.rtmega-megamenu .menu-item .menu-link {
                    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                        border-color: transparent;
                    }
                }
            }

            & .desktop-menu-area ul.rtmega-megamenu {
                & .menu-item {
                    padding-inline: var(--space-10);

                    &.menu-item-has-children .sub-menu.rtmegamenu-contents {
                        background-color: unset;
                        box-shadow: unset;

                        &:has(.services_menu) {
                            min-width: 800px;
                        }

                        &:has(.products_menu) {
                            min-width: 250px;
                        }

                        & .custom-menu-two-column .elementor-icon-list-items {
                            column-count: 2;
                        }
                    }
                }

                & #nav-menu-item-16332.menu-item {
                    display: none;
                }
            }

            & .mobile-menu-area {
                & .rtmega-menu-mobile-sidebar {
                    block-size: calc(100vh + var(--space-10));
                    padding: var(--space-40) var(--space-20) var(--space-20);
                    max-inline-size: calc(var(--space-250) + var(--space-30));
                    inset-inline-end: calc(var(--space-30) * -1);
                    inset-block-start: calc(var(--space-30) * -1);

                    & .rtmega-menu-mobile-close {
                        inset-inline-end: var(--space-0);
                        inset-block-start: var(--space-10);
                    }

                    & ul.rtmega-megamenu {
                        padding-block-start: var(--space-20);

                        & .menu-item {
                            padding-inline: var(--space-0);

                            & .menu-link {
                                padding-block: var(--space-4);

                                & .menu-text {
                                    display: flex;
                                    align-items: center;
                                    justify-content: space-between;
                                    min-block-size: var(--space-40);
                                    block-size: var(--space-40);
                                }
                            }

                            &.menu-item-has-children {
                                & .rtmegamenu-contents.sub-menu {
                                    padding-block-start: var(--space-0);
                                    inline-size: 100%;

                                    .services_menu {
                                    }

                                    .products_menu {
                                        justify-content: flex-start;
                                        gap: var(--space-10);
                                    }
                                }
                            }
                        }
                    }
                }

                &.opened .overlay {
                    display: none;
                }
            }
        }
    }
}

/* ============================================
   BLOG & CATEGORY STYLES
   ============================================ */

.blog,
.category {
    #main #content-wrap {
        padding-block-start: var(--space-120);
        padding-block-end: var(--space-0);
    }

    & #blog-entries {
        margin-block-end: var(--space-0);
    }

    & .blog-entry .blog-entry-inner .meta .meta-cat a,
    & .custom-blog-list .tpae-compect-blog-wrap .tp-blog-cetegory-style-5 .post-category-list a {
        background-color: rgba(255 255 255 / 10%);
        color: rgb(255 255 255);
        padding: var(--space-5) var(--space-12);
        border-radius: var(--radius-lg);
        font-size: var(--space-14);
        font-weight: 400;
        display: inline-flex;
        align-items: center;
    }

    & .load-more-pagination {
        margin-block-start: var(--space-10);

        & .load-more-button {
            padding: var(--space-10) var(--space-20);
            text-transform: capitalize;
        }
    }

    & .blog-entry .blog-entry-inner {
        &::before {
            background-color: #010f1d;
            inset: var(--space-0);
        }

        & .meta .meta-cat a,
        & .blog-entry-readmore a,
        & .blog-entry-header .entry-title a {
            &,
            &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                text-decoration: none !important;
                outline: none !important;
                border: none;
            }
        }

        & .blog-entry-readmore {
            text-align: end;
        }

        & .meta {
            justify-content: space-between;
            align-items: center;

            &::after {
                content: unset;
            }

            & .meta-cat {
                display: inline-flex;
                align-items: center;
                gap: var(--space-10);
                padding-block-end: var(--space-0);
            }
        }

        & .blog-entry-header .entry-title,
        & .blog-entry-summary {
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            display: -webkit-box;
            overflow: hidden;
        }

        & .blog-entry-header {
            min-block-size: var(--space-70);
        }

        & .thumbnail {
            overflow: hidden;
            margin: var(--space-0);
            border-radius: var(--radius-md);
        }
    }
}

/* ============================================
   SINGLE POST STYLES
   ============================================ */

.single.single-post {
    background-color: var(--e-global-color-7e0ce37);

    & .site-main {
        padding-block-start: var(--space-100);
    }

    &.content-both-sidebars {
        & .content-area {
            border: var(--space-0);
        }

        & .sidebar-box {
            margin: auto;
            text-align: center;

            & .widget-title {
                text-align: center;
                font-weight: 700;
                border: var(--space-0);
                padding: var(--space-0);
                font-size: var(--space-14);
                color: var(--e-global-color-76deddb);
            }

            & .social-icons-list {
                text-align: center;
                margin: auto;

                & .elementor-social-icons-wrapper {
                    inline-size: auto;
                    display: inline-flex;
                    align-items: center;
                    justify-content: center;
                    flex-direction: column;
                    gap: var(--space-20);
                    border-radius: var(--radius-sm);
                    padding: var(--space-20) var(--space-30);
                    background-color: var(--e-global-color-76deddb);

                    & .elementor-social-icon {
                        display: inline-flex;
                        align-items: center;
                        justify-content: center;

                        &,
                        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                            border: unset !important;
                            outline: unset !important;
                            text-decoration: unset !important;
                        }

                        & i {
                            font-size: var(--space-36);
                        }
                    }
                }
            }
        }

        & .sidebar-primary {
            background-color: var(--e-global-color-76deddb);
            border-radius: var(--radius-sm);
            margin: var(--space-0) var(--space-10);
            padding: var(--space-30);

            & .widget-title {
                color: var(--e-global-color-7e0ce37);
                margin-block-end: var(--space-20);
                line-height: 1.5;
            }

            & .wpcf7-form {
                margin: var(--space-0) auto;

                & .wpcf7-form-control-wrap {
                    padding: var(--space-0);

                    & input {
                        border: var(--space-0);
                        inline-size: var(--size-p100);
                        max-inline-size: var(--size-p100);
                        border-radius: var(--space-0);
                        background-color: unset;
                        border-block-end: var(--space-1) solid rgba(216 223 230 / 30%);

                        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                            outline: none;
                            box-shadow: unset;
                            border: var(--space-0);
                            border-block-end: 1px solid var(--e-global-color-primary);
                        }

                        &::placeholder {
                            color: var(--e-global-color-7e0ce37);
                            opacity: 1;
                        }
                    }
                }

                & .wpcf7-submit {
                    outline: none;
                    box-shadow: unset;
                    inline-size: var(--size-p100);
                    max-inline-size: var(--size-p100);
                    border-radius: var(--space-16);
                    background-color: var(--e-global-color-primary);
                    border: var(--space-1) solid var(--e-global-color-primary);

                    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                        outline: none;
                        box-shadow: unset;
                        border: var(--space-1) solid var(--e-global-color-7e0ce37);
                        background-color: var(--e-global-color-76deddb) !important;

                        &::before,
                        &::after {
                            content: unset;
                        }
                    }
                }
            }
        }
    }
}

/* ============================================
   CUSTOM BLOG LIST
   ============================================ */

.custom-blog-list {
    & .blog-list {
        & .post-inner-loop {
            & .grid-item {
                position: relative !important;
                inset: var(--space-0) !important;
                transform: unset !important;
            }
        }

        & .post {
            border-radius: var(--space-16);
            padding: var(--space-24) var(--space-24) var(--space-32);
        }
    }

    & .tpae-compect-blog-wrap {
        & .tp-blog-cetegory-style-5 {
            order: 1;

            & .post-category-list {
                display: inline-flex;
                align-items: center;
                gap: var(--space-10);

                & a {
                    background-color: rgba(255 255 255 / 10%);
                    color: rgb(255 255 255);
                    padding: var(--space-5) var(--space-12);
                    border-radius: var(--radius-lg);
                    font-size: var(--space-14);
                    font-weight: 400;

                    &::before {
                        content: unset;
                    }
                }
            }
        }

        & .tpae-blog-content {
            order: 2;
            position: static;
            margin-block-start: var(--space-40);

            & .post-title,
            & .entry-content {
                -webkit-box-orient: vertical;
                -webkit-line-clamp: 2;
                display: -webkit-box;
                overflow: hidden;
            }

            & .post-title {
                min-block-size: var(--space-70);

                & a {
                    border: none !important;
                    outline: none !important;
                }
            }

            & .entry-content {
                line-height: 1.6;
            }

            & .tpae-blog-meta {
                position: absolute;
                inset-block-start: var(--space-8);
                inset-inline-end: var(--space-6);

                & a {
                    font-size: var(--space-14);
                    color: var(--e-global-color-7e0ce37);
                }
            }

            & .pt-plus-button-wrapper {
                position: absolute;
                inset-block-end: calc(var(--space-10) * -1);
                inset-inline-end: var(--space-0);

                & a {
                    &,
                    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                        border: none !important;
                        transform: unset;
                        box-shadow: none;
                    }
                }
            }
        }

        & .tpae-blog-image {
            margin-block-end: var(--space-30);
            order: 3;

            & .blog-featured-image {
                overflow: hidden;
                margin: var(--space-0);
                border-radius: var(--radius-sm);
            }
        }
    }
}

/* ============================================
   HERO SECTIONS
   ============================================ */

.hero-banner-main {
    overflow: hidden;

    &.hero-careers-main,
    &.hero-casestudies-main {
        &::after {
            block-size: 300%;
            inline-size: var(--size-p100);
            inset-inline-start: calc(var(--size-p25) * -1);
            background-image: radial-gradient(circle at center, #0066ff 0%, #000212 50%, transparent 95%);
        }
    }

    &.hero-careers-main {
        &::after {
            inset-block-start: calc(var(--size-p10) * -1);
        }
    }

    &.hero-casestudies-main {
        overflow: unset;

        &::after {
            inset-block-start: var(--space-0);
        }
    }

    & .hero-section-title h2 {
        display: inline-flex;
        align-items: center;
        gap: var(--space-10);
    }

    & .hero-banner-main-overlay::after,
    &::before {
        inset: var(--space-0);
        background-size: cover;
        background-repeat: no-repeat;
        background-position: top center;
    }

    & .hero-banner-main-overlay {
        block-size: var(--size-p100);
        position: relative;
        display: flex;
        z-index: 0;
        flex: 1;

        & .elementor-shortcode {
            flex: 1;
            display: flex;
            align-items: center;
            justify-content: center;
        }
    }

    &.hero-engagement-main .banner_gradient_bg_wrap {
        block-size: 150% !important;
    }
}

/* ============================================
   OUR STORY SECTION
   ============================================ */

.section-our-story {
    & .story-left {
        & span {
            background-color: rgba(255 255 255 / 75%);
            transform: rotate(-65deg);
            display: inline-block;
            position: absolute;
            inset-block-start: calc(var(--space-20) * -1);
            inset-inline-start: var(--space-70);
            block-size: var(--space-100);
            inline-size: var(--space-1);

            &::before {
                inline-size: var(--space-1);
                block-size: var(--space-30);
                inset-inline-start: var(--space-12);
                transform: rotate(65deg);
                inset-block-start: calc((var(--space-20) + var(--space-2)) * -1);
                background-color: rgba(255 255 255 / 75%);
            }

            &::after {
                inset-block-end: calc(var(--space-20) * -1);
                inset-inline-end: calc(var(--space-20) * -1);
            }
        }

        &::after {
            inset-inline-end: var(--space-120);
            inset-block-start: var(--space-50);
            inline-size: var(--space-1);
            block-size: var(--size-p100);
            background-image: linear-gradient(
                to bottom,
                #e0fcf9 0%,
                #4de7d6 20%,
                #1e90ff 40%,
                #0066ff 60%,
                #001a33 80%,
                #000212 100%
            );
        }
    }

    & .story-right {
        & .desc-wrapper {
            &::before {
                inset-block-start: calc(var(--size-p10) * -1);
                inset-inline-start: 2.5%;
            }

            &::after {
                inset-block-start: var(--space-0);
                inset-inline-end: var(--size-p10);
                inline-size: var(--size-p100);
                block-size: var(--size-p100);
                max-inline-size: var(--size-p60);
                margin: var(--space-0) auto;
                background: radial-gradient(circle at center, rgba(30 105 255 / 10%) 0%, transparent 70%);
            }
        }
    }

    & .story-left span::after,
    & .story-right .desc-wrapper::before {
        inline-size: var(--space-50);
        block-size: var(--space-50);
        border-radius: var(--radius-full);
        background: radial-gradient(circle at center, rgba(255 255 255 / 30%) 0%, rgba(255 255 255 / 0%) 50%);
    }
}

/* ============================================
   AWARDS & COUNTERS
   ============================================ */

.section-awards-recognition .custom-tags li {
    border-radius: var(--space-50);
    color: var(--e-global-color-text);
    padding: var(--space-10) var(--space-20);
    background-color: rgba(0 0 0 / 6%);
    border: var(--space-1) solid rgba(0 0 0 / 10%);
}

.section-who-we-are .counter-wrap .elementor-counter-number-suffix {
    color: var(--e-global-color-secondary);
}

/* ============================================
   OPEN POSITIONS
   ============================================ */

.section-open-positions .career-job-posts .eael-adv-accordion .eael-accordion-list {
    & .eael-accordion-header .eael-accordion-tab-title {
        display: inline-flex;
        align-items: center;
        gap: var(--space-8);

        & span {
            background-color: rgba(241 245 249 / 4%);
            color: rgba(255 255 255 / 75%);
            padding: var(--space-8) var(--space-10);
            border-radius: var(--radius-xl);
            font-size: var(--space-12);
            display: inline-block;
        }
    }

    & .eael-accordion-content {
        border-radius: 0 0 var(--space-16) var(--space-16);
    }
}

/* ============================================
   BITLOGIX IN NUMBERS
   ============================================ */

.section-bitlogix-number .counter-wrap .elementor-counter-number-suffix {
    color: var(--e-global-color-7e0ce37);
}

/* ============================================
   DREAMS INTO REALITY
   ============================================ */

.section-dreams-reality .process-container {
    gap: var(--space-50);

    &::before {
        inset-block-end: var(--space-0);
        block-size: var(--size-p50);
        inline-size: calc(var(--size-p100) * 10);
        background-color: var(--e-global-color-text);
    }

    & .process-item {
        & .circle {
            color: var(--e-global-color-text);
            inline-size: calc(var(--space-250) + var(--space-1));
            block-size: calc(var(--space-250) + var(--space-2));
            max-inline-size: calc(var(--space-250) + var(--space-1));
            max-block-size: calc(var(--space-250) + var(--space-2));
            background-color: var(--e-global-color-7e0ce37);

            &::before {
                z-index: 1;
                inset: var(--space-0);
                inline-size: var(--size-p100);
                block-size: var(--size-p100);
                background-color: unset;
                transform: rotate(180deg);
                border-radius: var(--radius-full);
                box-shadow: 0 0 var(--space-10) 0 rgba(0 0 0 / 10%);
            }
        }

        & .step-num {
            inset-inline-start: 40%;
        }

        & .result-text {
            font-size: var(--space-12);
            min-block-size: var(--space-80);
            max-inline-size: var(--space-200);
        }

        &::before {
            background-color: unset;
            border-style: solid;
            border-color: transparent;
            transform: rotate(-45deg);
            border-radius: var(--radius-full);
            border-width: calc(var(--space-100) / 2);
            inline-size: calc(var(--space-250) + var(--space-100));
            block-size: calc(var(--space-250) + var(--space-100));
            inset-block-start: -19.5%;
            inset-inline-start: -19.5%;
        }

        &::after {
            inline-size: var(--space-5);
            block-size: var(--space-30);
            inset-inline-start: var(--size-p50);
            background-color: var(--e-global-color-primary);
            transform: translateX(calc(var(--size-p50) * -1));
        }

        &:nth-child(odd) {
            &::before {
                border-block-start-color: var(--e-global-color-0567362);
                border-inline-end-color: var(--e-global-color-0567362);
            }

            &::after {
                inset-block-start: var(--size-p100);
            }

            & .step-num {
                inset-block-start: -4.75rem;
            }

            & .result-text {
                color: var(--e-global-color-7e0ce37);
                inset-block-start: var(--space-300);
            }
        }

        &:nth-child(even) {
            &::before {
                border-block-end-color: var(--e-global-color-0567362);
                border-inline-start-color: var(--e-global-color-0567362);
            }

            &::after {
                inset-block-start: calc(var(--space-30) * -1);
            }

            & .step-num {
                align-self: end;
                inset-block-end: -4.75rem;
            }

            & .result-text {
                color: var(--e-global-color-text);
                inset-block-start: calc(var(--space-120) * -1);
            }
        }
    }
}

/* ============================================
   SERVICES
   ============================================ */

.services-main {
    overflow: hidden;

    &::before,
    &::after {
        inset-inline-start: 0;
        background-image: radial-gradient(circle at bottom, #0066ff 0%, #000212 50%, transparent 95%);
    }

    &::before {
        inset-block-start: 5%;
        inline-size: 50%;
        block-size: 50%;
    }

    &::after {
        inset-block-end: -25%;
        inline-size: 100%;
        block-size: 200%;
    }
}

.services-grid,
.home-services-grid,
.digital-engineer-wrap,
.section-case-studies-list {
    & .eael-post-grid {
        display: grid;
        grid-gap: var(--space-24);
        grid-template-columns: repeat(3, 1fr);

        & .eael-grid-post {
            padding: var(--space-0) !important;
        }
    }
}

/* Services single */
.wp-singular.single-services .hero-section-title {
    filter: drop-shadow(var(--space-15) var(--space-4) var(--space-8) #003cff33);
    background-image: linear-gradient(to right, #282a4b 0%, #494e6a 100%);
    padding: var(--space-10) var(--space-16) var(--space-5);
    border-radius: var(--space-6);
}

.services-grid,
.home-services-grid {
    & .eael-post-grid .eael-grid-post {
        & .eael-grid-post-holder {
            overflow: hidden;
            block-size: var(--size-p100);
            padding: var(--space-10) var(--space-20);

            &::before {
                opacity: 0;
                visibility: hidden;
                inset: var(--space-0);
                inline-size: var(--size-p100);
                block-size: var(--size-p100);
                transform: translateY(-var(--size-p100));
                transition: all var(--dur-normal) var(--ease-smooth);
            }

            &:is(:hover, :active, :focus, :focus-within, :focus-visible) {
                &::before {
                    transition: all var(--dur-normal) var(--ease-smooth);
                    background-color: var(--e-global-color-primary);
                    transform: translateY(0);
                    visibility: visible;
                    opacity: 1;
                }

                & .eael-entry-wrapper .eael-entry-content .custom-excerpt ul li::before {
                    color: var(--e-global-color-7e0ce37);
                }
            }
        }

        & .eael-entry-wrapper {
            flex: 1;
            display: flex;
            flex-direction: column;

            & .eael-entry-title {
                margin-block: var(--space-0);

                & a {
                    font-size: unset;

                    &,
                    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                        border: none !important;
                        transform: unset;
                        box-shadow: none;
                    }
                }
            }

            & .eael-entry-content {
                flex: 1;

                & p:empty {
                    display: none;
                }

                & .eael-grid-post-excerpt {
                    block-size: var(--size-p100);
                    display: flex;
                    flex-direction: column;
                    justify-content: space-between;
                }

                & .custom-excerpt {
                    line-height: 1.35;
                    font-size: var(--space-18);
                    color: var(--e-global-color-7e0ce37);

                    & ul {
                        list-style-type: none;
                        margin-block-start: var(--space-10);

                        & li {
                            margin-block-end: var(--space-10);
                            font-size: var(--space-16);

                            &::before {
                                content: "\2713";
                                display: inline-block;
                                inline-size: var(--space-10);
                                margin-inline-end: var(--space-10);
                                margin-inline-start: calc(var(--space-20) * -1);
                                color: var(--e-global-color-primary);
                            }

                            &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                                &::before {
                                    color: var(--e-global-color-7e0ce37);
                                }
                            }
                        }
                    }
                }
            }

            & .eael-post-elements-readmore-btn {
                &,
                &:is(:active, :focus, :focus-within, :focus-visible, :target) {
                    transform: unset;
                    box-shadow: none;
                    border: none !important;
                    outline: none !important;
                }
            }
        }
    }
}

.home-services-grid .eael-post-grid .eael-grid-post .eael-grid-post-holder {
    & .eael-entry-media .eael-entry-thumbnail {
        margin: var(--space-20);
        max-inline-size: var(--space-70);
        max-block-size: var(--space-70);
    }

    & .eael-entry-wrapper .eael-entry-content .custom-excerpt {
        color: rgba(255 255 255 / 75%);

        & > div {
            margin-block: var(--space-16);
        }

        & ul {
            line-height: 1.5;
        }
    }
}

.services-grid .eael-post-grid {
    & .eael-grid-post .eael-grid-post-holder {
        background-image: linear-gradient(135deg, rgba(18 75 189 / 41%) 0%, rgba(18 75 189 / 25%) 0%, #000 100%);
        padding: var(--space-32);

        & .eael-entry-wrapper {
            /* max-inline-size: 80%; */
            padding: var(--space-0);
            order: 1;
        }

        & .eael-entry-media {
            margin-block: var(--space-0);
            order: 2;

            & .eael-entry-thumbnail {
                max-inline-size: var(--space-120);
                max-block-size: var(--space-120);
                margin-inline-start: auto;
            }
        }
    }

    /* Grid last row centering */
    & > :nth-last-child(2):nth-child(3n + 1) {
        grid-column: 2;
    }

    & > :nth-last-child(1):nth-child(3n + 2) {
        grid-column: 3;
    }

    & > :nth-last-child(1):nth-child(3n + 1) {
        grid-column: 2;
    }
}

/* ============================================
   IMAGES MARQUEE
   ============================================ */

.images-marquee {
    --animation-speed: 40s;
    inline-size: var(--size-p100);
    overflow: hidden;

    & .marquee {
        display: flex;
        overflow: hidden;
        user-select: none;
        position: relative;

        &:hover .marquee-content {
            animation-play-state: paused;
        }

        & .marquee-content {
            display: flex;
            gap: var(--space-20);
            padding: var(--space-0);
            margin-block-end: var(--space-0);
            white-space: nowrap;
            animation: scroll var(--animation-speed) linear infinite;

            & > div {
                display: flex;
                flex-shrink: 0;
                gap: var(--space-20);
            }

            & li {
                display: flex;
                justify-content: center;
                align-items: center;
                list-style: none;
                overflow: hidden;
                text-align: center;
                transition: all 0.3s ease;
                min-inline-size: var(--space-300);
                font-size: var(--space-100);
                border-radius: var(--space-16);
                color: var(--e-global-color-7e0ce37);

                &:hover {
                    transform: translateY(-10px);
                }

                & img {
                    block-size: var(--space-150);
                    inline-size: var(--size-p100);
                    object-fit: cover;
                    display: block;
                }
            }
        }
    }
}

/* ============================================
   TEAM FOUNDERS
   ============================================ */

.section-team-founder .eael-team-item {
    & .eael-team-image {
        justify-self: flex-start;

        &::after {
            inset: var(--space-0);
            inline-size: var(--size-p100);
            block-size: var(--size-p100);
            background-image: linear-gradient(to top, #000 0%, transparent 50%);
        }
    }

    & .eael-team-content {
        gap: var(--space-20);
        display: flex;
        flex-direction: column;

        & .eael-team-member-name,
        & .eael-team-member-position,
        & .eael-team-member-social-profiles,
        & .eael-team-text {
            margin: var(--space-0);
        }

        & .eael-team-member-name {
            order: 2;
        }

        & .eael-team-member-position {
            order: 1;
        }

        & .eael-team-member-social-profiles {
            order: 4;
        }

        & .eael-team-text {
            order: 3;
        }
    }
}

/* ============================================
   HAVE PROJECT
   ============================================ */

.section-have-project {
    &::before,
    &::after {
        background-color: rgba(255 180 4 / 60%);
        block-size: var(--space-250);
        inline-size: var(--space-250);
        border-radius: var(--radius-full);
    }

    &::before {
        inset-block-start: 55%;
        inset-inline-start: 1%;
    }

    &::after {
        inset-block-end: -50%;
        inset-inline-end: -1%;
    }
}

/* ============================================
   OUR PRODUCTS
   ============================================ */

.section-our-products .our-products-grid-wrap .product_item {
    flex-wrap: nowrap !important;
    padding: var(--space-0);
    border-radius: var(--space-12);

    &::before {
        background-color: var(--e-global-color-7e0ce37) !important;
    }

    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
        background-color: var(--e-global-color-52d9271);
    }

    & .elementor-heading-title a {
        &,
        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
            font-weight: unset;
        }
    }

    & .product_item_meta {
        margin-block-start: auto;
        border-radius: var(--radius-sm);
        background:
            linear-gradient(#fff, #fff) padding-box,
            linear-gradient(to left, #449af8, #abf5f4) border-box;

        &::before {
            background-color: var(--e-global-color-7e0ce37) !important;
        }

        & .product_item_meta_location .elementor-icon-box-wrapper {
            display: flex;

            & .elementor-icon-box-content .elementor-icon-box-title {
                margin-inline-start: calc(var(--space-36) * -1);
            }
        }
    }
}

/* ============================================
   TECH STACK
   ============================================ */

.section-tech-stack .eael-filter-gallery-wrapper {
    & .eael-filter-gallery-control ul li {
        padding: var(--space-6) var(--space-16);
    }

    & .eael-filter-gallery-container {
        block-size: unset !important;
        inline-size: var(--size-p100);
        gap: var(--space-10);
        overflow: unset;
        display: flex;
        flex-wrap: wrap;
        align-items: start;
        justify-content: center;

        & .eael-filterable-gallery-item-wrap {
            position: static !important;
            float: unset !important;
            inline-size: auto !important;
            max-inline-size: var(--space-120);
            flex: 1;

            & .eael-gallery-grid-item {
                overflow: unset;
                cursor: pointer;

                & .gallery-item-thumbnail-wrap {
                    margin: auto;
                    display: flex;
                    justify-content: center;
                    min-block-size: var(--space-60);
                    max-inline-size: var(--space-60);

                    & img {
                        inline-size: auto;
                        block-size: auto;
                        margin: auto;
                    }
                }

                & .gallery-item-caption-wrap {
                    position: relative;
                    visibility: visible;
                    opacity: 1;
                    z-index: 1;

                    & .fg-item-title {
                        text-align: center;
                        font-weight: 400;
                        font-size: var(--space-16);
                        margin-block-end: var(--space-0);
                    }
                }

                &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                    & .gallery-item-thumbnail-wrap {
                        transform: scale(1.2);
                        transition: transform var(--dur-slow) var(--ease-smooth);
                    }
                }
            }
        }
    }
}

/* ============================================
   INDUSTRIES CATER
   ============================================ */

.section-industries-cater .theplus-tabs-wrapper {
    & .theplus-tabs-nav-wrapper .plus-tabs-nav li .elementor-tab-title.plus-tab-header {
        &.active,
        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
            & .tab-icon-wrap svg {
                fill: var(--e-global-color-primary);
                stroke: var(--e-global-color-primary);
            }
        }
    }

    & .theplus-tabs-content-wrapper {
        max-inline-size: var(--size-p80);
        margin: var(--space-20) auto var(--space-0);
    }
}

/* ============================================
   DIGITAL ENGINEER
   ============================================ */

.digital-engineer-wrap .eael-post-grid .eael-grid-post .eael-grid-post-holder {
    border: var(--space-1) solid var(--e-global-color-3b7cbdd);
    border-radius: var(--space-10);
    block-size: var(--size-p100);
    padding: var(--space-32);

    & .eael-grid-post-holder-inner {
        flex-direction: row;

        & .eael-entry-media {
            min-inline-size: var(--space-36);

            & a,
            & .eael-entry-thumbnail a {
                cursor: default;
                pointer-events: none;
            }

            & .eael-entry-thumbnail {
                margin-block-start: calc(var(--space-2) * -1);
                inline-size: var(--space-25);
                block-size: var(--space-25);
            }
        }

        & .eael-entry-wrapper {
            padding: var(--space-0);

            & .eael-entry-title {
                margin: var(--space-0) var(--space-0) var(--space-10);

                & a {
                    cursor: default;
                    pointer-events: none;

                    &:is(:active, :focus, :focus-within, :focus-visible, :target) {
                        border: none !important;
                        transform: unset;
                        box-shadow: none;
                    }
                }
            }
        }
    }
}

/* ============================================
   CAREER BENEFITS
   ============================================ */

.section-more-than-job-place-grow .custom-career-job-grow-wrapper,
.section-career-benefits .grid-career-benefit {
    & .elementor-icon-box-wrapper .elementor-icon-box-icon {
        padding: var(--space-10);
        block-size: var(--space-50);
        inline-size: var(--space-50);
        border-radius: var(--space-10);
    }
}

.section-career-benefits .grid-career-benefit .elementor-icon-box-wrapper .elementor-icon-box-icon {
    background-color: rgba(219 234 254 / 100%);
}

.section-more-than-job-place-grow .custom-career-job-grow-wrapper .elementor-icon-box-wrapper .elementor-icon-box-icon {
    background-color: rgba(255 241 242 / 10%);
}

/* ============================================
   CAREER HERO
   ============================================ */

.section-hero-career .career-custom-chips {
    border: var(--space-0);

    &::before {
        inset-block-start: calc(var(--space-15) * -1);
        inset-inline-start: calc(var(--space-10) * -1);
        inline-size: var(--space-16);
        block-size: var(--space-16);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-image: url("https://ebitlogix.com/wp-content/uploads/2026/01/arrow-mark.png");
    }
}

/* ============================================
   CASE STUDIES LIST
   ============================================ */

.section-case-studies-list .eael-post-grid .eael-grid-post .eael-grid-post-holder {
    padding: var(--space-20);
    block-size: 100%;

    & a i {
        margin-inline-start: 0.5rem;
    }

    /* 
    &:is(:active, :focus, :focus-within, :focus-visible, :target) {
        border: none !important;
    } 
    */

    & .eael-entry-media,
    & .eael-entry-wrapper {
        padding: var(--space-0);
    }

    & .eael-entry-media .eael-entry-thumbnail {
        block-size: 185px;
    }

    & .eael-entry-wrapper {
        flex: 1;
        display: flex;
        flex-direction: column;

        & .eael-entry-header {
            & .eael-entry-title {
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 1;
                -webkit-box-orient: vertical;
                margin-block: var(--space-0);
            }
        }

        & .eael-entry-content {
            flex: 1;
            display: flex;

            & .eael-grid-post-excerpt {
                flex: 1;
                display: flex;
                flex-direction: column;
            }

            & p {
                overflow: hidden;
                display: -webkit-box;
                -webkit-line-clamp: 2;
                -webkit-box-orient: vertical;
                margin-block: var(--space-4);
            }

            & a {
                margin-block-start: auto;
            }
        }
    }
}

/* ============================================
   LIFE AT BITLOGIX
   ============================================ */

#custom-wrapper-life-bitlogix .eael-post-grid {
    block-size: unset !important;
    display: flex;

    & .swiper-wrapper {
        gap: var(--space-25);
        align-items: stretch;
    }

    & .eael-grid-post {
        &.swiper-slide {
            padding: var(--space-0) !important;
            margin: var(--space-0) !important;
            position: relative !important;
            inset: unset !important;
            float: unset !important;
            block-size: auto;
            display: flex;
        }

        & .eael-grid-post-holder-inner {
            padding: var(--space-24);

            & a {
                cursor: default;
                pointer-events: none;

                &:is(:active, :focus, :focus-within, :focus-visible, :target) {
                    border: none !important;
                    transform: unset;
                    box-shadow: none;
                }
            }

            & .eael-entry-media,
            & .eael-entry-wrapper {
                padding: var(--space-0);
            }

            & .eael-entry-wrapper {
                padding: var(--space-0);
                margin-block-start: var(--space-10);

                & .eael-entry-header {
                    margin-block-end: var(--space-10);

                    & .eael-entry-title {
                        margin: var(--space-0);
                    }
                }
            }
        }
    }
}

/* ============================================
   ENGAGEMENT MODEL
   ============================================ */

.section-engagement-model .engagement-model-item {
    & .engagement-model-item-img {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: var(--space-8);
        border-radius: var(--space-8);
        border: var(--space-1) solid rgba(216 223 230 / 30%);
    }

    & .engagement-model-item-list {
        margin-block-start: var(--space-10);
        margin-inline-start: var(--space-5);
        font-size: var(--space-16);
        line-height: 1.5;
    }
}

/* ============================================
   TESTIMONIALS
   ============================================ */

.testimonials-main {
    padding-block-end: var(--space-150) !important;
    overflow: hidden;

    &::before {
        inset-inline-start: 35%;
        inset-block-end: 0;
        inline-size: 100%;
        block-size: 100%;
        background-image: radial-gradient(circle at bottom, rgba(255 212 0 / 40%) 0%, #000 50%, transparent 95%);
    }

    & .testimonial_gradient_wrap {
        inset-block-start: calc(var(--size-p25) * -1) !important;
        z-index: -1;

        & .testimonial_gradient {
            inline-size: var(--size-p100);
            block-size: var(--size-p100);
        }
    }
}

.section-testimonials .testimonial-wrap {
    & .tss-carousel {
        margin-block-end: var(--space-0);
        padding: var(--space-0);

        &.swiper {
            & .slide-item.swiper-slide {
                margin-block-end: var(--space-0) !important;
                padding: var(--space-0) !important;
            }

            & .swiper-arrow {
                border: var(--space-1) solid var(--e-global-color-7e0ce37) !important;
                inset-block-start: var(--size-p60) !important;
                border-radius: var(--radius-full);
                inline-size: var(--space-40);
                block-size: var(--space-40);
                justify-content: center;
                align-items: center;
                display: flex;

                &.swiper-button-prev {
                    inset-inline-start: calc(var(--space-60) * -1);
                }

                &.swiper-button-next {
                    inset-inline-end: calc(var(--space-60) * -1);
                }
            }

            & .swiper-pagination {
                inset-block-end: calc(var(--space-50) * -1) !important;

                & .swiper-pagination-bullet {
                    background-color: rgba(255 255 255 / 75%) !important;

                    &.swiper-pagination-bullet-active {
                        inline-size: var(--space-30);
                        border-radius: var(--space-10);
                        background-color: rgba(255 255 255 / 100%) !important;
                    }
                }
            }
        }
    }

    & .single-item-wrapper {
        gap: var(--space-8);
        display: flex;
        flex-direction: column-reverse;
        padding: var(--space-40) var(--space-40) var(--space-40) var(--space-100);

        & .item-content-wrapper,
        & .author-name,
        & .author-bio {
            &,
            & p {
                margin: var(--space-0);
            }
        }

        & .item-content-wrapper {
            background-color: transparent;
            margin-block-end: var(--space-15);
            padding: var(--space-0);

            &::before {
                font-size: var(--space-36);
                transform: rotate(180deg);
                inset-block-start: calc(var(--space-8) * -1);
                inset-inline-start: calc(var(--space-50) * -1);
            }
        }
    }
}

/* ============================================
   
   ============================================ */
.specialised-box .specialised-separator {
    margin-left: calc(var(--space-100) * -1);
}

/* ============================================
   TEAM MEMBER SINGLE
   ============================================ */
.section-hero-teammember-single .team-member-skills ul {
    gap: var(--space-20);

    li {
        & span {
            font-size: var(--space-16) !important;
            color: var(--e-global-color-text) !important;
            background-color: var(--e-global-color-7e0ce37);
            padding: var(--space-8) var(--space-20);
            border-radius: var(--space-50);
        }
    }
}

/* ============================================
   CASE STUDY SINGLE
   ============================================ */

.section-hero-casestudy-single .case-study-list ul li {
    & span {
        background-color: rgba(241 245 249 / 10%);
        color: rgba(255 255 255 / 75%);
        padding: var(--space-2) var(--space-12);
        border-radius: var(--radius-xl);
        font-size: var(--space-12);
        display: inline-block;
    }
}

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

.section-why .product_cta_gradient_wrap {
    max-inline-size: var(--space-300);

    & .product_cta_gradient {
        inline-size: var(--size-p100);
        block-size: var(--size-p100);
    }
}

/* ============================================
   TABS DEDICATED MODULES
   ============================================ */

.tabs-dedicated-modules .e-n-tabs .e-n-tabs-heading .e-n-tab-title {
    &[aria-selected="false"],
    &[aria-selected="true"] {
        &,
        &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
            background-color: unset !important;
        }
    }

    &[aria-selected="true"] .e-n-tab-icon svg {
        fill: var(--e-global-color-primary);
        stroke: var(--e-global-color-primary);
    }
}

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

.contact-main {
    overflow: hidden;

    &::before {
        background-image: radial-gradient(circle at center, rgba(0 102 255 / 75%) 0%, #000212 50%, transparent 95%);
        inset-inline-start: calc(var(--size-p20) * -1);
        inset-block-start: calc(var(--size-p15) * -1);
        inline-size: var(--size-p100);
        block-size: 200%;
    }
}

.section-contact {
    & .tabs-office-location .eael-advance-tabs {
        & .disabled.eael-tab-nav-item {
            pointer-events: none;
            cursor: default;
            opacity: 0.5;
        }

        & .eael-tab-nav-item {
            &.active {
                &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                    border: 0 0 var(--space-1) 0;
                }
            }
        }

        & .eael-tab-title .coming-soon {
            background-color: var(--e-global-color-primary);
            color: var(--e-global-color-7e0ce37);
            padding: var(--space-2) var(--space-10);
            margin-inline-start: var(--space-4);
            border-radius: var(--radius-lg);
            font-size: var(--space-10);
            display: inline-block;
        }

        & .eael-tabs-content {
            border: var(--space-1) solid rgba(255 255 255 / 20%);
            backdrop-filter: blur(var(--space-0));
            background: rgba(255 255 255 / 15%);
            border-radius: var(--space-16);
            margin-block-start: var(--space-20);

            & .strong {
                font-weight: 500;
            }

            & .address-wrap img {
                position: absolute;
                inset-block-end: var(--space-20);
                inset-inline-end: var(--space-20);
            }

            & .address-list li {
                min-inline-size: calc(var(--space-200) + var(--space-20));

                & a {
                    color: var(--e-global-color-7e0ce37);
                    font-size: var(--space-16);
                    font-weight: 300;

                    &:is(:hover, :active, :focus, :focus-within, :focus-visible, :target) {
                        color: var(--e-global-color-primary);
                        border: none !important;
                    }
                }

                & .icon-wrap {
                    display: flex;
                    align-items: center;
                    justify-content: center;
                    block-size: var(--space-32);
                    inline-size: var(--space-32);
                    border-radius: var(--radius-full);
                    color: var(--e-global-color-text);
                    background-color: var(--e-global-color-7e0ce37);
                }
            }
        }
    }

    .eael-contact-form-7-wrapper {
        .eael-contact-form-7 .wpcf7-form {
            .two-column {
                padding-inline: var(--space-0);
                margin-bottom: var(--space-0);
                gap: var(--space-20);
                display: grid;
                grid-template-columns: repeat(2, minmax(240px, 1fr));
            }

            .wpcf7-form-control-wrap {
                display: block;
                margin-top: var(--space-10);
            }

            .wpcf7-response-output {
                margin: var(--space-10) var(--space-0) var(--space-0);
                border-radius: var(--space-5);
            }
        }
    }
}

.custom_sc_widget_contact {
    background-image: url("https://ebitlogix.com/wp-content/uploads/2026/01/contact.webp");
    background-position: top center;
    background-repeat: no-repeat;
    background-attachment: fixed;
    background-size: cover;
}

.section-greenounce-easypick,
.section-perfect-role,
.section-build-together {
    background-image: linear-gradient(90deg, #0066ff 0%, #000212 50%, #000 60%, #1763fa40 75%, transparent 90%);
}

.section-team-heads .swiper,
.swiper.has-custom-swiper-pagination {
    padding-block-end: var(--space-40);

    & .swiper-pagination {
        margin-block-start: var(--space-0);
        inset-block-end: var(--space-0) !important;
        inline-size: 100% !important;
        transform: unset !important;

        & .swiper-pagination-bullet {
            opacity: 1;
            inline-size: var(--space-10);
            block-size: var(--space-10);
            transform: unset !important;
            inset-inline: unset !important;
            background-color: rgba(255 255 255 / 45%) !important;
            transition: all var(--dur-normal) var(--ease-smooth);

            &.swiper-pagination-bullet-active {
                border-radius: var(--space-10);
                inline-size: var(--space-30) !important;
                background-color: var(--e-global-color-primary) !important;
            }
        }

        &.swiper-pagination-products {
            & .swiper-pagination-bullet {
                background-color: rgba(0 102 255 / 50%) !important;

                &.swiper-pagination-bullet-active {
                    background-color: var(--e-global-color-primary) !important;
                }
            }
        }
    }
}

/* ============================================
   FOOTER
   ============================================ */

#footer-widgets {
    overflow: hidden;

    &::before {
        inset-block-end: -35%;
        inset-inline-start: var(--space-0);
        inline-size: var(--size-p100);
        block-size: 200%;
        background-image: radial-gradient(circle at bottom, #0066ff 0%, #000212 50%, transparent 95%);
    }

    & .footer-gradient {
        inline-size: var(--size-p100);
        z-index: 0;
    }

    & .custom_footer_menu .uc-list-menu {
        display: flex;
        gap: var(--space-10);
        flex-direction: column;

        .menu-item a {
            &:is(:active, :focus, :focus-within, :focus-visible, :target) {
                color: var(--e-global-color-secondary);
            }
        }
    }
}

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

@media (width > 1200px) {
    .hero-banner-main.hero-about-main::before {
        filter: none;
        will-change: transform;
        animation: diagonal-sweep-transform 12s cubic-bezier(0.45, 0, 0.55, 1) infinite;
        background-position: center;
        background-image:
            image-set(url("https://ebitlogix.com/wp-content/uploads/2026/01/gradients_about.svg") type("image/svg")),
            url("https://ebitlogix.com/wp-content/uploads/2026/01/gradients_about.svg");
    }

    .section-industries-cater .theplus-tabs-wrapper {
        & .theplus-tabs-content-wrapper {
            & .industry-item {
                font-size: var(--space-18);
                line-height: 1.6;

                & .industry-item-content {
                    & h4 {
                        font-size: var(--space-40);
                        line-height: 1.2;
                    }

                    & p {
                        font-size: var(--space-16);
                        font-weight: 300;
                    }
                }

                & .industry-item-img {
                    min-inline-size: var(--space-300);
                    max-inline-size: var(--space-300);
                    margin-block-start: var(--space-10);
                }
            }
        }
    }
}

@media (width <= 1200px) {
    .hero-banner-home .hero-custom-image {
        max-inline-size: var(--space-250) !important;
    }

    .images-marquee .marquee .marquee-content > div {
        gap: var(--space-20);
    }

    .section-dreams-reality .process-container {
        margin-block-end: var(--space-120);

        &::before {
            block-size: 110%;
            inline-size: 49.875%;
            inset-inline-end: var(--space-0);
            inset-block-start: calc(var(--size-p10) * -1);
            background-image: linear-gradient(
                to bottom,
                var(--e-global-color-primary) 0%,
                var(--e-global-color-text) 75%
            );
        }

        & .process-item {
            &::before {
                transform: rotate(-135deg);
            }

            &::after {
                inline-size: var(--space-30);
                block-size: var(--space-5);
                inset-block-start: var(--size-p50) !important;
            }

            & .result-text {
                inset-block-start: var(--space-80) !important;
            }

            &:nth-child(odd) {
                &::after {
                    inset-inline-start: unset;
                    inset-inline-end: calc(var(--space-40) * -1);
                }

                & .step-num {
                    inset-block-start: 11.5rem;
                    inset-inline-start: -3.5rem;
                }

                & .result-text {
                    inset-inline-end: calc((var(--space-250) - var(--space-10)) * -1);
                    text-align: start;
                }
            }

            &:nth-child(even) {
                &::after {
                    inset-inline-start: calc(var(--space-10) * -1);
                }

                & .step-num {
                    inset-block-end: 10.75rem;
                    inset-inline-start: 26rem;
                }

                & .result-text {
                    inset-inline-start: calc((var(--space-250) - var(--space-10)) * -1);
                    text-align: end;
                }
            }
        }
    }

    .section-industries-cater .theplus-tabs-wrapper .theplus-tabs-content-wrapper {
        max-inline-size: var(--size-p100);

        & .industry-item {
            font-size: var(--space-16);
            line-height: 1.5;

            & h4 {
                font-size: var(--space-30);
            }
        }
    }

    .testimonials-main {
        padding-block-end: var(--space-100) !important;
    }

    .section-contact {
        .eael-contact-form-7-wrapper {
            .eael-contact-form-7 .wpcf7-form {
                .two-column {
                    gap: var(--space-0);
                    grid-template-columns: 1fr;
                    margin-block-end: var(--space-20);
                }
            }
        }
    }
}

@media (width <= 1024px) {
    #site-header {
        position: fixed;

        & .custom-header-wrap {
            & .header_logo {
                margin-inline-end: auto !important;
            }
        }

        & .rtmega-menu-area.enabled-mobile-menu .mobile-menu-area {
            display: none !important;

            &.opened {
                display: block !important;
            }

            & .rtmega-menu-mobile-sidebar {
                inset-inline-end: calc(var(--space-30) * -1);
                max-inline-size: calc(var(--space-200) + var(--space-30));
            }
        }
    }

    .images-marquee .marquee .marquee-content li {
        font-size: var(--space-80);

        & img {
            block-size: var(--space-80);
        }
    }

    .section-our-story .story-left {
        opacity: 0;
        display: none;
        visibility: hidden;
    }

    .section-our-products
        .our-products-grid-wrap
        .product_item
        .product_item_meta
        .product_item_meta_location
        .elementor-icon-box-wrapper {
        text-align: start;

        & .elementor-icon-box-content .elementor-icon-box-title {
            margin-inline-start: unset;
        }
    }

    .services-grid,
    .home-services-grid,
    .digital-engineer-wrap,
    .section-case-studies-list {
        & .eael-post-grid {
            grid-template-columns: repeat(2, 1fr);
        }
    }

    .digital-engineer-wrap .eael-post-grid .eael-grid-post .eael-grid-post-holder {
        padding: var(--space-24);
    }

    .testimonials-main {
        &:before {
            inset-inline-start: 0;
        }
    }

    .section-contact {
        & .tabs-office-location .eael-advance-tabs {
            .eael-tabs-content .address-wrap .address-list {
                padding-block-end: var(--space-100);
            }

            & .eael-tabs-nav ul {
                align-items: stretch;

                & .eael-tab-nav-item {
                    padding: var(--space-16) var(--space-10);
                    font-size: var(--space-15);
                }
            }
        }
    }

    .elementor-element {
        &:has(#section-contact) {
            padding-inline: var(--space-0) !important;
        }
    }
}

@media (768px < width <= 1024px) {
    .section-our-products .our-products-grid-wrap {
        .swiper-wrapper {
            display: grid;
            gap: var(--space-40);
            grid-template-columns: repeat(2, 1fr);
        }
    }

    .section-case-studies-list {
        & .case-studies-list-main {
            & .eael-post-grid {
                & .eael-grid-post {
                    inline-size: var(--size-p100) !important;
                }
            }
        }

        .elementor-grid-tablet-eael-col-2 {
            & .eael-post-grid {
                & .eael-grid-post {
                    &,
                    &:nth-of-type(2n) {
                        margin-right: var(--space-12) !important;
                    }
                }
            }
        }
    }
}

@media (width <= 768px) {
    #site-header {
        & .custom-header-wrap {
            & .custom_button {
                & .elementor-button {
                    & .elementor-button-icon {
                        display: none;
                    }
                }
            }
        }

        & .rtmega-menu-area.enabled-mobile-menu {
            & .mobile-menu-area .rtmega-menu-mobile-sidebar {
                inset-inline-end: calc(var(--space-10) * -1);
            }
        }
    }

    .hero-banner-home .hero-custom-image {
        max-inline-size: var(--space-200) !important;
    }

    .hero-banner-main {
        &.hero-careers-main,
        &.hero-casestudies-main {
            &:after {
                inset-inline-start: unset !important;
            }
        }
    }

    .images-marquee {
        padding: var(--space-0) var(--space-10);

        & .marquee .marquee-content,
        & .marquee .marquee-content > div {
            gap: var(--space-15);
        }
    }

    .services-grid,
    .home-services-grid,
    .digital-engineer-wrap,
    .section-case-studies-list {
        & .eael-post-grid {
            grid-template-columns: 1fr;
        }
    }

    .home-services-grid .eael-post-grid .eael-grid-post .eael-grid-post-holder {
        & .eael-entry-media .eael-entry-thumbnail {
            margin-inline: var(--space-0);
        }

        & .eael-entry-wrapper {
            padding: var(--space-0);
        }
    }

    .services-grid .eael-post-grid,
    .home-services-grid .eael-post-grid {
        /* 
        &,
        & .swiper-wrapper {
            min-block-size: 46rem;
            max-block-size: 46rem;
        } 
        */

        & .eael-grid-post .eael-grid-post-holder {
            padding: var(--space-20);
        }
    }

    .section-industries-cater .theplus-tabs-wrapper {
        & .theplus-tabs-nav-wrapper {
            display: flex;

            & .plus-tabs-nav {
                overflow: auto;
                display: inline-flex;
                align-items: center;

                & .elementor-tab-title.plus-tab-header span {
                    white-space: nowrap;
                }
            }
        }

        & .theplus-tabs-content-wrapper {
            margin: var(--space-0);
        }
    }

    .section-open-positions
        .career-job-posts
        .eael-adv-accordion
        .eael-accordion-list
        .eael-accordion-header
        .eael-accordion-tab-title {
        flex-direction: column;
        align-items: start;
    }

    .section-our-products .our-products-grid-wrap {
        &,
        & .swiper-wrapper {
            /* min-block-size: 90rem; */
            max-block-size: 75rem;
        }

        & .product_item .product_item_meta {
            & .product_item_meta_location .elementor-icon-box-wrapper {
                flex-direction: column-reverse;
                align-items: center;

                & .elementor-icon-box-icon {
                    inset-block-start: var(--space-0);
                    text-align: center;
                }

                & .elementor-icon-box-content {
                    text-align: center;

                    & .elementor-icon-box-title {
                        margin-inline-start: var(--space-0);
                    }
                }
            }

            & .product_item_meta_industry .elementor-icon-box-wrapper {
                max-inline-size: var(--space-200);
            }
        }
    }

    .section-tech-stack .eael-filter-gallery-wrapper {
        & .eael-filter-gallery-control ul {
            overflow: auto;
            display: inline-flex;
            align-items: center;

            & li {
                padding: var(--space-5) var(--space-10);
                white-space: nowrap;
            }
        }

        & .eael-filter-gallery-container {
            gap: var(--space-20);
        }
    }

    .custom-blog-list .blog-list .post-inner-loop {
        &,
        & .swiper-wrapper {
            min-block-size: 52rem;
            max-block-size: 52rem;
            margin-inline: 0;
        }

        &.swiper {
            block-size: auto !important;

            & .swiper-wrapper {
                display: flex !important;
                block-size: auto !important;
            }

            & .grid-item.swiper-slide {
                position: relative !important;
                transform: none !important;
                inset: auto !important;
                opacity: 1 !important;
            }
        }

        & .grid-item {
            padding-inline: var(--space-0) !important;

            & .post {
                padding: var(--space-20) var(--space-20) var(--space-24);
            }
        }
    }

    .digital-engineer-wrap .eael-post-grid {
        margin-inline: calc(var(--space-5) * -1) !important;

        & .eael-grid-post .eael-grid-post-holder {
            padding: var(--space-16);
        }
    }

    .section-team-founder .eael-team-item {
        & .eael-team-image {
            justify-self: center;
        }

        & .eael-team-content {
            & .eael-team-member-name,
            & .eael-team-member-position,
            & .eael-team-member-social-profiles,
            & .eael-team-text {
                text-align: center;
            }
        }
    }

    .section-hero-casestudy-single .case-study-list ul li {
        margin-block-end: var(--space-10);
    }

    .section-career-benefits .grid-career-benefit,
    .section-more-than-job-place-grow .custom-career-job-grow-wrapper {
        & .elementor-widget-icon-box .elementor-icon-box-wrapper {
            align-items: center !important;
        }
    }

    .services_book_call_wrap {
        position: relative !important;
        inset-inline-end: unset !important;
        inset-block-end: var(--space-30) !important;
    }

    .section-dreams-reality .process-container {
        &::before {
            inset-block-start: -7.5%;
        }

        .process-item {
            & .result-text {
                max-inline-size: 17.5rem;
                word-break: break-word;
            }

            &:nth-child(odd) .result-text {
                inset-inline-end: calc((var(--space-200) + var(--space-10)) * -1);
            }

            &:nth-child(even) .result-text {
                inset-inline-start: calc((var(--space-200) + var(--space-10)) * -1);
            }
        }
    }

    .testimonials-main {
        .section-testimonials .testimonial-wrap {
            & .single-item-wrapper {
                padding: var(--space-20) var(--space-30) var(--space-20) var(--space-70);

                & .item-content-wrapper {
                    &:before {
                        inset-block-start: calc(var(--space-4) * -1);
                    }
                }
            }

            & .tss-carousel.swiper .swiper-arrow {
                display: none !important;
            }
        }
    }

    .rt-team-container .single-team-area img {
        inline-size: 80%;
    }

    .contact-main {
        &:before {
            inset-inline-start: var(--space-0);
        }
    }

    .blog,
    .category {
        #main #content-wrap {
            padding-block-start: var(--space-60);

            .content-area {
                margin-block-end: var(--space-0);
            }
        }

        .blog-entry {
            padding: 0 1.6rem !important;
            margin-block-end: 0 1.6rem !important;
        }

        .section_def_padding {
            padding-block-start: var(--space-60);
            padding-block-end: var(--space-80);
            padding-inline: var(--space-24) !important;

            &.custom_sc_widget_contact {
                padding-inline: var(--space-0) !important;
            }
        }
    }

    #footer-widgets {
        padding: var(--space-50) var(--space-0) var(--space-40);
    }
}

@media (width <= 576px) {
    .container {
        max-inline-size: var(--size-p100);
        inline-size: var(--size-p100);
    }

    .images-marquee .marquee .marquee-content li {
        font-size: var(--space-50);

        & img {
            block-size: var(--space-100);
        }
    }

    .section-dreams-reality .process-container {
        &::before {
            inline-size: 49.5%;
        }

        .process-item {
            &::after {
                content: unset;
            }

            & .result-text {
                max-inline-size: var(--space-70);
                word-break: break-word;
            }

            &:nth-child(odd) .result-text {
                inset-inline-end: -7.5rem;
            }

            &:nth-child(even) .result-text {
                inset-inline-start: -7.5rem;
            }
        }
    }

    /* 
    .services-grid .eael-post-grid,
    .home-services-grid .eael-post-grid {
        &,
        & .swiper-wrapper {
            min-block-size: 50rem;
            max-block-size: 50rem;
        }
    }    
    */

    .section-our-products .our-products-grid-wrap {
        /* 
        &,
        & .swiper-wrapper {
            min-block-size: 80rem;
            max-block-size: 80rem;
        } 
        */

        & .product_item .product_item_meta {
            & .product_item_meta_industry .elementor-icon-box-wrapper {
                max-inline-size: var(--space-150);
            }
        }
    }

    .section-team-founder .eael-team-item {
        & .eael-team-image {
            max-inline-size: 300px;
        }
    }
}

@media (width <= 480px) {
    /* 
    .services-grid .eael-post-grid,
    .home-services-grid .eael-post-grid {
        &,
        & .swiper-wrapper {
            min-block-size: 60rem;
            max-block-size: 60rem;
        }
    }
    */

    .section-our-products .our-products-grid-wrap {
        /* 
        &,
        & .swiper-wrapper {
            min-block-size: 77rem;
            max-block-size: 77rem;
        } 
        */

        & .product_item .product_item_meta {
            & .product_item_meta_industry .elementor-icon-box-wrapper {
                max-inline-size: var(--space-100);
            }
        }
    }

    .custom-blog-list .blog-list .post-inner-loop {
        &,
        & .swiper-wrapper {
            min-block-size: 46rem;
            max-block-size: 46rem;
        }

        & .tpae-compect-blog-wrap {
            & .tpae-blog-content {
                & .tpae-blog-meta {
                    inset-block-start: unset;
                    inset-inline-end: unset;
                    inset-block-end: calc(var(--space-5) * -1);
                    /* display: none; */

                    & a {
                        font-size: var(--space-12);
                        color: var(--e-global-color-1871565);
                    }
                }
            }
        }
    }

    .section-team-founder .eael-team-item {
        & .eael-team-image {
            max-inline-size: 250px;
        }
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .images-marquee .marquee .marquee-content {
        animation-play-state: paused;
    }

    .hero-banner-main.hero-about-main::before {
        animation: none;
    }
}

/* ============================================
   KEYFRAME ANIMATIONS
   ============================================ */

@keyframes scroll {
    from {
        transform: translateX(var(--space-0));
    }

    to {
        transform: translateX(calc(var(--size-p50) * -1));
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }

    to {
        transform: rotate(360deg);
    }
}

/* Use infinite alternate */
@keyframes ken-burns {
    0% {
        transform: scale(1) translate(0, 0);
    }
    100% {
        transform: scale(1.08) translate(-3%, -3%);
    }
}

@keyframes subtle-rotate {
    0% {
        transform: scale(1.05) rotate(0deg);
    }
    50% {
        transform: scale(1.1) rotate(1deg);
    }
    100% {
        transform: scale(1.05) rotate(0deg);
    }
}

@keyframes diagonal-sweep-transform {
    0% {
        transform: translate(0, 0) scale(1);
    }
    20% {
        transform: translate(-5%, -8%) scale(1.12);
    }
    40% {
        transform: translate(-10%, -15%) scale(1.3);
    }
    60% {
        transform: translate(-20%, -10%) scale(1.2);
    }
    80% {
        transform: translate(-25%, -5%) scale(1.1);
    }
    100% {
        transform: translate(0, 0) scale(1);
    }
}