/*------------------------------------------------------------------

    1. Variables and Colors
    2. Global Styles
    3. Utility Classes
    4. Components
    5. Layout
        01. Preloader
        02. Hero Section
        03. Footer Section
        04. Breadcrumb Section
        05. Counter Card
        06. Tap To Top
        07. Sidebar Menu
        08. Header
        09. Section Content
        10. How It Works
        11. Portfolio Details
        12. Testimonial
        13. Why Choose Us
        14. Marqee Section
        15. About Section
        16. Newsletter Section
    6. Pages
        02. About Page
        03. Service Page
        04. Service Details Page
        05. Portfolio Page
        06. Portfolio Details Page
        07. Faq Page
        08. Pricing Page
        09. Team Details  
        10. Contact Page      
        11. Blog Page
        12. Blog Details Page
        13. Error 404 Page
        14. Home 1        
        15. Home 2        
        16. Home 3        
        17. Home 4
        18. Home 5        

    -------------------------------------------------------------------*/
    @import url("https://fonts.googleapis.com/css2?family=Funnel+Display:wght@300..800&family=Phudu:wght@300..900&display=swap");

    @font-face {
        font-family: "T1 Korium";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/t1-korium/T1Korium.woff2") format("woff2"), url("../fonts/t1-korium/T1Korium.woff") format("woff"), url("../fonts/t1-korium/T1Korium.otf") format("opentype"), url("../fonts/t1-korium/T1Korium.ttf") format("truetype");
    }

    @font-face {
        font-family: "Clash Display";
    font-style: normal;
    font-weight: 400;
    src: url("../fonts/ClashDisplay/ClashDisplay.ttf") format("truetype");
    }

    @font-face {
        font-family: "Clash Display";
    src: url("../fonts/ClashDisplay/ClashDisplay-Variable.woff2") format("woff2"), url("../fonts/ClashDisplay/ClashDisplay-Variable.woff") format("woff"), url("../fonts/ClashDisplay/ClashDisplay-Variable.ttf") format("truetype");
    font-weight: 200 700;
    font-display: swap;
    font-style: normal;
    }

    :root,
    [data-theme=light] {
        --heading-font: "T1 Korium";
        --heading-font-two: "Phudu", sans-serif;
        --body-font: "Funnel Display", sans-serif;
        --body-font-two: "Clash Display", sans-serif;
        --heading-one: clamp(1.5rem, 2.8vw + 1rem, 3.75rem);
        --heading-two: clamp(1.375rem, 1.7vw + 1rem, 2.5rem);
        --heading-three: clamp(1.25rem, .8vw + 1rem, 1.875rem);
        --heading-four: clamp(1.125rem, .5vw + 1rem, 1.5rem);
        --heading-five: clamp(1.0625rem, .3vw + 1rem, 1.25rem);
        --heading-six: 1.2rem;
        --body-bg-one: #E6E3FF;
        --body-bg-two: #F8F7F3;
        --body-bg-three: #F5F5F5;
        --body-bg-four: #D1CCFF;
        --body-color: #000000;
        --card-bg: #2B3035;
        --card-bg-two: #F2F0E8;
        --card-bg-three: #0D0D0D;
        --card-bg-four: #F9F8F6;
        --hero-bg: #FAF7EF;
        --border-color: #3B4046;
        --button-bg: #3B4046;
        --blackish-color-rgb: 0, 0, 1;
        --primary: #FF582F;
        --secondary: #C4F112;
        --tertiary: #460AF5;
        --white: #FFF;
        --white-l-100: rgba(255, 255, 255, 0.1);
        --white-l-200: rgba(255, 255, 255, 0.2);
        --white-l-300: rgba(255, 255, 255, 0.3);
        --white-l-400: rgba(255, 255, 255, 0.4);
        --white-l-500: rgba(255, 255, 255, 0.5);
        --white-l-600: rgba(255, 255, 255, 0.6);
        --white-l-700: rgba(255, 255, 255, 0.7);
        --white-l-800: rgba(255, 255, 255, 0.8);
        --white-l-900: rgba(255, 255, 255, 0.9);
        --black: #000;
        --black-l-100: rgba(0, 0, 0, 0.1);
        --black-l-200: rgba(0, 0, 0, 0.2);
        --black-l-300: rgba(0, 0, 0, 0.3);
        --black-l-400: rgba(0, 0, 0, 0.4);
        --black-l-500: rgba(0, 0, 0, 0.5);
        --black-l-600: rgba(0, 0, 0, 0.6);
        --black-l-700: rgba(0, 0, 0, 0.7);
        --black-l-800: rgba(0, 0, 0, 0.8);
        --black-l-900: rgba(0, 0, 0, 0.9);
        --dark: #212529;
        --dark-d-100: #1e2125;
        --dark-d-200: #1a1e21;
        --dark-d-300: #171a1d;
        --dark-d-400: #141619;
        --dark-d-500: #111315;
        --dark-l-100: #373b3e;
        --dark-l-200: #4d5154;
        --dark-l-300: #646669;
        --dark-l-400: #7a7c7f;
        --dark-l-500: #909294;
        --dark-l-600: #a6a8a9;
        --dark-l-700: #bcbebf;
        --dark-l-800: #d3d3d4;
        --dark-l-900: #e9e9ea;
        --success: #0ED016;
        --success-d-100: #0dbb14;
        --success-d-200: #0ba612;
        --success-d-300: #0a920f;
        --success-d-400: #087d0d;
        --success-d-500: #07680b;
        --success-l-100: #26d52d;
        --success-l-200: #3ed945;
        --success-l-300: #56de5c;
        --success-l-400: #6ee373;
        --success-l-500: #87e88b;
        --success-l-600: #9feca2;
        --success-l-700: #b7f1b9;
        --success-l-800: #cff6d0;
        --success-l-900: #e7fae8;
        --danger: #f25640;
        --danger-d-100: #da4d3a;
        --danger-d-200: #c24533;
        --danger-d-300: #a93c2d;
        --danger-d-400: #913426;
        --danger-d-500: #792b20;
        --danger-l-100: #f36753;
        --danger-l-200: #f57866;
        --danger-l-300: #f68979;
        --danger-l-400: #f79a8c;
        --danger-l-500: #f9aba0;
        --danger-l-600: #fabbb3;
        --danger-l-700: #fbccc6;
        --danger-l-800: #fcddd9;
        --danger-l-900: #feeeec;
        --warning: #dfa000;
        --warning-d-100: #c99000;
        --warning-d-200: #b28000;
        --warning-d-300: #9c7000;
        --warning-d-400: #866000;
        --warning-d-500: #705000;
        --warning-l-100: #e2aa1a;
        --warning-l-200: #e5b333;
        --warning-l-300: #e9bd4d;
        --warning-l-400: #ecc666;
        --warning-l-500: #efd080;
        --warning-l-600: #f2d999;
        --warning-l-700: #f5e3b3;
        --warning-l-800: #f9eccc;
        --warning-l-900: #fcf6e6;
        --info: #0dcaf0;
        --info-d-100: #0cb6d8;
        --info-d-200: #0aa2c0;
        --info-d-300: #098da8;
        --info-d-400: #087990;
        --info-d-500: #076578;
        --info-l-100: #0dcaf0;
        --info-l-200: #25cff2;
        --info-l-300: #3dd5f3;
        --info-l-400: #56daf5;
        --info-l-500: #6edff6;
    }

    [data-theme=dark] {
        --body-bg-one: #101010;
        --body-bg-two: #101010;
        --body-bg-three: #030303;
        --body-bg-four: #0f0f0f;
        --body-color: #ffffff;
        --card-bg: #FFFFFF;
        --card-bg-two: #1F1E1A;
        --card-bg-three: #F2F2F2;
        --card-bg-four: #1B1A18;
        --white: #000;
        --black: #ffffff;
        --hero-bg: #141414;
        --black-l-100: rgba(255, 255, 255, 0.1);
        --black-l-200: rgba(255, 255, 255, 0.2);
        --black-l-300: rgba(255, 255, 255, 0.3);
        --black-l-400: rgba(255, 255, 255, 0.4);
        --black-l-500: rgba(255, 255, 255, 0.5);
        --black-l-600: rgba(255, 255, 255, 0.6);
        --black-l-700: rgba(255, 255, 255, 0.7);
        --black-l-800: rgba(255, 255, 255, 0.8);
        --black-l-900: rgba(255, 255, 255, 0.9);
        --white-l-100: rgba(0, 0, 0, 0.1);
        --white-l-200: rgba(0, 0, 0, 0.2);
        --white-l-300: rgba(0, 0, 0, 0.3);
        --white-l-400: rgba(0, 0, 0, 0.4);
        --white-l-500: rgba(0, 0, 0, 0.5);
        --white-l-600: rgba(0, 0, 0, 0.6);
        --white-l-700: rgba(0, 0, 0, 0.7);
        --white-l-800: rgba(0, 0, 0, 0.8);
        --white-l-900: rgba(0, 0, 0, 0.9);
    }

    ::-webkit-scrollbar {
        width: 6px;
    }

    ::-webkit-scrollbar-track {
        box-shadow: inset 0 0 5px var(--primary);
    }

    ::-webkit-scrollbar-thumb {
        background: var(--primary);
    }

    ::-webkit-scrollbar-thumb:hover {
        background: var(--primary);
    }

    .fit--img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .cursor--pointer {
        cursor: pointer;
    }

    .container-fluid {
        padding: 0 75px;
    }

    .material-symbols-outlined {
        font-family: "Material Symbols Outlined";
        font-weight: normal;
        font-style: normal;
        font-size: 24px;
        line-height: 1;
        letter-spacing: normal;
        text-transform: none;
        display: inline-block;
        white-space: nowrap;
        word-wrap: normal;
        direction: ltr;
        -webkit-font-feature-settings: "liga";
        -webkit-font-smoothing: antialiased;
    }

    .left-marq {
        animation: moveLeft 40s linear infinite;
    }

    .right-marq {
        animation: moveRight 20s linear infinite;
    }

    .top-marq {
        animation: moveTop 40s linear infinite;
    }

    .bottom-marq {
        animation: moveBottom 10s linear infinite;
    }

    .top-marq--two {
        animation: moveTopTwo 40s linear infinite;
    }

    .bottom-marq--two {
        animation: moveBottomTwo 40s linear infinite;
    }

    @keyframes moveLeft {
        0% {
            transform: translateX(0%);
        }

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

    @keyframes moveRight {
        0% {
            transform: translateX(-550px);
        }

        100% {
            transform: translateX(0%);
        }
    }

    @keyframes moveTop {
        0% {
            transform: translateY(-100px);
        }

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

    @keyframes moveTopTwo {
        0% {
            transform: translateY(-10%);
        }

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

    @keyframes moveBottom {
        0% {
            transform: translateY(-100px);
        }

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

    @keyframes moveBottomTwo {
        0% {
            transform: translateY(-20%);
        }

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

    @keyframes animate-pulse {
        0% {
            box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.2), 0 0 0 0 rgba(255, 255, 255, 0.2);
        }

        40% {
            box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 0 rgba(255, 255, 255, 0.2);
        }

        80% {
            box-shadow: 0 0 0 50px rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
        }

        100% {
            box-shadow: 0 0 0 0 rgba(255, 109, 74, 0), 0 0 0 30px rgba(255, 109, 74, 0);
        }
    }

    .fit-bg--img {
        background-size: cover !important;
        background-repeat: no-repeat !important;
        background-position: center !important;
    }

    #smooth-wrapper {
        height: 100%;
        overflow: hidden;
    }

    #smooth-content {
        will-change: transform;
    }

    .split--text span {
        display: inline-block;
        min-width: 30px !important;
    }

    .text--perspective {
        perspective: 400px;
    }

    body .cursor {
        pointer-events: none;
    }

    body .cursor__ball {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1;
    }

    body .cursor__ball circle {
        fill: var(--black);
    }

    .hover--img {
        position: relative;
    }

    .hover--img canvas {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .hover--img img:nth-child(2) {
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        transition: opacity 0.3s;
    }

    .hover--img img {
        display: none;
    }

    .hover--img:hover img:nth-child(2) {
        opacity: 1;
    }

    .ai-agency {
        position: relative;
    }

    .ai-agency .line {
        height: 100%;
        width: 1px;
        border: 1px dashed var(--black-l-100);
    }

    .ai-agency .line.one {
        top: 0;
        left: 75px;
        z-index: 1;
    }

    .ai-agency .line.two {
        top: 0;
        right: 75px;
        z-index: 1;
    }

    .ai-agency .line.three {
        top: 0;
        left: 70px;
        z-index: 1;
    }

    .ai-agency .line.four {
        top: 0;
        right: 70px;
        z-index: 1;
    }

    .pills {
        border-radius: 90px !important;
    }

    .er-word--span {
        display: inline-block;
    }

    .er-letter--span {
        display: inline-block;
    }

    .hover-link--light {
        display: inline !important;
        background-image: linear-gradient(transparent calc(100% - 2px), var(--white) 5px);
        background-repeat: no-repeat;
        background-size: 0% 100%;
        background-position: left top;
        transition: background-size 0.5s ease;
    }

    .hover-link--light:hover {
        background-size: 100% 100%;
    }

    .hover-link--dark {
        display: inline !important;
        background-image: linear-gradient(transparent calc(100% - 2px), var(--black) 5px);
        background-repeat: no-repeat;
        background-size: 0% 100%;
        background-position: left top;
        transition: background-size 0.5s ease;
    }

    .hover-link--dark:hover {
        background-size: 100% 100%;
    }

    .hover-link--primary {
        display: inline !important;
        background-image: linear-gradient(transparent calc(100% - 2px), var(--primary) 5px);
        background-repeat: no-repeat;
        background-size: 0% 100%;
        background-position: left top;
        transition: background-size 0.5s ease;
    }

    .hover-link--primary:hover {
        background-size: 100% 100%;
    }

    .title-underline--dark {
        display: inline !important;
        background-image: linear-gradient(transparent calc(100% - 2px), var(--black) 5px);
        background-repeat: no-repeat;
        background-size: 0% 100%;
        background-position: left top;
        transition: background-size 0.5s ease;
    }

    .title-underline--light {
        display: inline !important;
        background-image: linear-gradient(transparent calc(100% - 2px), var(--white) 5px);
        background-repeat: no-repeat;
        background-size: 0% 100%;
        background-position: left top;
        transition: background-size 0.5s ease;
    }

    .work-listing article {
        line-height: 0;
        position: relative;
        -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
        -webkit-tap-highlight-color: transparent;
        -webkit-backface-visibility: none;
        backface-visibility: none;
    }

    .work-listing article a {
        display: block;
    }

    .work-listing figure i.work-lottie {
        display: block;
        height: 100%;
        overflow: hidden;
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 1;
    }

    .work-listing article i svg path {
        fill: #eeeef2;
        width: 100%;
        height: 100%;
    }

    .work-listing figure,
    .work-listing figure img {
        position: relative;
        transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
        -webkit-transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
        -moz-transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
        -o-transition: transform 0.5s cubic-bezier(0.23, 1, 0.32, 1);
        height: 100%;
    }

    .work-listing article i svg {
        height: 100%;
        opacity: 1;
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 2;
    }

    .offcanvas {
        width: 300px !important;
    }

    .offcanvas .sidebar-menu-list__link .text {
        font-size: 26px;
    }

    .offcanvas .link-roll--xl {
        height: 36px;
    }

    .offcanvas .sidebar-submenu-list__link {
        margin: 0px 0px 0px 0px !important;
        padding: 3px 12px;
        font-size: 16px;
    }

    .offcanvas .gallery--wrap .thumb--wrap {
        width: 100%;
        height: 125px;
        overflow: hidden;
    }

    .offcanvas .gallery--wrap .thumb--wrap img {
        transition: 0.3s linear;
    }

    .offcanvas .gallery--wrap .thumb--wrap:hover img {
        scale: 1.1;
    }

    .offcanvas .social-item--wrap .item a {
        width: 35px;
        height: 35px;
        border: 1px solid var(--black);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .offcanvas .social-item--wrap .item a i {
        transition: 0.3s linear !important;
    }

    .offcanvas .social-item--wrap .item a:hover {
        background-color: var(--primary);
        border: 1px solid var(--primary);
    }

    .offcanvas .social-item--wrap .item a:hover i {
        color: var(--white) !important;
    }

    .offcanvas .contact-info--wrap .location--item .icon--wrap {
        width: 25px;
        height: 25px;
        border: 1px solid var(--black);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .offcanvas .contact-info--wrap .location--item .icon--wrap i {
        font-size: 13px;
    }

    .map-box {
        height: 662px;
        width: 100%;
        overflow: hidden;
    }

    .map-box iframe {
        width: 100%;
        height: 100%;
    }

    .bg--white {
        background-color: var(--white) !important;
    }

    .bg--black {
        background-color: var(--black) !important;
    }

    .bg--dark {
        background-color: var(--dark-bg) !important;
    }

    .bg--primary {
        background-color: var(--primary) !important;
    }

    .bg--secondary {
        background-color: var(--secondary) !important;
    }

    .bg--tertiary {
        background-color: var(--tertiary) !important;
    }

    .bg--success {
        background-color: var(--success) !important;
    }

    .bg--danger {
        background-color: var(--danger) !important;
    }

    .bg--warning {
        background-color: var(--warning) !important;
    }

    .bg--info {
        background-color: var(--info) !important;
    }

    .section--bg {
        background-color: var(--body-bg-one) !important;
    }

    .section-bg--two {
        background-color: var(--body-bg-two) !important;
    }

    .section-bg--three {
        background-color: var(--body-bg-three) !important;
    }

    .bg--transparent {
        background-color: transparent !important;
    }

    .body-bg--two {
        background-color: var(--body-bg-two);
    }

    .text--base-two {
        color: var(--base-two) !important;
    }

    .text--white {
        color: var(--white) !important;
    }

    .text--white7 {
        color: var(--white-l-700) !important;
    }

    .text--primary {
        color: var(--primary) !important;
    }

    .text--secondary {
        color: var(--secondary) !important;
    }

    .text--tertiary {
        color: var(--tertiary) !important;
    }

    .text--success {
        color: var(--success) !important;
    }

    .text--danger {
        color: var(--danger) !important;
    }

    .text--warning {
        color: var(--warning) !important;
    }

    .text--info {
        color: var(--info) !important;
    }

    .text--violet {
        color: var(--violet) !important;
    }

    .text--body {
        color: var(--body-bg-one);
    }

    .text--black {
        color: var(--black) !important;
    }

    .text--black7 {
        color: var(--black-l-700) !important;
    }

    .hover-text--primary:hover {
        color: var(--primary) !important;
    }

    .my-120 {
        margin-top: 120px;
        margin-bottom: 120px;
    }

    .my-80 {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    .my-60 {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .my-40 {
        margin-top: 30px;
        margin-bottom: 30px;
    }

    .mb-180 {
        margin-bottom: 180px;
    }

    .mt-180 {
        margin-top: 180px;
    }

    .mt-120 {
        margin-top: 120px;
    }

    .mt-100 {
        margin-top: 100px;
    }

    .mt-60 {
        margin-top: 60px;
    }

    .mt-25 {
        margin-top: 25px;
    }

    .mt-80 {
        margin-top: 80px;
    }

    .mt-40 {
        margin-top: 40px;
    }

    .mb-120 {
        margin-bottom: 120px;
    }

    .mb-110 {
        margin-bottom: 110px;
    }

    .mb-100 {
        margin-bottom: 100px;
    }

    .mb-80 {
        margin-bottom: 80px;
    }

    .mb-75 {
        margin-bottom: 75px;
    }

    .mb-70 {
        margin-bottom: 70px;
    }

    .mb-60 {
        margin-bottom: 60px;
    }

    .mb-50 {
        margin-bottom: 50px;
    }

    .mb-40 {
        margin-bottom: 40px;
    }

    .mb-30 {
        margin-bottom: 30px !important;
    }

    .mb-20 {
        margin-bottom: 20px;
    }

    @media (max-width: 992px) {
        .my-120 {
            margin-top: 60px;
            margin-bottom: 60px;
        }

        .mt-100 {
            margin-top: 0px;
        }

        .mt-120 {
            margin-top: 50px;
        }

        .mb-120 {
            margin-bottom: 80px;
        }

        .mb-100 {
            margin-bottom: 60px;
        }

        .mb-110 {
            margin-bottom: 70px;
        }

        .my-60 {
            margin-top: 40px;
            margin-bottom: 40px;
        }

        .mt-60 {
            margin-top: 40px;
        }

        .mt-25 {
            margin-top: 20px;
        }

        .mb-60 {
            margin-bottom: 40px;
        }

        .my-80 {
            margin-top: 60px;
            margin-bottom: 60px;
        }

        .mt-80 {
            margin-top: 60px;
        }

        .mb-80 {
            margin-bottom: 60px;
        }

        .my-40 {
            margin-top: 30px;
            margin-bottom: 30px;
        }

        .mt-40 {
            margin-top: 30px;
        }

        .mb-40 {
            margin-bottom: 30px;
        }

        .mb-20 {
            margin-bottom: 15px;
        }
    }
    /* Base Styles */
    .py-30 {
        padding-top: 30px;
        padding-bottom: 30px;
    }

    .py-40 {
        padding-top: 40px;
        padding-bottom: 40px;
    }

    .py-50 {
        padding-top: 50px;
        padding-bottom: 50px;
    }

    .py-60 {
        padding-top: 60px;
        padding-bottom: 60px;
    }

    .py-70 {
        padding-top: 70px;
        padding-bottom: 70px;
    }

    .py-80 {
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .py-100 {
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .py-110 {
        padding-top: 110px;
        padding-bottom: 110px;
    }

    .py-115 {
        padding-top: 115px;
        padding-bottom: 115px;
    }

    .py-120 {
        padding-top: 120px;
        padding-bottom: 120px;
    }

    .py-130 {
        padding-top: 130px;
        padding-bottom: 130px;
    }

    .py-155 {
        padding-top: 155px;
        padding-bottom: 155px;
    }

    .py-175 {
        padding-top: 175px;
        padding-bottom: 175px;
    }

    .py-180 {
        padding-top: 180px;
        padding-bottom: 180px;
    }

    .py-290 {
        padding-top: 290px;
        padding-bottom: 290px;
    }

    .pt-200 {
        padding-top: 200px;
    }

    .pt-120 {
        padding-top: 120px;
    }

    .pt-130 {
        padding-top: 130px;
    }

    .pt-80 {
        padding-top: 80px;
    }

    .pt-100 {
        padding-top: 100px !important;
    }

    .pt-60 {
        padding-top: 60px !important;
    }

    .pt-40 {
        padding-top: 40px;
    }

    .pt-30 {
        padding-top: 30px;
    }

    .pb-30 {
        padding-bottom: 30px;
    }

    .pb-40 {
        padding-bottom: 40px;
    }

    .pb-50 {
        padding-bottom: 50px;
    }

    .pb-60 {
        padding-bottom: 60px;
    }

    .pb-80 {
        padding-bottom: 80px;
    }

    .pb-100 {
        padding-bottom: 100px;
    }

    .pb-115 {
        padding-bottom: 115px;
    }

    .pb-120 {
        padding-bottom: 120px;
    }

    .pb-130 {
        padding-bottom: 130px;
    }

    /* Media Queries */
    @media (max-width: 1399px) {
        .py-100,
    .py-110,
    .py-115,
    .py-120,
    .py-155,
    .py-175,
    .py-180,
    .py-290 {
            padding-top: 80px;
            padding-bottom: 80px;
        }

        .py-175 {
            padding-top: 120px;
            padding-bottom: 120px;
        }

        .py-180 {
            padding-top: 130px;
            padding-bottom: 130px;
        }

        .py-290 {
            padding-top: 180px;
            padding-bottom: 180px;
        }

        .pb-100,
    .pb-115,
    .pb-120 {
            padding-bottom: 80px;
        }

        .pb-120 {
            padding-bottom: 100px;
        }

        .pb-40 {
            padding-bottom: 30px;
        }
    }

    @media (max-width: 1024px) {
        .py-290 {
            padding-top: 120px;
            padding-bottom: 120px;
        }
    }

    @media (max-width: 992px) {
        .py-40 {
            padding-top: 30px;
            padding-bottom: 30px;
        }

        .py-60 {
            padding-top: 100px;
            padding-bottom: 40px;
        }

        .py-80 {
            padding-top: 60px;
            padding-bottom: 60px;
        }

        .py-100,
    .py-290 {
            padding-top: 80px;
            padding-bottom: 80px;
        }

        .pt-120 {
            padding-top: 100px;
        }

        .pt-80 {
            padding-top: 60px;
        }

        .pt-100 {
            padding-top: 90px;
        }

        .pt-60 {
            padding-top: 50px;
        }

        .pt-40 {
            padding-top: 30px;
        }

        .pb-30 {
            padding-bottom: 25px;
        }

        .pb-60 {
            padding-bottom: 50px;
        }

        .pb-80 {
            padding-bottom: 60px;
        }
    }

    @media (max-width: 576px) {
        .py-40 {
            padding-top: 20px;
            padding-bottom: 20px;
        }

        .py-60 {
            padding-top: 90px;
            padding-bottom: 40px;
        }

        .py-80 {
            padding-top: 40px;
            padding-bottom: 40px;
        }

        .py-100,
    .py-110,
    .py-115,
    .py-120,
    .py-155,
    .py-175,
    .py-180,
    .py-290 {
            padding-top: 70px;
            padding-bottom: 70px;
        }

        .pt-120 {
            padding-top: 80px;
        }

        .pt-80 {
            padding-top: 50px;
        }

        .pt-100 {
            padding-top: 70px;
        }

        .pt-60 {
            padding-top: 40px;
        }

        .pt-40 {
            padding-top: 20px;
        }

        .pb-30 {
            padding-bottom: 20px;
        }

        .pb-40 {
            padding-bottom: 30px;
        }

        .pb-60 {
            padding-bottom: 40px;
        }

        .pb-80 {
            padding-bottom: 40px;
        }

        .pb-100 {
            padding-bottom: 70px;
        }

        .pb-115,
    .pb-120 {
            padding-bottom: 70px;
        }
    }

    body {
        font-family: var(--body-font);
        word-break: break-word;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        overflow-x: hidden;
    }

    p {
        font-family: var(--body-font);
        font-size: 16px;
        margin: 0;
        font-weight: 400;
        word-break: break-word;
        color: var(--body-color);
        line-height: 1.1;
    }

    h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
        margin: 0 0 15px 0;
        font-family: var(--body-font);
        color: var(--body-color);
        line-height: 1.1;
        word-break: break-word;
    }

    @media screen and (max-width: 770px) {
        h1,
    h2,
    h3,
    h4,
    h5,
    h6 {
            margin: 0 0 10px 0;
        }
    }

    h1 {
        font-size: var(--heading-one);
        font-weight: 700;
    }

    h2 {
        font-size: var(--heading-two);
        font-weight: 600;
        margin: 0px;
    }

    h3 {
        font-size: var(--heading-three);
        font-weight: 600;
    }

    h4 {
        font-size: var(--heading-four);
        font-weight: 500;
    }

    h5 {
        font-size: var(--heading-five);
        font-weight: 500;
    }

    h6 {
        font-size: 20px;
        font-weight: 500;
    }

    h1 > a,
    h2 > a,
    h3 > a,
    h4 > a,
    h5 > a,
    h6 > a {
        font-weight: 400;
        transition: 0.2s linear;
        line-height: 1.4;
        word-break: break-word;
        color: hsl(var(--heading-color));
    }

    a {
        display: inline-block;
        transition: 0.2s linear;
        text-decoration: none;
        font-family: var(--body-font);
        color: var(--body-color);
    }

    a:hover {
        color: var(--primary);
    }

    img {
        max-width: 100%;
        height: auto;
        vertical-align: middle;
    }

    select {
        cursor: pointer;
    }

    ul,
    ol {
        padding: 0;
        margin: 0;
        list-style: none;
    }

    *:focus {
        outline: none;
    }

    button {
        cursor: pointer;
        border: none;
        background-color: transparent;
    }

    button:focus {
        outline: none;
    }

    .form-select:focus {
        outline: 0;
        box-shadow: none;
    }

    .text--upper {
        text-transform: uppercase;
    }

    .text--xsm {
        font-size: 8px !important;
    }

    .text--sm {
        font-size: 12px !important;
    }

    .fs--14 {
        font-size: 14px !important;
    }

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

    .fs--18 {
        font-size: 18px !important;
    }

    .fs--20 {
        font-size: 20px !important;
    }

    .fs--22 {
        font-size: 22px !important;
    }

    .fs--24 {
        font-size: 24px !important;
    }

    .fs--26 {
        font-size: 26px !important;
    }

    .fs--28 {
        font-size: 28px !important;
    }

    .fs--30 {
        font-size: 30px !important;
    }

    .fs--32 {
        font-size: 32px !important;
    }

    .fs--34 {
        font-size: 34px !important;
    }

    .fs--36 {
        font-size: 36px !important;
    }

    .fs--38 {
        font-size: 38px !important;
    }

    .fs--40 {
        font-size: 40px !important;
    }

    .fs--42 {
        font-size: 42px !important;
    }

    .fs--44 {
        font-size: 44px !important;
    }

    .fs--46 {
        font-size: 46px !important;
    }

    .fs--48 {
        font-size: 48px !important;
    }

    .fs--50 {
        font-size: 50px !important;
    }

    .fs--52 {
        font-size: 52px !important;
    }

    .fs--54 {
        font-size: 54px !important;
    }

    .fs--56 {
        font-size: 56px !important;
    }

    .fs--58 {
        font-size: 58px !important;
    }

    .fs--60 {
        font-size: 60px !important;
    }

    .fs--62 {
        font-size: 62px !important;
    }

    .fs--64 {
        font-size: 64px !important;
    }

    .fs--66 {
        font-size: 66px !important;
    }

    .fs--68 {
        font-size: 68px !important;
    }

    .fs--70 {
        font-size: 70px !important;
    }

    .fs--72 {
        font-size: 72px !important;
    }

    .fs--100 {
        font-size: 100px !important;
    }

    .fw--100 {
        font-weight: 300 !important;
    }

    .fw--200 {
        font-weight: 300 !important;
    }

    .fw--300 {
        font-weight: 300 !important;
    }

    .fw--400 {
        font-weight: 400 !important;
    }

    .fw--500 {
        font-weight: 500 !important;
    }

    .fw--600 {
        font-weight: 600 !important;
    }

    .fw--700 {
        font-weight: 700 !important;
    }

    .fw--800 {
        font-weight: 800 !important;
    }

    .fw--900 {
        font-weight: 900 !important;
    }

    .body--font {
        font-family: var(--body-font) !important;
    }

    .body-font--two {
        font-family: var(--body-font-two) !important;
    }

    .heading--font {
        font-family: var(--heading-font) !important;
    }

    .heading-font--two {
        font-family: var(--heading-font-two) !important;
    }

    .third--font {
        font-family: var(--third--heading) !important;
    }

    .text--underline {
        text-decoration: underline !important;
    }

    .digital--number-font {
        font-family: var(--digit-font) !important;
    }

    @media (max-width: 767px) {
        .fw--600 {
            font-weight: 500 !important;
        }

        .fw--700 {
            font-weight: 500 !important;
        }

        .fw--800 {
            font-weight: 500 !important;
        }

        .fw--900 {
            font-weight: 500 !important;
        }
    }

    @media (max-width: 575px) {
        .fs--32 {
            font-size: 26px !important;
        }
    }

    .text--stroke {
        color: transparent;
        -webkit-text-stroke: 1px var(--black);
    }

    .text-stroke--white {
        color: transparent;
        -webkit-text-stroke: 1px var(--white);
    }

    .base--radius {
        border-radius: 8px !important;
    }

    .radius--4 {
        border-radius: 4px !important;
    }

    .radius--8 {
        border-radius: 8px !important;
    }

    .radius--12 {
        border-radius: 12px !important;
    }

    .radius--16 {
        border-radius: 16px !important;
    }

    .radius--20 {
        border-radius: 20px !important;
    }

    .radius--24 {
        border-radius: 24px !important;
    }

    .radius--28 {
        border-radius: 28px !important;
    }

    .radius--30 {
        border-radius: 30px !important;
    }

    .radius--32 {
        border-radius: 32px !important;
    }

    .radius--50 {
        border-radius: 50% !important;
    }

    .radius--0 {
        border-radius: 0 !important;
    }

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

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

    .z--3 {
        z-index: 3;
    }

    .z--4 {
        z-index: 4;
    }

    .z--5 {
        z-index: 5;
    }

    .z--6 {
        z-index: 6;
    }

    .z--7 {
        z-index: 7;
    }

    .z--8 {
        z-index: 8;
    }

    .z--9 {
        z-index: 9;
    }

    .zm--1 {
        z-index: -1;
    }

    .zm--2 {
        z-index: -2;
    }

    .zm--3 {
        z-index: -3;
    }

    .zm--4 {
        z-index: -4;
    }

    .zm--5 {
        z-index: -5;
    }

    .zm--6 {
        z-index: -6;
    }

    .zm--7 {
        z-index: -7;
    }

    .zm--8 {
        z-index: -8;
    }

    .zm--9 {
        z-index: -9;
    }

    .w--10 {
        width: 10% !important;
    }

    .w--20 {
        width: 20% !important;
    }

    .w--30 {
        width: 30% !important;
    }

    .w--40 {
        width: 40% !important;
    }

    .w--50 {
        width: 50% !important;
    }

    .w--60 {
        width: 60% !important;
    }

    .w--70 {
        width: 70% !important;
    }

    .w--80 {
        width: 80% !important;
    }

    .w--90 {
        width: 90% !important;
    }

    .w--100 {
        width: 100% !important;
    }

    .h--10 {
        height: 10% !important;
    }

    .h--20 {
        height: 20% !important;
    }

    .h--30 {
        height: 30% !important;
    }

    .h--40 {
        height: 40% !important;
    }

    .h--50 {
        height: 50% !important;
    }

    .h--60 {
        height: 60% !important;
    }

    .h--70 {
        height: 70% !important;
    }

    .h--80 {
        height: 80% !important;
    }

    .h--90 {
        height: 90% !important;
    }

    .h--100 {
        height: 100% !important;
    }

    .border--base3 {
        border: 1px solid hsl(var(--base)/0.3) !important;
    }

    .border--black {
        border-color: hsl(var(--black)) !important;
    }

    .border--black1 {
        border-color: hsl(var(--black)/0.1) !important;
    }

    .border--black3 {
        border-color: hsl(var(--black)/0.32) !important;
    }

    .border--primary {
        border-color: var(--primary) !important;
    }

    .border--secondary {
        border-color: hsl(var(--secondary)) !important;
    }

    .border--success {
        border-color: hsl(var(--success)) !important;
    }

    .border--danger {
        border-color: hsl(var(--danger)) !important;
    }

    .border--warning {
        border-color: hsl(var(--warning)) !important;
    }

    .border--info {
        border-color: hsl(var(--info)) !important;
    }

    .border--violet {
        border-color: hsl(var(--violet)) !important;
    }

    .border--white {
        border: 1px solid hsl(var(--white)) !important;
    }

    .border-top--solid {
        border-top: 1px solid hsl(var(--black)) !important;
    }

    .border-top--dash {
        border-top: 1px dashed hsl(var(--black)) !important;
    }

    .border-right--solid {
        border-right: 1px solid hsl(var(--black)) !important;
    }

    .border-tight--dash {
        border-right: 1px dashed hsl(var(--black)) !important;
    }

    .border-left--solid {
        border-left: 1px solid hsl(var(--black)) !important;
    }

    .border-left--dashed {
        border-left: 1px dashed hsl(var(--black)) !important;
    }

    .border-bottom--solid {
        border-bottom: 1px solid hsl(var(--black)) !important;
    }

    .border-bottom--dashed {
        border-bottom: 1px dashed hsl(var(--black)) !important;
    }

    .border--solid1 {
        border: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border--dash1 {
        border: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border--solid2 {
        border: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border--dash2 {
        border: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border--solid3 {
        border: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border--dash3 {
        border: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border--solid4 {
        border: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border--dash4 {
        border: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border--solid5 {
        border: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border--dash5 {
        border: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border-top--solid1 {
        border-top: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border-top--dash1 {
        border-top: 1px dashed hsl(var(--black)/0.1) !important;
    }

    .border-top--solid2 {
        border-top: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border-top--dash2 {
        border-top: 1px dashed hsl(var(--black)/0.2) !important;
    }

    .border-top--solid3 {
        border-top: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border-top--dash3 {
        border-top: 1px dashed hsl(var(--black)/0.3) !important;
    }

    .border-top--solid4 {
        border-top: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border-top--dash4 {
        border-top: 1px dashed hsl(var(--black)/0.4) !important;
    }

    .border-top-solid5 {
        border-top: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border-top--dash5 {
        border-top: 1px dashed hsl(var(--black)/0.5) !important;
    }

    .border-right--solid1 {
        border-right: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border-right--dash1 {
        border-right: 1px dashed hsl(var(--black)/0.1) !important;
    }

    .border-right--solid2 {
        border-right: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border-right--dash2 {
        border-right: 1px dashed hsl(var(--black)/0.2) !important;
    }

    .border-right--solid3 {
        border-right: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border-right--dash3 {
        border-right: 1px dashed hsl(var(--black)/0.3) !important;
    }

    .border-right--solid4 {
        border-right: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border-right--dash4 {
        border-right: 1px dashed hsl(var(--black)/0.4) !important;
    }

    .border-right-solid5 {
        border-right: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border-right--dash5 {
        border-right: 1px dashed hsl(var(--black)/0.5) !important;
    }

    .border-bottom--solid1 {
        border-bottom: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border-bottom--dash1 {
        border-bottom: 1px dashed hsl(var(--black)/0.1) !important;
    }

    .border-bottom--solid2 {
        border-bottom: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border-bottom--dash2 {
        border-bottom: 1px dashed hsl(var(--black)/0.2) !important;
    }

    .border-bottom--solid3 {
        border-bottom: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border-bottom--dash3 {
        border-bottom: 1px dashed hsl(var(--black)/0.3) !important;
    }

    .border-bottom--solid4 {
        border-bottom: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border-bottom--dash4 {
        border-bottom: 1px dashed hsl(var(--black)/0.4) !important;
    }

    .border-bottom-solid5 {
        border-bottom: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border-bottom--dash5 {
        border-bottom: 1px dashed hsl(var(--black)/0.5) !important;
    }

    .border-bottom-solid--white {
        border-bottom: 1px solid hsl(var(--white)) !important;
    }

    .border-bottom-solid--black3 {
        border-bottom: 1px solid hsl(var(--black)/0.32) !important;
    }

    .border-bottom-solid--white5 {
        border-bottom: 1px solid hsl(var(--white)/0.5) !important;
    }

    .border-left--solid1 {
        border-left: 1px solid hsl(var(--black)/0.1) !important;
    }

    .border-left--dash1 {
        border-left: 1px dashed hsl(var(--black)/1) !important;
    }

    .border-left--solid2 {
        border-left: 1px solid hsl(var(--black)/0.2) !important;
    }

    .border-left--dash2 {
        border-left: 1px dashed hsl(var(--black)/2) !important;
    }

    .border-left--solid3 {
        border-left: 1px solid hsl(var(--black)/0.3) !important;
    }

    .border-left--dash3 {
        border-left: 1px dashed hsl(var(--black)/3) !important;
    }

    .border-left--solid4 {
        border-left: 1px solid hsl(var(--black)/0.4) !important;
    }

    .border-left--dash4 {
        border-left: 1px dashed hsl(var(--black)/4) !important;
    }

    .border-left-solid5 {
        border-left: 1px solid hsl(var(--black)/0.5) !important;
    }

    .border-left--dash5 {
        border-left: 1px dashed hsl(var(--black)/5) !important;
    }

    .border--none {
        border: none !important;
    }

    .bt--none {
        border-top: none !important;
    }

    .bs--none {
        border-left: none !important;
    }

    .be--none {
        border-right: none !important;
    }

    .bb--none {
        border-bottom: none !important;
    }

    .br-left--0 {
        border-top-left-radius: 0px !important;
        border-bottom-left-radius: 0px !important;
    }

    .br-btm--0 {
        border-bottom-left-radius: 0px !important;
        border-bottom-right-radius: 0px !important;
    }

    .gap--4 {
        gap: 4px !important;
    }

    .gap--8 {
        gap: 8px !important;
    }

    .gap--12 {
        gap: 12px !important;
    }

    .gap--16 {
        gap: 16px !important;
    }

    .gap--20 {
        gap: 20px !important;
    }

    .gap--24 {
        gap: 24px !important;
    }

    .gap--28 {
        gap: 28px !important;
    }

    .gap--32 {
        gap: 32px !important;
    }

    .gap--36 {
        gap: 36px !important;
    }

    .gap--40 {
        gap: 40px !important;
    }

    .gap--44 {
        gap: 44px !important;
    }

    .gap--48 {
        gap: 48px !important;
    }

    .gap--52 {
        gap: 52px !important;
    }

    .gap--56 {
        gap: 56px !important;
    }

    .gap--58 {
        gap: 58px !important;
    }

    .gap--60 {
        gap: 60px !important;
    }

    .gap--64 {
        gap: 64px !important;
    }

    .gap--68 {
        gap: 68px !important;
    }

    .gap--72 {
        gap: 72px !important;
    }

    .gap--74 {
        gap: 74px !important;
    }

    .gap--76 {
        gap: 76px !important;
    }

    .gap--78 {
        gap: 78px !important;
    }

    .gap--80 {
        gap: 80px !important;
    }

    .gap--82 {
        gap: 82px !important;
    }

    .gap--84 {
        gap: 84px !important;
    }

    .gap--86 {
        gap: 86px !important;
    }

    .gap--88 {
        gap: 88px !important;
    }

    .gap--100 {
        gap: 100px !important;
    }

    @keyframes swing {
        20% {
            transform: rotate3d(0, 0, 1, 15deg);
        }

        40% {
            transform: rotate3d(0, 0, 1, -10deg);
        }

        60% {
            transform: rotate3d(0, 0, 1, 5deg);
        }

        80% {
            transform: rotate3d(0, 0, 1, -5deg);
        }

        to {
            transform: rotate3d(0, 0, 1, 0deg);
        }
    }

    .swing {
        transform-origin: top center;
        animation-name: swing;
    }

    .tada {
        animation: tada 5s ease-in-out infinite;
    }

    @-webkit-keyframes tada {
        0% {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }

        10%, 20% {
            -webkit-transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
            transform: scale3d(0.9, 0.9, 0.9) rotate(-3deg);
        }

        30%, 50%, 70%, 90% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(3deg);
        }

        40%, 60%, 80% {
            -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
            transform: scale3d(1.1, 1.1, 1.1) rotate(-3deg);
        }

        to {
            -webkit-transform: scaleX(1);
            transform: scaleX(1);
        }
    }

    @keyframes fadeIn {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .fadeIn {
        animation-name: fadeIn;
    }

    @keyframes slide-down {
        0% {
            opacity: 0;
            transform: translateY(-150%);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .top_image_bounce {
        -webkit-animation: top-image-bounce 3s infinite ease-in-out;
        animation: top-image-bounce 3s infinite ease-in-out;
    }

    .top_image_bounce_2 {
        -webkit-animation: top-image-bounce-2 6s infinite ease-in-out;
        animation: top-image-bounce-2 6s infinite ease-in-out;
    }

    .left_image_bounce {
        -webkit-animation: left-image-bounce 3s infinite ease-in-out;
        animation: left-image-bounce 3s infinite ease-in-out;
    }

    .left_image_bounce-1 {
        -webkit-animation: left-image-bounce 6s infinite ease-in-out;
        animation: left-image-bounce 6s infinite ease-in-out;
    }

    .left_image_bounce-2 {
        -webkit-animation: left-image-bounce 3s infinite ease-in-out;
        animation: left-image-bounce 3s infinite ease-in-out;
    }

    .right_image_bounce {
        -webkit-animation: right-image-bounce 3s infinite ease-in-out;
        animation: right-image-bounce 3s infinite ease-in-out;
    }

    .spin_image {
        -webkit-animation: spin 8s infinite ease-in-out;
        animation: spin 8s infinite ease-in-out;
    }

    @keyframes top-image-bounce {
        0% {
            -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
        }

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

        100% {
            -webkit-transform: translateY(-8px);
            transform: translateY(-8px);
        }
    }

    @keyframes top-image-bounce {
        0% {
            -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
        }

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

        100% {
            -webkit-transform: translateY(-20px);
            transform: translateY(-20px);
        }
    }

    @keyframes top-image-bounce-2 {
        0% {
            -webkit-transform: translateY(-4px);
            transform: translateY(-4px);
        }

        50% {
            -webkit-transform: translateY(15px);
            transform: translateY(8px);
        }

        100% {
            -webkit-transform: translateY(-4px);
            transform: translateY(-4px);
        }
    }

    @keyframes left-image-bounce {
        0% {
            -webkit-transform: translateX(-5px);
            transform: translateX(-5px);
        }

        50% {
            -webkit-transform: translateX(10px);
            transform: translateX(10px);
        }

        100% {
            -webkit-transform: translateX(-5px);
            transform: translateX(-5px);
        }
    }

    @-webkit-keyframes spin {
        100% {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
            -webkit-transform-origin: 50%;
            transform-origin: 50%;
        }
    }

    @keyframes spin {
        100% {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
            -webkit-transform-origin: 50%;
            transform-origin: 50%;
        }
    }

    .square {
        display: inline-block;
        width: 100px;
        height: 100px;
        border-radius: 20px;
        background: whiteSmoke;
        box-shadow: 4px -40px 60px 5px rgb(26, 117, 206) inset;
    }

    .pulse {
        animation: pulse 1s infinite ease-in-out alternate;
    }

    @keyframes pulse {
        from {
            transform: scale(0.8);
        }

        to {
            transform: scale(1.2);
        }
    }

    .flash {
        animation: flash 500ms ease infinite alternate;
    }

    @keyframes flash {
        from {
            opacity: 1;
        }

        to {
            opacity: 0;
        }
    }

    .fade-in {
        animation: fade-in 3s linear infinite;
    }

    @keyframes fade-in {
        0% {
            opacity: 0;
        }

        100% {
            opacity: 1;
        }
    }

    .fade-out {
        animation: fade-out 2s linear infinite;
    }

    @keyframes fade-out {
        from {
            opacity: 1;
        }

        to {
            opacity: 0;
        }
    }

    .swing {
        transform-origin: top center;
        animation: swing 2s ease infinite;
    }

    @keyframes swing {
        20% {
            transform: rotate(15deg);
        }

        40% {
            transform: rotate(-10deg);
        }

        60% {
            transform: rotate(5deg);
        }

        80% {
            transform: rotate(-5deg);
        }

        100% {
            transform: rotate(0deg);
        }
    }

    @keyframes waves {
        0% {
            -webkit-transform: scale(0.2, 0.2);
            transform: scale(0.2, 0.2);
            opacity: 0;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        }

        50% {
            opacity: 0.9;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
        }

        100% {
            -webkit-transform: scale(0.9, 0.9);
            transform: scale(0.9, 0.9);
            opacity: 0;
            -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
        }
    }

    .fa-play:before {
        content: "\f04b";
    }

    @-webkit-keyframes circle {
        0% {
            opacity: 1;
        }

        40% {
            opacity: 1;
        }

        100% {
            width: 200%;
            height: 200%;
            opacity: 0;
        }
    }

    @keyframes circle {
        0% {
            opacity: 1;
        }

        40% {
            opacity: 1;
        }

        100% {
            width: 200%;
            height: 200%;
            opacity: 5;
        }
    }

    @keyframes fadeInOut {
        0% {
            opacity: 0;
        }

        50% {
            opacity: 1;
        }

        100% {
            opacity: 0;
        }
    }

    @keyframes move {
        0% {
            transform: scale(1) translate(0, 0) rotate(0);
            fill: hsl(var(--base)/0.7);
            filter: drop-shadow(20px 14px 10px rgba(0, 0, 0, 0.1));
        }

        25% {
            transform: scale(0.8) translate(20px, 30px) rotate(55deg);
            fill: hsl(var(--base)/0.9);
            filter: drop-shadow(14px 14px 6px rgba(0, 0, 0, 0.1));
        }

        50% {
            transform: scale(0.6) translate(40px, 45px) rotate(180deg);
            fill: hsl(var(--base-two)/0.4);
            filter: drop-shadow(-16px -16px 16px rgba(0, 0, 0, 0.1));
        }

        75% {
            transform: scale(0.8) translate(70px, 80px) rotate(55deg);
            fill: hsl(var(--base-two));
            filter: drop-shadow(14px 14px 6px rgba(0, 0, 0, 0.1));
        }

        100% {
            transform: scale(1) translate(0, 0) rotate(0);
            fill: hsl(var(--base));
            filter: drop-shadow(20px 14px 10px rgba(0, 0, 0, 0.1));
        }
    }

    @keyframes lineDownAnimate {
        0% {
            transform-origin: left;
            transform: scaleX(0);
        }

        50% {
            transform-origin: left;
            transform: scaleX(1);
        }

        51% {
            transform-origin: right;
            transform: scaleX(1);
        }

        100% {
            transform-origin: right;
            transform: scaleX(0);
        }
    }

    .zoomInOut {
        animation: zoomInOut 3s linear infinite;
    }

    @keyframes zoomInOut {
        0% {
            transform: scale(1.4);
        }

        50% {
            transform: scale(0.8);
        }

        100% {
            transform: scale(1.4);
        }
    }

    @keyframes gelatine {
        from, to {
            transform: scale(1, 1);
        }

        25% {
            transform: scale(0.9, 1.1);
        }

        50% {
            transform: scale(1.1, 0.9);
        }

        75% {
            transform: scale(0.95, 1.05);
        }
    }

    @keyframes shake1 {
        0% {
            transform: rotate(10deg);
        }

        100% {
            transform: rotate(-10deg);
        }
    }

    @keyframes animation-1xegglx {
        0% {
            transform: translateY(-50%) rotate(-46deg);
        }

        50% {
            transform: translate(-20%, -50%) rotate(0deg);
        }

        100% {
            transform: translateY(-50%) rotate(46deg);
        }
    }

    @keyframes animation-jkrku4 {
        0% {
            transform: translateY(-50%) rotate(-46deg);
        }

        50% {
            transform: translate(20%, -50%) rotate(0deg);
        }

        100% {
            transform: translateY(-50%) rotate(46deg);
        }
    }

    @keyframes animation-1ssg1zn {
        0% {
            transform: translateY(-50%) rotate(46deg);
        }

        50% {
            transform: translate(-20%, -50%) rotate(0deg);
        }

        100% {
            transform: translateY(-50%) rotate(-46deg);
        }
    }

    @keyframes animation-f7gund {
        0% {
            transform: translateY(-50%) rotate(46deg);
        }

        50% {
            transform: translate(20%, -50%) rotate(0deg);
        }

        100% {
            transform: translateY(-50%) rotate(-46deg);
        }
    }

    @keyframes rotateCircle {
        0% {
            -webkit-transform: rotate(0deg);
            transform: rotate(0deg);
        }

        100% {
            -webkit-transform: rotate(360deg);
            transform: rotate(360deg);
        }
    }

    @keyframes toRight {
        49% {
            transform: translate(100%);
        }

        50% {
            opacity: 0;
            transform: translate(-100%);
        }

        51% {
            opacity: 1;
        }
    }

    .custom--accordion .accordion-item {
        background-color: transparent !important;
        border-radius: 15px;
        border: 1px solid var(--white) !important;
    }

    .custom--accordion .accordion-item:not(:last-child) {
        margin-bottom: 20px;
    }

    .custom--accordion .accordion-body {
        padding: 0 28px 28px 28px !important;
        background-color: var(--card-bg-two);
        color: var(--black-l-800);
        border-radius: 0 0 8px 8px !important;
    }

    .custom--accordion .accordion-body .text {
        max-width: 60%;
    }

    @media screen and (max-width: 575px) {
        .custom--accordion .accordion-body .text {
            max-width: 100%;
        }
    }

    .custom--accordion:first-of-type .accordion-button.collapsed {
        border-radius: 0px;
        font-weight: 500;
    }

    .custom--accordion:last-of-type .accordion-button.collapsed {
        border-radius: 0px;
        color: hsl(var(--body-color));
    }

    .custom--accordion .accordion-button {
        background-color: var(--card-bg-two) !important;
        color: var(--black) !important;
        font-size: 20px;
        padding: 25px 30px;
        font-weight: 500;
        font-family: var(--body-font);
        border-radius: 15px !important;
        position: relative;
        z-index: auto !important;
    }

    @media screen and (max-width: 575px) {
        .custom--accordion .accordion-button {
            font-size: 18px;
            padding: 13px;
            padding-right: 30px;
        }
    }

    .custom--accordion .accordion-button::after {
        background-image: none;
    }

    .custom--accordion .accordion-button:focus {
        box-shadow: none;
        z-index: auto !important;
    }

    .custom--accordion .accordion-button:hover {
        z-index: auto !important;
    }

    .custom--accordion .accordion-button:not(.collapsed) {
        color: var(--black) !important;
        background-color: var(--card-bg-two) !important;
        box-shadow: none;
        font-weight: 500;
        border-radius: 8px 8px 0 0 !important;
    }

    .custom--accordion .accordion-button:not(.collapsed)::after {
        transform: rotate(0deg);
        background-image: none;
    }

    .custom--accordion .accordion-button[aria-expanded=true]::after, .custom--accordion .accordion-button[aria-expanded=false]::after {
        font-family: "Font Awesome 6 Free";
        font-weight: 600;
        content: "\f077";
        display: inline-flex;
        justify-content: center;
        align-items: center;
        position: relative;
        border-radius: 4px;
        margin-left: auto;
        width: 32px !important;
        height: 32px;
        right: 16px;
        color: var(--primary) !important;
        font-size: 16px;
        border: 1px solid var(--black-l-100);
    }

    @media screen and (max-width: 575px) {
        .custom--accordion .accordion-button[aria-expanded=true]::after, .custom--accordion .accordion-button[aria-expanded=false]::after {
            right: -4px;
            font-size: 14px;
        }
    }

    .custom--accordion .accordion-button[aria-expanded=false]::after {
        content: "\f078";
        color: var(--black);
    }

    .custom--accordion.one .icon--wrap {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(-50%, -50%);
    }

    .custom--accordion.one .icon--wrap img {
        transition: 0.3s linear;
    }

    .custom--accordion.one .accordion-button:not(.collapsed)::after {
        transform: rotate(0deg);
        background-image: none;
    }

    .custom--accordion.one .accordion-button:not(.collapsed) .icon--wrap img {
        rotate: 90deg;
    }

    .custom--accordion.one .accordion-button[aria-expanded=true]::after, .custom--accordion.one .accordion-button[aria-expanded=false]::after {
        content: none !important;
    }

    .custom--accordion.two .accordion-item {
        background-color: var(--white) !important;
        border: 1px solid var(--black-l-100);
    }

    .custom--accordion.two .accordion-button {
        background-color: var(--white) !important;
        padding: 30px 30px 30px 60px;
    }

    .custom--accordion.two .accordion-button .dot {
        width: 12px;
        height: 12px;
        border-radius: 2px;
        background-color: var(--primary);
        margin-right: 30px;
    }

    .custom--accordion.two .accordion-body {
        border-top: 1px dashed var(--black);
        background-color: var(--white) !important;
        margin: 0 60px 30px 60px !important;
        padding: 30px 0 0 0 !important;
    }

    .custom--accordion.three .accordion-item {
        border-bottom: 1px solid var(--black-l-100) !important;
        border-radius: 0;
        margin: 0;
    }

    .custom--accordion.three .accordion-body {
        background-color: transparent;
        color: var(--black-l-800);
        border-radius: 0 !important;
        padding-left: 0 !important;
    }

    .custom--accordion.three .accordion-button {
        background-color: transparent !important;
        position: relative;
        padding-left: 0;
        font-size: 26px;
        font-weight: 600px;
    }

    .custom--accordion.three .accordion-button .icon--wrap {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translate(-50%, -50%);
    }

    .custom--accordion.three .accordion-button .icon--wrap img {
        transition: 0.3s linear;
    }

    .custom--accordion.three .accordion-button:not(.collapsed)::after {
        transform: rotate(0deg);
        background-image: none;
    }

    .custom--accordion.three .accordion-button:not(.collapsed) .icon--wrap img {
        rotate: 90deg;
    }

    .custom--accordion.three .accordion-button[aria-expanded=true]::after, .custom--accordion.three .accordion-button[aria-expanded=false]::after {
        content: none;
    }

    button {
        border: none;
        transition: 0.5s;
    }

    button:focus {
        outline: none;
        box-shadow: none;
    }

    .btn {
        border-radius: 4px;
        line-height: 1.2;
        position: relative;
    }

    .btn.pills {
        border-radius: 50px !important;
    }

    .btn:focus {
        outline: none;
        box-shadow: none;
    }

    @media screen and (max-width: 1025px) {
        .btn {
            padding: 6px 10px;
        }
    }

    @media screen and (max-width: 575px) {
        .btn {
            padding: 6px 7px;
        }
    }

    .btn:hover, .btn:focus {
        color: hsl(var(--white));
        border-color: transparent;
    }

    .btn--sm {
        padding: 4px 12px;
        font-size: 14px;
    }

    .btn--sm:hover, .btn--sm:focus {
        background-color: hsl(var(--white));
        border: 1px solid transparent;
        color: hsl(var(--white)) !important;
    }

    @media screen and (max-width: 770px) {
        .btn--sm {
            padding: 5px 8px;
        }
    }

    .btn--md {
        padding: 13px 14px;
        font-size: 16px;
    }

    @media screen and (max-width: 770px) {
        .btn--md {
            padding: 6px 12px;
        }
    }

    .btn--lg {
        padding: 14px 26px;
        font-size: 16px !important;
    }

    @media screen and (max-width: 770px) {
        .btn--lg {
            padding: 12px 14px;
            font-size: 14px !important;
        }
    }

    .btn--base {
        background: var(--body-bg-one);
        color: var(--black);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
        border: 0px solid transparent !important;
        overflow: hidden;
        position: relative;
        z-index: 1;
    }

    .btn--base:hover, .btn--base:active, .btn--base:focus {
        background: var(--body-bg-one) !important;
        color: var(--black) !important;
        border: 1px solid transparent !important;
    }

    .btn--base:hover, .btn--base:active, .btn--base:focus {
        border: 0px !important;
    }

    .btn--primary {
        background: var(--primary);
        color: var(--white);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--primary:hover, .btn--primary:active, .btn--primary:focus {
        background: var(--secondary) !important;
        color: var(--white) !important;
        border: 1px solid transparent !important;
    }

    .btn--primary.two:hover {
        background-color: transparent !important;
        border: 1px solid var(--primary) !important;
        color: var(--primary) !important;
    }

    .btn--secondary {
        background: var(--secondary);
        color: var(--secondary);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--secondary:hover, .btn--secondary:active, .btn--secondary:focus {
        background: var(--secondary-d-100) !important;
        color: var(--secondary) !important;
        border: 1px solid transparent !important;
    }

    .btn--success {
        background: var(--success);
        color: var(--success);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--success:hover, .btn--success:active, .btn--success:focus {
        background: var(--success-d-100) !important;
        color: var(--success) !important;
        border: 1px solid transparent !important;
    }

    .btn--danger {
        background: var(--danger);
        color: var(--white);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--danger:hover, .btn--danger:active, .btn--danger:focus {
        background: var(--danger-d-100) !important;
        color: var(--white) !important;
        border: 1px solid transparent !important;
    }

    .btn--warning {
        background: var(--warning);
        color: var(--warning);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--warning:hover, .btn--warning:active, .btn--warning:focus {
        background: var(--warning-d-100) !important;
        color: var(--warning) !important;
        border: 1px solid transparent !important;
    }

    .btn--info {
        background: var(--info);
        color: var(--info);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--info:hover, .btn--info:active, .btn--info:focus {
        background: var(--info-d-100) !important;
        color: var(--info) !important;
        border: 1px solid transparent !important;
    }

    .btn--violet {
        background: var(--violet);
        color: var(--violet);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--violet:hover, .btn--violet:active, .btn--violet:focus {
        background: var(--violet-d-100) !important;
        color: var(--violet) !important;
        border: 1px solid transparent !important;
    }

    .btn--dark {
        background: var(--black);
        color: var(--white);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--dark:hover, .btn--dark:active, .btn--dark:focus {
        background: var(--dark-l-100) !important;
        color: var(--white) !important;
        border: 1px solid transparent !important;
    }

    .btn--dark::after {
        background-color: hsl(var(--white)/0.3);
    }

    .btn--dark::before {
        background-color: hsl(var(--white)/0.3);
    }

    .btn--dark.two:hover {
        background-color: transparent !important;
        border: 1px solid var(--black) !important;
        color: var(--black) !important;
    }

    .btn--dark.outline {
        background-color: transparent !important;
        border: 1px solid var(--black) !important;
        color: var(--black) !important;
    }

    .btn--dark.outline:hover {
        background-color: var(--black) !important;
        color: var(--white) !important;
    }

    .btn--light {
        background: var(--white);
        color: var(--black);
        border: 1px solid transparent;
        font-weight: 600;
        font-size: 16px;
        text-align: center;
        text-transform: capitalize;
        font-family: var(--body-font);
        transition: 0.2s linear;
    }

    .btn--light:hover, .btn--light:active, .btn--light:focus {
        background: var(--white-l-900) !important;
        color: var(--black) !important;
        border: 1px solid transparent !important;
    }

    .btn--light.two:hover {
        background-color: transparent !important;
        border: 1px solid var(--white) !important;
        color: var(--white) !important;
    }

    .btn--light::after {
        background-color: hsl(var(--white)/0.3);
    }

    .btn--light::before {
        background-color: hsl(var(--white)/0.3);
    }

    .btn-style--two .btn--text {
        padding: 14px 45px;
        font-size: 20px !important;
        border-radius: 50px;
        color: var(--black);
        text-align: center;
        transition: 0.3s linear;
        overflow: hidden;
        z-index: 1;
        position: relative;
    }

    @media screen and (max-width: 770px) {
        .btn-style--two .btn--text {
            padding: 12px 14px;
            font-size: 14px !important;
        }
    }

    .btn-style--two .btn--text:hover::before {
        transform: scaleX(1);
    }

    .btn-style--two .btn--text::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        transform: scaleX(0);
        transform-origin: 0 50%;
        width: 101%;
        height: 101%;
        border-radius: 50px;
        transition: all 0.475s;
        z-index: -1;
    }

    .btn-style--two .btn--circle {
        width: 50px;
        height: 50px;
        transition: 0.3s linear;
    }

    .btn-style--two.light .btn--text {
        background-color: var(--body-bg-one);
    }

    .btn-style--two.light .btn--text::before {
        background: var(--primary);
    }

    .btn-style--two.light .btn--circle {
        background-color: var(--body-bg-one);
    }

    .btn-style--two.light svg path {
        fill: var(--black);
    }

    .btn-style--two.dark .btn--text {
        background-color: var(--black);
        color: var(--white);
    }

    .btn-style--two.dark .btn--text::before {
        background: var(--primary);
    }

    .btn-style--two.dark .btn--circle {
        background-color: var(--black);
    }

    .btn-style--two.dark svg path {
        fill: var(--white);
    }

    .btn-style--two:hover .btn--circle {
        transform: translateX(-12px);
    }

    .btn-style--three {
        padding: 8px 8px 8px 30px;
        font-size: 18px !important;
        border-radius: 50px;
        color: var(--black);
        text-align: center;
        transition: 0.3s linear;
        overflow: hidden;
        position: relative;
        z-index: 1;
    }

    .btn-style--three::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        transform: scaleX(0);
        transform-origin: 0 50%;
        width: 101%;
        height: 101%;
        border-radius: 50px;
        transition: all 0.475s;
        z-index: -1;
    }

    @media screen and (max-width: 770px) {
        .btn-style--three {
            padding: 12px 14px;
            font-size: 14px !important;
        }
    }

    .btn-style--three .btn--circle {
        width: 44px;
        height: 44px;
        transition: 0.3s linear;
    }

    .btn-style--three.light {
        background-color: var(--secondary);
        color: var(--black);
    }

    .btn-style--three.light::before {
        background: var(--primary);
    }

    .btn-style--three.light .btn--circle {
        background-color: var(--black);
    }

    .btn-style--three.light svg {
        rotate: -45deg;
    }

    .btn-style--three.light svg path {
        fill: var(--white);
    }

    .btn-style--three.tertiary {
        background-color: var(--tertiary);
        color: var(--white);
    }

    .btn-style--three.tertiary::before {
        background: var(--secondary);
    }

    .btn-style--three.tertiary .btn--circle {
        background-color: var(--black);
    }

    .btn-style--three.tertiary .bg--white svg {
        rotate: -45deg;
    }

    .btn-style--three.tertiary .bg--white svg path {
        fill: var(--black);
    }

    .btn-style--three.tertiary svg {
        rotate: -45deg;
    }

    .btn-style--three.tertiary svg path {
        fill: var(--white);
    }

    .btn-style--three:hover::before {
        transform: scaleX(1);
    }

    .btn-style--three:hover svg {
        animation: toRight 0.3s forwards;
    }

    .btn-style--three:hover.tertiary {
        color: var(--black);
    }

    .btn-style--three:hover.light {
        color: var(--white);
    }

    .btn-style--four {
        padding: 15px 35px;
        font-size: 18px !important;
        border-radius: 50px;
        color: var(--black);
        text-align: center;
        transition: 0.3s linear;
        overflow: hidden;
        position: relative;
        z-index: 1;
    }

    .btn-style--four::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        transform: scaleX(0);
        transform-origin: 0 50%;
        width: 101%;
        height: 101%;
        border-radius: 50px;
        transition: all 0.475s;
        z-index: -1;
    }

    @media screen and (max-width: 770px) {
        .btn-style--four {
            padding: 12px 14px;
            font-size: 14px !important;
        }
    }

    .btn-style--four.light {
        background-color: #102B49;
        color: #f8f9fa;
    }

    .btn-style--four.light::before {
        background: var(--primary);
    }

    .btn-style--four.light .btn--circle {
        background-color: var(--black);
    }

    .btn-style--four.light svg {
        rotate: -45deg;
    }

    .btn-style--four.light svg path {
        fill: var(--white);
    }

    .btn-style--four.tertiary {
        background-color: var(--tertiary);
        color: var(--white);
    }

    .btn-style--four.tertiary::before {
        background: var(--secondary);
    }

    .btn-style--four.tertiary .btn--circle {
        background-color: var(--black);
    }

    .btn-style--four.tertiary svg {
        rotate: -45deg;
    }

    .btn-style--four.tertiary svg path {
        fill: var(--white);
    }

    .btn-style--four:hover::before {
        transform: scaleX(1);
    }

    .btn-style--four:hover svg {
        animation: toRight 0.3s forwards;
    }

    .btn-style--four:hover.tertiary {
        color: var(--black);
    }

    .btn-style--four:hover.light {
        color: var(--white);
    }

    .copytext {
        border-radius: 0px 6px 6px 0px !important;
    }

    @keyframes gradient {
        0% {
            background-position: 0% 50%;
        }

        50% {
            background-position: 100% 50%;
        }

        100% {
            background-position: 0% 50%;
        }
    }

    .header--cta {
        width: 45px;
        height: 45px;
        border-radius: 7px;
        background-color: var(--button-bg);
        color: var(--body-color);
        text-align: center;
    }

    /* END Button Style */
    .swiper-btn--wrap .swiper-button-next,
    .swiper-btn--wrap .swiper-button-prev {
        width: 66px;
        height: 66px;
        background-color: var(--white);
        border-radius: 50%;
        position: unset;
        transition: 0.3s linear;
        margin: 0;
        padding: 0;
    }

    .swiper-btn--wrap .swiper-button-next svg,
    .swiper-btn--wrap .swiper-button-prev svg {
        transition: 0.3s linear;
    }

    .swiper-btn--wrap .swiper-button-next svg path,
    .swiper-btn--wrap .swiper-button-prev svg path {
        stroke: var(--black);
    }

    .swiper-btn--wrap .swiper-button-next:hover,
    .swiper-btn--wrap .swiper-button-prev:hover {
        background-color: var(--primary);
    }

    .swiper-btn--wrap .swiper-button-next:hover svg path,
    .swiper-btn--wrap .swiper-button-prev:hover svg path {
        stroke: var(--white);
    }

    .swiper-btn--wrap .swiper-button-next::after,
    .swiper-btn--wrap .swiper-button-prev::after {
        content: none;
    }

    .swiper-btn--wrap .swiper-button-next svg,
    .swiper-btn--wrap .swiper-button-prev svg {
        width: unset;
        height: unset;
        object-fit: contain;
        transform-origin: center;
    }

    .swiper-btn--wrap.inblog {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        z-index: 9;
        padding: 0 16px;
    }

    .swiper-btn--wrap.inblog .swiper-button-next,
    .swiper-btn--wrap.inblog .swiper-button-prev {
        width: 46px;
        height: 46px;
        background-color: var(--white);
        border-radius: 50%;
        position: unset;
        transition: 0.3s linear;
        margin: 0;
        padding: 0;
    }

    .swiper-btn--wrap.inblog .swiper-button-next svg,
    .swiper-btn--wrap.inblog .swiper-button-prev svg {
        transition: 0.3s linear;
    }

    .swiper-btn--wrap.inblog .swiper-button-next svg path,
    .swiper-btn--wrap.inblog .swiper-button-prev svg path {
        stroke: var(--black);
    }

    .swiper-btn--wrap.inblog .swiper-button-next:hover,
    .swiper-btn--wrap.inblog .swiper-button-prev:hover {
        background-color: var(--primary);
    }

    .swiper-btn--wrap.inblog .swiper-button-next:hover svg path,
    .swiper-btn--wrap.inblog .swiper-button-prev:hover svg path {
        stroke: var(--white);
    }

    .swiper-btn--wrap.inblog .swiper-button-next::after,
    .swiper-btn--wrap.inblog .swiper-button-prev::after {
        content: none;
    }

    .swiper-btn--wrap.inblog .swiper-button-next svg,
    .swiper-btn--wrap.inblog .swiper-button-prev svg {
        width: unset;
        height: unset;
        object-fit: contain;
        transform-origin: center;
    }

    .btn--rounded {
        width: 180px;
        height: 180px;
        font-weight: 500;
        font-size: 18px;
        color: var(--black);
        border: 1px solid var(--black-l-200);
        border-radius: 50%;
        display: flex;
        justify-content: center;
        align-items: center;
        text-transform: uppercase;
        text-align: center;
        position: relative;
        overflow: hidden;
        z-index: 1;
    }

    .btn--rounded .btn-rc--dot {
        position: absolute;
        bottom: 0;
        left: 32px;
        width: 0px;
        height: 0px;
        transition: all 0.6s ease-out;
        line-height: 20px;
        border-radius: 50%;
        background-color: var(--secondary);
        transform: translate(-50%, -50%);
        border: 1px solid transparent;
        z-index: -1;
    }

    .btn--rounded:hover {
        color: var(--black);
    }

    .btn--rounded:hover .btn-rc--dot {
        width: 420px;
        height: 420px;
    }

    .pricing--cta {
        background-color: var(--primary);
        border-radius: 8px;
        padding: 12px;
        margin-bottom: 76px;
    }

    .pricing-cta--btn {
        padding: 12px 24px;
        color: var(--white);
        border: 1px solid transparent !important;
        background-color: var(--background-bg);
        border-radius: 4px;
    }

    .pricing-cta--btn:hover, .pricing-cta--btn:active, .pricing-cta--btn:focus {
        background: var(--secondary) !important;
        color: var(--black) !important;
        border: 1px solid transparent !important;
        box-shadow: 0px 7px 8px 0px var(--base);
    }

    .pricing-cta--btn.active {
        background-color: var(--secondary);
    }

    .price--btn {
        border: 1px solid var(--black);
        border-radius: 15px;
        padding: 18px;
        transition: 0.3s linear;
    }

    .price--btn:hover {
        background-color: var(--secondary);
        border-color: var(--secondary);
    }

    .price--btn.active {
        background-color: var(--secondary);
    }

    .details--btn {
        padding: 32px 54px;
        border: 1px solid var(--black-l-100);
        border-radius: 150px;
    }

    .details--btn:hover {
        scale: 0.95;
    }

    .testimonial--card.one {
        padding: 60px 45px;
        gap: 120px;
    }

    .testimonial--card.one .icon--wrap {
        width: 72px;
        height: 57px;
    }

    .testimonial--card.one .user--info .thumb--wrap {
        width: 90px;
        height: 90px;
    }

    .testimonial--card.two {
        padding: 60px 40px;
        border: 1px solid var(--black);
        width: 100%;
    }

    .testimonial--card.two .thumb--wrap {
        width: 145px;
        height: 160px;
        margin-bottom: 60px;
    }

    .testimonial--card.two .description {
        margin-bottom: 35px;
    }

    .testimonial--card.three {
        padding: 45px 35px;
        width: 100%;
        border-radius: 15px;
        height: 100%;
    }

    .testimonial--card.three .content--wrap {
        height: 100%;
    }

    .testimonial--card.three .star--thumb {
        margin-bottom: 45px;
    }

    .testimonial--card.three .star--wrap li {
        color: #FF9D00;
    }

    .testimonial--card.three .description {
        margin-bottom: 35px;
    }

    .testimonial--card.three .user--info {
        border: 1px solid var(--black-l-100);
        border-radius: 6px;
        padding: 9px;
    }

    .testimonial--card.three .thumb--wrap {
        width: 56px;
        height: 56px;
    }

    .testimonial--card.four {
        padding: 45px 35px;
        width: 100%;
        border-radius: 5px;
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
        height: 100%;
    }

    .testimonial--card.four .star--thumb {
        margin-bottom: 45px;
    }

    .testimonial--card.four .description {
        margin-bottom: 150px;
    }

    .testimonial--card.four .thumb--wrap {
        width: 56px;
        height: 56px;
    }

    .testimonial--card.five {
        padding: 45px 35px;
        width: 380px;
        background: var(--card-bg-four);
        border: 1px solid var(--white);
        box-shadow: 23px 27px 40px rgba(16, 23, 0, 0.08);
        border-radius: 25px;
    }

    .testimonial--card.five .star--thumb {
        margin-bottom: 45px;
    }

    .testimonial--card.five .description {
        margin-bottom: 76px;
    }

    .testimonial--card.five.style--one .review--wrap .review--text {
        font-size: 90px;
        margin-bottom: 25px;
    }

    .testimonial--card.five.style--one .review--wrap .star--wrap {
        margin-bottom: 10px;
        gap: 3px;
    }

    .testimonial--card.five.style--one .user--info .thumb--wrap {
        margin-left: -20px;
    }

    .portfolio--card {
        margin-bottom: 100px;
    }

    .portfolio--card .thumb--wrap.one {
        height: 620px;
    }

    .portfolio--card .thumb--wrap.two {
        height: 892px;
    }

    .portfolio--card .thumb--wrap.three {
        height: 620px;
    }

    .portfolio--card .thumb--wrap.four {
        height: 620px;
    }

    .portfolio--card .thumb--wrap.five {
        height: 620px;
    }

    .portfolio--card .thumb--wrap.six {
        height: 892px;
    }

    .portfolio--card .thumb--wrap.seven {
        height: 620px;
    }

    .portfolio--card .thumb--wrap:hover {
        cursor: none;
    }

    .portfolio--card .thumb--cover {
        display: flex;
        flex-direction: row;
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
    }

    .portfolio--card .blocks-wrapper {
        position: absolute;
        top: 0;
        left: 0;
        height: 100%;
        width: 100%;
        z-index: 2;
        display: flex;
        flex-wrap: wrap;
    }

    .portfolio--card .blocks {
        overflow: hidden;
        background-color: #000;
        box-sizing: border-box;
    }

    .portfolio--card .view--btn {
        width: 106px;
        height: 106px;
        background-color: var(--white);
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        cursor: pointer;
        transition: transform 0.15s linear;
        opacity: 0;
        visibility: hidden;
        z-index: 9;
    }

    .portfolio--card .date--wrap {
        top: 30px;
        left: 30px;
        background-color: var(--white);
        border-radius: 4px;
        padding: 4px 16px;
        opacity: 0;
        transition: 0.3s linear;
        z-index: 9;
    }

    .portfolio--card .date--wrap .dot {
        width: 10px;
        height: 10px;
    }

    .portfolio--card:hover .view--btn {
        opacity: 1;
        visibility: visible;
    }

    .portfolio--card:hover .date--wrap {
        opacity: 1;
    }

    .partner--card.one .thumb--wrap {
        width: 100%;
        height: 256px;
        border-radius: 10px;
    }

    .partner--card.two .thumb--wrap {
        width: 282px;
        height: 190px;
        border-radius: 10px;
    }

    .partner--card.three {
        width: 278px;
        height: 248px;
        border-radius: 4px;
        flex-shrink: 0;
    }

    .partner--card.three .line.one {
        border-top: 1px solid var(--black-l-100);
        top: 15px;
        left: 0;
        width: 100%;
    }

    .partner--card.three .line.two {
        border-bottom: 1px solid var(--black-l-100);
        bottom: 15px;
        left: 0;
        width: 100%;
    }

    .partner--card.three .line.three {
        border-left: 1px solid var(--black-l-100);
        top: 0px;
        left: 15px;
        height: 100%;
    }

    .partner--card.three .line.four {
        border-left: 1px solid var(--black-l-100);
        top: 0px;
        right: 15px;
        height: 100%;
    }

    .featured--card .thumb--wrap {
        width: 100%;
        border-radius: 10px;
        overflow: hidden;
    }

    .featured--card .thumb--wrap img {
        transition: 0.2s linear;
    }

    .featured--card .tags--wrap {
        gap: 10px;
    }

    .featured--card .tags--wrap .tags {
        border: 1px solid var(--black-l-100);
        border-radius: 4px;
        padding: 4px 15px;
    }

    .featured--card .tags--wrap .tags .dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .featured--card .view--btn {
        width: 106px;
        height: 106px;
        background-color: var(--white);
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        cursor: pointer;
        transition: transform 0.15s linear;
        opacity: 0;
        visibility: hidden;
    }

    .featured--card .date--wrap {
        top: 30px;
        left: 30px;
        background-color: var(--white);
        border-radius: 4px;
        padding: 4px 16px;
        opacity: 0;
        transition: 0.3s linear;
    }

    .featured--card .date--wrap .dot {
        width: 10px;
        height: 10px;
    }

    .featured--card:hover .view--btn {
        opacity: 1;
        visibility: visible;
    }

    .featured--card:hover .date--wrap {
        opacity: 1;
    }

    .featured--card:hover .thumb--wrap img {
        scale: 1.2;
    }

    .service--card.two {
        border-bottom: 1px dashed var(--black-l-200);
        padding: 26px 0;
        margin-bottom: 60px;
    }

    .service--card.two .content--wrap .number {
        font-size: 100px;
        font-weight: 400;
    }

    .service--card.two .content--wrap .title {
        font-size: 25px;
        font-weight: 400;
        margin-bottom: 20px;
    }

    .service--card.two .thumb--wrap {
        width: 100%;
        height: 318px;
        border-radius: 10px;
    }

    .service--card.two .thumb--wrap img {
        transition: 0.3s linear;
    }

    .service--card.two .thumb--wrap:hover img {
        scale: 1.1;
    }

    .service--card.two .service-list--wrap .service--list {
        padding: 26px 0;
        border-top: 1px dashed var(--black-l-200);
    }

    .service--card.two .service-list--wrap .service--list:last-child {
        padding-bottom: 0;
    }

    .service--card.three {
        border-bottom: 1px solid var(--black-l-200);
        padding: 45px 0;
    }

    .service--card.three .content--wrap .number {
        font-size: 100px;
        font-weight: 400;
    }

    .service--card.three .content--wrap .title {
        font-size: 100px;
        font-weight: 400;
        margin-bottom: 50px;
    }

    .service--card.three .thumb--wrap {
        width: 100%;
        height: 318px;
        border-radius: 10px;
    }

    .service--card.three .service-list--wrap {
        margin-bottom: 35px;
    }

    .service--card.three .service-list--wrap .service--list {
        padding: 10px 0;
    }

    .service--card.four {
        border-bottom: 1px solid var(--black-l-200);
        padding: 60px 70px 70px 70px;
        border-radius: 25px;
        background-color: #531dff;
        width: 100%;
        -webkit-mask-image: url("../images/common/mask4.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: url("../images/common/mask4.png");
        mask-repeat: no-repeat;
        mask-size: cover;
        mask-position: center;
    }

    .service--card.four .content--wrap .title--wrap {
        margin-bottom: 35px;
    }

    .service--card.four .content--wrap .title {
        font-size: 60px;
        font-weight: 600;
        margin-bottom: 25px;
    }

    .service--card.four .thumb--wrap {
        width: 716px;
        height: 575px;
        top: 0;
        right: 0;
    }

    .service--card.four .service-list--wrap {
        margin-bottom: 35px;
        gap: 12px;
        display: flex;
        flex-direction: column;
    }

    .service--card.four .service-list--wrap .service--list {
        padding: 10px 0;
    }

    .counter--card.one {
        min-height: 342px;
        padding-left: 18px;
        border-bottom: 1px dashed var(--black);
    }

    .counter--card.one::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: 6px;
        border-bottom: 1px dashed var(--black);
        width: 100%;
    }

    .counter--card.one .title {
        font-size: 172px;
        font-weight: 400;
        line-height: 112px;
        margin-bottom: 50px;
    }

    .counter--card.four .number {
        font-size: 100px;
        margin-bottom: 15px;
    }

    .counter--card.four .title {
        margin-bottom: 15px;
    }

    .counter--card.five {
        background-color: var(--card-bg-two);
        padding: 32px 58px 45px 58px;
        border-radius: 10px;
        border: 2px solid var(--white);
    }

    .counter--card.five .number {
        font-size: 90px;
    }

    .counter--card.five .title {
        margin-bottom: 25px;
    }

    .counter--card.five .description {
        line-height: 1.5;
    }

    .blog--card.one .thumb--wrap {
        width: 344px;
        height: 630px;
    }

    .blog--card.one .content--wrap {
        right: 0;
        bottom: 0;
        padding: 45px;
        padding-right: 0;
        width: 428px;
    }

    .blog--card.one .tags--wrap {
        gap: 10px;
    }

    .blog--card.one .tags--wrap .tags {
        border: 1px solid var(--black-l-100);
        border-radius: 4px;
        padding: 4px 20px;
    }

    .blog--card.one .tags--wrap .tags:hover {
        background-color: var(--black);
        color: var(--white);
    }

    .blog--card.one .tags--wrap .tags:hover .dot {
        background-color: var(--white);
    }

    .blog--card.one .tags--wrap .tags:hover p {
        color: var(--white);
    }

    .blog--card.one .tags--wrap .dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .blog--card.one .blog--btn svg {
        transition: 0.3s linear;
        margin-left: 4px;
    }

    .blog--card.one .blog--btn:hover svg {
        rotate: 45deg;
    }

    .blog--card.two .content--wrap {
        padding: 25px 0;
    }

    .blog--card.two .blog--btn svg {
        transition: 0.3s linear;
    }

    .blog--card.two .blog--btn:hover svg path {
        stroke: var(--primary);
    }

    .blog--card.two .thumb--wrap {
        width: 100%;
        height: 375px;
        border-radius: 10px;
    }

    .blog--card.two .thumb--wrap .thumb {
        position: relative;
        overflow: hidden;
    }

    .blog--card.two .thumb--wrap .thumb img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -webkit-transition: 0.6s;
        transition: 0.6s;
    }

    .blog--card.two .thumb--wrap .thumb img:nth-child(1) {
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1;
        -webkit-transition: 0.6s;
        transition: 0.6s;
        -webkit-transform: translateY(50%) scaleY(2);
        transform: translateY(50%) scaleY(2);
        opacity: 0;
        -webkit-filter: blur(10px);
        filter: blur(10px);
    }

    .blog--card.two .thumb--wrap .user--thumb {
        bottom: 10px;
        right: 0;
    }

    .blog--card.two .tags--wrap {
        gap: 10px;
    }

    .blog--card.two .tags--wrap .tags {
        border: 1px solid var(--black-l-100);
        border-radius: 8px;
        padding: 4px 20px;
    }

    .blog--card.two .tags--wrap .dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .blog--card.two:hover .thumb img:nth-child(1) {
        -webkit-transform: translateY(0%) scaleY(1);
        transform: translateY(0%) scaleY(1);
        opacity: 1;
        -webkit-filter: blur(0);
        filter: blur(0);
    }

    .blog--card.two:hover .thumb img:nth-child(2) {
        -webkit-transform: translateY(-50%) scaleY(2);
        transform: translateY(-50%) scaleY(2);
        opacity: 0;
        -webkit-filter: blur(10px);
        filter: blur(10px);
    }

    .blog--card.four {
        padding: 30px;
        border-radius: 5px;
    }

    .blog--card.four .thumb--wrap {
        width: 100%;
        height: 280px;
    }

    .blog--card.four .blog--btn {
        padding: 12px 30px;
        padding-right: 82px;
        border: 1px solid var(--black);
        border-radius: 90px;
        transition: transform 0.3s linear;
    }

    .blog--card.four .blog--btn .text {
        transition: transform 0.3s linear;
    }

    .blog--card.four .blog--btn .icon--wrap {
        width: 52px;
        height: 52px;
        border: 1px solid var(--black);
        top: 0;
        right: 0;
        transition: transform 0.3s linear;
    }

    .blog--card.four .blog--btn .icon--wrap i {
        font-size: 12px;
    }

    .blog--card.four .blog--btn .icon--wrap_two {
        width: 52px;
        height: 52px;
        border: 1px solid var(--black);
        top: 0;
        left: 0;
        transform: translateX(100%);
        opacity: 0;
        transition: transform 0.3s linear;
    }

    .blog--card.four .blog--btn .icon--wrap_two i {
        font-size: 12px;
    }

    .blog--card.four .blog--btn:hover {
        padding-right: 30px;
        padding-left: 82px;
    }

    .blog--card.four .blog--btn:hover .icon--wrap {
        transform: translateX(-100%);
        opacity: 0;
    }

    .blog--card.four .blog--btn:hover .icon--wrap_two {
        transform: translateX(0);
        opacity: 1;
    }

    .blog--card.five {
        padding: 20px;
        border-radius: 10px;
    }

    .blog--card.five .video--btn {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 109px;
        height: 109px;
        background-color: var(--white-l-700);
        backdrop-filter: blur(6px);
        animation: animate-pulse 3s linear infinite;
    }

    .blog--card.five .video--btn i {
        font-size: 30px;
        color: var(--black);
    }

    .blog--card.five .video--wrap {
        width: 100%;
        height: 398px;
        border-radius: 10px;
        margin-bottom: 20px;
    }

    .blog--card.five .content--wrap {
        padding: 25px;
    }

    .blog--card.five .thumb--wrap {
        width: 260px;
        height: 348px;
        border-radius: 10px;
    }

    .blog--card.five .thumb--wrap.xxl {
        width: 100% !important;
        height: 398px;
        border-radius: 10px;
        margin-bottom: 20px;
    }

    .blog--card.five .thumb--wrap.xxl img {
        transition: 0.3s linear;
    }

    .blog--card.five .thumb--wrap.xxl:hover img {
        scale: 1.05;
    }

    .blog--card.five .blog--btn {
        transition: 0.3s linear;
    }

    .blog--card.five .blog--btn i {
        font-size: 8px;
        color: var(--black);
    }

    .blog--card.five .blog--btn .text {
        color: var(--black);
    }

    .blog--card.five .blog--btn:hover i {
        color: var(--tertiary) !important;
    }

    .blog--card.five .blog--btn:hover .text {
        text-decoration: underline;
        color: var(--tertiary) !important;
    }

    .blog--card.five .tag--wrap {
        gap: 10px;
        margin-bottom: 25px;
    }

    .blog--card.five .tag--wrap .tag {
        padding: 4px 20px;
        border-radius: 90px;
        border: 1px solid var(--black-l-200);
    }

    .blog--card.five .tag--wrap .tag:hover {
        background-color: var(--black);
        color: var(--white) !important;
    }

    .blog--card.six a {
        padding: 12px;
        border-radius: 10px;
        background-color: rgba(112, 112, 112, 0.0588235294);
        backdrop-filter: blur(6px);
        border: 1px solid rgba(70, 10, 245, 0.3490196078);
    }

    .blog--card.six .thumb--wrap {
        width: 100%;
        height: 180px;
        margin-bottom: 20px;
        border-radius: 8px;
        overflow: hidden;
    }

    .blog--card.six .btn-style--three {
        padding: 5px 5px 5px 30px;
        font-size: 16px !important;
    }

    .blog--card.six .btn-style--three .btn--circle {
        width: 34px;
        height: 34px;
    }

    .blog--card.masonry .blog--thumb {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 12px;
        overflow: hidden;
    }

    .blog--card.masonry .blog-items__card-ribbon {
        width: 100%;
        display: inline-flex;
        gap: 8px;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        position: absolute;
        top: 0;
        padding: 20px;
        z-index: 1;
    }

    .blog--card.masonry .blog-items__content {
        position: absolute;
        bottom: 0;
        padding: 20px;
        width: 100%;
        background: linear-gradient(0deg, rgb(19, 15, 17) 0%, rgba(32, 32, 40, 0) 100%);
        overflow: hidden;
        border-radius: 12px;
    }

    .blog--card.masonry .blog-items__date {
        font-size: 14px;
        font-weight: 500;
        font-family: var(--body-font);
        color: var(--white-l-900);
        text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.6);
    }

    .blog--card.masonry .blog-items__title {
        font-size: 24px;
        font-weight: 600;
        color: var(--white);
        margin-bottom: 34px;
        width: 100%;
        text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
    }

    .blog--card.masonry .blog-items__info {
        display: flex;
        gap: 12px;
        align-items: center;
        margin-top: 14px;
        text-shadow: 2px 2px 4px var(--black);
    }

    .blog--card.masonry .blog-items__info-image {
        border-radius: 50%;
        height: 40px;
        width: 40px;
        object-fit: cover;
    }

    .blog--card.masonry .blog-items__info-title {
        color: var(--white);
        font-size: 16px;
        font-weight: 600;
        margin-bottom: 4px;
    }

    .blog--card.masonry .blog-items__info-desc {
        color: var(--white);
        font-size: 14px;
        font-style: italic;
    }

    .contact--card.two {
        padding: 60px 45px;
        border-radius: 10px;
    }

    .contact--card.two input {
        background-color: #F1F1F1;
    }

    .contact--card.two textarea {
        background-color: #F1F1F1;
    }

    .contact--card.four {
        padding: 60px;
        border-radius: 10px;
    }

    .contact--card.four .btn--wrap .btn {
        font-size: 26px;
        padding: 27px;
    }

    .work--card.one .thumb--wrap {
        width: 100%;
        height: 600px;
        overflow: hidden;
    }

    .work--card.one .thumb--wrap img {
        transition: 0.3s linear;
    }

    .work--card.one .content--wrap {
        top: 50%;
        left: 50%;
        transform: translate(-50%, 50%);
        padding: 35px 35px 35px 35px;
        border-radius: 10px;
        width: 513px;
        opacity: 0;
        visibility: hidden;
        transition: 0.3s linear;
        z-index: 9;
    }

    .work--card.one .content--wrap .work--btn {
        width: 46px;
        height: 46px;
    }

    .work--card.one:hover .content--wrap {
        opacity: 1;
        visibility: visible;
        transform: translate(-50%, 25%);
    }

    .work--card.four {
        transition: 0.3s linear;
    }

    .work--card.four .thumb--wrap {
        width: 100%;
        margin-bottom: 6px;
        border-radius: 5px;
        background-size: cover;
        background-repeat: no-repeat;
    }

    .solution--card {
        border-radius: 25px;
        padding: 35px;
        height: 100%;
    }

    .solution--card .number--wrap {
        margin-bottom: 76px;
    }

    .solution--card .logo--wrap {
        margin-bottom: 70px;
    }

    .solution--card .logo--wrap .logo {
        width: 70px;
        height: 70px;
    }

    .solution--card .description {
        line-height: 1.5;
    }

    .solution--card.one {
        background-color: #E4DAF5;
    }

    .solution--card.two {
        background-color: #CFFFB3;
    }

    .solution--card.three {
        background-color: #FFC9C9;
    }

    .solution--card.four {
        background-color: #FDDCA6;
    }

    .step--card {
        background-color: var(--card-bg-three);
        border-radius: 25px;
        border: 1px solid var(--card-bg-three);
        box-shadow: inset 3px 3px 30px rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(15px);
        padding: 35px;
    }

    .step--card .content--wrap {
        margin-bottom: 25px;
    }

    .step--card .content--wrap .number {
        width: 52px;
        height: 52px;
    }

    .step--card .content--wrap .description {
        color: var(--white-l-600);
    }

    .price--card {
        border-radius: 25px;
    }

    .price--card .thumb--wrap {
        width: 100%;
        height: 775px;
    }

    .price--card .tag {
        padding: 4px 20px;
        border-radius: 90px;
        margin-bottom: 15px;
    }

    .price--card .name {
        font-size: 40px;
    }

    .price--card .price {
        font-size: 90px;
    }

    .price--card .content--wrap {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--tertiary);
        padding: 195px 70px;
        z-index: 1;
        opacity: 0;
        visibility: hidden;
        transition: 0.2s linear;
    }

    .price--card .content--wrap .description {
        line-height: 1.5;
    }

    .price--card .content--wrap .bg--thumb {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        opacity: 0.3;
    }

    .price--card.active .content--wrap {
        opacity: 1;
        visibility: visible;
    }

    .footer--card {
        padding: 35px;
        border-right: 1px dashed var(--white-l-100);
        height: 100%;
        position: relative;
    }

    .footer--card::after {
        content: "";
        position: absolute;
        top: 0;
        right: 4px;
        height: 100%;
        border-right: 1px dashed var(--white-l-100);
    }

    .plan--card {
        padding: 36px 24px 24px 24px;
        border: 1px solid var(--black-l-100);
        height: 100%;
    }

    .plan--card h6 {
        color: var(--black);
    }

    .plan--card p {
        color: var(--black);
    }

    .plan--card i {
        color: var(--black);
    }

    .plan--card .t-badge--wrap {
        margin-bottom: 20px;
    }

    .plan--card .save--badge {
        padding: 8px 16px;
        border-radius: 30px;
        background-color: var(--background-bg);
    }

    .plan--card .text--badge {
        background-color: var(--base);
        padding: 2px 8px;
        border-radius: 4px;
    }

    .plan--card .btn--wrap {
        margin-bottom: 24px;
    }

    .plan--card .heading {
        margin-bottom: 24px;
    }

    .plan--card .title--wrap {
        margin-bottom: 32px;
    }

    .plan--card .description {
        margin-bottom: 36px;
    }

    .plan--card .feature-item--wrap {
        padding: 32px 0px;
    }

    .plan--card .feature-item--wrap .include--text {
        line-height: 1.5;
        margin-bottom: 28px !important;
    }

    .plan--card .icon--wrap {
        width: 38px;
        height: 28px;
        border-radius: 60px;
        background-color: var(--black);
    }

    .plan--card .icon--wrap i {
        color: var(--white);
    }

    .plan--card.bg--black .icon--wrap {
        background-color: var(--white);
    }

    .plan--card.bg--black .icon--wrap i {
        color: var(--black);
    }

    .plan--card .tags--wrap {
        top: -20px;
        left: 50%;
        transform: translateX(-50%);
        border: 1px solid hsl(var(--base-two)/0.3);
        padding: 10px 20px;
        border-radius: 30px;
        background-color: hsl(var(--background-bg));
    }

    .plan--card .price-m {
        opacity: 0;
        transform: translateY(100%);
    }

    .plan--card .price-y {
        opacity: 1;
        transition: all 0.5s cubic-bezier(0.25, 1.2, 0.5, 1);
    }

    .plan--card.monthly-active .price-m {
        opacity: 1;
        transition: all 0.5s cubic-bezier(0.25, 1.2, 0.5, 1);
        transform: translateY(0%);
    }

    .plan--card.monthly-active .price-y {
        opacity: 0;
        transform: translateY(-100%);
    }

    .plan--card .save--badge {
        opacity: 1;
        transform: translateY(0%);
        transition: all 0.5s cubic-bezier(0.25, 1.2, 0.5, 1);
    }

    .plan--card.monthly-active .save--badge {
        opacity: 0;
        transform: translateY(-100%);
        transition: all 0.5s cubic-bezier(0.25, 1.2, 0.5, 1);
    }

    .plan--card .t-badge--wrap .title {
        top: 0;
        left: 0;
    }

    .plan--card .t-badge--wrap .save--badge {
        top: 0;
        right: 0;
    }

    .t-badge--wrap {
        height: 38px;
    }

    .team--card .thumb--wrap {
        width: 100%;
        height: 610px;
        border-radius: 10px;
        margin-bottom: 20px;
    }

    .team--card .thumb--wrap img {
        width: 100%;
        height: 100%;
        -o-object-fit: cover;
        object-fit: cover;
        -webkit-transition: 0.6s;
        transition: 0.6s;
    }

    .team--card .thumb--wrap img:nth-child(1) {
        position: absolute;
        left: 0;
        top: 0;
        z-index: 1;
        -webkit-transition: 0.6s;
        transition: 0.6s;
        -webkit-transform: translateY(50%) scaleY(2);
        transform: translateY(50%) scaleY(2);
        opacity: 0;
        -webkit-filter: blur(10px);
        filter: blur(10px);
    }

    .team--card .thumb--wrap:hover img:nth-child(1) {
        -webkit-transform: translateY(0%) scaleY(1);
        transform: translateY(0%) scaleY(1);
        opacity: 1;
        -webkit-filter: blur(0);
        filter: blur(0);
    }

    .team--card .thumb--wrap:hover img:nth-child(2) {
        -webkit-transform: translateY(-50%) scaleY(2);
        transform: translateY(-50%) scaleY(2);
        opacity: 0;
        -webkit-filter: blur(10px);
        filter: blur(10px);
    }

    .team--card .content--wrap {
        border-radius: 10px;
    }

    .team--card.two {
        position: relative;
    }

    .team--card.two .content--wrap {
        position: absolute;
        left: 50%;
        bottom: 16px;
        width: 94%;
        z-index: 9;
        transform: translate(-50%, 0%);
        backdrop-filter: blur(16px);
        background-color: var(--white-l-200);
        border: 1px solid var(--white-l-100);
    }

    .team--card.two .social--info a {
        border: 1px solid var(--white-l-100);
        color: var(--white);
    }

    .team--card.two .social--info a:hover {
        color: var(--primary);
        border: 1px solid var(--primary);
    }

    .team--card .social--info a {
        padding: 4px 20px;
        border-radius: 90px;
        border: 1px solid var(--black-l-100);
        font-size: 15px;
    }

    .faq--card {
        padding: 45px;
        border: 1px solid var(--black-l-100);
        border-radius: 10px;
    }

    .faq--card .thumb--wrap {
        width: 160px;
        height: 160px;
        border-radius: 10px;
        margin-bottom: 35px;
    }

    .faq--card .content--wrap {
        margin-bottom: 155px;
    }

    .faq--card .content--wrap h6 {
        margin-bottom: 25px;
    }

    .faq--card .content--wrap p {
        line-height: 28px;
    }

    .chart--card {
        height: 240px;
        padding: 24px;
        border-radius: 10px;
    }

    .chart--card.one {
        bottom: 45px;
        left: 45px;
    }

    .chart--card.one h6 {
        font-size: 12px;
    }

    .chart--card.one .bar span {
        width: 20px;
        height: 0px;
        border-radius: 3px;
    }

    .chart--card.one .bar p {
        font-size: 10px;
    }

    .chart--card.two {
        top: 45px;
        left: 45px;
    }

    .chart--card.two .bar--wrap {
        height: 151px;
    }

    .chart--card.two .dash--wrap {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
    }

    .chart--card.two .dash--wrap .dash {
        border-bottom: 1px dashed var(--black-l-100);
    }

    .chart--card.two h6 {
        font-size: 12px;
    }

    .chart--card.two .tag {
        font-size: 12px;
    }

    .chart--card.two .tag::after {
        content: "";
        position: absolute;
        top: 50%;
        left: -6px;
        transform: translate(-50%, -50%);
        width: 8px;
        height: 6px;
    }

    .chart--card.two .tag.one::after {
        background-color: var(--tertiary);
    }

    .chart--card.two .tag.two::after {
        background-color: var(--secondary);
    }

    .chart--card.two .bar--two span {
        width: 16px;
        height: 0px;
        border-radius: 3px;
    }

    .chart--card.two .bar--two p {
        font-size: 10px;
    }

    .progress--card {
        width: 255px;
        height: 140px;
        padding: 24px;
        border-radius: 10px;
    }

    .progress--card .content--wrap p {
        font-size: 12px;
        margin-bottom: 12px;
    }

    .progress--card .circle {
        width: 36px !important;
        height: 36px !important;
    }

    .progress--card .progress-bar--wrap p {
        font-size: 12px;
    }

    .progress--card .progress--bar {
        background-color: #E5E7E6;
        width: 100%;
        height: 8px;
        border-radius: 60px;
    }

    .progress--card .progress--bar .bar {
        width: 0;
        height: 8px;
        border-radius: 60px;
    }

    .progress--card.one {
        bottom: 70px;
        right: 70px;
    }

    .work-card--wrap {
        transform: perspective(700px);
        transform-style: preserve-3d;
        width: 100%;
        height: 377px;
    }

    .contact-card--two {
        background: var(--white);
        border: 1px solid rgba(0, 0, 0, 0.1);
        box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
        border-radius: 10px;
        padding: 35px;
    }

    .contact-card--two .social--list a {
        width: 46px;
        height: 46px;
        border-radius: 50%;
        border: 1px solid var(--black);
    }

    .contact-card--two .social--list a:hover {
        background: var(--primary);
        border: 1px solid var(--primary);
    }

    .contact-card--two .social--list a:hover i {
        color: var(--white);
    }

    .contact-card--two p {
        line-height: 28px;
    }

    .contact-card--two h6 {
        margin-bottom: 20px;
    }

    .comment--box {
        padding: 60px;
        border: 1px solid var(--black-l-100);
    }

    .comment--box input {
        background: #F8F7F3;
        border-radius: 10px;
    }

    .comment--box input:focus {
        background: #F8F7F3;
    }

    .comment--box textarea {
        background: #F8F7F3;
        border-radius: 10px;
    }

    .comment--box textarea:focus {
        background: #F8F7F3;
    }

    .comment--box .single-comment {
        padding: 27px 0px 0px 16px;
    }

    .comment--box .single-comment.nested {
        padding-left: 30px;
        margin-left: 50px;
        border-left: 1px dashed var(--black-l-300);
    }

    .comment--box .single-comment.nested.two {
        padding-left: 30px;
        margin-left: 100px;
        border-left: 1px dashed var(--black-l-300);
    }

    .comment--box .single-comment .auth-info {
        display: inline-flex;
        align-items: center;
        gap: 7px;
        margin-bottom: 20px;
        flex-wrap: wrap;
    }

    .comment--box .single-comment .auth-info .user-thumb--wrap {
        display: inline-flex;
        align-items: center;
        gap: 12px;
    }

    .comment--box .single-comment .auth-info .user-thumb--wrap .user-thumb {
        width: 70px;
        height: 70px;
        border-radius: 50%;
        overflow: hidden;
    }

    .comment--box .single-comment .auth-info i {
        font-size: 6px;
    }

    .comment--box .single-comment .auth-info .time-status {
        color: var(--black-l-700);
        font-weight: 500;
    }

    .comment--box .single-comment .comment-text {
        margin-left: 32px;
        position: relative;
    }

    .base--card {
        padding: 20px;
        border-radius: 10px;
    }

    .card--holder.card--one {
        height: 300px;
    }

    .card--holder.card--two {
        height: 450px;
    }

    .card--holder.card--three {
        height: 550px;
    }

    .form--label {
        color: var(--black);
        font-size: 14px;
        font-weight: 500;
        margin-bottom: 16px;
    }

    label.req {
        position: relative;
    }

    label.req::after {
        content: "*";
        position: absolute;
        top: 3px;
        right: -10px;
        color: var(--danger);
    }

    .form--control {
        font-weight: 500;
        outline: none;
        width: 100%;
        padding: 10px 16px;
        border-radius: 4px;
        background-color: transparent;
        color: var(--black);
        line-height: 26px;
        border: 1px solid var(--black);
    }

    .form--control::placeholder {
        color: var(--black-l-500) !important;
        font-size: 16px;
    }

    .form--control:focus {
        color: var(--black);
        box-shadow: none;
        border: 1px solid var(--black);
        border-radius: 4px;
        background-color: transparent;
    }

    .form--control:disabled, .form--control[readonly] {
        background-color: var(--black-l-500);
        opacity: 1;
        border: 0;
    }

    .form--control[type=password] {
        color: var(--black-l-800);
    }

    .form--control[type=password]:focus {
        color: var(--black-l-800);
    }

    .form--control[type=file] {
        line-height: 45px;
        padding: 0;
        position: relative;
    }

    .form--control[type=file]::file-selector-button {
        border: 1px solid var(--black-l-800);
        padding: 2px 6px;
        border-radius: 0.2em;
        background-color: var(--base-l-500);
        transition: 0.2s linear;
        line-height: 25px;
        position: relative;
        margin-left: 15px;
        color: var(--black-l-800);
        cursor: pointer;
    }

    .form--control[type=file]::file-selector-button:hover {
        background-color: var(--primary-d-100);
        border: 1px solid var(--primary);
        color: var(--white);
    }

    .form--control.pills {
        border-radius: 50px !important;
    }

    .form--control:focus ~ .form--label,
    .form--control:not(:placeholder-shown).form--control:not(:focus) ~ .form--label {
        top: -14px;
        left: 8px;
        font-size: 14px;
        background: var(--black);
        z-index: 9;
    }

    textarea.form--control {
        height: 220px;
        padding: 15px;
    }

    input:-webkit-autofill,
    input:-webkit-autofill:hover,
    input:-webkit-autofill:focus,
    input:-webkit-autofill:active {
        -webkit-transition: background-color 5000s ease-in-out 0s;
        transition: background-color 5000s ease-in-out 0s;
    }

    input:-webkit-autofill,
    textarea:-webkit-autofill,
    select:-webkit-autofill {
        -webkit-box-shadow: 0 0 0px 1000px transparent inset;
        -webkit-text-fill-color: hsl(var(--black)) !important;
    }

    .footer-subscribe-box .footer-input:-webkit-autofill {
        -webkit-text-fill-color: hsl(var(--black)) !important;
    }

    .search--input .search-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        font-size: 18px;
        color: var(--primary);
    }

    .search--input input {
        padding-right: 40px;
    }

    .input--icon {
        position: absolute;
        left: 0;
        top: 50%;
        transform: translateY(-50%);
        color: var(--primary);
    }

    .password-show-hide {
        position: absolute;
        right: 20px;
        z-index: 3;
        cursor: pointer;
        top: 50%;
        transform: translateY(-50%);
        color: var(--black-l-500);
    }

    #send-amount input[type=file] {
        color: var(--primary);
        cursor: pointer;
    }

    input #send-amount::file-selector-button {
        display: none;
    }

    input::-webkit-outer-spin-button,
    input::-webkit-inner-spin-button {
        -webkit-appearance: none;
    }

    input[type=number] {
        -moz-appearance: textfield;
    }

    /*====== Country code ======*/
    .input-group.country-code {
        position: relative;
        display: flex;
        flex-wrap: nowrap;
    }

    .input-group.country-code .input-group-text {
        background-color: var(--primary-l-500);
        border: 1px solid var(--primary-l-700);
    }

    .form--select option {
        background-color: var(--body-color);
        color: var(--black);
    }

    /* Custom Checkbox Design */
    .form--check {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
    }

    .form--check a {
        display: inline;
    }

    .form--check .form-check-input {
        box-shadow: none;
        background-color: transparent;
        box-shadow: none !important;
        border: 0;
        position: relative;
        border-radius: 2px;
        width: 16px;
        height: 16px;
        border: 1px solid var(--black-l-700);
        margin-top: 0px;
    }

    .form--check .form-check-input:checked {
        background-color: var(--primary) !important;
        border-color: var(--primary) !important;
        box-shadow: none;
    }

    .form--check .form-check-input:checked[type=checkbox] {
        background-image: none;
    }

    .form--check .form-check-input:checked::before {
        position: absolute;
        content: "\f00c";
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        color: var(--black);
        font-size: 12px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .form--check .form-check-label {
        width: calc(100% - 16px);
        padding-left: 12px;
        color: var(--black-l-700);
        font-size: 16px;
        font-weight: 400;
        line-height: 29px;
        font-family: var(--body-font);
    }

    .form--check label {
        color: var(--black);
    }

    @media screen and (max-width: 424px) {
        .form--check label {
            font-size: 15px;
        }
    }

    @media screen and (max-width: 424px) {
        .form--check a {
            font-size: 15px;
        }
    }

    /*  Custom Radio Design */
    .form--radio {
        display: flex;
        align-items: center;
        gap: 6px;
    }

    .form--radio .form-radio-input {
        box-shadow: none;
        border: 2px solid var(--primary);
        position: relative;
        margin: 0px;
        height: 20px;
        width: 20px;
    }

    .form--radio .form-radio-input:active {
        filter: brightness(100%);
    }

    .form--radio .form-radio-input:checked {
        background-color: transparent;
        border-color: var(--primary);
    }

    .form--radio .form-radio-input:checked[type=radio] {
        background-image: none;
    }

    .form--radio .form-radio-input:checked::before {
        position: absolute;
        content: "";
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        width: 9px;
        height: 9px;
        background-color: var(--primary);
        border-radius: 50%;
        z-index: 999;
    }

    .form--radio .form-radio-label {
        width: calc(100% - 16px);
        color: var(--black-l-700);
        font-size: 16px;
        font-weight: 400;
        line-height: 29px;
        font-family: var(--body-font);
    }

    /*  Custom Switch Design */
    .form--switch .form-check-input {
        width: unset;
        border-radius: 16px;
        background-image: none;
        position: relative;
        box-shadow: none;
        border: 0;
        background-color: var(--primary) !important;
        padding: 12px 30px !important;
        margin-left: 0;
        margin-bottom: 5px;
    }

    .form--switch .form-check-input:focus {
        width: unset;
        border-radius: 16px;
        background-image: none;
        position: relative;
        box-shadow: none;
        border: 0;
    }

    .form--switch .form-check-input::before {
        position: absolute;
        content: "";
        width: 17px;
        height: 17px;
        background-color: var(--black);
        top: 50%;
        transform: translateY(-50%);
        border-radius: 50%;
        left: 5px;
        transition: 0.2s linear;
    }

    .form--switch .form-check-input:checked {
        background-color: var(--primary);
    }

    .form--switch .form-check-input:checked::before {
        left: calc(100% - 20px);
    }

    .form--switch .form-check-label {
        margin-right: 10px;
        color: var(--black);
        font-weight: 500;
        margin-bottom: 0;
        line-height: 2;
    }

    .form-check.form--switch {
        display: flex;
        flex-wrap: wrap;
        padding-left: 10px;
    }

    .form-check.form--switch .form-check-label {
        margin-right: 10px;
        color: var(--black);
        font-weight: 500;
        margin-bottom: 0;
        line-height: 2;
    }

    /*  Custom Switch End Design */
    ::-webkit-calendar-picker-indicator {
        filter: invert(0.5);
    }

    ::-webkit-calendar-picker-indicator {
        background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="16" height="15" viewBox="0 0 24 24"><path fill="%23bbbbbb" d="M20 3h-1V1h-2v2H7V1H5v2H4c-1.1 0-2 .9-2 2v16c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 18H4V8h16v13z"/></svg>');
    }

    .search-input {
        padding-right: 60px !important;
    }

    .contact--section.one input::placeholder {
        color: var(--black) !important;
        font-family: var(--body-font-two) !important;
        font-weight: 300 !important;
    }

    .contact--section.one textarea::placeholder {
        color: var(--black) !important;
        font-family: var(--body-font-two) !important;
        font-weight: 300 !important;
    }

    .contact--form input {
        color: #fff !important;
        border-top: 1px solid #999999 !important;
        border-radius: 0 !important;
    }

    .contact--form input::placeholder {
        color: #999999 !important;
    }

    .contact--form textarea {
        color: #fff !important;
        border-top: 1px solid #999999 !important;
        border-bottom: 1px solid #999999 !important;
        border-radius: 0 !important;
    }

    .contact--form textarea::placeholder {
        color: #999999 !important;
    }

    .contact--section.one form .textarea--wrap, .contact--section.one form .input--wrap {
        position: relative;
    }

    .contact--section.one form .textarea--wrap::after, .contact--section.one form .input--wrap::after {
        content: "";
        position: absolute;
        left: 50%;
        width: 0;
        height: 2px;
        transform: translateX(-50%);
        background-color: var(--primary);
        z-index: 1;
        transition: width 0.2s linear;
    }

    .contact--section.one form .textarea--wrap:focus-within::after, .contact--section.one form .input--wrap:focus-within::after {
        width: 100%;
    }

    .contact--section.one form .input--wrap::after {
        bottom: -1px;
    }

    .contact--section.one form .textarea--wrap::after {
        bottom: 5px;
    }

    /* --------------------------- */
    .modal--base .modal-dialog .modal-content {
        border-radius: 20px !important;
        border: 1px solid var(--black-l-800);
        padding: 24px;
        position: relative;
    }

    .modal--base .modal-dialog .modal-content::after {
        content: "";
        position: absolute;
        bottom: -8px;
        left: 0;
        width: 100%;
        height: 100%;
        border-radius: 32px;
        transition: 0.3s ease;
        background-color: var(--black);
        z-index: -1;
    }

    .modal--base .modal-dialog .modal-header {
        justify-content: space-between;
        padding: 0px;
        padding-bottom: 16px;
        margin-bottom: 36px;
    }

    .modal--base .modal-dialog .modal-header .btn--close {
        width: 30px;
        height: 30px;
        border-radius: 8px;
        background-color: var(--black-l-800) !important;
    }

    .modal--base .modal-dialog .modal-body {
        padding: 0px;
    }

    .modal--base .modal-dialog .modal-footer {
        border: 0;
    }

    .custom--tabs {
        padding: 12px 0px;
        border-radius: 12px;
    }

    .custom--tabs li {
        margin: 0px 8px 8px 0px;
    }

    .custom--tabs li .btn {
        color: var(--primary) !important;
        border: 1px solid var(--primary-l-800) !important;
        padding: 8px 16px;
        outline: none !important;
    }

    .custom--tabs li .btn-check:active + .btn,
    .custom--tabs li .btn-check:checked + .btn,
    .custom--tabs li .btn.active,
    .custom--tabs li .btn.show,
    .custom--tabs li .btn:active {
        color: var(--white) !important;
        background: var(--primary) !important;
        font-weight: 600;
        border: 1px solid var(--white) !important;
    }

    .custom--tabs.nav-tabs {
        border-bottom: 1px solid var(--white) !important;
        border-radius: 0px;
        margin-bottom: 36px !important;
    }

    /* Badge Color and style */
    .badge {
        border-radius: 6px;
        padding: 0px 8px;
        font-size: 14px;
        line-height: 24px;
        font-weight: 400 !important;
    }

    .badge--primary {
        color: var(--primary) !important;
        background-color: var(--primary-l-100) !important;
    }

    .badge--secondary {
        color: var(--secondary) !important;
        background-color: var(--secondary-l-100) !important;
    }

    .badge--success {
        color: var(--success) !important;
        background-color: var(--success-l-100) !important;
    }

    .badge--danger {
        color: var(--danger) !important;
        background-color: var(--danger-l-100) !important;
    }

    .badge--warning {
        color: var(--warning) !important;
        background-color: var(--warning-l-100) !important;
    }

    .badge--info {
        color: var(--info) !important;
        background-color: var(--info-l-100) !important;
    }

    .badge--violet {
        color: var(--violet) !important;
        background-color: var(--violet-l-100) !important;
    }

    .pagination {
        flex-wrap: wrap;
        justify-content: center;
    }

    .pagination .page-item .page-link {
        border: 1px solid var(--primary);
        margin: 0 5px;
        border-radius: 50%;
        height: 40px;
        width: 40px;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: transparent;
        font-weight: 500;
        padding: 0;
        color: hsl(var(--black));
    }

    .pagination .page-item .page-link.active, .pagination .page-item .page-link:hover {
        color: var(--white);
        background-color: var(--primary);
    }

    .pagination .page-item .page-link:focus {
        box-shadow: none;
    }

    .pagination .page-item.active .page-link {
        color: var(--white);
        background-color: var(--primary);
    }

    #preloader {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 1040;
        width: 100vw;
        height: 100vh;
        background-color: var(--primary);
        -webkit-backdrop-filter: blur(10px);
        backdrop-filter: blur(10px);
        display: grid;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        -webkit-transition: height 0.5s, opacity 0.5s, border-radius 0.5s;
        transition: height 0.5s, opacity 0.5s, border-radius 0.5s;
    }

    #preloader #text {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        gap: 12px;
    }

    @media screen and (max-width: 767px) {
        #preloader #text {
            gap: 7px;
        }
    }

    #preloader #text p {
        color: var(--white);
        font-size: 5.625rem;
        font-weight: 400;
        margin: 0;
        opacity: 0;
        -webkit-animation: fadeIn 1.5s ease-in-out infinite;
        animation: fadeIn 1.5s ease-in-out infinite;
        font-family: var(--heading-font);
    }

    @media screen and (max-width: 1199px) {
        #preloader #text p {
            font-size: 3.75rem;
        }
    }

    @media screen and (max-width: 991px) {
        #preloader #text p {
            font-size: 3.625rem;
        }
    }

    @media screen and (max-width: 575px) {
        #preloader #text p {
            font-size: 3.563rem;
        }
    }

    @media screen and (max-width: 767px) {
        #preloader #text p {
            font-size: 2.375rem;
        }
    }

    @media screen and (max-width: 767px) and (max-width: 1199px) {
        #preloader #text p {
            font-size: 2.438rem;
        }
    }

    @media screen and (max-width: 767px) and (max-width: 991px) {
        #preloader #text p {
            font-size: 2.375rem;
        }
    }

    @media screen and (max-width: 767px) and (max-width: 575px) {
        #preloader #text p {
            font-size: 2.313rem;
        }
    }

    #preloader #text p:nth-child(1) {
        -webkit-animation-delay: 0s;
        animation-delay: 0s;
    }

    #preloader #text p:nth-child(2) {
        -webkit-animation-delay: 0.2s;
        animation-delay: 0.2s;
    }

    #preloader #text p:nth-child(3) {
        -webkit-animation-delay: 0.4s;
        animation-delay: 0.4s;
    }

    #preloader #text p:nth-child(4) {
        -webkit-animation-delay: 0.6s;
        animation-delay: 0.6s;
    }

    #preloader #text p:nth-child(5) {
        -webkit-animation-delay: 0.8s;
        animation-delay: 0.8s;
    }

    #preloader #text p:nth-child(6) {
        -webkit-animation-delay: 1s;
        animation-delay: 1s;
    }

    #preloader #text p:nth-child(7) {
        -webkit-animation-delay: 1.2s;
        animation-delay: 1.2s;
    }

    #preloader #text p:nth-child(8) {
        -webkit-animation-delay: 1.4s;
        animation-delay: 1.4s;
    }

    #preloader #text p:nth-child(9) {
        -webkit-animation-delay: 1.6s;
        animation-delay: 1.6s;
    }

    #preloader #text p:nth-child(10) {
        -webkit-animation-delay: 1.8s;
        animation-delay: 1.8s;
    }

    @keyframes fadeIn {
        from {
            opacity: 0;
        }

        to {
            opacity: 1;
        }
    }

    .preloader--one {
        z-index: 9999999;
        flex-flow: column;
        flex: none;
        place-content: flex-end center;
        align-items: flex-end;
        gap: 0;
        width: 100%;
        padding: 0;
        display: flex;
        position: fixed;
        top: -1px;
        bottom: -1px;
        left: 0%;
        overflow: visible;
    }

    .preloader--one .top-block--wrap {
        flex-flow: row;
        flex: 1 0 0;
        place-content: center;
        align-items: center;
        gap: 0;
        width: 100%;
        height: 1px;
        padding: 0;
        display: flex;
        position: relative;
        overflow: visible;
    }

    .preloader--one .top-block--wrap .block {
        transform-origin: top;
    }

    .preloader--one .block {
        flex: none;
        width: 20%;
        height: 100%;
        transform-origin: top;
    }

    .preloader--one .bottom-block--wrap {
        flex-flow: row;
        flex: 1 0 0;
        place-content: flex-end center;
        align-items: flex-end;
        gap: 0;
        width: 100%;
        height: 1px;
        padding: 0;
        display: flex;
        position: relative;
        overflow: visible;
    }

    .preloader--one .bottom-block--wrap .block {
        transform-origin: bottom;
    }

    .preloader--four {
        position: fixed;
        top: 0;
        left: 0;
        background-color: var(--tertiary);
        width: 100%;
        height: 100%;
        z-index: 99999;
    }

    .preloader--four .loading--text {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 100px;
        z-index: 100;
        color: var(--white);
        font-family: var(--body-font) !important;
    }

    .preloader--four .overlay {
        width: 100%;
        height: 100vh;
        position: absolute;
        top: 0;
        left: 0;
    }

    .preloader--four .block {
        position: fixed;
        width: 5.1%;
        height: 100%;
        background: var(--black);
        transform-origin: left;
    }

    .preloader--four .block-1 {
        left: 0;
    }

    .preloader--four .block-2 {
        left: 5%;
    }

    .preloader--four .block-3 {
        left: 10%;
    }

    .preloader--four .block-4 {
        left: 15%;
    }

    .preloader--four .block-5 {
        left: 20%;
    }

    .preloader--four .block-6 {
        left: 25%;
    }

    .preloader--four .block-7 {
        left: 30%;
    }

    .preloader--four .block-8 {
        left: 35%;
    }

    .preloader--four .block-9 {
        left: 40%;
    }

    .preloader--four .block-10 {
        left: 45%;
    }

    .preloader--four .block-11 {
        left: 50%;
    }

    .preloader--four .block-12 {
        left: 55%;
    }

    .preloader--four .block-13 {
        left: 60%;
    }

    .preloader--four .block-14 {
        left: 65%;
    }

    .preloader--four .block-15 {
        left: 70%;
    }

    .preloader--four .block-16 {
        left: 75%;
    }

    .preloader--four .block-17 {
        left: 80%;
    }

    .preloader--four .block-18 {
        left: 85%;
    }

    .preloader--four .block-19 {
        left: 90%;
    }

    .preloader--four .block-20 {
        left: 95%;
    }

    .preloader--two {
        position: fixed;
        width: 100%;
        height: 100vh;
        z-index: 99999;
    }

    .preloader--two #black {
        width: 100%;
        height: 100vh;
        background-color: #161616;
    }

    .preloader--two h1 {
        overflow: hidden;
        text-align: center;
        color: white;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 150px;
        font-weight: 400;
        line-height: 1.1;
        font-family: var(--body-font) !important;
    }

    .preloader--two .top {
        position: absolute;
        top: 5vh;
        left: 50%;
        transform: translate(-50%);
    }

    .preloader--two .child {
        display: inline-block;
    }

    .preloader--three {
        position: fixed;
        width: 100%;
        height: 100%;
        background-color: var(--black);
        overflow: hidden;
        z-index: 9999999;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .preloader--three .loading--text {
        font-size: 150px;
        font-weight: 400;
        line-height: 1.1;
        font-family: var(--body-font) !important;
        color: var(--white);
    }

    .preloader--three .mask {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 3;
        opacity: 0;
        visibility: hidden;
    }

    .preloader--five {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100vh;
        background: var(--black);
        display: flex;
        justify-content: center;
        align-items: center;
        flex-direction: column;
        z-index: 9999999;
    }

    .preloader--five .mask {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .preloader--five .progress-container {
        width: 300px;
        height: 2px;
        background: rgba(0, 0, 0, 0.1);
        margin-bottom: 20px;
        position: relative;
        z-index: 2;
    }

    .preloader--five .progress-bar {
        position: absolute;
        left: 0;
        top: 0;
        height: 100%;
        width: 0%;
        background: rgb(255, 255, 255);
    }

    .preloader--five .percentage {
        position: fixed;
        bottom: 32px;
        right: 32px;
        font-family: var(--body-font);
        font-size: 25rem;
        line-height: 0.8;
        color: rgb(255, 255, 255);
        opacity: 0.2;
    }

    .preloader--five .text-container {
        height: 100px;
        position: relative;
        overflow: hidden;
        margin: 20px 0;
        width: 100%;
    }

    .preloader--five .loading-text {
        font-family: var(--body-font);
        font-weight: 400;
        color: var(--white);
        font-size: 50px;
        position: absolute;
        width: 100%;
        text-align: center;
    }

    /* dashboard Sidebar Menu Start */
    .dashboard_profile .sidebar-menu-list__link {
        color: hsl(var(--black));
    }

    .dashboard_profile .sidebar-menu-list__link:hover {
        background: hsl(var(--base)/0.1);
    }

    .sidebar-menu-list__link.active {
        position: relative;
        background: hsl(var(--white));
    }

    .sidebar-menu-list__link.active .icon {
        color: hsl(var(--base));
    }

    .sidebar-menu-list__link.active .text {
        color: hsl(var(--base));
    }

    .sidebar-menu-list {
        padding-bottom: 30px;
        position: relative;
        overflow-y: auto;
        height: 100%;
        overflow-x: hidden;
    }

    .sidebar-menu-list::-webkit-scrollbar {
        width: 0px;
    }

    .sidebar-menu-list__item {
        margin: 0px 0px 8px 0px;
    }

    .sidebar-menu-list__item.has-dropdown.active {
        background-color: var(--white-l-100);
        border-radius: 4px;
    }

    .sidebar-menu-list__item.has-dropdown.active > a {
        color: hsl(var(--base-two));
    }

    .sidebar-menu-list__item.has-dropdown.active > a:after {
        transform: rotate(90deg);
        margin-left: 14px;
        color: var(--primary);
    }

    .sidebar-menu-list__item.has-dropdown > a:after {
        font-family: "Font Awesome 5 Free";
        font-weight: 900;
        content: "\f105";
        position: absolute;
        top: 4px;
        right: 0px;
        transition: 0.1s linear;
        margin-left: 14px;
        color: var(--body-color);
    }

    .sidebar-menu-list__link {
        display: flex;
        align-items: center;
        text-decoration: none;
        position: relative;
        width: 100%;
        color: var(--body-color) !important;
        gap: 8px;
    }

    .sidebar-menu-list__link .text {
        transition: 0.3s linear;
        font-size: 52px;
    }

    .sidebar-menu-list__link:hover .text {
        color: var(--primary) !important;
    }

    .sidebar-menu-list__link .icon {
        display: block;
        width: 14x;
        height: 14px;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 16px;
        border-radius: 4px;
        animation: swing ease-in-out 0.5s 1 alternate;
    }

    /*=============== Sidebar Submenu Start ===============*/
    .sidebar-submenu {
        display: none;
        position: relative;
    }

    .sidebar-submenu.open-submenu {
        display: block;
    }

    .sidebar-submenu-list {
        padding: 5px 0;
    }

    .sidebar-submenu-list__item {
        position: relative;
    }

    .sidebar-submenu-list__item.active::before {
        background: var(--primary) !important;
    }

    .sidebar-submenu-list__item.active > a {
        color: var(--primary);
    }

    .sidebar-submenu-list__link {
        padding: 6px 12px;
        color: var(--black);
        border-bottom: 0 !important;
        font-size: 20px;
    }

    .sidebar-submenu-list__link:hover {
        color: var(--primary);
    }

    .sidebar-submenu-list__link.active {
        border-bottom: 1px solid var(--primary) !important;
        border-radius: 8px;
    }

    .sidebar-submenu-list__link.active:hover {
        background: transparent !important;
    }

    @keyframes swing {
        0% {
            transform: rotate(0deg);
        }

        10% {
            transform: rotate(10deg);
        }

        30% {
            transform: rotate(0deg);
        }

        40% {
            transform: rotate(-10deg);
        }

        50% {
            transform: rotate(0deg);
        }

        60% {
            transform: rotate(5deg);
        }

        70% {
            transform: rotate(0deg);
        }

        80% {
            transform: rotate(-5deg);
        }

        100% {
            transform: rotate(0deg);
        }
    }
    /*========  responsive sidebar menu  =======*/
    .sidebar-menu-wrapper {
        width: 300px;
        height: 100vh;
        background-color: var(--card-bg);
        position: fixed;
        z-index: 15;
        left: -320px;
        transition: all 0.4s ease-in-out;
    }

    .sidebar-menu-wrapper.show {
        left: 0;
    }

    .sidebar-menu-wrapper .top-close {
        margin-top: 21px;
        text-align: end;
        margin-right: 24px;
    }

    .sidebar-menu-wrapper .top-close i {
        font-size: 22px;
        color: var(--black);
    }

    .sidebar-menu-wrapper .header-wrapper .logo-wrapper img {
        width: 130px;
        margin-left: 6px;
    }

    @media screen and (max-width: 991px) {
        .sidebar-menu-wrapper .header-wrapper .logo-wrapper img {
            margin-left: 15px;
        }
    }

    @media screen and (max-width: 575px) {
        .sidebar-menu-wrapper .header-wrapper .logo-wrapper img {
            margin-left: 6px;
        }
    }

    .sidebar-menu-list__item .btn.btn--base {
        border: 1px solid var(--black);
    }

    .sidebar-menu-list__item a span {
        color: var(--black);
        font-weight: 600;
    }

    .header {
        position: absolute;
        top: 25px;
        z-index: 5;
        padding: 0px;
        width: 100%;
    }

    @media screen and (max-width: 991px) {
        .header {
            top: 0px;
            padding: 18px 0px;
            position: absolute;
            left: 0;
            right: 0;
            z-index: 7;
        }
    }

    @media screen and (max-width: 575px) {
        .header {
            padding: 12px 0px;
        }
    }

    .header.fixed-header {
        position: fixed;
        top: 0px;
        animation: slide-down 0.8s;
        width: 100%;
        z-index: 999;
    }

    .header-main-area .container-fluid {
        padding: 0 75px;
    }

    @media screen and (max-width: 1399px) {
        .header-main-area .container-fluid {
            padding: 0 60px;
        }
    }

    @media screen and (max-width: 575px) {
        .header-main-area .container-fluid {
            padding: 0 25px;
        }
    }

    .header-main-area.one .fixed-header {
        background-color: rgba(0, 0, 0, 0.57) !important;
        backdrop-filter: blur(28px) brightness(1.34);
        padding: 0;
    }

    .header-main-area.two .header-wrapper {
        border: 1px solid hsl(var(--black)/0.05);
        padding: 30px 0;
        border-top: 1px dashed var(--black);
    }

    .header-main-area.two .fixed-header {
        background-color: rgba(255, 255, 255, 0.57) !important;
        backdrop-filter: blur(28px) brightness(1.34);
        padding: 0;
    }

    .header-main-area.two .header--description {
        width: 290px;
        font-size: 14px;
    }

    .header-main-area.three .fixed-header {
        background-color: rgba(255, 255, 255, 0.57) !important;
        backdrop-filter: blur(28px) brightness(1.34);
        padding: 5px 0;
        border-bottom: 1px dashed var(--black-l-200);
    }

    .header-main-area.six .header .header-wrapper {
        position: relative;
    }

    .header-main-area.six .header .header-wrapper::after {
        content: "";
        position: absolute;
        bottom: -20px;
        left: 0;
        width: 100%;
        border-bottom: 1px dashed var(--black-l-100);
    }

    .header-main-area.six .header .header-wrapper::before {
        content: "";
        position: absolute;
        bottom: -23px;
        left: 0;
        width: 100%;
        border-bottom: 1px dashed var(--black-l-100);
    }

    .header-main-area.six .fixed-header {
        background-color: rgba(255, 255, 255, 0.57) !important;
        backdrop-filter: blur(28px) brightness(1.34);
        padding: 10px 0;
        border-bottom: 1px dashed var(--black-l-100);
    }

    .header-main-area.six .fixed-header .header-wrapper::after {
        content: none;
    }

    .header-main-area.six .fixed-header .header-wrapper::before {
        content: none;
    }

    .header-main-area.four .header {
        top: 0;
        border-bottom: 1px dashed var(--white-l-300);
    }

    .header-main-area.four .header::after {
        content: "";
        position: absolute;
        left: 0;
        bottom: -5px;
        width: 100%;
        border-bottom: 1px dashed var(--white-l-300);
    }

    .header-main-area.four .header-wrapper {
        padding: 25px 0;
    }

    .header-main-area.four .fixed-header {
        background-color: rgba(0, 0, 0, 0.57) !important;
        backdrop-filter: blur(28px) brightness(1.34);
        padding: 0;
    }

    .header-main-area.four .social-item--wrap {
        gap: 10px;
    }

    .header-main-area.four .social-item--wrap .item {
        width: 42px;
        height: 42px;
        border: 1px solid var(--white);
        transition: 0.2s linear;
        background-color: transparent;
    }

    .header-main-area.four .social-item--wrap .item:hover {
        background-color: var(--secondary);
    }

    .header-main-area.four .social-item--wrap .item:hover i {
        color: var(--black);
    }

    .header-main-area.four .social-item--wrap .item i {
        font-size: 16px;
    }

    .header-main-area.five .container-fluid {
        padding: 0 160px !important;
    }

    .header-main-area.five .header-wrapper {
        background-color: var(--white);
        border-radius: 15px !important;
        padding: 18px 35px !important;
    }

    .header-main-area.five .fixed-header {
        padding: 5px 0;
    }

    .header-main-area.five .fixed-header .header-wrapper {
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    }

    .header-main-area.five .btn-style--four {
        padding: 10px 20px;
    }

    .scrolled {
        display: none !important;
    }

    .header-wrapper {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 0;
        background-color: hsl(var(--white));
        border-radius: 0px;
        border: 1px solid hsl(var(--black)/0.05);
    }

    .header-wrapper.two {
        padding: 25px 0;
        border-top: 1px dashed var(--black);
    }

    @media screen and (max-width: 575px) {
        .header-wrapper {
            padding: 10px 15px !important;
        }
    }

    .header-wrapper .ham__menu {
        display: none;
    }

    @media screen and (max-width: 991px) {
        .header-wrapper .ham__menu {
            display: block !important;
        }
    }

    .header-wrapper .main-menu {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 50px;
    }

    @media screen and (max-width: 1199px) {
        .header-wrapper .main-menu {
            margin-left: 0px;
        }
    }

    .header-wrapper .main-menu .menu-link--wrap {
        transition: all 0.4s;
        padding: 20px 0;
    }

    .header-wrapper .main-menu .menu {
        font-size: 18px;
        color: var(--body-bg-one);
        font-family: var(--body-font);
        font-weight: 500;
        position: relative;
        text-transform: uppercase;
    }

    .header-wrapper .main-menu .menu:hover {
        color: var(--primary);
    }

    .header-wrapper .main-menu .menu.active {
        color: var(--primary);
    }

    .header-wrapper .main-menu .menu.active:before {
        opacity: 1;
        transform: translateX(0);
    }

    @media screen and (max-width: 1399px) {
        .header-wrapper .main-menu .menu {
            font-size: 18px;
        }
    }

    @media screen and (max-width: 1199px) {
        .header-wrapper .main-menu .menu {
            padding: 0px;
            font-size: 16px;
        }
    }

    @media (max-width: 770px) {
        .header-wrapper .menu-list-wrapper {
            display: block !important;
        }

        .header-wrapper .menu-list-wrapper ul {
            gap: 0px;
        }
    }

    @media (max-width: 620px) {
        .header-wrapper .menu-list-wrapper ul:last-child {
            display: none;
        }
    }

    .header-wrapper .count-item {
        position: absolute;
        height: 19px;
        width: 19px;
        background: hsl(var(--base));
        text-align: center;
        border-radius: 50%;
        font-size: 13px;
        color: hsl(var(--black));
        top: -7px;
        right: 7px;
        font-weight: 600;
        line-height: 19px;
    }

    @media screen and (max-width: 991px) {
        .header-wrapper .count-item {
            top: -4px;
        }
    }

    @keyframes slide-down {
        0% {
            opacity: 0;
            transform: translateY(-150%);
        }

        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }

    .link--roll {
        display: inline-block;
        text-decoration: none;
        overflow: hidden;
        height: 24px;
    }

    .link--roll:hover .letter, .link--roll.play .letter {
        transform: translateY(-100%);
    }

    .link--roll .letter {
        display: inline-block;
        transition: transform 0.6s cubic-bezier(0.76, 0, 0.24, 1);
    }

    .link-roll--xl {
        display: inline-block;
        text-decoration: none;
        overflow: hidden;
        height: 70px;
    }

    .link-roll--xl:hover .letter, .link-roll--xl.play .letter {
        transform: translateY(-100%);
    }

    .link-roll--xl .letter {
        display: inline-block;
        transition: transform 0.6s cubic-bezier(0.76, 0, 0.24, 1);
    }

    .letter:nth-child(1) {
        transition-delay: 0s;
    }

    .letter:nth-child(2) {
        transition-delay: 0.015s;
    }

    .letter:nth-child(3) {
        transition-delay: 0.03s;
    }

    .letter:nth-child(4) {
        transition-delay: 0.045s;
    }

    .letter:nth-child(5) {
        transition-delay: 0.06s;
    }

    .letter:nth-child(6) {
        transition-delay: 0.075s;
    }

    .letter:nth-child(7) {
        transition-delay: 0.09s;
    }

    .letter:nth-child(8) {
        transition-delay: 0.105s;
    }

    .letter:nth-child(9) {
        transition-delay: 0.12s;
    }

    .letter:nth-child(10) {
        transition-delay: 0.135s;
    }

    .letter:nth-child(11) {
        transition-delay: 0.15s;
    }

    .letter:nth-child(12) {
        transition-delay: 0.165s;
    }

    .letter:nth-child(13) {
        transition-delay: 0.18s;
    }

    .letter:nth-child(14) {
        transition-delay: 0.195s;
    }

    .letter:nth-child(15) {
        transition-delay: 0.21s;
    }

    .letter:nth-child(16) {
        transition-delay: 0.225s;
    }

    .letter:nth-child(17) {
        transition-delay: 0.24s;
    }

    .letter:nth-child(18) {
        transition-delay: 0.255s;
    }

    .letter:nth-child(19) {
        transition-delay: 0.27s;
    }

    .letter:nth-child(20) {
        transition-delay: 0.285s;
    }

    .letter:nth-child(21) {
        transition-delay: 0.3s;
    }

    .header-main-area .main-menu .links--wrap:hover .dropdown--link::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 62px;
        background-color: #1c2a2a;
        border-radius: 8px 8px 0 0;
        z-index: -1;
    }

    .header-main-area .main-menu .links--wrap:hover .menu--dropdown {
        visibility: visible;
        opacity: 1;
        transition: 0.3s linear;
        margin-top: 0px;
    }

    .header-main-area .main-menu .links--wrap .dropdown--hover {
        position: relative;
        padding: 0 10px;
    }

    .header-main-area .main-menu .links--wrap .dropdown--hover::after {
        content: "[";
        position: absolute;
        top: 50%;
        left: 4px;
        transform: translate(-50%, -50%);
    }

    .header-main-area .main-menu .links--wrap .dropdown--hover::before {
        content: "]";
        position: absolute;
        top: 50%;
        right: -2px;
        transform: translate(-50%, -50%);
    }

    .header-main-area .main-menu .links--wrap .submenu--hover {
        position: relative;
    }

    .header-main-area .main-menu .links--wrap .submenu--hover::before {
        content: "\f054";
        font-family: FontAwesome;
        position: absolute;
        font-size: 12px;
        top: 50%;
        right: 3px;
        transform: translate(-50%, -50%);
    }

    .header-main-area .main-menu .links--wrap.two .dropdown-hover--two {
        position: relative;
        padding: 0 18px 0 0;
    }

    .header-main-area .main-menu .links--wrap.two .dropdown-hover--two::before {
        content: "\f0d7";
        font-family: FontAwesome;
        position: absolute;
        font-size: 16px;
        top: 50%;
        right: -5px;
        transform: translate(-50%, -50%);
        color: var(--black);
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown {
        opacity: 0;
        visibility: hidden;
        top: 70px;
        left: 0px;
        z-index: 1;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px;
        transition: 0.3s linear;
        background-color: var(--white);
        padding: 20px;
        border-radius: 12px;
        min-width: 420px;
        margin-top: -5px;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown h6.body--font.fs--16 {
        position: relative;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown h6.body--font.fs--16::after {
        content: "";
        position: absolute;
        bottom: -2px;
        left: 0;
        width: 60px;
        border-bottom: 1px solid var(--black);
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown li a {
        font-size: 15px !important;
        font-weight: 400;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown i {
        margin-right: 6px;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown .sub--menu {
        opacity: 0;
        visibility: hidden;
        background-color: var(--white);
        padding: 20px;
        border-radius: 6px;
        min-width: 180px;
        top: 0;
        right: -178px;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px;
        z-index: 2;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown .sub-menu--link:hover .sub--menu {
        visibility: visible;
        opacity: 1;
        transition: 0.1s linear;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown .sub--menu {
        opacity: 0;
        visibility: hidden;
        background-color: var(--white);
        padding: 20px;
        border-radius: 6px;
        min-width: 180px;
        top: 0;
        right: -178px;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown .submenu--inner:hover .inner-sub--menu {
        visibility: visible;
        opacity: 1;
        transition: 0.1s linear;
    }

    .header-main-area .main-menu .links--wrap .menu--dropdown .inner-sub--menu {
        opacity: 0;
        visibility: hidden;
        background-color: var(--white);
        padding: 20px;
        border-radius: 6px;
        min-width: 180px;
        top: 0;
        right: -178px;
        box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px 0px;
    }

    .side-navigation--wrap {
        bottom: 0;
        right: 0;
        z-index: 4;
        display: flex;
        justify-content: end;
        align-items: end;
    }

    .side-navigation--wrap.in--four {
        top: 80px;
        bottom: unset;
    }

    .side-navigation--wrap.in--four .link-roll--xl {
        height: 42px;
    }

    .side-navigation--wrap.in--four .text {
        font-size: 30px;
    }

    .side-navigation--wrap .side--navigation {
        border-radius: 30px;
        padding: 30px 50px;
        width: 0;
        height: 0;
        margin: 30px;
        opacity: 0;
        visibility: hidden;
        transition: 0.4s linear;
        position: absolute;
        bottom: 0;
        right: 0;
        overflow-y: auto;
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
    }

    .side-navigation--wrap .side--navigation .logo--wrap {
        margin-bottom: 30px;
    }

    .side-navigation--wrap .side--navigation .close--btn {
        width: 50px;
        height: 50px;
        border-radius: 50%;
        background-color: var(--black-l-100);
        z-index: 99;
    }

    .side-navigation--wrap .side--navigation .close--btn i {
        font-size: 20px;
    }

    .side-navigation--wrap .contact--meta .thumb--wrap {
        width: 100%;
        height: 150px;
        background-color: var(--black);
        border-radius: 20px;
        overflow: hidden;
    }

    .side-navigation--wrap .contact--meta .thumb--wrap img {
        transition: 0.3s linear;
    }

    .side-navigation--wrap .contact--meta .thumb--wrap:hover img {
        transition: 0.3s linear;
        scale: 1.1;
    }

    .side-navigation--wrap .contact--meta .thumb--wrap .text {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .side-navigation--wrap .contact--meta .social--list a {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
    }

    .side-navigation--wrap .contact--meta .social--list a i {
        font-size: 14px;
        color: var(--black);
    }

    .side-navigation--wrap .contact--meta .social--list a:hover {
        background-color: var(--tertiary) !important;
    }

    .side-navigation--wrap .contact--meta .social--list a:hover i {
        color: var(--white);
    }

    .side-navigation--wrap .contact--meta .hover-link--dark.text--sm:hover {
        color: var(--tertiary) !important;
    }

    .side-navigation--wrap.active.in--four .side--navigation {
        height: 85vh;
    }

    .side-navigation--wrap.active.in--four .sidebar-submenu-list__link:hover {
        color: var(--tertiary);
    }

    .side-navigation--wrap.active .side--navigation {
        width: 35vw;
        height: 80vh;
        opacity: 1;
        visibility: visible;
    }

    .header-cta--btn {
        width: 52px;
        height: 52px;
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
    }

    .header-cta--btn.two {
        width: 0px;
        height: 0px;
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
        opacity: 0;
        visibility: hidden;
        cursor: pointer;
    }

    .header-cta--btn.two.fixed--cta {
        position: fixed;
        z-index: 99;
        top: 45px;
        right: 45px;
        width: 52px;
        height: 52px;
        opacity: 1;
        visibility: visible;
        box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
    }

    .hero-section.one {
        padding: 370px 0 30px 0;
    }

    .hero-section.one .banner--title {
        font-size: 370px;
        font-weight: 400;
        line-height: 1.1;
    }

    .hero-section.one .bg--thumb {
        top: 6%;
        right: 14%;
    }

    .hero-section.one .hero--element {
        z-index: 3;
    }

    .hero-section.one .hero--element .dot--lg {
        width: 30px;
        height: 30px;
        border: 1px solid var(--body-bg-one);
        cursor: pointer;
    }

    .hero-section.one .hero--element .dot--lg .dot--md {
        width: 16px;
        height: 16px;
        background-color: var(--body-bg-one);
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        position: relative;
    }

    .hero-section.one .hero--element .dot--lg .dot--md::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: var(--primary);
        transition: 0.1s linear;
        opacity: 0;
    }

    .hero-section.one .hero--element .dot--lg:hover .dot--md::after {
        opacity: 1;
    }

    .hero-section.one .hero--element .dot--lg:hover + .content--wrap {
        opacity: 1;
        visibility: visible;
    }

    .hero-section.one .hero--element .content--wrap {
        padding: 12px 16px;
        border-radius: 4px;
        background-color: var(--body-bg-one);
        margin-top: 30px;
        position: relative;
        opacity: 0;
        visibility: hidden;
        transition: 0.3s linear;
    }

    .hero-section.one .hero--element .content--wrap::after {
        content: "";
        position: absolute;
        width: 22px;
        height: 22px;
        background: var(--body-bg-one);
        top: 0;
        left: 50%;
        transform: translate(-50%, -95%);
        clip-path: polygon(50% 40%, 0% 100%, 100% 100%);
        transition: 0.5s ease, 0.8s opacity ease;
    }

    .hero-section.one .hero--element .content--wrap img {
        width: 26px;
        height: 26px;
        object-fit: cover;
    }

    .hero-section.one .hero--element .content--wrap span {
        padding: 2px 7px;
        border-radius: 90px;
        background-color: var(--primary);
        line-height: 20px;
    }

    .hero-section.one .hero--element.one {
        top: 20%;
        right: 45%;
    }

    .hero-section.one .hero--element.two {
        top: 20%;
        right: 5%;
    }

    .hero-section.one .hero--element.three {
        top: 57%;
        right: 25%;
    }

    .hero-section.two {
        padding: 180px 0 130px 0;
    }

    .hero-section.two .social-item--wrap {
        top: 35%;
        left: -102px;
        rotate: 90deg;
        gap: 10px;
    }

    .hero-section.two .social-item--wrap a {
        padding: 2px 20px 2px 20px;
        border: 1px solid var(--black);
    }

    .hero-section.two .scroll-down--wrap {
        top: 25%;
        right: 10px;
        gap: 10px;
        rotate: 90deg;
    }

    .hero-section.two .scroll-down--wrap p {
        font-size: 18px;
    }

    .hero-section.two .scroll-down--wrap img {
        position: absolute;
        right: -115px;
        bottom: -75px;
        rotate: -90deg;
    }

    .hero-section.two .banner--title {
        font-size: 200px;
        font-weight: 400;
        line-height: 0.9;
    }

    .hero-section.two .hero-sm--text {
        line-height: 30px;
        width: 510px;
        margin-top: 36px;
        text-indent: 174px;
    }

    .hero-section.two .element--wrap {
        padding-top: 228px;
    }

    .hero-section.two .element--wrap .counter--wrap {
        gap: 86px;
    }

    .hero-section.two .element--wrap .counter {
        width: 392px;
        padding: 0 0 30px 30px;
        border-left: 1px dashed var(--black);
        border-bottom: 1px dashed var(--black);
        z-index: 1;
    }

    .hero-section.two .element--wrap .counter .br--shape {
        width: 388px;
        height: 181px;
        border-left: 1px dashed var(--black);
        border-bottom: 1px dashed var(--black);
        top: 0;
        right: 0;
        z-index: -1;
    }

    .hero-section.two .element--wrap .counter .number {
        line-height: 90px;
    }

    .hero-section.two .element--wrap .video--wrap {
        width: 730px;
        height: 420px;
        bottom: 0;
        right: 75px;
        z-index: 1;
    }

    .hero-section.two .element--wrap .video--wrap video {
        width: 930px;
        height: 520px;
    }

    .hero-section.three {
        padding: 180px 0 130px 0;
        background-color: var(--hero-bg);
        background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05) 1px, transparent 1px, transparent 2px);
    }

    .hero-section.three .social-item--wrap {
        top: 25%;
        left: -120px;
        rotate: 90deg;
        gap: 10px;
        z-index: 99;
    }

    .hero-section.three .social-item--wrap a {
        padding: 2px 20px 2px 20px;
        border: 1px solid var(--black-l-100);
        position: relative;
        z-index: 9;
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(15px);
    }

    .hero-section.three .scroll-down--wrap {
        top: 17%;
        right: -28px;
        gap: 10px;
        rotate: 90deg;
        z-index: 9;
        padding: 2px 20px 2px 20px;
        border: 1px solid var(--black-l-100);
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(15px);
        border-radius: 90px;
    }

    .hero-section.three .scroll-down--wrap img {
        position: absolute;
        right: -115px;
        bottom: -70px;
        rotate: -90deg;
    }

    .hero-section.three .banner--title {
        font-size: 200px;
        font-weight: 400;
        line-height: 0.9;
    }

    .hero-section.three .hero-sm--text {
        line-height: 30px;
        width: 506px;
        text-indent: 130px;
    }

    .hero-section.three .hero-element4 {
        width: 388px;
    }

    .hero-section.three .hero-element3--wrap {
        height: 860px;
    }

    .hero-section.three .hero-element3--wrap .hero-element3 {
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .hero-section.four {
        padding: 180px 0 130px 0;
    }

    .hero-section.four .banner--title {
        font-size: 120px;
        font-weight: 600;
        line-height: 1;
    }

    .hero-section.four .hero-sm--text {
        line-height: 30px;
        width: 460px;
    }

    .hero-section.four .thumb--wrap.one {
        top: 22%;
        right: 75px;
        width: 342px;
        height: 400px;
    }

    .hero-section.four .thumb--wrap.one img {
        -webkit-mask-image: url("../images/common/mask1.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: url("../images/common/mask1.png");
        mask-repeat: no-repeat;
        mask-size: cover;
        mask-position: center;
    }

    .hero-section.four .thumb--wrap.two {
        top: 22%;
        left: 75px;
    }

    .hero-section.four .thumb--wrap.three {
        top: 0;
    }

    .hero-section.four .thumb--wrap.three img {
        transform-style: preserve-3d;
    }

    .hero-section.four .video--wrap {
        left: 75px;
        bottom: 0;
        width: 570px;
        height: 352px;
    }

    .hero-section.four .video--wrap video {
        -webkit-mask-image: url("../images/common/mask2.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: url("../images/common/mask2.png");
        mask-repeat: no-repeat;
        mask-size: cover;
        mask-position: center;
    }

    .hero-section.four .tag--wrap {
        gap: 10px;
    }

    .hero-section.four .tag--wrap .tag {
        padding: 8px 20px;
        border: 1px solid var(--white);
        border-radius: 50px;
    }

    .hero-section.four .tag--wrap .tag p {
        font-size: 15px;
    }

    .hero-section.four .tag--wrap .tag .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background-color: var(--white);
        display: inline-block;
    }

    .hero-section.five {
        padding: 240px 0 130px 0;
    }

    .hero-section.five .content--wrap .element--wrap {
        bottom: 15%;
        left: -8%;
    }

    .hero-section.five .top-review--wrap {
        border: 1px solid var(--black-l-200);
        padding: 6px 28px;
        border-radius: 90px;
        margin-bottom: 25px;
        height: 40px;
    }

    .hero-section.five .top-review--wrap .user--thumb {
        width: 26px;
        height: 26px;
        margin-left: -12px;
    }

    .hero-section.five .title {
        font-size: 55px;
        text-align: center;
    }

    .hero-section.five .hero-shape-1 {
        top: 0;
        right: 0;
        z-index: -1;
    }

    .hero-section.five .hero-shape-2 {
        top: 0;
        left: 0;
        z-index: -1;
    }

    .hero-section.five .description {
        width: 75%;
        margin-bottom: 35px;
    }

    .hero-section.five .hero-input--wrap .hero--input {
        padding: 26px 35px;
        border-radius: 90px;
        outline: 0;
        border: 1px solid var(--black-l-200);
    }

    .hero-section.five .hero-input--wrap .hero--input::placeholder {
        color: var(--black);
        font-size: 18px;
    }

    .hero-section.five .hero-input--wrap .hero-search--btn {
        top: 50%;
        right: 0;
        transform: translate(-6%, -50%);
    }

    .hero-section.five .hero-slider--wrap .slider-shadow {
        background-image: linear-gradient(90deg, #F8F7F3 35%, rgba(246, 246, 246, 0));
        width: 15vw;
        height: 103%;
        inset: 0% auto 0% 0%;
        z-index: 9;
    }

    .hero-section.five .hero-slider--wrap .slider-shadow.one {
        top: 0;
        left: 0;
    }

    .hero-section.five .hero-slider--wrap .slider-shadow.two {
        background-image: linear-gradient(270deg, #F8F7F3 35%, rgba(246, 246, 246, 0));
        inset: 0% 0% 0% auto;
        top: 0;
        right: 0;
    }

    .hero-section.five .hero--marque {
        gap: 30px;
    }

    .hero-section.five .hero--marque .thumb--wrap {
        width: 633px;
        height: 441px;
        border-radius: 5px;
    }

    .slice {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        background-image: url("../images/common/hero-bg-2s.png");
        background-size: cover;
        background-repeat: repeat;
        z-index: -1;
    }

    .about--section.one .about-content--wrap {
        position: relative;
        z-index: 1;
        background-color: transparent;
    }

    .about--section.one .section--text {
        font-size: 200px;
        font-weight: 400;
        line-height: 0.9;
    }

    .about--section.one .title .thumb--wrap {
        width: 190px;
        height: 140px;
        border-radius: 10px;
        transition: width 0.1s ease-out;
        margin: 8px 32px 0 32px;
    }

    .about--section.one .about-element--wrap {
        height: 40vh;
    }

    .about--section.one .about-element--wrap .about-element {
        position: relative;
        z-index: 2;
    }

    .about--section.two .section--title {
        font-weight: 600;
        font-size: 60px;
        line-height: 70px;
    }

    .about--section.two .thumb--wrap {
        width: 100%;
    }

    .about--section.two .thumb--wrap.one {
        height: 913px;
    }

    .about--section.two .thumb--wrap.two {
        height: 378px;
    }

    .about--section.four .container-fluid {
        padding: 0 160px;
    }

    .about--section.four .about-thumb--wrap img {
        -webkit-mask-image: url("../images/common/mask3.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: url("../images/common/mask3.png");
        mask-repeat: no-repeat;
        mask-size: cover;
        mask-position: center;
    }

    .about--section.four .about-content--wrap .about--content {
        padding: 35px 0;
        border-top: 1px dashed var(--black);
        border-bottom: 1px dashed var(--black);
        gap: 65px;
    }

    .about--section.four .about-content--wrap .about--content .title {
        line-height: 40px;
    }

    .about--section.four .section-content--wrap {
        margin-bottom: 60px;
    }

    .about--section.four .section-content--wrap .line--wrap .line {
        height: 1px;
        width: 40px;
        background-color: var(--tertiary);
    }

    .about--section.four .section-content--wrap .title {
        font-size: 60px;
        margin-bottom: 35px;
    }

    .about--section.four .slider--wrap {
        padding: 0 75px;
    }

    .about--section.five .container-fluid {
        padding: 0px 160px;
    }

    .about--section.five .about-thumb--wrap {
        width: 100%;
        height: 744px;
        border-radius: 15px;
    }

    .about--section.five .about-content--wrap .about--content {
        padding: 35px 0;
        border-top: 1px dashed var(--black);
        border-bottom: 1px dashed var(--black);
        gap: 65px;
    }

    .about--section.five .about-content--wrap .about--content .title {
        line-height: 40px;
    }

    .portfolio--section .content--wrap {
        z-index: 1;
    }

    .portfolio--section .content--wrap .discription {
        font-size: 70px;
    }

    .portfolio--section .content--wrap .discription span {
        margin-right: 100px;
        padding: 4px 25px 2px 25px;
        background-color: #E6E3FF;
        position: relative;
        top: -20px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 400px;
        font-weight: 400;
    }

    .portfolio--section .video--wrap {
        top: 0;
        left: 0;
        z-index: -1;
        width: 100%;
        height: 100%;
    }

    .portfolio--section .video--wrap::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: var(--black-l-500);
    }

    .portfolio--section.two .section-content--wrap {
        border-bottom: 1px dashed var(--black-l-200);
        padding-bottom: 40px;
    }

    .portfolio--section.two .section-content--wrap .title {
        top: 0;
        left: 75px;
    }

    .portfolio--section.two .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .scroll-text {
        color: transparent;
        background: linear-gradient(to right, #ffffff 0%, #ffffff 0%, #ffffff 0%);
        -webkit-background-clip: text !important;
        background-clip: text !important;
    }

    .scroll-text--two {
        color: transparent;
        background: linear-gradient(to right, #000000 0%, #000000 0%, #000000 0%);
        -webkit-background-clip: text !important;
        background-clip: text !important;
    }

    .portfolio-card--section .btn--wrap {
        margin-top: 220px;
    }

    .service--section.one .bg-shape--one {
        top: 0;
        right: 140px;
    }

    .service--section.one .bg-shape--two {
        bottom: 0;
        left: 0;
    }

    .service--section.one .content--wrap .discription {
        font-size: 70px;
    }

    .service--section.one .content--wrap .discription span {
        margin-right: 100px;
        padding: 6px 25px 4px 25px;
        background-color: #000;
        position: relative;
        top: -20px;
    }

    .service--section.one .content--wrap .title {
        font-size: 400px;
        font-weight: 400;
    }

    .service--section.one .service-list--wrap {
        z-index: 1;
    }

    .service--section.one .service-list--wrap .bg--shape {
        position: absolute;
        top: 0;
        right: -8.5%;
        width: 100%;
        height: 100%;
        background-color: var(--black);
        z-index: -1;
        border-radius: 500px 0 0 500px;
    }

    .service--section.one .service-list--wrap .service--list {
        gap: 45px;
    }

    .service--section.one .service-list--wrap .service--list .service {
        gap: 100px;
        position: relative;
    }

    .service--section.one .service-list--wrap .service--list .service::after {
        content: "";
        position: absolute;
        bottom: 48px;
        left: 0;
        height: 1px;
        width: 100%;
        background-color: var(--white-l-100);
    }

    .service--section.one .service-list--wrap .service--list .service .number {
        font-size: 100px;
        font-weight: 400;
        transition: 0.3s linear;
    }

    .service--section.one .service-list--wrap .service--list .service .number:hover {
        color: var(--white) !important;
    }

    .service--section.one .service-list--wrap .service--list .service .title {
        font-size: 100px;
        font-weight: 400;
        transition: 0.3s linear;
    }

    .service--section.one .service-list--wrap .service--list .service .title:hover {
        color: var(--white) !important;
    }

    .service--section.one .service-list--wrap .service--list .service .service-tag--wrap {
        margin-top: 30px;
    }

    .service--section.one .service-list--wrap .service--list .service .service--tag {
        padding: 6px 20px;
        border: 1px solid var(--white-l-100);
        border-radius: 50px;
    }

    .service--section.one .service-list--wrap .service--list .service .service--tag .dot {
        width: 7px;
        height: 7px;
        border-radius: 1px;
        rotate: 45deg;
        background-color: var(--body-bg-one);
    }

    .service--section.one .service-thumb--wrap {
        opacity: 0;
        visibility: hidden;
        transition: 0.3s linear;
        top: 80px;
    }

    .service--section.one .service-thumb--wrap.active {
        margin-bottom: 0px;
        opacity: 1;
        visibility: visible;
        top: 30px;
    }

    .service--section.two .section-content--wrap {
        border-bottom: 1px dashed var(--black-l-200);
        padding-bottom: 40px;
    }

    .service--section.two .section-content--wrap .title {
        top: 0;
        left: 75px;
    }

    .service--section.two .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .service--section.three .section-content--wrap {
        border-bottom: 1px dashed var(--black-l-200);
        padding-bottom: 15px;
    }

    .service--section.three .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .service--section.three .section-content--wrap.two {
        margin-bottom: 90px;
        padding-bottom: 30px;
        border-bottom: 1px dashed var(--black-l-200);
        position: relative;
    }

    .service--section.three .section-content--wrap.two::after {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 100%;
        border-bottom: 1px dashed var(--black-l-200);
    }

    .service--section.three .section-content--wrap.two .title {
        font-size: 160px;
    }

    .service--section.three .btn--dark {
        border: 1px solid var(--black-l-200) !important;
        padding: 20px 35px !important;
    }

    .service--section.three .btn--dark.two {
        padding: 20px 35px !important;
    }

    .service--section.four .section-content--wrap {
        border-bottom: 1px dashed var(--black-l-200);
        padding-bottom: 40px;
    }

    .service--section.four .section-content--wrap .title {
        top: 0;
        left: 75px;
    }

    .service--section.four .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .testimonial--section .container-fluid {
        padding: 0 130px;
    }

    .testimonial--section .testimonial-card--wrap .inner {
        gap: 130px;
    }

    .testimonial--section .testimonial-card--wrap .inner.left {
        margin-bottom: 250px;
    }

    .testimonial--section .testimonial-card--wrap .inner.right {
        margin-top: 250px;
    }

    .testimonial--section .testimonial--marque {
        height: 100%;
        top: 50%;
        left: 49%;
        transform: translate(-50%, -50%);
    }

    .testimonial--section .testimonial--marque ul {
        gap: 160px;
    }

    .testimonial--section .testimonial--marque ul li {
        height: 724px;
    }

    .testimonial--section .testimonial--marque ul li h6 {
        font-size: 200px;
        font-weight: 400;
        word-break: keep-all;
        white-space: nowrap;
        rotate: 270deg;
    }

    .testimonial--section.one {
        background-color: var(--body-bg-four);
    }

    .testimonial--section.two .container-fluid {
        padding: 0 75px;
    }

    .testimonial--section.two .section-content--wrap .title {
        font-size: 80px;
        font-weight: 400;
        color: var(--black);
    }

    .testimonial--section.two .testimonial-card--wrap {
        min-height: 566px;
    }

    .testimonial--section.two .testimonial-card--wrap.two {
        right: -571px;
        top: -21px;
    }

    .testimonial--section.two .testimonial-card--wrap.three {
        top: -42px;
    }

    .testimonial--section.two .testimonial-card--wrap.four {
        right: -571px;
        top: -63px;
    }

    .testimonial--section.three {
        background-image: repeating-radial-gradient(circle at 0 0, rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.05) 1px, transparent 1px, transparent 2px);
    }

    .testimonial--section.three .container-fluid {
        padding: 0 75px;
    }

    .testimonial--section.three .swiper-btn--wrap.three::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(0%, -50%);
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .testimonial--section.three .swiper-btn--wrap.three::before {
        content: "";
        position: absolute;
        top: 42%;
        left: 0;
        transform: translate(0%, -50%);
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .testimonial--section.three .section-content--wrap {
        margin-bottom: 90px;
    }

    .testimonial--section.three .section-content--wrap .heading--wrap {
        padding: 4px 24px;
        border-radius: 60px;
        border: 2px solid #D4D4D4;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .testimonial--section.three .section-content--wrap .heading--wrap .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--primary);
        display: inline-block;
    }

    .testimonial--section.three .section-content--wrap .title {
        font-size: 60px;
    }

    .testimonial--section.four .circle {
        width: 609px;
        height: 609px;
        border: 90px solid var(--tertiary);
        border-radius: 50%;
        position: absolute;
        top: -30%;
        left: -18%;
    }

    .testimonial--section.four .bg-img--wrap {
        position: absolute;
        top: 0;
        right: 0;
    }

    .testimonial--section.four .section-content--wrap {
        margin-bottom: 90px;
    }

    .testimonial--section.four .section-content--wrap .line--wrap .line {
        height: 1px;
        width: 40px;
        background-color: var(--secondary);
    }

    .testimonial--section.four .section-content--wrap .title {
        font-size: 60px;
    }

    .testimonial--section.five .container-fluid {
        padding: 0 160px;
    }

    .testimonial--section.five .section-content--wrap {
        margin-bottom: 90px;
    }

    .testimonial--section.five .section-content--wrap .title {
        font-size: 60px;
    }

    .testimonial--section.five .testimonial-card--wrap {
        padding-left: 160px;
    }

    .achievement--section .content--wrap .discription {
        font-size: 70px;
    }

    .achievement--section .content--wrap .discription span {
        margin-right: 100px;
        padding: 6px 25px 4px 25px;
        background-color: #E6E3FF;
        position: relative;
        top: -20px;
    }

    .achievement--section .content--wrap .title {
        font-size: 100px;
        font-weight: 400;
    }

    .achievement--section .achievement--list .achievement {
        padding: 32px 0;
        border: 1px solid var(--white-l-200);
    }

    .achievement--section .achievement--list .achievement:hover .achievement--title {
        color: var(--primary) !important;
    }

    .achievement--section .achievement--list .achievement .achievement--tag {
        padding: 4px 20px;
        border: 1px solid var(--white-l-200);
        border-radius: 50px;
    }

    .achievement--section .achievement--list .achievement .achievement--tag .dot {
        width: 7px;
        height: 7px;
        border-radius: 1px;
        rotate: 45deg;
        background-color: var(--body-bg-one);
    }

    .achievement--section .achievement--wrap .image--wrapper {
        width: 355px;
        height: 452px;
        opacity: 0;
        position: absolute;
        overflow: hidden;
        transform: translate(-50%, -50%);
        top: 0;
        left: 0;
        pointer-events: none;
        z-index: 3;
    }

    .achievement--section .achievement--wrap .image--wrapper .image--slider {
        display: flex;
        flex-direction: column;
    }

    .achievement--section .achievement--wrap .image--wrapper .image--slider img {
        object-fit: cover;
        object-position: center;
    }

    .contact--section.one .title {
        font-size: 200px;
        font-weight: 400;
        line-height: 190px;
    }

    .contact--section.one .heading.two {
        letter-spacing: 0.6em;
    }

    .contact--section.one .contact--btn.one {
        margin-top: 40px;
    }

    .contact--section.one .contact--btn.one svg {
        transition: 0.3s linear;
        margin-left: 4px;
    }

    .contact--section.one .contact--btn.one:hover svg {
        transition: 0.3s linear;
        rotate: 45deg;
    }

    .contact--section.two .title {
        font-size: 200px;
        font-weight: 400;
        left: 75px;
        bottom: -30px;
    }

    .contact--section.two .video--wrap {
        top: 0;
        left: 0;
        z-index: -1;
        height: 100%;
        width: 100%;
    }

    .contact--section.two .video--wrap video {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .text-slide--wrap {
        gap: 45px;
    }

    .text-slide--wrap .text--slide .dash {
        min-width: 110px;
        height: 2px;
        background-color: var(--black);
        display: inline-block;
    }

    .text-slide--wrap .text--slide .slide--title {
        font-size: 200px;
        word-break: keep-all;
        line-height: 180px;
    }

    .text-slide--wrap .text--slide .slide--title.text--stroke {
        text-shadow: 1px 1px 0 rgba(var(--blackish-color-rgb), 0.2), -1px -1px 0 rgba(var(--blackish-color-rgb), 0.2), 1px -1px 0 rgba(var(--blackish-color-rgb), 0.2), -1px 1px 0 rgba(var(--blackish-color-rgb), 0.2), 1px 1px 0 rgba(var(--blackish-color-rgb), 0.2);
        -webkit-text-fill-color: var(--white);
        -webkit-text-stroke-width: 0;
        color: transparent !important;
    }

    .text-slide--wrap .text--slide .slide--title.text--stroke.white {
        text-shadow: 1px 1px 0 var(--white), -1px -1px 0 var(--white), 1px -1px 0 var(--white), -1px 1px 0 var(--white), 1px 1px 0 var(--white);
        -webkit-text-fill-color: var(--black);
        -webkit-text-stroke-width: 0;
        color: transparent !important;
    }

    .footer--section.one {
        background-color: var(--body-bg-one) !important;
    }

    .footer--section.one .bg--shape-one {
        top: -1px;
        left: 0;
    }

    .footer--section.one .bg--shape-two {
        top: -1px;
        right: 0;
    }

    .footer--section.one .content--wrap .description {
        font-size: 70px;
        margin-bottom: 60px;
    }

    .footer--section.one .social-list--wrap {
        gap: 16px;
        margin-bottom: 80px;
    }

    .footer--section.one .social-list--wrap .social--tag {
        padding: 12px 20px;
        border: 1px solid var(--black);
        border-radius: 50px;
        transition: 0.2s linear;
    }

    .footer--section.one .social-list--wrap .social--tag:hover {
        scale: 0.95;
    }

    .footer--section.one .social-list--wrap .social--tag .dot {
        width: 10px;
        height: 10px;
        border-radius: 50%;
        rotate: 45deg;
        background-color: var(--black);
    }

    .footer--section.one .email {
        font-size: 165px;
        font-weight: 400;
    }

    .footer--section.one .footer--bottom {
        border-top: 1px dashed var(--black);
        padding: 30px 0;
        position: relative;
    }

    .footer--section.one .footer--bottom::after {
        content: "";
        position: absolute;
        top: -5px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black);
    }

    .footer--section.two .back-to--top {
        position: absolute;
        top: 25%;
        right: 0;
        rotate: -90deg;
        display: flex;
        gap: 16px;
        cursor: pointer;
    }

    .footer--section.two .back-to--top img {
        rotate: 90deg;
    }

    .footer--section.two .footer-link--wrap {
        border-top: 1px dashed var(--white-l-100);
        position: relative;
    }

    .footer--section.two .footer-link--wrap::after {
        content: "";
        position: absolute;
        top: -4px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--white-l-100);
    }

    .footer--section.two .content--wrap .description {
        font-size: 70px;
        margin-bottom: 60px;
    }

    .footer--section.two .content--wrap .footer--btn {
        width: 180px;
        height: 180px;
        border-radius: 50%;
        transition: 0.3s linear;
    }

    .footer--section.two .content--wrap .footer--btn:hover {
        background-color: transparent !important;
        border: 1px dashed var(--white);
        color: var(--white) !important;
    }

    .footer--section.three {
        padding-bottom: 30px;
    }

    .footer--section.three .back-to--top {
        position: absolute;
        bottom: 30px;
        right: 75px;
        cursor: pointer;
        z-index: 3;
    }

    .footer--section.three .back-to--top img {
        transition: 0.3s linear;
    }

    .footer--section.three .back-to--top:hover img {
        scale: 0.9;
    }

    .footer--section.three .fifth--card {
        border-bottom-right-radius: 60px !important;
    }

    .footer--section.three .fifth--card .corner--shape {
        right: -1px;
        bottom: -1px;
        width: 80px;
        height: 80px;
        background-color: var(--black);
        border-top: 1px solid var(--white-l-200);
        border-left: 1px solid var(--white-l-200);
        border-top-left-radius: 10px;
    }

    .footer--section.three .footer-content--wrap {
        background-color: #111111;
        border: 1px solid var(--white-l-100);
        padding: 60px 35px;
        border-radius: 10px;
    }

    .footer--section.three .footer-content--wrap a:hover {
        color: var(--primary) !important;
    }

    .footer--section.three .footer-item--wrap .footer--item i {
        rotate: -45deg;
        transition: 0.3s linear;
    }

    .footer--section.three .footer--item.d-inline-flex.align-items-center.gap--12 img {
        transition: 0.3s linear;
    }

    .footer--section.three .footer--item.d-inline-flex.align-items-center.gap--12:hover img {
        rotate: 306deg;
    }

    .footer--section.three .footer--item.d-inline-flex.align-items-center.gap--12:hover a {
        color: var(--primary) !important;
    }

    .footer--section.three .footer--item.d-inline-flex.align-items-center.gap--12:hover i {
        rotate: 0deg;
    }

    .footer--section.three .footer--marque ul li h6 {
        font-size: 90px;
        font-weight: 400;
        word-break: keep-all;
        white-space: nowrap;
    }

    .footer--section.four .back-to--top {
        cursor: pointer;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        transition: 0.3s linear;
    }

    .footer--section.four .back-to--top:hover {
        scale: 0.9;
    }

    .footer--section.four .footer--top {
        border-bottom: 1px dashed var(--white-l-100);
    }

    .footer--section.four .container-fluid {
        padding: 0 160px;
    }

    .footer--section.four::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        background-color: rgba(0, 0, 0, 0.3215686275);
    }

    .footer--section.four .title {
        font-size: 60px;
        margin-bottom: 120px;
    }

    .footer--section.four .email {
        margin-bottom: 62px;
    }

    .footer--section.four .social-item--wrap .item {
        border: 1px solid var(--white);
        border-radius: 190px;
        padding: 20px 35px;
    }

    .footer--section.four .social-item--wrap .item .dot {
        width: 18px;
        height: 18px;
        border-radius: 50%;
        background-color: var(--white);
        transition: 0.3s linear;
    }

    .footer--section.four .social-item--wrap .item p {
        transition: 0.3s linear;
    }

    .footer--section.four .social-item--wrap .item:hover .dot {
        background-color: var(--secondary);
    }

    .footer--section.four .social-item--wrap .item:hover p {
        color: var(--secondary) !important;
    }

    .footer--section.four .newsletter--wrap {
        padding-right: 160px;
    }

    .footer--section.four .newsletter--wrap .newsletter-title {
        width: 80%;
        margin-bottom: 35px;
    }

    .footer--section.four .subscribe-form--wrap {
        margin-bottom: 45px;
    }

    .footer--section.four .subscribe-form--wrap input {
        background: rgba(255, 255, 255, 0.04);
        border: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: inset 3px 3px 30px rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(15px);
        border-radius: 90px;
        padding: 17px 35px;
        width: 100%;
    }

    .footer--section.four .subscribe-form--wrap .btn-style--three {
        top: 50%;
        right: -15%;
        transform: translate(-50%, -50%);
        padding: 3px 3px 3px 15px;
    }

    .footer--section.four .subscribe-form--wrap .btn-style--three .btn--circle {
        width: 34px;
        height: 34px;
        transition: 0.3s linear;
    }

    .footer--section.four .footer-menu--wrap {
        padding-left: 160px;
    }

    .footer--section.four .footer--bottom {
        padding: 35px 160px;
    }

    .footer--section.five .back-to--top {
        cursor: pointer;
        top: 120px;
        right: 160px;
        transition: 0.3s linear;
    }

    .footer--section.five .back-to--top:hover {
        scale: 0.9;
    }

    .footer--section.five .footer--top {
        border-bottom: 1px dashed var(--white-l-100);
    }

    .footer--section.five .container-fluid {
        padding: 0 160px;
    }

    .footer--section.five::after {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        background-color: rgba(0, 0, 0, 0.3215686275);
    }

    .footer--section.five .title {
        font-size: 60px;
        margin-bottom: 120px;
    }

    .footer--section.five .newsletter--wrap {
        padding-right: 160px;
    }

    .footer--section.five .newsletter--wrap .newsletter-title {
        width: 80%;
        margin-bottom: 35px;
    }

    .footer--section.five .subscribe-form--wrap {
        margin-bottom: 45px;
    }

    .footer--section.five .subscribe-form--wrap input {
        background: rgba(255, 255, 255, 0.04);
        border: 1px solid rgba(255, 255, 255, 0.1);
        box-shadow: inset 3px 3px 30px rgba(0, 0, 0, 0.45);
        backdrop-filter: blur(15px);
        border-radius: 90px;
        padding: 17px 35px;
        width: 100%;
        color: var(--white) !important;
    }

    .footer--section.five .subscribe-form--wrap input::placeholder {
        color: var(--white-l-700) !important;
    }

    .footer--section.five .subscribe-form--wrap .btn-style--three {
        top: 50%;
        right: -12%;
        transform: translate(-50%, -50%);
        padding: 3px 3px 3px 15px;
    }

    .footer--section.five .subscribe-form--wrap .btn-style--three .btn--circle {
        width: 34px;
        height: 34px;
        transition: 0.3s linear;
    }

    .footer--section.five .footer-menu--wrap {
        padding-left: 160px;
    }

    .footer--section.five .footer--bottom {
        padding: 35px 160px;
    }

    .footer--section.five .footer--item.d-inline-flex.align-items-center.gap--12 img {
        transition: 0.3s linear;
    }

    .footer--section.five .footer--item.d-inline-flex.align-items-center.gap--12:hover img {
        rotate: 306deg;
    }

    .footer--section.five .footer--item.d-inline-flex.align-items-center.gap--12:hover a {
        color: var(--secondary) !important;
    }

    .footer--section.five .social-item--wrap .item img {
        transition: 0.3s linear;
    }

    .footer--section.five .social-item--wrap .item:hover img {
        rotate: 306deg;
    }

    .footer--section.five .social-item--wrap .item:hover a {
        color: var(--secondary) !important;
    }

    .partner--section.one {
        border-bottom: 1px dashed var(--black-l-200);
    }

    .partner--section.one .section-content--wrap {
        margin-bottom: 90px;
    }

    .partner--section.one .section-content--wrap .title {
        top: 0;
        left: 75px;
        font-weight: 600;
    }

    .partner--section.one .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .partner--section.two {
        border-top: 1px dashed var(--black-l-100);
    }

    .partner--section.two .line {
        top: 5px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .partner--section.two .section-content--wrap {
        top: 0;
        left: 50%;
        transform: translate(-50%, -50%);
        border: 1px solid var(--black-l-100);
        padding: 8px 35px;
        border-radius: 90px;
        z-index: 9;
        background: rgba(255, 255, 255, 0.1);
        backdrop-filter: blur(15px);
    }

    .partner--section.three .line {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .partner--section.three .line--two {
        top: 48%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .partner--section.three .section-content--wrap {
        border: 1px solid var(--black-l-100);
        padding: 8px 35px;
        border-radius: 90px;
        z-index: 9;
    }

    .partner--section.five .section-content--wrap {
        padding-top: 30px;
    }

    .partner--section.five .title {
        margin-bottom: 35px;
    }

    .partner--section.five .brand-logo--inner {
        top: 37%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 1504px;
        height: 373px;
        overflow: hidden;
    }

    .partner--section.five .partner-thumb--wrap {
        perspective-origin: 50%;
        transform-origin: 50%;
        flex-flow: column;
        justify-content: center;
        align-items: center;
        width: 1440px;
        height: 1440px;
        display: flex;
        position: absolute;
        top: 20px;
        transform: translate(0rem) rotate(30deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb {
        z-index: 99;
        border-radius: 10px;
        object-position: 50% 50%;
        min-width: 110px;
        max-width: 110px;
        min-height: 110px;
        max-height: 110px;
        position: absolute;
        top: 0%;
        transform: translate(0) rotate(0);
        filter: drop-shadow(5px 10px 15px rgba(5, 0, 21, 0.1));
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.one {
        transform: translate(-43.47rem, 33.35rem) rotate(-75deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.two {
        transform: translate(-38.97rem, 22.5rem) rotate(-60deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.three {
        transform: translate(-31.82rem, 13.18rem) rotate(-45deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.four {
        transform: translate(-22.5rem, 6.03rem) rotate(-30deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.five {
        transform: translate(-11.65rem, 1.53rem) rotate(-15deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.six {
        transform: translate(0) rotate(0);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.seven {
        transform: translate(11.65rem, 1.53rem) rotate(15deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.eight {
        transform: translate(22.5rem, 6.03rem) rotate(30deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.nine {
        transform: translate(31.82rem, 13.18rem) rotate(45deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.ten {
        transform: translate(38.97rem, 22.5rem) rotate(60deg);
    }

    .partner--section.five .partner-thumb--wrap .partner--thumb.eleven {
        transform: translate(43.47rem, 33.35rem) rotate(75deg);
    }

    .featured--section .section-content--wrap {
        height: 1080px;
    }

    .featured--section .section-content--wrap .title {
        font-size: 172px;
        font-weight: 400;
        margin-bottom: 40px;
        word-break: keep-all !important;
        line-height: 0.9;
    }

    .featured--section .section-content--wrap .description .thumb--wrap {
        width: 230px;
        height: 110px;
        border-radius: 10px;
        transition: width 0.1s ease-out;
    }

    .featured--section .section-content--wrap .description p {
        word-break: keep-all;
    }

    .featured--section .section-content--wrap .brc--wrap {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 1760px;
    }

    .featured--section .section-content--wrap .l-brc {
        font-size: 226px;
        font-weight: 400;
    }

    .featured--section .section-content--wrap .r-brc {
        font-size: 226px;
        font-weight: 400;
    }

    .video--section .bg-thumb--wrap {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

    .video--section .title {
        top: 75px;
        left: 75px;
        width: 470px;
        text-decoration: underline;
    }

    .video--section .btn--base {
        right: 75px;
        bottom: 75px;
        padding: 18px 35px;
    }

    .video--section .video--btn {
        background-color: var(--white);
        width: 220px;
        height: 220px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .video--section .video--btn img {
        width: 156px;
        height: 156px;
    }

    .video--section.four .video--wrap {
        width: 100%;
        height: 900px;
    }

    .counter--section .section-content--wrap .title {
        margin-bottom: 60px;
    }

    .counter--section.one .counter--line {
        height: 100%;
        border-left: 1px dashed var(--black);
        top: 0;
        left: 16px;
    }

    .counter--section.one .counter--line.two {
        left: 10px;
    }

    .counter--section.one .counter--line.three {
        left: 49.5%;
    }

    .counter--section.one .counter--line.four {
        left: 50%;
    }

    .counter--section.four .top--arrow {
        bottom: -24px;
        left: 50%;
        transform: translate(-50%, 0%);
        transition: 0.3s linear;
        z-index: 3;
    }

    .counter--section.four .top--arrow:hover {
        scale: 0.95;
    }

    .counter--section.five .container-fluid {
        padding: 0 160px;
    }

    .counter--section .counter-card--wrap .col-lg-6:nth-child(7) .counter--card {
        border-bottom: 0;
    }

    .counter--section .counter-card--wrap .col-lg-6:nth-child(7) .counter--card::after {
        content: none;
    }

    .counter--section .counter-card--wrap .col-lg-6:nth-child(8) .counter--card {
        border-bottom: 0;
    }

    .counter--section .counter-card--wrap .col-lg-6:nth-child(8) .counter--card::after {
        content: none;
    }

    .blog--section.one .section-content--wrap {
        border-bottom: 1px dashed var(--black-l-200);
        padding-bottom: 40px;
    }

    .blog--section.one .section-content--wrap .title {
        top: 0;
        left: 75px;
    }

    .blog--section.one .section-content--wrap .title .dot {
        background-color: var(--primary);
        width: 10px;
        height: 10px;
    }

    .blog--section.three .heading--wrap {
        padding: 4px 24px;
        border-radius: 60px;
        border: 2px solid #D4D4D4;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .blog--section.three .heading--wrap .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--primary);
        display: inline-block;
    }

    .blog--section.three .blog-all-card--wrap {
        padding: 35px 0 120px 0;
        border-bottom: 1px dashed var(--black-l-100);
        border-top: 1px dashed var(--black-l-100);
        position: relative;
    }

    .blog--section.three .blog-all-card--wrap::after {
        content: "";
        position: absolute;
        top: -4px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .blog--section.three .blog-all-card--wrap::before {
        content: "";
        position: absolute;
        bottom: -4px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(1) {
        position: relative;
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(1)::after {
        content: "";
        position: absolute;
        top: -35px;
        right: 4px;
        border-right: 1px dashed var(--black-l-100);
        height: 100%;
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(1)::before {
        content: "";
        position: absolute;
        top: -35px;
        right: 0px;
        border-right: 1px dashed var(--black-l-100);
        height: 100%;
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(2) {
        position: relative;
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(2)::after {
        content: "";
        position: absolute;
        top: -35px;
        right: 4px;
        height: 100%;
        border-right: 1px dashed var(--black-l-100);
    }

    .blog--section.three .col-xl-4.col-lg-6:nth-child(2)::before {
        content: "";
        position: absolute;
        top: -35px;
        right: 0px;
        border-right: 1px dashed var(--black-l-100);
        height: 100%;
    }

    .blog--section.four .container-fluid {
        padding: 0 160px;
    }

    .blog--section.four .container-fluid .section-content--wrap {
        margin-bottom: 90px;
        padding-bottom: 30px;
        border-bottom: 1px dashed var(--black-l-200);
        position: relative;
    }

    .blog--section.four .container-fluid .section-content--wrap::after {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 100%;
        border-bottom: 1px dashed var(--black-l-200);
    }

    .blog--section.four .container-fluid .section-content--wrap .title {
        font-size: 160px;
    }

    .blog--section.five .container-fluid {
        padding: 0 160px;
    }

    .blog--section.five .container-fluid .section-content--wrap .title {
        font-size: 60px;
        margin-bottom: 70px;
    }

    .blog-tag--wrap {
        margin-bottom: 25px;
    }

    .blog-tag--wrap li a {
        padding: 3px 18px;
        border: 1px solid var(--black-l-100);
        border-radius: 90px;
        gap: 8px;
    }

    .blog-tag--wrap li a i {
        font-size: 6px;
    }

    .blog-author--wrap {
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
        border-radius: 90px;
        padding: 6px 34px 6px 6px;
    }

    .blog-author--wrap .thumb {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        overflow: hidden;
    }

    .why-choose--section .section-content--wrap {
        margin-bottom: 90px;
    }

    .why-choose--section .section-content--wrap .heading--wrap {
        padding: 4px 24px;
        border-radius: 60px;
        border: 2px solid #D4D4D4;
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 25px;
        font-weight: 600;
    }

    .why-choose--section .section-content--wrap .heading--wrap .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--primary);
        display: inline-block;
    }

    .why-choose--section .section-content--wrap .title {
        font-size: 60px;
    }

    .why-choose--section .thumb--wrap.xl {
        width: 57%;
        height: 748px;
    }

    .why-choose--section .thumb--wrap.xl .video--btn {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 149px;
        height: 149px;
        background-color: var(--white-l-400);
        backdrop-filter: blur(6px);
    }

    .why-choose--section .thumb--wrap.xl .video--btn i {
        font-size: 40px;
        color: var(--white);
    }

    .why-choose--section .whychoose-content--wrap {
        width: 20%;
        height: 100%;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.one {
        height: 465px;
        padding: 30px 32px;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.one .thumb--wrap.one .image--one {
        width: 200px;
        height: 314px;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.one .thumb--wrap.one .image--four {
        width: 240px;
        height: 240px;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.two {
        width: 510px;
        height: 272px;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.two .content--wrap {
        padding: 32px;
    }

    .why-choose--section .whychoose-content--wrap .whychoose-content.two.right {
        left: -168px;
    }

    .why-choose--section.four .bg-thumb--wrap {
        width: 100%;
        height: 100%;
        top: 0;
        left: 0;
    }

    .why-choose--section.four .bg-thumb--wrap img {
        -webkit-mask-image: url("../images/common/mask5.png");
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: cover;
        mask-image: url("../images/common/mask5.png");
        mask-repeat: no-repeat;
        mask-size: cover;
        mask-position: center;
    }

    .why-choose--section.four .wc-content--wrap {
        width: 50%;
        height: 100%;
        padding: 130px 90px;
    }

    .why-choose--section.four .wc-content--wrap .circle {
        width: 302px;
        height: 302px;
        border: 90px solid var(--secondary);
        border-radius: 50%;
        position: absolute;
        top: -15%;
        right: -15%;
    }

    .why-choose--section.four .wc-content--wrap .circle--two {
        width: 44px;
        height: 44px;
        border: 10px solid var(--tertiary);
        border-radius: 50%;
        position: absolute;
        bottom: 66px;
        right: 58px;
    }

    .why-choose--section.four .wc-content--wrap .section--content {
        margin-bottom: 30px;
    }

    .why-choose--section.four .wc-content--wrap .section--content .line--wrap .line {
        height: 1px;
        width: 40px;
        background-color: var(--secondary);
    }

    .why-choose--section.four .wc-content--wrap .wc--content .title {
        font-size: 60px;
        margin-bottom: 35px;
    }

    .why-choose--section.four .wc-content--wrap .wc--content .description {
        color: var(--white-l-600);
    }

    .why-choose--section.four .wc-content--wrap .wc-data--wrap {
        gap: 110px;
    }

    .why-choose--section.four .wc-content--wrap .wc--data {
        width: 266px;
    }

    .why-choose--section.four .wc-content--wrap .wc--data .thumb--wrap {
        width: 70px;
        height: 70px;
        margin-bottom: 20px;
    }

    .why-choose--section.four .wc-content--wrap .wc--data .description {
        color: var(--white-l-600);
    }

    .why-choose--section.five .content--wrap {
        padding: 120px;
        display: flex;
        flex-direction: column;
        gap: 35px;
    }

    .why-choose--section.five .content--wrap .heading {
        padding: 3px 20px;
        border: 1px solid var(--black-l-100);
        border-radius: 4px;
        font-size: 16px;
        margin-bottom: 25px;
        display: inline-block;
        position: relative;
    }

    .why-choose--section.five .content--wrap .heading::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 10px;
        transform: translate(-50%, -50%);
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background-color: var(--primary);
    }

    .why-choose--section.five .content--wrap .title {
        margin-bottom: 35px;
    }

    .work--section.one .section-content--wrap {
        margin-bottom: 90px;
    }

    .work--section.one .section-content--wrap .heading--wrap {
        padding: 4px 24px;
        border-radius: 60px;
        border: 2px solid #D4D4D4;
        display: flex;
        align-items: center;
        gap: 10px;
        margin-bottom: 25px;
        font-weight: 600;
    }

    .work--section.one .section-content--wrap .heading--wrap .dot {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--primary);
        display: inline-block;
    }

    .work--section.one .section-content--wrap .title {
        font-size: 60px;
    }

    .work--section.four .section-content--wrap {
        margin-bottom: 90px;
        padding-bottom: 30px;
        border-bottom: 1px dashed var(--black-l-200);
        position: relative;
    }

    .work--section.four .section-content--wrap::after {
        content: "";
        position: absolute;
        bottom: -5px;
        left: 0;
        width: 100%;
        border-bottom: 1px dashed var(--black-l-200);
    }

    .work--section.four .section-content--wrap .title {
        font-size: 160px;
    }

    .work--section.five .section-content--wrap {
        margin-bottom: 200px;
    }

    .work--section.five .work-circle--wrap {
        z-index: 0;
        background-color: var(--white);
        justify-content: center;
        align-items: center;
        height: 100vh;
        display: flex;
        position: sticky;
        overflow: clip;
    }

    .work--section.five .work-circle--wrap .circle {
        z-index: 1;
        background-color: var(--black);
        border-radius: 100%;
        width: 10px;
        height: 10px;
        position: absolute;
    }

    .work--section.five .container-fluid {
        padding: 0 160px;
    }

    .cta--section.one .section-content--wrap .form--wrap {
        background-color: var(--white-l-100);
        padding: 30px 40px;
        border-radius: 16px;
    }

    .cta--section.one .section-content--wrap .form--wrap input {
        color: var(--white);
    }

    .cta--section.one .section-content--wrap .form--wrap input::placeholder {
        color: var(--white) !important;
    }

    .cta--section.one .section-content--wrap .form--wrap .input--wrap {
        border-bottom: 1px solid var(--white-l-200);
        padding-bottom: 10px;
    }

    .cta--section.one .cta--thumb {
        width: 316px;
        height: 356px;
        border-radius: 10px;
    }

    .cta--section.one .cta-slider--wrap {
        top: 0;
        /*right: 40%;*/
        right: 0%;
        /*rotate: 32deg;*/
    }

    .cta--section.two .container-fluid {
        padding: 0 160px;
    }

    .cta--section.two .cta--inner {
        border-radius: 25px;
        padding-left: 70px;
    }

    .cta--section.two .cta--inner .cta-thumb {
        bottom: 0;
        right: 0;
    }

    .cta--section.two .cta--inner .cta-element--one {
        top: 20%;
        right: 0;
    }

    .cta--section.two .cta--inner .cta-element--two {
        bottom: 0;
        right: 30%;
    }

    .cta--section.two .section-content--wrap .title {
        font-size: 60px;
        margin-bottom: 35px;
    }

    .cta--section.two .section-content--wrap .description {
        margin-bottom: 45px;
    }

    .login-section {
        z-index: 1;
        padding: 100px 0px;
        position: relative;
    }

    .login-section .bg--thumb-one {
        top: 0;
        left: 0;
        opacity: 0.3;
    }

    .login-section .bg--thumb-two {
        bottom: 0;
        right: 0;
        opacity: 0.3;
    }

    .sign-up_box {
        padding: 20px 0px;
        border-radius: 4px;
    }

    .sign-up_box .title {
        margin-bottom: 40px;
    }

    .sign-up_box .input-group {
        display: flex;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .sign-up_box .input-group .input-group-text {
        border-radius: 4px;
        border: 1px solid hsl(var(--base)/0.5);
        background: var(--primary);
        color: hsl(var(--white));
    }

    .sign-up_box .login-meta {
        display: flex;
        justify-content: space-between;
        font-size: 14px;
    }

    .sign-up_box .login-meta p {
        font-size: 14px;
    }

    .login-box {
        border-radius: 16px;
        padding: 72px 86px 40px 86px;
        transition: all 0.4s ease-in-out;
        position: relative;
        height: 100%;
        border: 1px solid transparent;
        background-color: hsl(var(--white));
        z-index: 1;
    }

    .login-box .home--btn {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 60px;
        height: 60px;
        background-color: hsl(var(--white)/0.1);
        border-radius: 50%;
        border: 1px solid hsl(var(--white)/0.1);
        display: none;
        color: var(--primary);
    }

    .login-box .icon-wrap {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 24px;
    }

    .login-box .icon-wrap .icon {
        width: 84px;
        height: 84px;
        border-radius: 50%;
        background-color: var(--primary);
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .login-box .icon-wrap .icon i {
        font-size: 50px;
        color: hsl(var(--white));
    }

    .login-box .logo--wrap {
        margin-bottom: 24px;
    }

    .login-box .title {
        font-size: 30px;
        font-weight: 700;
        line-height: 1.3;
        text-align: center;
    }

    .login-box .condition-text {
        margin-left: 8px;
    }

    .login-box .condition-text a {
        color: var(--primary);
    }

    .login-box .condition-text p {
        font-size: 16px;
    }

    .login-box .condition-text p a {
        color: var(--primary) !important;
    }

    .login-box .req--box {
        height: 123px;
    }

    .login-box .form--wrap {
        padding: 0px 14px 50px 14px;
    }

    .login-box--wrap {
        position: absolute;
        top: 164px;
        width: 100%;
        height: 73vh;
        overflow: hidden;
    }

    .login-box--wrap .close--btn {
        width: 60px;
        height: 60px;
        border-radius: 50%;
        color: hsl(var(--black));
        font-size: 18px;
        background: hsl(var(--black)/0.09);
        position: absolute;
        left: 50%;
        transform: translate(-50%, -50%);
        display: block;
    }

    .login-box--wrap .close--btn .wrap {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

    .login-thumb--wrap {
        position: relative;
    }

    .login-thumb--wrap::after {
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        background-color: hsl(var(--base)/0.5);
        z-index: 1;
        width: 100%;
        height: 100%;
    }

    .login-thumb--wrap img {
        width: 100%;
    }

    .login-container {
        padding: 0px !important;
        margin: 0px !important;
    }

    .login-left-section {
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        position: relative;
        background: var(--primary);
    }

    .login-left-section::after {
        content: "";
        position: absolute;
        top: 0px;
        left: 0px;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.72);
    }

    .login-left-section .content-wrap {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        position: absolute;
        top: 50%;
        left: 50%;
        -ms-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%);
        z-index: 9;
        width: 80%;
    }

    .login-left-section .content-wrap .title {
        line-height: 70px;
    }

    .login-img--card {
        width: 100%;
        height: 341.348px;
    }

    @media (max-width: 769px) {
        .signup-section .signup-thumb {
            display: none !important;
        }
    }

    .social-option .text::after {
        content: "";
        position: absolute;
        top: 15px;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 400px;
        height: 1px;
        border: 1px dashed hsl(var(--base)/0.5);
        z-index: -1;
    }

    .social-option .text h6 {
        padding: 4px 8px;
    }

    .social-option ul li {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        border: 1px solid hsl(var(--base)/0.5);
        transition: 0.3s linear;
    }

    .social-option ul li:hover {
        background-color: hsl(var(--base)/0.1);
    }

    .growth--section.one {
        padding: 130px 0;
    }

    .growth--section.one .section-content--wrap {
        padding: 246px 0;
    }

    .growth--section.one .section-content--wrap .title {
        font-size: 110px;
        margin-bottom: 45px;
    }

    .growth--section.one .growth-thumb--wrap {
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .growth--section.one .growth-thumb--wrap .thumb {
        width: 320px;
        height: 340px;
        border-radius: 5px;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
    }

    .solutions--section .container--fluid {
        padding: 0 160px;
    }

    .solutions--section .section--content {
        margin-bottom: 70px;
    }

    .solutions--section .section-thumb--wrap {
        width: 100%;
        height: 800px;
        border-radius: 25px;
    }

    .price--section.one .container-fluid {
        padding: 0 160px;
    }

    .price--section.one .container-fluid .section-content--wrap .title {
        font-size: 60px;
        margin-bottom: 70px;
    }

    .faq--section.one .container-fluid {
        padding: 0 160px;
    }

    .faq--section.one .section-content--wrap {
        margin-bottom: 70px;
    }

    .faq--section.one .section-content--wrap .title {
        font-size: 60px;
    }

    .faq--section.one .section-element--wrap {
        gap: 80px;
    }

    .faq--section.one .section-element--wrap .element {
        width: 160px;
        background-color: var(--card-bg-four);
        border: 1px solid var(--white);
        padding: 44px 43px;
        box-shadow: 23px 27px 40px rgba(16, 23, 0, 0.08);
        border-radius: 191px;
        height: fit-content;
    }

    .faq--section.one .section-element--wrap .element .icon--wrap {
        width: 80px;
        height: 80px;
        margin-bottom: 15px;
    }

    .faq--section.one .section-element--wrap .element.two {
        margin-top: 90px;
    }

    /* ====================== Breadcrumb Css Start ==================== */
    .breadcrumb {
        margin-bottom: 0;
        padding-top: 230px;
        padding-bottom: 120px;
    }

    .breadcrumb.two {
        padding-bottom: 60px;
    }

    .breadcrumb.two::after {
        content: none;
    }

    .breadcrumb.two .breadcrumb-text--wrap {
        padding: 0;
    }

    .breadcrumb.two .breadcrumb--list {
        margin-bottom: 20px;
    }

    .breadcrumb.three::after {
        content: none;
    }

    .breadcrumb.five {
        padding-bottom: 0px;
    }

    .breadcrumb--list {
        border: 1px solid var(--black-l-100);
        padding: 6px 20px;
        border-radius: 6px;
        gap: 16px;
    }

    .breadcrumb--icon {
        font-size: 8px;
        color: var(--primary);
    }

    .breadcrumb .breadcrumb-text--wrap {
        padding-bottom: 70px;
    }

    .breadcrumb .breadcrumb--text {
        font-size: 72px;
    }

    .breadcrumb .breadcrumb--title {
        font-weight: 400;
        font-size: 365px;
        line-height: 1;
        text-align: center;
    }

    .breadcrumb .breadcrumb-title--wrap {
        border-top: 1px dashed var(--black-l-100);
    }

    .breadcrumb .breadcrumb--thumb {
        width: 100%;
        height: 850px;
    }

    .breadcrumb .breadcrumb--thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* ====================== Breadcrumb Css End ==================== */
    .team--section.one .content--wrap .discription {
        font-size: 70px;
    }

    .team--section.one .team--list .team {
        padding: 32px 0;
        border: 1px dashed var(--black-l-200);
    }

    .team--section.one .team--list .team:hover .achievement--title {
        color: var(--primary) !important;
    }

    .team--section.one .team--list .team .team--tag {
        padding: 4px 20px;
        border: 1px solid var(--white-l-200);
        border-radius: 50px;
    }

    .team--section.one .team--wrap .team--wrapper {
        width: 440px;
        height: 550px;
        opacity: 0;
        position: absolute;
        overflow: hidden;
        transform: translate(-50%, -50%);
        top: 0;
        left: 0;
        pointer-events: none;
        z-index: 3;
    }

    .team--section.one .team--wrap .team--wrapper .team--slider {
        display: flex;
        flex-direction: column;
    }

    .team--section.one .team--wrap .team--wrapper .team--slider img {
        width: 440px;
        height: 550px;
        object-fit: cover;
        object-position: center;
    }

    .price-plan--section.one .content--wrap .discription {
        font-size: 70px;
    }

    .join-us--section::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .join-us--section::after {
        content: "";
        position: absolute;
        top: 4px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .join-us--section .discription {
        font-size: 70px;
    }

    .join-us--section .discription a {
        text-decoration: underline;
        color: var(--primary);
    }

    .join-us--section .discription a:hover {
        color: var(--tertiary);
    }

    .service--details .service-meta--wrap {
        padding: 30px 0;
        border-top: 1px dashed var(--black-l-100);
        border-bottom: 1px dashed var(--black-l-100);
    }

    .service--details .description {
        color: #555555;
        font-weight: 400;
        font-size: 18px;
        line-height: 28px;
    }

    .service--details .title {
        font-size: 30px;
        font-family: "Funnel Display";
        font-weight: 600;
        line-height: 40px;
    }

    .service--details h6 {
        font-family: "Funnel Display";
        font-weight: 600;
    }

    .service--details .point {
        position: relative;
        padding-left: 25px;
    }

    .service--details .point::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(-50%, -50%);
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .service--details .section--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 60px;
    }

    .service--details .service--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 90px;
    }

    .blog--details .description {
        color: #555555;
        font-weight: 400;
        font-size: 18px;
        line-height: 28px;
    }

    .blog--details .title {
        font-size: 30px;
        font-family: "Funnel Display";
        font-weight: 600;
        line-height: 40px;
    }

    .blog--details h6 {
        font-family: "Funnel Display";
        font-weight: 600;
    }

    .blog--details .point {
        position: relative;
        padding-left: 25px;
    }

    .blog--details .point::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(-50%, -50%);
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .blog--details .section--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 60px;
    }

    .blog--details .service--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 90px;
    }

    .blog--details .blockquote--wrap {
        margin-bottom: 70px;
        padding-left: 35px;
        border-left: 1px dashed var(--black);
        position: relative;
    }

    .blog--details .blockquote--wrap::after {
        content: "";
        position: absolute;
        top: 0;
        left: 2px;
        height: 100%;
        border-left: 1px dashed var(--black);
    }

    .blog--details .blockquote--wrap .thumb--wrap {
        margin-bottom: 30px;
    }

    .blog--details .blockquote--wrap blockquote {
        font-family: "Funnel Display";
        font-weight: 500;
        font-size: 24px;
        line-height: 34px;
    }

    .blog--details .share--option {
        padding: 30px 0;
        border-top: 1px solid var(--black-l-100);
        border-bottom: 1px solid var(--black-l-100);
    }

    .blog--details .blog--tag a {
        font-weight: 500;
        font-size: 15px;
        line-height: 26px;
        padding: 3px 20px;
        border-radius: 90px;
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
    }

    .blog--details .blog--tag a:hover {
        background-color: var(--primary);
        color: var(--white);
    }

    .blog--details .social--list a {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        background-color: var(--white);
        border: 1px solid var(--black-l-100);
    }

    .blog--details .social--list a i {
        font-size: 14px;
    }

    .blog--details .social--list a:hover {
        background-color: var(--primary);
    }

    .blog--details .social--list a:hover i {
        color: var(--white);
    }

    .portfolio--details .description {
        color: #555555;
        font-weight: 400;
        font-size: 18px;
        line-height: 28px;
    }

    .portfolio--details .portfolio-meta--wrap {
        border-top: 1px dashed var(--black-l-100);
        padding-top: 25px;
        position: relative;
    }

    .portfolio--details .portfolio-meta--wrap::after {
        content: "";
        position: absolute;
        top: -4px;
        left: 0;
        width: 100%;
        border-top: 1px dashed var(--black-l-100);
    }

    .portfolio--details .title {
        font-size: 30px;
        font-family: "Funnel Display";
        font-weight: 600;
        line-height: 40px;
    }

    .portfolio--details h6 {
        font-family: "Funnel Display";
        font-weight: 600;
    }

    .portfolio--details .point {
        position: relative;
        padding-left: 25px;
    }

    .portfolio--details .point::after {
        content: "";
        position: absolute;
        top: 50%;
        left: 0;
        transform: translate(-50%, -50%);
        width: 10px;
        height: 10px;
        border-radius: 50%;
        background-color: var(--black);
    }

    .portfolio--details .section--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 60px;
    }

    .portfolio--details .thumb--wrap {
        width: 100%;
        height: 950px;
    }

    .portfolio--details .service--thumb {
        width: 100%;
        height: 950px;
        margin-bottom: 90px;
    }

    .portfolio--details .border--wrap {
        margin-bottom: 60px;
    }

    .portfolio--details .border--wrap .border {
        border-bottom: 1px dashed var(--black-l-100) !important;
    }

    .portfolio--details .border--wrap .border.one {
        margin-bottom: 3px;
    }

    .blog-sidebar-wrapper {
        position: sticky;
        top: 120px;
    }

    .blog-sidebar {
        margin-bottom: 30px;
    }

    .blog-sidebar:last-of-type {
        margin-bottom: 0;
    }

    @media screen and (max-width: 575px) {
        .blog-sidebar {
            padding: 20px 15px;
        }
    }

    .blog-sidebar--title {
        margin-bottom: 40px;
    }

    .blog-sidebar .categorie--list li a .title:hover {
        text-decoration: underline;
    }

    .blog-sidebar .tag--list li a {
        padding: 4px 16px;
        background-color: var(--black-l-100);
        border-radius: 50px;
    }

    .blog-sidebar .tag--list li a:hover {
        background-color: var(--black);
        color: var(--white);
    }

    .latest-blog {
        padding-bottom: 20px;
        margin-bottom: 20px;
        border-bottom: 1px solid var(--black-l-100);
    }

    .latest-blog:last-of-type {
        padding-bottom: 0px;
        margin-bottom: 0px;
        border-bottom: 0;
    }

    .latest-blog--thumb {
        width: 80px;
        max-height: 80px;
        display: flex;
        border-radius: 5px;
        overflow: hidden;
    }

    @media screen and (max-width: 424px) {
        .latest-blog--thumb {
            width: 60px;
        }
    }

    .latest-blog--thumb a {
        display: block;
        height: 100%;
        width: 100%;
    }

    .latest-blog--thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        border-radius: 5px;
    }

    .latest-blog--content {
        width: calc(100% - 80px);
        padding-left: 15px;
    }

    @media screen and (max-width: 424px) {
        .latest-blog--content {
            width: calc(100% - 60px);
        }
    }

    .latest-blog--title {
        margin-bottom: 5px;
        transition: 0.3s linear;
    }

    .latest-blog--title:hover {
        color: var(--tertiary);
        text-decoration: underline;
    }

    .dashboard {
        background: var(--body-bg);
        height: 100%;
        min-height: 100vh;
    }

    .dashboard_profile_wrap .profile_photo:hover::before {
        visibility: visible;
        opacity: 0.7;
    }

    .dashboard_profile_wrap .profile_photo:hover .photo_upload i {
        visibility: visible;
        opacity: 1;
    }

    .dashboard_profile__details ul li a {
        display: block;
        font-size: 17px;
        transition: all 0.3s ease-in-out;
    }

    .dashboard_profile__details ul li a i {
        margin-right: 10px;
    }

    .dashboard_profile__details ul li a:hover {
        color: hsl(var(--black));
    }

    .dashboard_profile__details ul li a.active {
        color: var(--primary);
    }

    .dashboard-body {
        position: relative;
    }

    .dashboard-body__bar {
        display: none;
    }

    @media screen and (max-width: 1199px) {
        .dashboard-body__bar {
            display: block;
        }
    }

    .dashboard-body__bar-icon {
        color: hsl(var(--white));
        font-size: 25px;
        margin-bottom: 10px;
        cursor: pointer;
        width: 50px;
        height: 40px;
        background-color: var(--primary);
        text-align: center;
        padding: 2px 8px;
        border-radius: 3px;
    }

    .dashboard-header {
        padding: 30px;
        border-radius: 0px;
        background-color: var(--card-bg);
        border-top: 1px solid var(--border-color);
        border-bottom: 1px solid var(--border-color);
    }

    .dashboard-header .user-thumb {
        width: 37px;
        height: 37px;
        border-radius: 50%;
        overflow: hidden;
    }

    .dashboard-header .user-thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .dashboard-header .user--name i {
        color: var(--primary);
        font-size: 18px;
    }

    .dashboard-header .user--name i:hover {
        color: var(--primary);
    }

    .dashboard-header .user-info--wrap .dropdown-menu {
        padding: 0;
        background: hsl(var(--white));
        border: 1px solid hsl(var(--black)/0.8);
        border-radius: 16px !important;
        overflow: hidden;
    }

    .dashboard-header .user-info--wrap .dropdown-menu .dropdown-item {
        padding: 8px 12px;
        border-bottom: 1px solid hsl(var(--black)/0.2);
    }

    .dashboard-header .user-info--wrap .dropdown-menu .dropdown-item:hover {
        color: hsl(var(--white));
        background-color: var(--primary);
    }

    .dashboard-header .dropdown-toggle::after {
        display: none;
    }

    .dashboard-container-wrap {
        margin-left: 300px;
    }

    .error--page {
        padding: 180px 0 0 0;
    }

    .error--page .thumb--wrap {
        margin-bottom: 35px;
    }

    .error--page .content .title {
        font-size: 72px;
        font-weight: 700;
    }

    .error--page .content .description {
        font-size: 20px;
        width: 70%;
    }

    .error--page .slide--wrap {
        background: var(--black);
        padding: 35px 0;
    }

    .error--page .slide--wrap .dot {
        width: 15px;
        height: 15px;
        border-radius: 50%;
        background-color: var(--white);
    }

    .error--page .slide--wrap ul li h6 {
        font-size: 62px;
        color: var(--white);
    }

    @media (max-width: 1896px) {
        .hero-section.four .banner--title {
            font-size: 100px;
        }

        .hero-section.one .banner--title {
            font-size: 367px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 364px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 367px;
        }

        .service--section.one .content--wrap .title {
            font-size: 367px;
        }

        .service--section.one .content--wrap .title {
            font-size: 367px;
        }

        .service--card.two .content--wrap .number {
            font-size: 80px;
        }

        .service--card.two .content--wrap .title {
            font-size: 25px;
        }

        .testimonial--section.two .section-content--wrap .title {
            font-size: 80px;
        }

        .breadcrumb::after {
            content: none;
        }
    }

    @media (max-width: 1882px) {
        .hero-section.one .banner--title {
            font-size: 360px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 360px;
        }

        .service--section.one .content--wrap .title {
            font-size: 360px;
        }

        .service--section.one .content--wrap .title {
            font-size: 360px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 357px;
        }

        .service--section.one .service-list--wrap .service--list .service .title {
            font-size: 80px;
        }

        .service--section.one .service-list--wrap .service--list .service .number {
            font-size: 80px;
        }
    }

    @media (max-width: 1849px) {
        .hero-section.one .banner--title {
            font-size: 350px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 350px;
        }

        .service--section.one .content--wrap .title {
            font-size: 350px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 347px;
        }

        .hero-section.four .hero-element3 {
            width: 300px;
        }

        .hero-section.four .hero-element3 svg {
            width: 100%;
        }
    }

    @media (max-width: 1799px) {
        .hero-section.five .title {
            font-size: 40px;
            text-align: center;
        }

        .counter--card.five {
            padding: 32px;
        }

        .counter--card.five .number {
            font-size: 68px;
        }

        .blog--card.five .tag--wrap .tag {
            padding: 2px 14px;
            font-size: 12px;
        }

        .hero-section.five .hero--marque .thumb--wrap {
            width: 580px;
            height: 441px;
        }

        .hero-section.one .banner--title {
            font-size: 340px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 340px;
        }

        .service--section.one .content--wrap .title {
            font-size: 340px;
        }

        .service--section.one .content--wrap .title {
            font-size: 340px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 337px;
        }

        .about--section.one .about-element.one .thumb--wrap {
            width: 180px;
        }

        .about--section.one .about-element.two .thumb--wrap {
            width: 180px;
        }

        .about--section.one .about-element.three .thumb--wrap {
            width: 180px;
        }

        .about--section.one .about-element.four .thumb--wrap {
            width: 180px;
        }

        .about--section.one .about-element.five .thumb--wrap {
            width: 180px;
        }

        .about--section.one .about-element.six .thumb--wrap {
            width: 180px;
        }

        .hero-section.two .element--wrap .video--wrap {
            width: 600px;
        }

        .hero-section.four .video--wrap {
            width: 470px;
            height: 290px;
        }
    }

    @media (max-width: 1755px) {
        .hero-section.one .banner--title {
            font-size: 330px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 330px;
        }

        .service--section.one .content--wrap .title {
            font-size: 330px;
        }

        .service--section.one .content--wrap .title {
            font-size: 330px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 327px;
        }
    }

    @media (max-width: 1707px) {
        .hero-section.one .banner--title {
            font-size: 320px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 320px;
        }

        .service--section.one .content--wrap .title {
            font-size: 320px;
        }

        .service--section.one .content--wrap .title {
            font-size: 320px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 317px;
        }

        .hero-section.two .banner--title {
            font-size: 150px;
        }

        .hero-section.two .hero-sm--text {
            width: 408px;
            text-indent: 150px;
            font-size: 16px !important;
        }

        .featured--section .section-content--wrap .brc--wrap {
            width: 1440px;
        }

        .service--details .service-meta--wrap a {
            font-size: 18px !important;
        }

        .details--btn {
            padding: 12px 30px;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            right: -485px;
            top: -1px;
        }

        .testimonial--section.two .testimonial-card--wrap.four {
            right: -536px;
            top: -1px;
        }

        .hero-section.two .element--wrap .video--wrap {
            width: 510px;
            height: 340px;
        }

        .hero-section.two .element--wrap .counter--wrap {
            gap: 64px;
        }

        .hero-section.three .banner--title {
            font-size: 140px;
        }

        .hero-section.four .banner--title {
            font-size: 80px;
        }

        .hero-section.four .hero-sm--text {
            line-height: 30px;
            width: 403px;
            font-size: 16px !important;
        }

        .footer--section.four .social-item--wrap .item {
            padding: 10px 20px;
        }
    }

    @media (max-width: 1660px) {
        .hero-section.one .banner--title {
            font-size: 110px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 110px;
        }

        .service--section.one .content--wrap .title {
            font-size: 110px;
        }

        .achievement--section .content--wrap .title {
            font-size: 110px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 107px;
        }

        .about--section.one .section--text {
            font-size: 154px;
        }

        .about--section.one .title .thumb--wrap {
            height: 110px;
            margin: 31px 32px 0 32px;
        }

        .about--section.one .about-element.three {
            bottom: -44%;
        }
    }

    @media (max-width: 1613px) {
        .hero-section.one .banner--title {
            font-size: 100px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 100px;
        }

        .service--section.one .content--wrap .title {
            font-size: 100px;
        }

        .achievement--section .content--wrap .title {
            font-size: 100px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 197px;
        }

        .service--section.one .service-list--wrap .service--list .service .title {
            font-size: 70px;
        }

        .service--section.one .service-list--wrap .service--list .service .number {
            font-size: 70px;
        }

        .hero-section.two .element--wrap {
            padding-top: 128px;
        }

        .hero-section.two .element--wrap .counter--wrap .counter .number {
            font-size: 75px !important;
        }

        .hero-section.five .hero--marque .thumb--wrap {
            width: 540px;
            height: 441px;
        }

        .about--section.five .section--content h2 {
            font-size: 46px !important;
        }

        .solutions--section.one .section--content h2 {
            font-size: 46px !important;
        }

        .partner--section.five .title {
            font-size: 46px !important;
        }

        .work-section--wrap.bg--black .section-content--wrap h2 {
            font-size: 46px !important;
        }

        .testimonial--section.five .section-content--wrap .title {
            font-size: 46px !important;
        }

        .price--section.one .container-fluid .section-content--wrap .title {
            font-size: 46px !important;
        }

        .faq--section.one .section-content--wrap .title {
            font-size: 46px !important;
        }

        .cta--section.two .section-content--wrap .title {
            font-size: 46px !important;
        }

        .blog--section.five .container-fluid .section-content--wrap .title {
            font-size: 46px !important;
        }

        .blog--card.five .blog--title {
            font-size: 18px !important;
        }

        .blog--card.five .mb-60 {
            margin-bottom: 28px !important;
        }
    }

    @media (max-width: 1566px) {
        .hero-section.one .banner--title {
            font-size: 90px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 90px;
        }

        .service--section.one .content--wrap .title {
            font-size: 90px;
        }

        .achievement--section .content--wrap .title {
            font-size: 90px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 87px;
        }

        .hero-section.four .video--wrap {
            width: 400px;
            height: 248px;
        }

        .hero-section.four .thumb--wrap.one {
            width: 300px;
            height: 352px;
        }
    }

    @media (max-width: 1519px) {
        .hero-section.one .banner--title {
            font-size: 280px;
        }

        .service--section.one .content--wrap .title {
            font-size: 280px;
        }

        .achievement--section .content--wrap .title {
            font-size: 280px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 277px;
        }

        .hero-section.two .element--wrap .counter {
            width: 348px;
            padding: 0 0 20px 20px;
        }

        .hero-section.two .element--wrap .counter .br--shape {
            width: 353px;
            height: 181px;
        }

        .hero-section.two .element--wrap .video--wrap {
            width: 470px;
            height: 314px;
        }

        .service--card.two .content--wrap .title {
            font-size: 25px;
        }

        .service--card.two .content--wrap .number {
            font-size: 70px;
        }

        .testimonial--section.two .section-content--wrap .title {
            font-size: 80px;
        }

        .hero-section.five .title {
            font-size: 40px;
        }

        .hero-section.five .hero--marque .thumb--wrap {
            width: 500px;
            height: 441px;
        }

        .counter--card.five .title {
            font-size: 20px !important;
        }

        .solutions--section .container--fluid {
            padding: 0 75px;
        }

        .work--section.five .container-fluid {
            padding: 0 75px;
        }

        .testimonial--section.five .container-fluid {
            padding: 0 75px;
        }

        .testimonial--section.five .testimonial-card--wrap {
            padding-left: 75px;
        }

        .price--section.one .container-fluid {
            padding: 0 75px;
        }

        .faq--section.one .container-fluid {
            padding: 0 75px;
        }

        .blog--section.five .container-fluid {
            padding: 0 75px;
        }

        .about--section.five .container-fluid {
            padding: 0px 75px;
        }

        .footer--section.five .container-fluid {
            padding: 0 75px;
        }

        .counter--section.five .container-fluid {
            padding: 0 75px;
        }

        .cta--section.two .container-fluid {
            padding: 0 75px;
        }

        .header-main-area.five .container-fluid {
            padding: 0 75px !important;
        }

        .blog--card.five .mb-60 {
            margin-bottom: 0px !important;
        }
    }

    @media (max-width: 1471px) {
        .hero-section.one .banner--title {
            font-size: 270px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 270px;
        }

        .service--section.one .content--wrap .title {
            font-size: 270px;
        }

        .achievement--section .content--wrap .title {
            font-size: 270px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 267px;
        }

        .about--section.one .section--text {
            font-size: 124px;
        }

        .about--section.one .title .thumb--wrap {
            height: 90px;
            margin: 23px 32px 0 32px;
        }

        .about--section.one .about-element.three {
            bottom: -44%;
        }
    }

    @media (max-width: 1424px) {
        .hero-section.one .banner--title {
            font-size: 260px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 260px;
        }

        .service--section.one .content--wrap .title {
            font-size: 260px;
        }

        .achievement--section .content--wrap .title {
            font-size: 260px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 257px;
        }
    }

    @media (max-width: 1377px) {
        .hero-section.one .banner--title {
            font-size: 250px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 250px;
        }

        .service--section.one .content--wrap .title {
            font-size: 250px;
        }

        .achievement--section .content--wrap .title {
            font-size: 250px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 247px;
        }
    }

    @media (max-width: 1330px) {
        .hero-section.one .banner--title {
            font-size: 240px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 240px;
        }

        .service--section.one .content--wrap .title {
            font-size: 240px;
        }

        .achievement--section .content--wrap .title {
            font-size: 240px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 237px;
        }
    }

    @media (max-width: 1283px) {
        .hero-section.one .banner--title {
            font-size: 230px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 230px;
        }

        .service--section.one .content--wrap .title {
            font-size: 230px;
        }

        .achievement--section .content--wrap .title {
            font-size: 320px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 210px;
        }
    }

    @media (max-width: 1235px) {
        .hero-section.one .banner--title {
            font-size: 220px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 220px;
        }

        .service--section.one .content--wrap .title {
            font-size: 220px;
        }

        .achievement--section .content--wrap .title {
            font-size: 220px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 180px;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 52px;
        }
    }

    @media (max-width: 1499px) {
        .header-wrapper .main-menu .city--time {
            display: none !important;
        }
    }

    @media (max-width: 1440px) {
        .portfolio-card--section .btn--wrap {
            margin-top: 120px;
        }

        .blog--card.one .content--wrap {
            position: unset !important;
            padding: 20px !important;
            width: 100% !important;
        }

        .blog--card.one .thumb--wrap {
            width: 100%;
            height: 430px;
        }

        .testimonial--card.three .description {
            display: -webkit-box;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 5;
            overflow: hidden;
        }

        .hero-section.three .hero-element4 {
            width: 250px;
        }

        .side-navigation--wrap .side--navigation {
            padding: 30px 30px;
        }

        .service--card.four .content--wrap .title {
            font-size: 46px;
        }

        .service--card.four .thumb--wrap {
            width: 488px;
            height: 410px;
        }

        .service--section.one .bg-shape--one {
            width: 250px;
        }

        .achievement--list .achievement-tag--wrap li p {
            font-size: 16px !important;
        }

        .service--section.one .service-list--wrap .service--list .service::after {
            bottom: 85px;
        }

        .footer--section.one .bg--shape-two {
            width: 200px;
        }

        .footer--section.one .bg--shape-one {
            width: 200px;
        }

        .video--section.four .video--wrap {
            height: 550px;
        }

        .contact--card.four .btn--wrap .btn {
            font-size: 20px;
            padding: 18px;
        }

        .contact--card.four h6 {
            font-size: 30px !important;
        }

        .footer--section.four .social-item--wrap .item p {
            font-size: 18px !important;
        }

        .hero-section.three .hero-sm--text {
            width: 426px;
        }

        .team--card .social--info a {
            padding: 4px 12px;
            font-size: 14px;
        }

        .team--card .thumb--wrap {
            height: 510px;
        }

        .counter--card.two h6 {
            font-size: 70px !important;
        }

        .counter--card.two p {
            font-size: 16px !important;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 50px;
        }

        .price-plan--section.one .content--wrap .discription {
            font-size: 56px;
        }

        .why-choose--section.five .content--wrap {
            padding: 70px;
        }

        .why-choose--section.five .content--wrap .title {
            font-size: 40px !important;
            margin-bottom: 20px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -16%;
        }

        .hero-section.four .thumb--wrap.one {
            width: 250px;
            height: 294px;
        }

        .about--section.four .about-content--wrap .about--content {
            padding: 20px 0;
            gap: 30px;
        }

        .about--section.four .about-content--wrap .about--content .title {
            margin-bottom: 10px !important;
        }

        .blog--section.four .container-fluid {
            padding: 0 75px;
        }

        .footer--section.four .container-fluid {
            padding: 0 75px;
        }

        .hero-section.four .thumb--wrap.one {
            display: none;
        }

        .footer--section.four .title {
            font-size: 50px;
            margin-bottom: 80px;
        }

        .testimonial--card.four .description {
            margin-bottom: 50px;
            font-size: 18px !important;
        }

        .growth--section.one .section-content--wrap .title {
            font-size: 70px;
            margin-bottom: 30px;
        }

        .about--section.four .section-content--wrap {
            margin-bottom: 40px;
        }

        .about--section.four .section-content--wrap .title {
            font-size: 46px;
            margin-bottom: 15px;
        }

        .hero-section.four .container-fluid .pb-130 {
            padding-bottom: 50px !important;
        }

        .work--card.one .content--wrap {
            transform: translate(-50%, -50%);
            width: 80%;
        }

        .portfolio--card .thumb--wrap.three {
            height: 480px;
        }

        .portfolio--card .thumb--wrap.four {
            height: 480px;
        }

        .portfolio--card .thumb--wrap.five {
            height: 480px;
        }

        .portfolio--card .thumb--wrap.one {
            height: 480px;
        }

        .portfolio--card .thumb--wrap.two {
            height: 670px;
        }

        .portfolio--card .thumb--wrap.six {
            height: 670px;
        }

        .portfolio--card .thumb--wrap.seven {
            height: 480px;
        }

        .partner--card.one .thumb--wrap {
            height: 200px;
        }

        .testimonial--card.two {
            padding: 40px 40px;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            right: -440px;
        }

        .testimonial--section.two .testimonial-card--wrap.four {
            right: -440px;
        }

        .testimonial--card.two .description {
            margin-bottom: 25px;
            font-size: 20px !important;
        }

        .testimonial--section.two .testimonial-card--wrap {
            min-height: 480px;
        }

        .testimonial--section.two .user--info {
            gap: 16px !important;
        }

        .why-choose--section .thumb--wrap.xl {
            height: 551px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one {
            height: 334px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one .thumb--wrap.one .image--one {
            width: 116px;
            height: 200px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two {
            width: 376px;
            height: 200px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content p {
            font-size: 16px !important;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one .thumb--wrap.one .image--four {
            width: 160px;
            height: 160px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two.right {
            left: -120px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two.right .thumb--wrap {
            width: 300px;
        }

        .service--card.three .content--wrap .number {
            font-size: 70px;
        }

        .service--card.three .content--wrap .title {
            font-size: 70px;
            margin-bottom: 30px;
        }

        .service--card.three .content--wrap .d-flex.gap--100 {
            gap: 40px !important;
        }

        .work--card.one .thumb--wrap {
            height: 438px;
        }

        .blog--card.two .thumb--wrap {
            height: 274px;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 54px;
            height: 54px;
        }

        .footer--section.five .title {
            font-size: 48px;
            margin-bottom: 60px;
        }
    }

    @media (max-width: 1399px) {
        .hero-section.five .hero--marque .thumb--wrap {
            width: 100%;
            height: 341px;
        }

        .why-choose--section .thumb--wrap.xl {
            width: 100%;
            border-radius: 10px;
            overflow: hidden;
        }

        .why-choose--section .thumb--wrap.xl .video--btn {
            width: 109px;
            height: 109px;
        }

        .why-choose--section .thumb--wrap.xl .video--btn i {
            font-size: 26px;
            color: var(--white);
        }

        .why-choose--section .whychoose-content--wrap {
            width: 100%;
            height: 100%;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two.right {
            left: unset;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two {
            width: 100%;
            height: 162px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two.right .thumb--wrap {
            width: 90%;
            height: 120px;
            border-radius: 10px;
            overflow: hidden;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two.right .thumb--wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .service--section.one .service-list--wrap::after {
            width: 112%;
        }

        .testimonial--card.one {
            padding: 60px 45px;
            gap: 70px;
        }

        .testimonial--card.one .description {
            font-size: 24px !important;
        }

        .footer--section.one .bg--shape-one {
            display: none;
        }

        .footer--section.one .bg--shape-two {
            display: none;
        }

        .footer--section.one .footer--top {
            border-radius: 170px 170px 0px 0px;
            overflow: hidden;
        }

        .footer--section.one .email {
            font-size: 142px;
        }

        article.blog--card.one.position-relative a {
            width: 100%;
        }

        .featured--section .section-content--wrap .brc--wrap {
            width: 1340px;
        }
    }

    @media (max-width: 1366px) {
        .header-main-area .container-fluid {
            padding: 0 75px;
        }

        .hero-section.three .hero-element3--wrap {
            height: 592px;
        }

        .hero-section.three .banner--title {
            font-size: 118px;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            bottom: 16px;
        }

        .about--section.one .title .thumb--wrap {
            height: 82px;
            margin: 20px 32px 0 32px;
        }

        .why-choose--section .thumb--wrap.xl {
            height: 519px;
        }

        .hero-section.two .element--wrap .video--wrap {
            width: 400px;
            height: 308px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one {
            height: 315px;
        }

        .work--card.one .thumb--wrap {
            height: 414px;
        }

        .portfolio--section .content--wrap .discription {
            font-size: 50px;
        }

        .service--section.one .content--wrap .discription {
            font-size: 50px;
        }

        .about--section.one .section--text {
            font-size: 112px;
        }

        .achievement--section .content--wrap .discription {
            font-size: 50px;
        }

        .footer--section.one .content--wrap .description {
            font-size: 50px;
            margin-bottom: 60px;
        }

        .testimonial--card.one .content--wrap {
            gap: 30px !important;
        }

        .achievement--list .achievement-tag--wrap {
            flex-wrap: wrap;
            justify-content: end;
        }
    }

    @media (max-width: 1299px) {
        .blog--card.two .thumb--wrap .user--thumb {
            bottom: 2px;
        }

        .blog--card.two .blog--title {
            font-size: 20px !important;
            margin-bottom: 0;
        }

        .work--section.one .section-content--wrap .heading--wrap {
            font-size: 12px;
            margin-bottom: 16px;
        }

        .side-navigation--wrap.active .side--navigation {
            width: 45vw;
        }

        .join-us--section .discription {
            font-size: 48px;
        }

        .team--card .thumb--wrap {
            height: 410px;
        }

        .team--card .social--info a {
            padding: 4px 12px;
            font-size: 12px;
        }

        .team--card .content--wrap {
            padding: 20px;
        }

        .blog--card.five {
            flex-direction: column;
        }

        .blog--card.five .thumb--wrap {
            height: 200px;
            width: 100%;
        }

        .blog--card.five .thumb--wrap.xxl {
            height: 200px;
            margin-bottom: 0px !important;
        }

        .blog--card.five .content--wrap {
            padding: 0px;
        }

        .blog--card.five.gap--44 {
            gap: 10px !important;
        }

        .hero-section.five .title {
            font-size: 40px;
        }

        .hero-section.five .title span {
            min-width: unset !important;
        }

        .solution--card .logo--wrap {
            margin-bottom: 40px;
        }

        .solution--card .number--wrap {
            margin-bottom: 36px;
        }

        .solution--card .title {
            font-size: 20px !important;
        }

        .solution--card .description {
            font-size: 16px !important;
        }

        .py-130 {
            padding-top: 100px;
            padding-bottom: 100px;
        }

        .video--section.four .video--wrap {
            width: 100%;
            height: 700px;
        }

        .why-choose--section.four .wc-content--wrap .wc--content .title {
            font-size: 35px;
            margin-bottom: 15px;
        }

        .hero-section.three .banner--title {
            font-size: 100px;
        }

        .why-choose--section.four .wc-content--wrap {
            padding: 90px 60px;
        }

        .about--section.four .section-content--wrap .title {
            font-size: 42px;
            margin-bottom: 15px;
        }

        .service--card.four .service-list--wrap .service--list p {
            font-size: 18px !important;
        }

        .service--card.four {
            padding: 45px 55px 55px 55px;
        }

        .btn-style--three {
            padding: 5px 5px 5px 25px;
            font-size: 15px !important;
        }

        .service--card.four .service-list--wrap .service--list {
            padding: 4px 0;
        }

        .btn-style--three .btn--circle {
            width: 34px;
            height: 34px;
        }

        .service--card.four .content--wrap .title {
            font-size: 40px;
            margin-bottom: 15px;
        }

        .service--card.four .thumb--wrap {
            width: 500px;
            height: 372px;
        }

        .about--section.four .about-content--wrap .about--content .title {
            line-height: 30px;
            font-size: 22px !important;
        }

        .about--section.four .section-content--wrap .mb-30 {
            margin-bottom: 20px !important;
        }

        .about--section.four .about-content--wrap .about--content p {
            font-size: 14px !important;
        }

        .hero-section.four .hero-element3 {
            width: 50%;
        }

        .hero-section.four .thumb--wrap.two {
            width: 150px;
        }

        .work--card.one .thumb--wrap {
            height: 390px;
        }

        .why-choose--section .section-content--wrap .title {
            font-size: 36px;
        }

        .work--section.one .section-content--wrap .title {
            font-size: 36px;
        }

        .testimonial--section.three .section-content--wrap .title {
            font-size: 36px;
        }

        .blog--section.three .section-content--wrap .title {
            font-size: 36px !important;
        }

        .cta--section.one .title {
            font-size: 36px !important;
        }

        .blog--card.two .thumb--wrap .thumb {
            height: 100%;
        }

        .blog--card.two .thumb--wrap {
            height: 244px;
        }

        .blog--section.three .blog-all-card--wrap {
            padding: 35px 0 50px 0;
        }

        .pt-120 {
            padding-top: 100px;
        }

        .pb-120 {
            padding-bottom: 100px;
        }

        .py-120 {
            padding: 100px 0 !important;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(1) .blog-card--wrap.two {
            padding-right: 0;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(2) .blog-card--wrap.two {
            padding-right: 0px;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(1) .blog-card--wrap.two::before {
            content: none;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(1) .blog-card--wrap.two::after {
            content: none;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(2) .blog-card--wrap.two::before {
            content: none;
        }

        .blog--section.three .col-xl-4.col-lg-6:nth-child(2) .blog-card--wrap.two::after {
            content: none;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 44px;
            height: 44px;
        }

        .featured--section .section-content--wrap .brc--wrap {
            width: 1240px;
        }

        .hero-section.three .hero-element4 {
            display: none !important;
        }

        .hero-section.three .banner--title {
            text-align: center !important;
        }

        .hero-section.two .banner--title {
            font-size: 110px;
        }

        .hero-section.two .hero-sm--text {
            font-size: 14px !important;
            line-height: 22px;
        }

        .hero-section.two .element--wrap .counter {
            width: 290px;
            padding: 0 0 20px 20px;
            gap: 0 !important;
        }

        .hero-section.two .element--wrap .counter p {
            font-size: 16px !important;
        }

        .hero-section.two .element--wrap .counter .br--shape {
            width: 294px;
            height: 150px;
        }

        .hero-section.two .element--wrap .counter--wrap .counter .number {
            font-size: 60px !important;
        }

        .hero-section.two .social-item--wrap a {
            font-size: 14px !important;
        }

        .about--section.one .about-element.one .thumb--wrap {
            width: 140px;
        }

        .about--section.one .about-element.two .thumb--wrap {
            width: 140px;
        }

        .about--section.one .about-element.three .thumb--wrap {
            width: 140px;
        }

        .about--section.one .about-element.four .thumb--wrap {
            width: 140px;
        }

        .about--section.one .about-element.five .thumb--wrap {
            width: 140px;
        }

        .about--section.one .about-element.six .thumb--wrap {
            width: 140px;
        }

        .btn-style--two .btn--text {
            padding: 7px 20px;
        }

        .header-wrapper .main-menu {
            gap: 28px;
        }

        .testimonial--section .container-fluid {
            padding: 0 75px;
        }

        .testimonial--section .testimonial--marque {
            left: 48%;
        }

        .achievement--list .achievement--title {
            font-size: 28px !important;
            flex-shrink: 0;
        }
    }

    @media (max-width: 1235px) {
        .hero-section.one .banner--title {
            font-size: 90px;
        }

        .service--section.one .content--wrap .title {
            font-size: 90px;
        }

        .service--section.one .content--wrap .title {
            font-size: 90px;
        }

        .achievement--section .content--wrap .title {
            font-size: 90px;
        }
    }

    @media (max-width: 1141px) {
        .hero-section.one .banner--title {
            font-size: 90px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 90px;
        }

        .service--section.one .content--wrap .title {
            font-size: 90px;
        }

        .achievement--section .content--wrap .title {
            font-size: 90px;
        }
    }

    @media (max-width: 1094px) {
        .hero-section.one .banner--title {
            font-size: 90px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 90px;
        }

        .service--section.one .content--wrap .title {
            font-size: 90px;
        }

        .achievement--section .content--wrap .title {
            font-size: 190px;
        }
    }

    @media (max-width: 333px) {
        .hero-section.one .banner--title {
            font-size: 56px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 56px;
        }

        .service--section.one .content--wrap .title {
            font-size: 56px !important;
        }

        .achievement--section .content--wrap .title {
            font-size: 56px;
        }
    }

    @media (max-width: 1199px) {
        .portfolio-card--section .btn--wrap {
            margin-top: 40px;
        }

        .breadcrumb .breadcrumb--thumb {
            width: 100%;
            height: 400px;
        }

        .details--btn {
            padding: 6px 15px;
        }

        .header-main-area.six .usser-info--wrap.one {
            display: none !important;
        }

        .blog--section.three .col-xl-4.col-lg-6::before {
            content: none !important;
        }

        .blog--section.three .col-xl-4.col-lg-6::after {
            content: none !important;
        }

        .service--section.three .section-content--wrap.two .title {
            font-size: 86px;
        }

        .blog--section.four .container-fluid .section-content--wrap .title {
            font-size: 86px;
        }

        .footer--section.four .title {
            font-size: 40px;
            margin-bottom: 60px;
        }

        .blog--card.two .thumb--wrap {
            height: 345px;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 64px;
            height: 68px;
        }

        .hero-section.three .hero-sm--text {
            width: 430px;
        }

        .preloader--two h1 {
            font-size: 100px;
        }

        .service--details .section--thumb {
            height: 450px;
            margin-bottom: 40px;
        }

        .blog--details .section--thumb {
            height: 450px;
            margin-bottom: 40px;
        }

        .portfolio--details .section--thumb {
            height: 450px;
            margin-bottom: 40px;
        }

        .portfolio--details .section--thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .service--details .service--thumb {
            height: 450px;
            margin-bottom: 40px;
        }

        .portfolio--details .service--thumb {
            height: 450px;
            margin-bottom: 40px;
        }

        .portfolio--details .service--thumb img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .price-plan--section.one .content--wrap .discription {
            font-size: 36px;
        }

        .why-choose--section.five .content--wrap {
            padding: 50px 40px;
        }

        .why-choose--section.five .content--wrap .title {
            font-size: 32px !important;
            margin-bottom: 20px;
        }

        .video--section .video--btn {
            width: 120px;
            height: 120px;
        }

        .text-slide--wrap .text--slide .slide--title {
            font-size: 135px;
            line-height: 1.1;
        }

        .video--section .video--btn img {
            width: 96px;
            height: 96px;
        }

        .team--section.one .content--wrap .discription {
            font-size: 46px;
        }

        .about--section.two .section--title {
            font-size: 46px;
        }

        .testimonial--section.two .testimonial-card--wrap {
            position: relative;
            z-index: 1;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            position: unset !important;
        }

        .about--section.five .section--content h2 {
            font-size: 36px !important;
        }

        .solutions--section.one .section--content h2 {
            font-size: 36px !important;
        }

        .partner--section.five .title {
            font-size: 36px !important;
        }

        .work-section--wrap.bg--black .section-content--wrap h2 {
            font-size: 36px !important;
        }

        .testimonial--section.five .section-content--wrap .title {
            font-size: 36px !important;
        }

        .price--section.one .container-fluid .section-content--wrap .title {
            font-size: 36px !important;
        }

        .faq--section.one .section-content--wrap .title {
            font-size: 36px !important;
        }

        .blog--section.five .container-fluid .section-content--wrap .title {
            font-size: 36px !important;
        }

        .price--card .thumb--wrap {
            height: 575px;
        }

        .price--card .content--wrap {
            padding: 60px;
        }

        .footer--section.five .newsletter--wrap {
            padding-right: 0px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -10%;
        }

        .price--card .tag {
            font-size: 16px !important;
        }

        .footer--section.five .subscribe-form--wrap {
            margin-bottom: 35px;
            width: 70%;
        }

        .footer--section.five .footer-menu--wrap {
            padding-left: 0px;
        }

        .price--card .price {
            font-size: 70px;
        }

        .price--card .name {
            font-size: 35px;
        }

        .about--section.five .about-content--wrap .about--content .title {
            font-size: 20px !important;
            line-height: 1.1;
            margin-bottom: 8px;
        }

        .about--section.five .about-content--wrap .about--content {
            padding: 15px 0;
            gap: 25px;
        }

        .about--section.five .about-thumb--wrap {
            width: 100%;
            height: 504px;
        }

        .footer--section.five .title {
            font-size: 36px;
            margin-bottom: 30px;
        }

        .cta--section.two .cta--inner .cta-element--two {
            width: 190px;
        }

        .cta--section.two .cta--inner .cta-element--one {
            width: 170px;
        }

        .cta--section.two .section-content--wrap .title {
            font-size: 36px !important;
        }

        .header-main-area.five .header-wrapper {
            padding: 6px 20px !important;
        }

        .hero-section.five .title {
            font-size: 30px;
        }

        .work--section.four .section-content--wrap .title {
            font-size: 100px;
        }

        .counter--card.four h6 {
            font-size: 80px !important;
        }

        .counter--card.four .title {
            font-size: 18px !important;
        }

        .contact--card.four {
            padding: 40px;
            border-radius: 10px;
        }

        .contact--card.four .btn--wrap .btn {
            padding: 15px;
        }

        .work--card.one:hover .content--wrap .title {
            font-size: 20px !important;
            text-align: center;
        }

        .service--card.three .content--wrap .number {
            font-size: 40px;
        }

        .service--card.three .content--wrap .title {
            font-size: 40px;
            margin-bottom: 20px;
        }

        .service--card.three .thumb--wrap {
            height: 238px;
        }

        .btn--lg {
            padding: 10px 20px;
            font-size: 14px !important;
        }

        .why-choose--section .thumb--wrap.xl {
            height: 448px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one .thumb--wrap.one .image--one {
            width: 76px;
            height: 112px;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.one {
            height: 266px;
        }

        .work--card.one .thumb--wrap {
            height: 354px;
        }

        .blog--card.two .content--wrap {
            padding: 8px 0;
            gap: 6px !important;
        }

        .banner--title {
            font-size: 90px;
        }

        .banner--title .split--text span {
            display: inline-block;
            min-width: 10px !important;
        }

        .counter--card.two h6 {
            font-size: 70px !important;
        }

        .hero-section.three .hero-sm--text {
            font-size: 14px !important;
        }

        .why-choose--section .whychoose-content--wrap .whychoose-content.two img {
            width: 150px;
            height: auto;
        }

        .service--card.three .service-list--wrap .service--list p {
            font-size: 16px !important;
        }

        .featured--section .section-content--wrap .brc--wrap {
            width: 1140px;
        }

        .featured--card .content--wrap .title--wrap {
            gap: 16px !important;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            right: -362px;
        }

        .testimonial--section.two .testimonial-card--wrap.four {
            right: -362px;
        }

        .testimonial--card.two .thumb--wrap {
            width: 145px;
            height: 160px;
            margin-bottom: 25px;
        }

        .featured--section .section-content--wrap .title {
            font-size: 110px;
        }

        .featured--card .thumb--wrap {
            height: 450px;
        }

        .portfolio--card .thumb--wrap.three {
            height: 380px;
        }

        .portfolio--card .thumb--wrap.four {
            height: 380px;
        }

        .portfolio--card .thumb--wrap.five {
            height: 380px;
        }

        .portfolio--card .thumb--wrap.one {
            height: 380px;
        }

        .portfolio--card .thumb--wrap.two {
            height: 520px;
        }

        .portfolio--card .thumb--wrap.six {
            height: 520px;
        }

        .portfolio--card .thumb--wrap.seven {
            height: 380px;
        }

        .service--section.one .service-list--wrap::after {
            border-radius: 150px 0 0 230px;
        }

        .service--section.one .service-list--wrap .service--list .service::after {
            bottom: 88px;
        }

        .contact--section.one .title {
            font-size: 160px;
        }

        .footer--section.one .email {
            font-size: 118px;
        }

        .social-list--wrap p {
            font-size: 16px !important;
        }

        .hero-section.one {
            padding: 200px 0 0px 0;
        }

        .hero-section.one .bg--thumb {
            top: 6%;
            right: 0%;
            width: 400px;
        }

        .hero-section.one .hero--element.three {
            top: 67%;
            right: 12%;
        }

        .hero-section.one .hero--element.one {
            top: 20%;
            right: 32%;
        }

        .header-wrapper .main-menu .menu {
            padding: 0px;
            font-size: 14px;
        }

        .about--section.one .about-element.one {
            left: -65px;
        }

        .about--section.one .about-element.six {
            right: -65px;
        }

        .about--section.one .about-element.two {
            left: -65px;
        }

        .about--section.one .about-element.three {
            bottom: -56%;
        }

        .about--section.one .about-element.four {
            bottom: -44%;
        }

        .about--section.one .title .thumb--wrap {
            height: 58px;
            margin: 24px 32px 0 32px;
        }

        .hero-section.two .element--wrap .video--wrap {
            display: none;
        }

        .counter--card.one .title {
            font-size: 102px;
        }

        .hero-section.four .video--wrap {
            display: none !important;
        }

        .hero-section.four .tag--wrap .tag {
            padding: 5px 16px;
        }

        .about--section.four .container-fluid {
            padding: 0 75px;
        }
    }

    @media (max-width: 1025px) {
        .header-main-area.two .header-wrapper {
            padding: 20px 0;
            border-top: 1px dashed var(--black);
            border-bottom: 1px dashed var(--black);
        }

        .hero-section.three .content--wrap.pb-120 {
            padding: 0 !important;
        }

        .featured--section .section-content--wrap {
            height: unset;
            padding-bottom: 100px;
        }

        .hero-section.one {
            padding: 270px 0 30px 0;
        }

        .about--section.one .section--text {
            font-size: 80px;
        }

        .about--section.one .about-element.two {
            bottom: -30%;
        }

        .about--section.one .about-element.five {
            top: 80%;
        }

        .about--section.one .about-element.three {
            bottom: -80%;
        }

        .service--section.one .service-list--wrap .service--list .service .title {
            font-size: 54px !important;
        }

        .service--section.one .service-list--wrap .service--list .service .number {
            font-size: 54px;
        }

        .hero-section.one .hero--description {
            font-size: 40px !important;
        }

        .portfolio--section .content--wrap .discription {
            font-size: 40px;
        }

        .service--section.one .content--wrap .discription {
            font-size: 40px;
        }

        .achievement--section .content--wrap .discription {
            font-size: 40px;
        }

        .service--section.one .content--wrap .discription span {
            margin-right: 40px;
            top: -8px;
        }

        .portfolio--section .content--wrap .discription span {
            margin-right: 40px;
            top: -8px;
        }

        .achievement--section .content--wrap .discription span {
            margin-right: 40px;
            top: -8px;
        }

        .featured--section .section-content--wrap .title {
            font-size: 100px;
            margin-bottom: 0px;
        }

        .featured--section .section-content--wrap .description .thumb--wrap {
            margin-top: 40px;
        }

        .pt-130 {
            padding-top: 90px;
        }

        .pb-120 {
            padding-bottom: 90px;
        }

        .py-130 {
            padding-top: 90px;
            padding-bottom: 90px;
        }

        .footer--section.one .footer--top {
            border-radius: 50px 50px 0px 0px !important;
        }

        .hero-section.two .banner--title {
            font-size: 90px;
        }

        .hero-section.two .banner--title .gap--58 {
            gap: 20px !important;
        }

        .contact--section.two .title {
            display: none;
        }

        .footer--card {
            padding: 15px;
        }

        .footer--section.two .content--wrap .description {
            font-size: 48px;
            margin-bottom: 60px;
        }

        .testimonial--section.two .section-content--wrap .title {
            font-size: 80px;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            right: -300px;
        }

        .testimonial--section.two .testimonial-card--wrap.four {
            right: -300px;
        }

        .testimonial--card.two .thumb--wrap {
            width: 90px;
            height: 100px;
            margin-bottom: 15px;
        }

        .testimonial--card.two {
            padding: 20px;
        }

        .testimonial--card.two .user--name {
            font-size: 18px !important;
        }

        .testimonial--section.two .user--info {
            gap: 4px !important;
        }

        .testimonial--section.two .testimonial-card--wrap {
            min-height: 360px;
        }

        .hero-section.three .banner--title {
            font-size: 80px;
            justify-content: center;
        }

        .hero-section.three .banner--title span.d-flex.align-items-center.gap--58 {
            flex-wrap: wrap;
            gap: 20px !important;
        }

        .hero-section.three .social-item--wrap a {
            padding: 2px 12px 2px 12px;
            font-size: 12px !important;
        }

        .hero-section.three .hero-element3--wrap {
            display: none !important;
        }

        .partner--section.two .section-content--wrap {
            padding: 5px 26px;
        }

        .partner--section.two .section-content--wrap h2 {
            font-size: 14px !important;
        }

        .hero-section.three .social-item--wrap {
            top: 55%;
            left: -56px;
        }

        .hero-section.three .scroll-down--wrap {
            top: 55%;
        }

        .work--card.one .thumb--wrap {
            height: 295px;
        }

        .blog--card.two .thumb--wrap {
            height: 284px;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 54px;
            height: 54px;
        }

        .work--section.one .section-content--wrap .title {
            font-size: 28px;
        }

        .why-choose--section .section-content--wrap .title {
            font-size: 28px;
        }

        .testimonial--section.three .section-content--wrap .title {
            font-size: 28px;
        }

        .blog--section.three .section-content--wrap .title {
            font-size: 28px !important;
        }

        .about--section.four .section-content--wrap .title {
            font-size: 30px;
        }

        .why-choose--section.four .wc-content--wrap .wc-data--wrap {
            gap: 40px;
            flex-wrap: wrap;
        }

        .testimonial--section.four .section-content--wrap .title {
            font-size: 36px;
        }

        .testimonial--card.four h6 {
            font-size: 18px !important;
        }

        .testimonial--card.four .star--thumb {
            margin-bottom: 15px;
        }

        .testimonial--card.four .description {
            margin-bottom: 20px;
        }

        .testimonial--card.four .icon--thumb {
            width: 40px;
            height: 40px;
        }

        .growth--section.one .growth-thumb--wrap .thumb {
            width: 220px;
            height: 240px;
        }

        .growth--section.one .growth-thumb--wrap .thumb.one {
            top: 0;
            left: 0;
            transform: translate(-170%, -230%);
            rotate: -9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb.two {
            top: 0;
            left: 0;
            transform: translate(-200%, 75%);
            rotate: -9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb.three {
            top: 0;
            left: 0;
            transform: translate(95%, 85%);
            rotate: 9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb.four {
            top: 0;
            left: 0;
            transform: translate(65%, -230%);
            rotate: 9deg;
        }

        .contact--card.four h6 {
            font-size: 28px !important;
            margin-bottom: 30px !important;
        }

        .footer--section.four .title {
            font-size: 36px;
            margin-bottom: 25px;
        }

        .footer--section.four .email {
            margin-bottom: 42px;
            font-size: 28px !important;
        }

        .footer--section.four .social-item--wrap .item p {
            font-size: 16px !important;
        }

        .pb-130 {
            padding-bottom: 90px;
        }

        .service--card.four .thumb--wrap {
            width: 400px;
            height: 302px;
        }

        .hero-section.five {
            padding: 170px 0 130px 0;
        }

        .hero-section.five .hero--marque .thumb--wrap {
            height: 280px;
        }

        .preloader--five .percentage {
            font-size: 18rem;
        }

        .hero-section.five .hero-input--wrap .hero--input {
            padding: 16px 35px;
        }

        .hero-section.five .hero-input--wrap .hero-search--btn {
            padding: 8px 18px;
        }

        .solution--card {
            border-radius: 10px;
            padding: 20px;
        }

        .solution--card .title {
            font-size: 18px !important;
        }

        .work--section.five .container-fluid {
            padding: 0 45px;
        }

        .counter--section.five .container-fluid {
            padding: 0 45px;
        }

        .about--section.five .container-fluid {
            padding: 0px 45px;
        }

        .solutions--section .container--fluid {
            padding: 0 45px;
        }

        .testimonial--section.five .container-fluid {
            padding: 0 45px;
        }

        .price--section.one .container-fluid {
            padding: 0 45px;
        }

        .faq--section.one .container-fluid {
            padding: 0 45px;
        }

        .cta--section.two .container-fluid {
            padding: 0 45px;
        }

        .header-main-area.five .container-fluid {
            padding: 0 45px !important;
        }

        .cta--section.two .cta--inner .cta-thumb {
            width: 360px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -10%;
        }

        .cta--section.two .section-content--wrap .title {
            margin-bottom: 25px;
        }

        .cta--section.two .cta--inner {
            padding-left: 35px;
        }

        .app-link--btn {
            width: 130px;
        }

        .side-navigation--wrap.active .side--navigation {
            width: 55vw;
        }
    }

    @media (max-width: 1024px) {
        .footer--section.five .back-to--top {
            top: 20px;
            right: 20px;
            width: 40px;
        }

        .footer--section.five .footer--bottom {
            padding: 20px 25px;
        }

        .footer--section.four .footer--bottom {
            padding: 20px 25px;
        }

        .service--section.one .bg-shape--one {
            display: none;
        }

        .why-choose--section.four .bg-thumb--wrap {
            display: none;
        }

        .why-choose--section.four .wc-content--wrap {
            width: 100%;
        }
    }

    @media (max-width: 1023px) {
        .testimonial--section.five .testimonial-card--wrap {
            justify-content: center;
            gap: 16px;
            flex-wrap: wrap;
            padding-left: 45px !important;
        }

        .work--section.five .work-circle--wrap {
            display: none;
        }

        .cta--section.two {
            background-color: var(--secondary);
        }

        .hero-section.two {
            background-color: var(--secondary);
        }
    }

    @media (max-width: 1046px) {
        .hero-section.one .banner--title {
            font-size: 180px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 180px;
        }

        .service--section.one .content--wrap .title {
            font-size: 180px;
        }

        .achievement--section .content--wrap .title {
            font-size: 180px;
        }
    }

    @media (max-width: 999px) {
        .hero-section.one .banner--title {
            font-size: 170px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 170px;
        }

        .service--section.one .content--wrap .title {
            font-size: 170px;
        }

        .achievement--section .content--wrap .title {
            font-size: 170px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 160px;
        }
    }

    @media (max-width: 952px) {
        .hero-section.one .banner--title {
            font-size: 160px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 160px;
        }

        .service--section.one .content--wrap .title {
            font-size: 160px;
        }

        .achievement--section .content--wrap .title {
            font-size: 160px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 130px;
        }
    }

    @media (max-width: 905px) {
        .hero-section.one .banner--title {
            font-size: 155px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 155px;
        }

        .service--section.one .content--wrap .title {
            font-size: 155px;
        }

        .achievement--section .content--wrap .title {
            font-size: 155px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 130px;
        }
    }

    @media (max-width: 881px) {
        .hero-section.one .banner--title {
            font-size: 145px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 145px;
        }

        .service--section.one .content--wrap .title {
            font-size: 145px;
        }

        .achievement--section .content--wrap .title {
            font-size: 145px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 100px;
        }
    }

    @media (max-width: 834px) {
        .hero-section.one .banner--title {
            font-size: 135px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 135px;
        }

        .service--section.one .content--wrap .title {
            font-size: 135px;
        }

        .achievement--section .content--wrap .title {
            font-size: 135px;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 52px;
        }
    }

    @media (max-width: 787px) {
        .hero-section.one .banner--title {
            font-size: 125px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 125px;
        }

        .achievement--section .content--wrap .title {
            font-size: 125px;
        }

        .hero-section.one .banner--title {
            font-size: 115px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 115px;
        }

        .service--section.one .content--wrap .title {
            font-size: 115px;
        }

        .achievement--section .content--wrap .title {
            font-size: 115px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 80px;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 42px;
        }
    }

    @media (max-width: 688px) {
        .hero-section.one .banner--title {
            font-size: 125px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 125px;
        }

        .service--section.one .content--wrap .title {
            font-size: 125px;
        }

        .achievement--section .content--wrap .title {
            font-size: 125px;
        }
    }

    @media (max-width: 688px) {
        .hero-section.one .banner--title {
            font-size: 115px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 115px;
        }

        .service--section.one .content--wrap .title {
            font-size: 115px;
        }

        .achievement--section .content--wrap .title {
            font-size: 115px;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 32px;
        }
    }

    @media (max-width: 592px) {
        .hero-section.one .banner--title {
            font-size: 105px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 105px;
        }

        .service--section.one .content--wrap .title {
            font-size: 105px;
        }

        .achievement--section .content--wrap .title {
            font-size: 105px;
        }

        .service--section.one .service-list--wrap .service--list .service {
            gap: 10px;
        }
    }

    @media (max-width: 998px) {
        .header-two--wrap {
            display: none;
        }

        .testimonial--section .testimonial-card--wrap .inner.left {
            margin: 0 !important;
        }

        .testimonial--section .testimonial-card--wrap .inner.right {
            margin: 0 !important;
        }

        .testimonial--section .testimonial-card--wrap .inner {
            gap: 30px;
        }

        .video--section {
            height: 600px;
        }

        .video--section .title {
            font-size: 40px !important;
        }

        .testimonial--section.two .testimonial-card--wrap.two {
            position: unset !important;
        }

        .testimonial--section.two .testimonial-card--wrap.four {
            position: unset !important;
        }

        .partner--section.one .section-content--wrap {
            margin-bottom: 90px;
            flex-wrap: wrap;
        }

        .partner--section.one .section-content--wrap .title {
            position: unset !important;
        }

        .partner--section.one .section-content--wrap h2 {
            text-align: center;
            font-size: 40px !important;
        }

        .hero-section.three .banner--title {
            font-size: 68px;
        }
    }

    @media (max-width: 992px) {
        .counter--section.one .counter--line.one {
            display: none !important;
        }

        .counter--section.one .counter--line.two {
            display: none !important;
        }

        .counter--card.one {
            padding: 20px !important;
        }

        .counter--section.one {
            padding-bottom: 90px;
        }

        .counter--card.one.\33 {
            border-bottom: 0;
        }

        .counter--card.one.\33 ::after {
            content: none;
        }

        .counter--card.one.\34 {
            border-bottom: 0;
        }

        .counter--card.one.\34 ::after {
            content: none;
        }

        .testimonial--section.two .testimonial-card--wrap.three {
            top: 0px;
        }

        .work--section.five .section-thumb--wrap {
            display: none !important;
        }

        .work--section.five .section-content--wrap {
            margin-bottom: 50px;
        }

        .step-card--wrap {
            display: flex;
            flex-direction: column;
            gap: 16px;
        }
    }

    @media (max-width: 991px) {
        .testimonial--card.five.style--one .user--info {
            height: 100px;
        }

        .footer--section.two .back-to--top {
            top: 40%;
        }

        .about--section.two .section--title {
            font-size: 30px;
            line-height: 1.1;
        }

        .team--section.one .content--wrap .discription {
            font-size: 30px;
        }

        .footer--section.four .footer--bottom {
            padding: 20px 10px;
        }

        .service--section.three .section-content--wrap.two .title {
            font-size: 50px;
        }

        .work--section.four .section-content--wrap .title {
            font-size: 50px;
        }

        .blog--section.four .container-fluid .section-content--wrap .title {
            font-size: 50px;
        }

        .header-main-area.four .header-wrapper {
            padding: 10px 0;
        }

        .header-wrapper .menu--wrap {
            display: none !important;
        }

        .footer--section.four .email {
            margin-bottom: 22px;
            font-size: 22px !important;
        }

        .counter--card.four h6 {
            font-size: 60px !important;
        }

        .counter--card.four .title {
            font-size: 16px !important;
        }

        .video--section.four {
            min-height: 500px;
        }

        .video--section.four .video--wrap {
            width: 100%;
            height: 500px;
        }

        section.why-choose--section.four.position-relative.pb-130 {
            padding: 0;
        }

        .about--section.four .about-thumb--wrap {
            height: 450px;
            width: 100%;
            border-radius: 10px;
            overflow: hidden;
        }

        .about--section.four .about-thumb--wrap img {
            width: 100%;
            height: 100%;
            object-fit: cover;
        }

        .cta--section.one .cta--thumb {
            width: 190px;
            height: 190px;
            border-radius: 10px;
        }

        /*.cta--section.one .cta-slider--wrap {*/
        /*    top: 0;*/
        /*    right: 20%;*/
        /*}*/
        
        .cta--section.one .cta-slider--wrap {
            top: 0;
            right: 0%;
        }    

        .blog--card.two .thumb--wrap {
            height: 270px;
        }

        .hero-section.three .banner--title span.d-flex.align-items-center.gap--58 {
            flex-direction: column;
            justify-content: center;
            gap: 0px !important;
        }

        .hero-section.three .hero-sm--text {
            display: none !important;
        }

        .contact--section.one .title {
            font-size: 100px;
            line-height: 1.1;
        }

        .footer--section.one .email {
            font-size: 78px;
            text-align: center;
        }

        .achievement--section .achievement--list .achievement {
            gap: 20px !important;
            flex-wrap: wrap;
            flex-direction: column;
            justify-content: start !important;
            align-items: start !important;
        }

        .achievement--list .achievement-tag--wrap {
            flex-wrap: wrap;
            justify-content: start;
        }

        .hero-section.five .content--wrap .element--wrap {
            display: none;
        }

        .hero-section.five {
            padding: 170px 0 90px 0;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -15%;
        }

        .blog--card.five .thumb--wrap {
            height: 300px;
            width: 100%;
        }

        .blog--card.five .thumb--wrap.xxl {
            height: 300px;
        }
    }

    @media (max-width: 768px) {
        .footer--section.three .fifth--card .corner--shape {
            width: 60px;
            height: 60px;
        }

        .footer--section.three .back-to--top {
            position: absolute;
            bottom: 30px;
            right: 30px;
            width: 41px;
        }

        .breadcrumb {
            margin-bottom: 0;
            padding-top: 180px;
            padding-bottom: 80px;
        }

        .custom--accordion.two .accordion-button {
            background-color: var(--white) !important;
            padding: 30px 30px 30px 30px;
        }

        .price--card .content--wrap {
            padding: 30px;
        }

        .why-choose--section.four .wc-content--wrap .circle {
            width: 200px;
            height: 200px;
            border: 26px solid var(--secondary);
        }

        .header-main-area.four .social-item--wrap {
            gap: 10px;
            display: none !important;
        }

        .hero-section.four .thumb--wrap.two {
            left: unset;
            right: 0;
        }

        .preloader--four .loading--text {
            font-size: 50px;
        }

        .blog--card.two .thumb--wrap {
            height: 246px;
        }

        .side-navigation--wrap.active .side--navigation {
            width: 75vw;
        }

        .service--details .title {
            font-size: 24px;
        }

        .hero-section.two .banner--title .gap--58 {
            gap: 0px !important;
            flex-wrap: wrap;
            justify-content: center;
        }

        .counter--card.one::after {
            content: "";
            bottom: 3px;
        }

        .partner--card.one .thumb--wrap {
            height: 170px;
        }

        .container-fluid {
            padding: 0 45px !important;
        }

        .testimonial--section.two .container-fluid {
            padding: 0 45px;
        }

        .ai-agency .line.one {
            display: none !important;
        }

        .ai-agency .line.two {
            display: none !important;
        }

        .ai-agency .line.three {
            display: none !important;
        }

        .ai-agency .line.four {
            display: none !important;
        }

        .hero-section.three .hero-element4 {
            width: 172px;
        }

        .cta--section.one .section-content--wrap .form--wrap {
            padding: 16px 16px;
            border-radius: 8px;
        }

        .service--card.three .content--wrap .d-flex.gap--100 {
            gap: 20px !important;
            flex-direction: column;
        }

        .service--section.three .btn--dark {
            padding: 10px 25px !important;
        }

        .service--card.three .content--wrap .number {
            flex-shrink: 0;
        }

        .work--card.one .thumb--wrap {
            border-radius: 10px;
        }

        .growth--section.one {
            padding: 90px 0;
        }

        .growth--section.one .section-content--wrap .title {
            font-size: 65px;
        }

        .growth--section.one .growth-thumb--wrap .thumb.one {
            transform: translate(-120%, -225%);
            rotate: -9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb {
            width: 170px;
            height: 190px;
        }

        .growth--section.one .growth-thumb--wrap .thumb.four {
            transform: translate(40%, -226%);
            rotate: 9deg;
        }

        .blog--card.four .blog--title {
            font-size: 18px !important;
        }

        .blog--card.four .content--wrap {
            gap: 10px !important;
        }

        .hero-section.four .banner--title {
            font-size: 60px;
        }

        .hero-section.four .hero-sm--text {
            line-height: 1.1;
            font-size: 16px !important;
        }

        .service--card.four .thumb--wrap {
            display: none;
        }

        .cta--section.two .cta--inner .cta-thumb {
            width: 220px;
        }

        .cta--section.two .cta--inner .cta-element--two {
            width: 120px;
        }

        .cta--section.two .cta--inner .cta-element--one {
            width: 120px;
        }

        .cta--section.two .cta--inner {
            padding-left: 0;
        }
    }

    @media (max-width: 767px) {
        .side-navigation--wrap.active .side--navigation {
            width: 85vw;
        }

        .cta--section.two .cta--inner .cta-thumb {
            display: none;
        }

        .cta--section.two .cta--inner .cta-element--one {
            display: none;
        }

        .cta--section.two .cta--inner .cta-element--two {
            display: none;
        }

        .chart--card.two {
            display: none !important;
        }

        .solutions--section .section-thumb--wrap {
            height: 450px;
        }

        .preloader--five .percentage {
            font-size: 10rem;
        }
    }

    @media (max-width: 692px) {
        .container-fluid {
            padding: 0 25px !important;
        }

        .about--section.four .slider--wrap {
            padding: 0 25px !important;
        }

        .hero-section.one .banner--title {
            font-size: 135px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 135px;
        }

        .service--section.one .content--wrap .title {
            font-size: 135px !important;
        }

        .achievement--section .content--wrap .title {
            font-size: 135px;
        }
    }

    @media (max-width: 630px) {
        .hero-section.four .hero-element3 {
            display: none;
        }

        .contact--section.one .title {
            font-size: 70px;
        }

        .hero-section.two .banner--title {
            font-size: 70px;
        }

        .split--text span {
            min-width: unset !important;
        }

        .hero-section.two .hero-sm--text {
            width: 330px;
            margin-top: 16px;
        }

        .hero-section.two .social-item--wrap {
            left: -130px;
        }

        .hero-section.two .scroll-down--wrap {
            right: -35px;
        }

        .video--section .title {
            top: 25px;
            left: 25px;
            width: auto;
            text-decoration: underline;
        }

        .video--section .video--btn {
            width: 120px;
            height: 120px;
        }

        .video--section .video--btn img {
            width: 90px;
            height: 90px;
        }

        .counter--card.one {
            border: 1px dashed var(--black) !important;
        }

        .counter--card.one::after {
            content: none;
        }

        .counter--section.one .counter--line.three {
            display: none !important;
        }

        .counter--section.one .counter--line.four {
            display: none !important;
        }

        .growth--section.one .growth-thumb--wrap .thumb.four {
            transform: translate(5%, -226%);
            rotate: 9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb.two {
            transform: translate(-160%, 105%);
            rotate: -9deg;
        }

        .growth--section.one .growth-thumb--wrap .thumb.three {
            transform: translate(60%, 130%);
            rotate: 9deg;
        }
    }

    @media (max-width: 575px) {
        .portfolio-card--section .btn--wrap {
            margin-top: 0px;
        }

        .contact-card--two {
            padding: 20px;
        }

        .service--section.one .service-list--wrap .service--list .service::after {
            content: none;
        }

        .service--section.one .service-list--wrap .service--list .service .number {
            font-size: 35px;
        }

        .service--section.one .service-list--wrap .service--list .service .title {
            font-size: 35px !important;
        }

        .footer--section.four .social-item--wrap .item .dot {
            width: 10px;
            height: 10px;
        }

        .testimonial--card.four .user--info {
            flex-direction: column;
            gap: 12px !important;
            align-items: start !important;
            justify-content: start !important;
        }

        .footer--section.four .back-to--top {
            display: none;
        }

        .footer--section.two .back-to--top {
            top: 30%;
            right: -8%;
        }

        .error--page .content .title {
            font-size: 40px;
        }

        .error--page .content .description {
            width: 100%;
            font-size: 16px;
        }

        .error--page .slide--wrap ul li h6 {
            font-size: 22px;
        }

        .error--page .slide--wrap ul {
            gap: 22px !important;
        }

        .join-us--section .discription {
            font-size: 26px;
        }

        .breadcrumb .breadcrumb--text {
            font-size: 22px;
        }

        .breadcrumb {
            margin-bottom: 0;
            padding-top: 130px;
            padding-bottom: 80px;
        }

        .faq--card {
            padding: 15px;
        }

        .faq--card .content--wrap h6 {
            margin-bottom: 15px;
            font-size: 30px !important;
        }

        .faq--card .content--wrap {
            margin-bottom: 50px;
        }

        .header-main-area.six .login-lng {
            display: none !important;
        }

        .counter--card.two h6 {
            font-size: 44px !important;
        }

        .video--section .title {
            font-size: 30px !important;
        }

        .team--section.one .team .team--title {
            font-size: 22px !important;
            gap: 16px !important;
        }

        .team--section.one .team--list .team {
            flex-wrap: wrap;
        }

        .faq--section.one .section-element--wrap {
            gap: 16px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -12%;
            padding: 3px 15px 3px 15px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three .btn--circle {
            display: none !important;
        }

        .price--card .thumb--wrap {
            height: 520px;
        }

        .testimonial--section.five .testimonial-card--wrap {
            padding: 0 25px !important;
        }

        .testimonial--section.five .testimonial-card--wrap .style--one .user--info {
            height: 100px;
        }

        .testimonial--card.five {
            width: 100%;
        }

        .solutions--section .container--fluid {
            padding: 0 25px !important;
        }

        .container-fluid {
            padding: 0 25px !important;
        }

        .why-choose--section.four .wc-content--wrap {
            padding: 90px 24px;
        }

        .service--card.four {
            padding: 25px;
        }

        .footer--section.four .social-item--wrap {
            gap: 12px !important;
        }

        .preloader--four .loading--text {
            font-size: 38px;
        }

        .hero-section.four .hero-sm--text {
            width: 100%;
        }

        .footer--section.two .content--wrap .description {
            font-size: 28px;
            margin-bottom: 50px;
        }

        .blog--card.one .content--wrap {
            padding: 20px 0px !important;
        }

        .contact--card.two {
            padding: 30px 25px;
        }

        .contact--card.two h6 {
            font-size: 30px !important;
        }

        .hero-section.two .social-item--wrap {
            display: none !important;
        }

        .hero-section.two .scroll-down--wrap {
            display: none !important;
        }

        .header-main-area.two .header--description {
            display: none !important;
        }

        .hero-section.two .element--wrap .counter--wrap {
            flex-wrap: wrap;
        }

        .featured--section .section-content--wrap .title {
            font-size: 52px;
        }

        .featured--section .section-content--wrap .description p {
            display: none !important;
        }

        .partner--section.one .section-content--wrap h2 {
            font-size: 22px !important;
        }

        .featured--section .btn--wrap {
            margin-top: 60px;
        }

        .counter--section .section-content--wrap .title {
            font-size: 26px !important;
        }

        .hero-section.two .banner--title {
            font-size: 50px;
        }

        .preloader--two h1 {
            font-size: 40px !important;
        }

        .header-main-area.two .header-wrapper {
            padding: 30px 0;
            border-top: 1px dashed var(--black);
        }

        .shape--wrap.top_image_bounce {
            width: 140px;
            height: 200px;
        }

        .shape--wrap.top_image_bounce img {
            width: 100%;
            height: 100%;
        }

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

        .footer--section.one .content--wrap .description {
            font-size: 24px;
            margin-bottom: 50px;
        }

        .footer--section.one .email {
            font-size: 38px;
            text-align: center;
        }

        .footer--section.one .social-list--wrap .social--tag {
            padding: 8px 16px;
        }

        .contact--section.one .heading {
            font-size: 18px !important;
        }

        .work-listing article .content--wrap {
            gap: 20px !important;
        }

        .achievement--section .content--wrap .discription {
            font-size: 16px;
        }

        .achievement--section .content--wrap .discription span {
            margin-right: 14px;
            top: -8px;
            font-size: 12px !important;
        }

        .service--section.one .service-list--wrap .bg--shape {
            width: 111%;
            border-radius: 22px 0 0 222px;
        }

        .hero-section.three .social-item--wrap {
            left: -96px;
        }

        .hero-section.three .scroll-down--wrap {
            right: -40px;
        }

        .header-main-area.five .container-fluid {
            padding: 0 25px !important;
        }

        .hero-section.three .banner--title {
            font-size: 44px !important;
        }

        .hero-section.three .social-item--wrap {
            display: none !important;
        }

        .hero-section.three .scroll-down--wrap {
            display: none !important;
        }

        .hero-section.three {
            padding: 150px 0 50px 0;
        }

        .partner--section.two .section-content--wrap h2 {
            font-size: 10px !important;
        }

        .blog--card.two .thumb--wrap {
            height: 250px;
        }

        .work--section.one .section-content--wrap .heading--wrap {
            font-size: 12px;
            margin-bottom: 14px;
        }

        .preloader--three .loading--text {
            font-size: 80px;
        }

        .testimonial--section.three .section-content--wrap .heading--wrap {
            font-size: 12px;
            margin-bottom: 14px !important;
        }

        .blog--section.three .heading--wrap {
            font-size: 12px;
            margin-bottom: 14px !important;
        }

        .cta--section.one .cta-slider--wrap {
            display: none !important;
        }
    }

    @media (max-width: 545px) {
        .hero-section.one .banner--title {
            font-size: 95px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 95px;
        }

        .service--section.one .content--wrap .title {
            font-size: 95px;
        }

        .achievement--section .content--wrap .title {
            font-size: 95px;
        }
    }

    @media (max-width: 530px) {
        .growth--section.one .growth-thumb--wrap {
            display: none;
        }

        .growth--section.one .section-content--wrap .title {
            font-size: 45px;
        }

        .growth--section.one .section-content--wrap {
            padding: 0;
        }
    }

    @media (max-width: 498px) {
        .hero-section.one .banner--title {
            font-size: 85px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 85px;
        }

        .service--section.one .content--wrap .title {
            font-size: 85px;
        }

        .achievement--section .content--wrap .title {
            font-size: 85px;
        }
    }

    @media (max-width: 451px) {
        .hero-section.one .banner--title {
            font-size: 75px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 75px;
        }

        .service--section.one .content--wrap .title {
            font-size: 75px !important;
        }

        .achievement--section .content--wrap .title {
            font-size: 75px;
        }

        .breadcrumb .breadcrumb--title {
            font-size: 60px;
        }
    }

    @media (max-width: 425px) {
        .hero-section.one .hero--element.one {
            display: none !important;
        }

        .hero-section.one .bg--thumb {
            width: 300px;
        }

        .hero-section.one .hero--element.two {
            display: none !important;
        }

        .hero-section.one .hero--element.three {
            display: none !important;
        }

        .hero-section.one .banner--title {
            font-size: 70px;
        }

        .hero-section.one .hero--description {
            font-size: 26px !important;
        }

        .about--section.one .section--text {
            font-size: 70px;
        }

        .portfolio--section .content--wrap .discription {
            font-size: 20px;
        }

        .portfolio--section .content--wrap .discription span {
            margin-right: 14px;
            top: -8px;
            font-size: 12px !important;
        }

        .portfolio--section .content--wrap .title {
            font-size: 90px;
        }

        .pb-120 {
            padding-bottom: 70px !important;
        }

        .pt-120 {
            padding-bottom: 70px !important;
        }

        .py-120 {
            padding: 70px 0 !important;
        }

        .service--section.one .content--wrap .discription {
            font-size: 25px !important;
        }

        .service--section.one .content--wrap .discription span {
            margin-right: 14px;
            top: -8px;
            font-size: 12px !important;
        }

        .header-cta--btn {
            display: none !important;
        }

        .hero-section.five .title {
            font-size: 43px;
        }

        .hero-section.five .description {
            width: 100%;
            margin-bottom: 25px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -12%;
        }

        .hero-section.five .hero-input--wrap .hero-search--btn {
            padding: 6px 12px;
            font-size: 14px;
        }

        .hero-section.five .hero-input--wrap .hero--input {
            padding: 12px 35px;
        }

        .hero-section.five .hero--marque .thumb--wrap {
            height: 230px;
        }

        .footer--section.five .subscribe-form--wrap {
            width: 100%;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 45px;
            height: 50px;
        }
    }

    @media (max-width: 404px) {
        .hero-section.one .banner--title {
            font-size: 65px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 65px;
        }

        .service--section.one .content--wrap .title {
            font-size: 65px !important;
        }

        .achievement--section .content--wrap .title {
            font-size: 65px;
        }
    }

    @media (max-width: 376px) {
        .blog--card.two .thumb--wrap {
            height: 214px;
        }

        .blog--card.two .thumb--wrap .user--thumb {
            width: 44px;
            height: 44px;
        }
    }

    @media (max-width: 356px) {
        .hero-section.one .banner--title {
            font-size: 60px;
        }

        .portfolio--section .content--wrap .title {
            font-size: 60px;
        }

        .service--section.one .content--wrap .title {
            font-size: 60px !important;
        }

        .achievement--section .content--wrap .title {
            font-size: 60px;
        }
    }

    @media (max-width: 375px) {
        .partner--section.five .title {
            font-size: 28px !important;
        }

        .work-section--wrap.bg--black .section-content--wrap h2 {
            font-size: 28px !important;
        }

        .testimonial--section.five .section-content--wrap .title {
            font-size: 28px !important;
        }

        .price--section.one .container-fluid .section-content--wrap .title {
            font-size: 28px !important;
        }

        .faq--section.one .section-content--wrap .title {
            font-size: 28px !important;
        }

        .blog--section.five .container-fluid .section-content--wrap .title {
            font-size: 28px !important;
        }

        .about--section.five .section--content h2 {
            font-size: 28px !important;
        }

        .hero-section.five .title {
            font-size: 28px;
        }

        .footer--section.five .subscribe-form--wrap .btn-style--three {
            right: -16%;
        }
    }

    body.dark {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .header-main-area.six .normal-logo img {
        filter: invert(1);
    }

    body.dark .header-main-area.five .normal-logo img {
        filter: invert(1);
    }

    body.dark .hero-section.two {
        background-color: var(--black);
    }

    body.dark .partner--card.one .thumb--wrap {
        background-color: var(--body-bg-two) !important;
        border: 1px solid var(--black-l-100);
    }

    body.dark .hero-section.two .banner--title {
        color: var(--white) !important;
    }

    body.dark .header-main-area.two .header--description {
        color: var(--white) !important;
    }

    body.dark .header-main-area.two .header-wrapper .main-menu .menu {
        color: var(--white) !important;
    }

    body.dark .hero-section.two .scroll-down--wrap p {
        color: var(--white) !important;
    }

    body.dark .partner--section.one {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .partner--card.one .thumb--wrap img {
        filter: invert(1);
    }

    body.dark .counter--section.one .shape--wrap img {
        filter: invert(1);
    }

    body.dark .video--section .video--btn img {
        filter: invert(1);
    }

    body.dark .hero-section.two .element--wrap .counter .number {
        color: var(--white);
    }

    body.dark .hero-section.two .social-item--wrap a {
        border: 1px solid var(--white);
        color: var(--white);
    }

    body.dark .hero-section.two .social-item--wrap a:hover {
        color: var(--primary);
    }

    body.dark .header-main-area.two .header-wrapper {
        border-top: 1px dashed var(--white);
    }

    body.dark .hero-section.two .element--wrap .counter p {
        color: var(--white);
    }

    body.dark .hero-section.two .element--wrap .counter {
        border-left: 1px dashed var(--white);
        border-bottom: 1px dashed var(--white);
    }

    body.dark .hero-section.two .element--wrap .counter .br--shape {
        border-left: 1px dashed var(--white);
        border-bottom: 1px dashed var(--white);
    }

    body.dark section.counter--section.one.bg--secondary.pin-area {
        background: var(--body-bg-three) !important;
    }

    body.dark .preloader--five {
        background: var(--white);
    }

    body.dark .preloader--five .loading-text {
        color: var(--black);
    }

    body.dark .btn-style--four.light {
        color: var(--white);
    }

    body.dark .btn-style--three.light {
        color: var(--white);
    }

    body.dark .custom--accordion .accordion-item {
        border: 1px solid #2c2c2c !important;
    }

    body.dark .faq--section.one .section-element--wrap .element {
        border: 1px solid #2c2c2c !important;
    }

    body.dark .hero-section.five .hero-input--wrap .hero--input {
        background-color: var(--white);
    }

    body.dark .hero-section.five .hero-slider--wrap .slider-shadow {
        background-image: linear-gradient(90deg, #1E1F22 35%, rgba(30, 31, 34, 0));
    }

    body.dark .hero-section.five .hero-slider--wrap .slider-shadow.two {
        background-image: linear-gradient(270deg, #1E1F22 35%, rgba(30, 31, 34, 0));
    }

    body.dark .testimonial--card.five {
        border: 1px solid #2c2c2c;
        box-shadow: 23px 27px 40px rgba(16, 23, 0, 0.08);
    }

    body.dark .counter--card.five {
        border: 2px solid #2c2c2c;
    }

    body.dark .solution--card h6 {
        color: var(--white);
    }

    body.dark .solution--card p {
        color: var(--white);
    }

    body.dark .step--card {
        box-shadow: inset 3px 3px 30px rgba(255, 255, 255, 0.45);
    }

    body.dark .price--card.one p {
        color: var(--black) !important;
    }

    body.dark .price--card.one h6 {
        color: var(--black) !important;
    }

    body.dark .price--card.one h4 {
        color: var(--black) !important;
    }

    body.dark .price--card.one .tag {
        color: var(--black) !important;
    }

    body.dark .footer--section.five {
        color: var(--black) !important;
    }

    body.dark .footer--section.five h2 {
        color: var(--black) !important;
    }

    body.dark .footer--section.five h6 {
        color: var(--black) !important;
    }

    body.dark .footer--section.five p {
        color: var(--black) !important;
    }

    body.dark .footer--section.five a {
        color: var(--black) !important;
    }

    body.dark .footer--section.five a:hover {
        color: var(--secondary) !important;
    }

    body.dark .footer--section.five .subscribe-form--wrap input {
        color: var(--black) !important;
    }

    body.dark .footer--section.five .subscribe-form--wrap input::placeholder {
        color: var(--black) !important;
    }

    body.dark .featured--section .section-content--wrap .l-brc {
        color: var(--black);
    }

    body.dark .featured--section .section-content--wrap .r-brc {
        color: var(--black);
    }

    body.dark .service--section.two .section-content--wrap .title {
        color: var(--black);
    }

    body.dark .blog--section.one .section-content--wrap .title {
        color: var(--black);
    }

    body.dark .partner--section.one .section-content--wrap .title {
        color: var(--black);
    }

    body.dark .footer--section.two .content--wrap .description {
        color: var(--black) !important;
    }

    body.dark .footer--section.two h6 {
        color: var(--black) !important;
    }

    body.dark .footer--section.two p {
        color: var(--black) !important;
    }

    body.dark .footer--section.two i {
        color: var(--black) !important;
    }

    body.dark .footer--section.two a {
        color: var(--black) !important;
    }

    body.dark .footer--section.two a:hover {
        color: var(--secondary) !important;
    }

    body.dark .footer--section.two span {
        color: var(--black) !important;
    }

    body.dark .footer--section.two .footer--card {
        border-right: 1px dashed var(--black-l-100);
    }

    body.dark .footer--section.two .footer--card::after {
        border-right: 1px dashed var(--black-l-100);
    }

    body.dark .footer--section.two .footer-link--wrap {
        border-top: 1px dashed var(--black-l-100);
    }

    body.dark .footer--section.two .footer-link--wrap::after {
        border-top: 1px dashed var(--black-l-100);
    }

    body.dark .footer--section.two .footer--btn {
        color: var(--white) !important;
    }

    body.dark .footer--section.two .footer--btn span {
        color: var(--white) !important;
    }

    body.dark .footer--section.two .footer--btn:hover {
        border: 1px dashed var(--black) !important;
        color: var(--black) !important;
    }

    body.dark .contact--card.two textarea {
        background-color: #191919;
    }

    body.dark .contact--card.two input {
        background-color: #191919;
    }

    body.dark .text-slide--wrap .text--slide .slide--title.text--stroke {
        text-shadow: 1px 1px 0 var(--black-l-200), -1px -1px 0 var(--black-l-200), 1px -1px 0 var(--black-l-200), -1px 1px 0 var(--black-l-200), 1px 1px 0 var(--black-l-200);
        -webkit-text-fill-color: var(--white);
        -webkit-text-stroke-width: 0;
        color: transparent !important;
    }

    body.dark .header-cta--btn.two {
        background-color: var(--black);
        border: 1px solid var(--white-l-100);
    }

    body.dark .hero-section.three {
        background-image: repeating-radial-gradient(circle at 0 0, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.05) 1px, transparent 1px, transparent 2px);
    }

    body.dark .service--section.three .section-content--wrap span {
        color: var(--black);
    }

    body.dark .why-choose--section .section-content--wrap .heading--wrap {
        color: var(--black);
    }

    body.dark .testimonial--section.three {
        background-image: repeating-radial-gradient(circle at 0 0, var(--body-bg-three), var(--body-bg-three) 1px, transparent 1px, transparent 2px);
    }

    body.dark .footer--section.three {
        background-color: var(--white) !important;
    }

    body.dark .footer--section.three .footer--marque ul li h6 {
        color: var(--black) !important;
    }

    body.dark .text-stroke--white {
        color: transparent !important;
        -webkit-text-stroke: 1px var(--black);
    }

    body.dark .footer--section.three a {
        color: var(--black) !important;
    }

    body.dark .footer--section.three a:hover {
        color: var(--primary) !important;
    }

    body.dark .footer--section.three p {
        color: var(--black) !important;
    }

    body.dark .footer--section.three .fifth--card .corner--shape {
        background-color: var(--white);
    }

    body.dark .hero-section.three .scroll-down--wrap img {
        filter: invert(1);
    }

    body.dark .header-cta--btn {
        background-color: var(--black);
        border: 1px solid var(--white-l-100);
        color: var(--white);
    }

    body.dark .hero-section.four h1 span {
        color: var(--black) !important;
    }

    body.dark .hero-section.four .hero-sm--text {
        color: var(--black) !important;
    }

    body.dark .hero-section.four .tag--wrap .tag p {
        color: var(--black) !important;
    }

    body.dark .hero-section.four .tag--wrap .tag {
        border: 1px solid var(--black);
    }

    body.dark .hero-section.four .tag--wrap .tag .dot {
        background-color: var(--black);
    }

    body.dark .header-wrapper .main-menu .menu {
        color: var(--black) !important;
    }

    body.dark .header-main-area.four .social-item--wrap .item {
        border: 1px solid var(--black);
    }

    body.dark .header-main-area.four .social-item--wrap .item i {
        color: var(--black) !important;
    }

    body.dark .header-main-area.four .social-item--wrap .item:hover i {
        color: var(--white) !important;
    }

    body.dark .header-main-area.four .header::after {
        border-bottom: 1px dashed var(--black-l-300);
    }

    body.dark .header-main-area.four .header {
        border-bottom: 1px dashed var(--black-l-300);
    }

    body.dark .partner--card.three img {
        filter: invert(1);
    }

    body.dark .service--card.four .content--wrap .title {
        color: var(--black) !important;
    }

    body.dark .service--card.four .content--wrap .description {
        color: var(--black) !important;
    }

    body.dark .service--card.four .content--wrap p {
        color: var(--black) !important;
    }

    body.dark .testimonial--section.four {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .testimonial--section.four .section-content--wrap .title {
        color: var(--black) !important;
    }

    body.dark .testimonial--card.four h6 {
        color: var(--white) !important;
    }

    body.dark .testimonial--card.four p {
        color: var(--white) !important;
    }

    body.dark .counter--card.four h6 {
        color: var(--black) !important;
    }

    body.dark .counter--card.four p {
        color: var(--black) !important;
    }

    body.dark .growth--section.one {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .footer--section.four .title {
        color: var(--black) !important;
    }

    body.dark .footer--section.four .email {
        color: var(--black) !important;
    }

    body.dark .footer--section.four .social-item--wrap .item {
        border: 1px solid var(--black);
    }

    body.dark .footer--section.four .social-item--wrap .item p {
        color: var(--black) !important;
    }

    body.dark .footer--section.four .social-item--wrap .item .dot {
        background-color: var(--black);
    }

    body.dark .footer--section.four .social-item--wrap .item:hover p {
        color: var(--secondary) !important;
    }

    body.dark .footer--section.four .social-item--wrap .item:hover .dot {
        background-color: var(--secondary);
    }

    body.dark .contact--card.four {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .hero-section.one {
        background-color: var(--white) !important;
    }

    body.dark .hero-section.one .text--body {
        color: var(--black);
    }

    body.dark .header-main-area.one .text--body {
        color: var(--black);
    }

    body.dark .header-main-area.one .text--body:hover {
        color: var(--primary);
    }

    body.dark .hero-section.one .hero--element .dot--lg {
        border: 1px solid var(--black);
    }

    body.dark .hero-section.one .hero--element .dot--lg .dot--md {
        background-color: var(--black);
    }

    body.dark .portfolio--section .video--wrap::after {
        background-color: var(--white-l-500);
    }

    body.dark .portfolio--section .content--wrap .title {
        color: var(--black);
    }

    body.dark .portfolio--section .content--wrap .discription span {
        color: var(--white) !important;
    }

    body.dark .testimonial--section.three .section-content--wrap .heading--wrap {
        color: var(--black);
    }

    body.dark .testimonial--card.one {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .testimonial--card.one .icon--wrap img {
        filter: invert(1);
    }

    body.dark .achievement--section.bg--black {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .achievement--section .content--wrap .discription {
        color: var(--black) !important;
    }

    body.dark .achievement--section .content--wrap .title {
        color: var(--black) !important;
    }

    body.dark .achievement--section .achievement--list .achievement a {
        color: var(--black) !important;
    }

    body.dark .achievement--section .achievement--list .achievement a:hover {
        color: var(--primary) !important;
    }

    body.dark .achievement--section .achievement--list .achievement {
        border: 1px solid var(--black-l-200);
    }

    body.dark .achievement--section .achievement--list .achievement .achievement--tag p {
        color: var(--black) !important;
    }

    body.dark .achievement--section .achievement--list .achievement .achievement--tag .dot {
        background-color: var(--black) !important;
    }

    body.dark .achievement--section .achievement--list .achievement .achievement--tag {
        border: 1px solid var(--black-l-200);
    }

    body.dark .service--section.one .bg-shape--one img {
        filter: brightness(0.07);
    }

    body.dark .footer--section.one .bg--shape-one img {
        filter: brightness(0.07);
    }

    body.dark .footer--section.one .bg--shape-two img {
        filter: brightness(0.07);
    }

    body.dark .service--section.one .content--wrap .discription span {
        background-color: var(--black);
    }

    body.dark .partner--section.five {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .partner--section.five .partner-thumb--wrap .partner--thumb {
        background-color: var(--black-l-100) !important;
    }

    body.dark .blog--card.five {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .custom--accordion.one .icon--wrap img {
        filter: invert(1);
    }

    body.dark .cta--section.two .section-content--wrap .title {
        color: var(--white) !important;
    }

    body.dark .cta--section.two .section-content--wrap .description {
        color: var(--white) !important;
    }

    body.dark .hero-section.five .hero-input--wrap .hero--input {
        color: var(--black) !important;
    }

    body.dark .partner--card.two .thumb--wrap {
        background-color: var(--body-bg-three) !important;
    }

    body.dark .partner--card.two .thumb--wrap img {
        filter: invert(1);
    }

    body.dark .work--section.one .section-content--wrap .heading--wrap {
        color: var(--black) !important;
    }

    body.dark .blog--section.three .heading--wrap {
        color: var(--black) !important;
    }

    body.dark .work--card.one .content--wrap .work--btn img {
        filter: invert(1);
    }

    body.dark .blog--card.two .blog--btn svg path {
        stroke: var(--black);
    }

    body.dark .blog--card.two .blog--btn:hover svg path {
        stroke: var(--primary);
    }

    body.dark .preloader--three {
        background-color: var(--white);
    }

    body.dark .preloader--three .loading--text {
        color: var(--black);
    }

    body.dark .preloader--four .loading--text {
        color: var(--black);
    }

    body.dark .preloader--four .block {
        background: var(--white);
    }

    body.dark .partner--card.three {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .partner--card.three .thumb--wrap {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .btn--rounded:hover {
        color: var(--white);
    }

    body.dark .header-main-area.one .btn-style--two.light .btn--text {
        background-color: var(--black);
        color: var(--white);
    }

    body.dark .header-main-area.one .btn-style--two.light .btn--circle {
        background-color: var(--black);
    }

    body.dark .header-main-area.one .btn-style--two.light .btn--circle svg path {
        fill: var(--white);
    }

    body.dark .service--section.one .bg-shape--one {
        top: -1px;
    }

    body.dark .contact--section.one .contact--btn.one {
        color: var(--black);
    }

    body.dark .contact--section.one .contact--btn.one svg path {
        stroke: var(--black);
    }

    body.dark .breadcrumb--item--text {
        color: var(--black-l-700);
    }

    body.dark .custom--accordion.three .accordion-item {
        border: 0 !important;
        border-bottom: 1px solid var(--black-l-100) !important;
    }

    body.dark .custom--accordion.three .accordion-button .icon--wrap img {
        filter: invert(1);
    }

    body.dark .text-slide--wrap .text--slide .slide--title {
        color: var(--black) !important;
    }

    body.dark .why-choose--section.five .content--wrap .heading {
        color: var(--black-l-700) !important;
    }

    body.dark .why-choose--section.five .content--wrap .feature--list img {
        filter: invert(1);
    }

    body.dark .btn--dark:hover,
    body.dark .btn--dark:active,
    body.dark .btn--dark:focus {
        background: var(--black-l-100) !important;
        color: var(--black) !important;
    }

    body.dark .pricing-cta--btn:hover,
    body.dark .pricing-cta--btn:active,
    body.dark .pricing-cta--btn:focus {
        color: var(--white) !important;
    }

    body.dark .counter--card.two .dot i {
        color: var(--black) !important;
    }

    body.dark .price--btn.active {
        color: var(--white);
    }

    body.dark .price--btn.active:hover {
        color: var(--primary);
    }

    body.dark .service--details .description {
        color: #d3d3d3;
    }

    body.dark .portfolio--details .description {
        color: #d3d3d3;
    }

    body.dark .details--btn img {
        filter: invert(1);
    }

    body.dark .latest-blog .latest-blog--date {
        color: var(--black-l-800);
    }

    body.dark .team--card.two h6 {
        color: var(--black) !important;
    }

    body.dark .team--card.two .social--info a {
        color: var(--black) !important;
        border: 1px solid var(--black-l-100);
    }

    body.dark .error--page .thumb--wrap svg path {
        fill: var(--black);
    }

    body.dark .error--page .thumb--wrap svg .circle {
        fill: var(--primary);
    }

    body.dark .pagination .page-item .page-link {
        color: var(--black);
    }

    body.dark .blog--details .description {
        color: #d3d3d3;
    }

    body.dark .blog--details .blockquote--wrap blockquote {
        color: var(--black);
    }

    body.dark .comment--box .single-comment .auth-info i {
        color: #d3d3d3;
    }

    body.dark .comment--box input {
        background: var(--body-bg-two);
    }

    body.dark .comment--box textarea {
        background: var(--body-bg-two);
    }

    body.dark .blog--card.masonry .blog-items__title {
        color: var(--black);
        text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.6);
    }

    body.dark .blog--card.masonry .blog-items__title.hover-link--light {
        background-image: linear-gradient(transparent calc(100% - 2px), var(--black) 5px);
    }

    body.dark .blog--card.masonry .blog-items__date {
        color: var(--black-l-900);
    }

    body.dark .blog--card.masonry .blog-items__info {
        text-shadow: 2px 2px 4px var(--white);
    }

    body.dark .blog--card.masonry .blog-items__info-title {
        color: var(--black);
    }

    body.dark .blog--card.masonry .blog-items__info-desc {
        color: var(--black);
    }

    body.dark .offcanvas {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .offcanvas .normal-logo img {
        filter: invert(1);
    }

    body.dark .offcanvas .logo--wrap img {
        filter: invert(1);
    }

    body.dark .header-wrapper .ham__menu {
        color: var(--black);
    }

    body.dark .offcanvas .contact-info--wrap .location--item .icon--wrap i {
        color: var(--black);
    }

    body.dark .why-choose--section.bg--black {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .why-choose--section .section-content--wrap .title {
        color: var(--black) !important;
    }

    body.dark .why-choose--section .section-content--wrap .title-underline--light {
        background-image: linear-gradient(transparent calc(100% - 2px), var(--black) 5px) !important;
    }

    body.dark .why-choose--section .thumb--wrap.xl .video--btn i {
        color: var(--black);
    }

    body.dark .counter--card.two h6 {
        color: var(--black) !important;
    }

    body.dark .counter--card.two p {
        color: var(--black) !important;
    }

    body.dark .testimonial--card.three {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .testimonial--card.three .star--thumb img {
        filter: invert(1);
    }

    body.dark .cta--section.one {
        background-color: var(--body-bg-two) !important;
    }

    body.dark .cta--section.one .title {
        color: var(--black) !important;
    }

    body.dark .side-navigation--wrap .side--navigation .close--btn i {
        color: var(--black) !important;
    }

    body.dark .blog--card.one .blog--btn svg path {
        stroke: var(--black);
    }

    body.dark .blog--card.one .blog--btn:hover svg path {
        stroke: var(--primary);
    }

    body.dark .cta--section.one .section-content--wrap .form--wrap {
        background-color: var(--black-l-100) !important;
    }

    body.dark .cta--section.one .section-content--wrap .form--wrap input {
        color: var(--black) !important;
    }

    body.dark .cta--section.one .section-content--wrap .form--wrap input::placeholder {
        color: var(--black-l-700) !important;
    }

    body.dark .cta--section.one .section-content--wrap .form--wrap .input--wrap {
        border-bottom: 1px solid var(--black-l-200);
    }

    body.dark .side-navigation--wrap .side--navigation .logo--wrap img {
        filter: invert(1);
    }
    /*# sourceMappingURL=main.css.map */


    /* CUSTOM PROJECT CARD STYLES */
    .project-card-custom {
        position: relative;
        background: #ffffff;
        border-radius: 20px;
        overflow: hidden;
        border: 1px solid #eeeeee;
        transition: all 0.4s ease;
        cursor: pointer;
        height: 100%;
    }

    .project-image-container {
        position: relative;
        width: 100%;
        height: 350px;
        overflow: hidden;
        background: #000;
    }

    .project-img-zoom {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transform: scale(1);
        transition: transform 0.5s ease-in-out !important;
    }

    .project-card-custom:hover .project-img-zoom {
        transform: scale(1.5);
    }

    .project-overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0);
        transition: background 0.4s ease;
        pointer-events: none;
        z-index: 1;
    }

    .project-card-custom:hover .project-overlay {
        background: rgba(0, 0, 0, 0.15);
    }

    .project-content-custom {
        padding: 25px 30px;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #fff;
        position: relative;
        z-index: 2;
    }

    .project-title {
        font-family: var(--body-font);
        font-size: 22px;
        font-weight: 700;
        color: #000;
        margin: 0;
    }

    .project-card-custom:hover {
        box-shadow: 0 20px 40px rgba(0, 0, 0, 0.1);
        border-color: var(--tertiary-color);
    }

    @media (max-width: 768px) {
        .project-image-container {
            height: 280px;
        }
        .project-title {
            font-size: 18px;
        }
    }

    /* CAREER PAGE CUSTOM STYLES */
    .career-input {
        border: 1px solid #e0e0e0;
        padding: 12px 20px;
        border-radius: 10px;
        font-size: 16px;
        background: #f9f9f9;
        transition: all 0.3s ease;
    }
    .career-input:focus {
        border-color: var(--tertiary-color);
        box-shadow: 0 0 0 3px rgba(var(--tertiary-rgb), 0.1);
        background: #fff;
        outline: none;
    }
    .benefit-card {
        transition: all 0.4s ease;
    }
    .benefit-card:hover {
        transform: translateY(-10px);
        border-color: var(--tertiary-color);
        box-shadow: 0 20px 40px rgba(0,0,0,0.05);
    }
    .radius--30 {
        border-radius: 30px;
    }







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

    .aimstorms-about-section{
        background:#ffffff;
        padding:60px 0;
        overflow:hidden;
    }

    .aimstorms-about-wrapper{
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:80px;
    }

    /* Left Image */

    .aimstorms-about-image-left{
        width:36%;
        position:relative;
    }

    .aimstorms-about-image-left img{
        width:100%;
        height:570px;
        object-fit:cover;
        display:block;
    }

    /* Center Content */

    .aimstorms-about-content{
        width:40%;
        position:relative;
    }

    /*.aimstorms-about-dot{*/
    /*    width:18px;*/
    /*    height:18px;*/
    /*    background:#000;*/
    /*    border-radius:50%;*/
    /*    position:absolute;*/
    /*    left:-80px;*/
    /*    top:-70px;*/
    /*}*/

    .aimstorms-about-text{
    font-weight: 400;
        word-break: break-word;
        color: var(--body-color);
        line-height: 1.1;
    }

    .aimstorms-about-stats{
        display:flex;
        align-items:center;
        gap:50px;
    }

    .aimstorms-about-stat-box h5{
        font-size:20px;
        font-weight:500;
        margin-bottom:10px;
        color:#222;
        font-family: 'Cormorant Garamond', serif;
    }

    .aimstorms-about-stat-box h2{
        font-size:70px;
        line-height:1;
        font-weight:500;
        color:#000;
        margin:0;
        font-family: 'Cormorant Garamond', serif;
    }

    .aimstorms-about-divider{
        width:1px;
        height:220px;
        background:#D4AF37;
        transform:rotate(12deg);
    }

    /* Right Image */

    .aimstorms-about-image-right{
        width:18%;
        display:flex;
        justify-content:flex-end;
    }

    .aimstorms-about-image-right img{
        width:250px;
        height:320px;
        object-fit:cover;
        display:block;
    }

    /* Hover Effects */

    .aimstorms-about-image-left img,
    .aimstorms-about-image-right img{
        transition:all .5s ease;
    }

    .aimstorms-about-image-left:hover img,
    .aimstorms-about-image-right:hover img{
        transform:scale(1.05);
    }

    /* Responsive */

    @media(max-width:1200px){

        .aimstorms-about-wrapper{
            gap:50px;
        }

        .aimstorms-about-text{
            font-size:28px;
        }

        .aimstorms-about-stat-box h2{
            font-size:75px;
        }
    }

    @media(max-width:991px){

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

        .aimstorms-about-image-left,
        .aimstorms-about-content,
        .aimstorms-about-image-right{
            width:100%;
        }

        .aimstorms-about-image-left img{
            height:auto;
        }

        .aimstorms-about-image-right{
            justify-content:center;
        }

        .aimstorms-about-dot{
            display:none;
        }

        .aimstorms-about-stats{
            justify-content:center;
        }

        .aimstorms-about-divider{
            height:150px;
        }

        .aimstorms-about-text{
            font-size:24px;
            margin-bottom:50px;
        }
    }

    @media(max-width:576px){

        .aimstorms-about-section{
            padding:70px 0;
        }

        .aimstorms-about-text{
            font-size:18px;
            line-height:1.8;
        }

        .aimstorms-about-stat-box h2{
            font-size:55px;
        }

        .aimstorms-about-stat-box h5{
            font-size:18px;
        }

        .aimstorms-about-image-right img{
            width:180px;
            height:240px;
        }

        .aimstorms-about-stats{
            gap:25px;
        }
    }


    /* AIMSTORMS CTA CARD */

    .aimstorms-whatsapp-cta{
        background: linear-gradient(135deg,#000,#111,#1c1c1c);
        border-radius:20px;
        padding:35px 25px;
        height:100%;
        min-height:320px;
        display:flex;
        flex-direction:column;
        justify-content:center;
        align-items:center;
        text-align:center;
        position:relative;
        overflow:hidden;
        transition:.4s ease;
            padding: 14px 14px;
    }

    .aimstorms-whatsapp-cta::before{
        content:"";
        position:absolute;
        width:180px;
        height:180px;
        background:#D4AF37;
        opacity:.08;
        border-radius:50%;
        top:-60px;
        right:-60px;
    }

    .aimstorms-whatsapp-cta:hover{
        transform:translateY(-8px);
    }

    .aimstorms-cta-tag{
        background:#D4AF37;
        color:#000;
        font-size:12px;
        font-weight:700;
        letter-spacing:1px;
        text-transform:uppercase;
        padding:8px 15px;
        border-radius:30px;
        margin-bottom:20px;
    }

    .aimstorms-whatsapp-cta h3{
        color:#fff;
        font-size:20px;
        line-height:1.3;
        font-weight:700;
        font-family: var(--body-font);
    }

    .aimstorms-whatsapp-cta p{
        color:rgba(255,255,255,.75);
        font-size:15px;
        line-height:1.8;
        margin-bottom:25px;
    }

    .aimstorms-whatsapp-btn{
        background:#25D366;
        color:#fff;
        text-decoration:none;
        padding:14px 28px;
        border-radius:50px;
        display:inline-flex;
        align-items:center;
        gap:10px;
        font-size:16px;
        font-weight:600;
        transition:.3s ease;
    }

    .aimstorms-whatsapp-btn:hover{
        background:#fff;
        color:#25D366;
        transform:translateY(-3px);
    }

    .aimstorms-whatsapp-btn i{
        font-size:22px;
    }



    .partner--section.five .section-content--wrap {
        padding-top: 50px;
    }



    /*forms*/ 

    /* ===================================
    AIMSTORMS POPUP
    =================================== */

    .aimstorms-popup-overlay{
        position:fixed !important;
        top:0;
        left:0;
        width:100%;
        height:100vh;
        display:none;
        justify-content:center;
        align-items:center;
        background:rgba(0,0,0,0.85);
        z-index:99999999 !important;
        overflow-y:auto;
        padding:20px;
        
    }

    .aimstorms-popup-overlay{
        transform:none !important;
    }

    .aimstorms-popup-box{
        position:relative;
        width:100%;
        max-width:550px;
        margin:auto;
        background:#fff;
        border-radius:20px;
        z-index:999999999;
    }

    @keyframes popupZoom{
        from{
            opacity:0;
            transform:translateY(30px) scale(.9);
        }
        to{
            opacity:1;
            transform:translateY(0) scale(1);
        }
    }

    .aimstorms-popup-close{
        position:absolute;
        right:18px;
        top:15px;
        border:none;
        background:#000;
        color:#fff;
        width:40px;
        height:40px;
        border-radius:50%;
        font-size:24px;
        cursor:pointer;
        transition:.3s;
    }

    .aimstorms-popup-close:hover{
        background:#c9a227;
        color:#000;
    }

    .aimstorms-popup-heading{
        background: linear-gradient(135deg, #1d1515, #4e4040);
        padding:40px 35px;
        text-align:center;
    font-family: var(--body-font);
    }

    .aimstorms-popup-heading h3{
        color:#fff;
        margin:0 0 10px;
        font-size:30px;
        font-weight:700;
            font-family: var(--body-font);
    }

    .aimstorms-popup-heading p{
        color:rgba(255,255,255,.75);
        margin:0;
    }

    #aimstorms-company-form,
    #aimstorms-contact-form{
        padding:35px;
    }

    .aimstorms-form-group{
        margin-bottom:18px;
    }

    .aimstorms-form-group input,
    .aimstorms-form-group textarea{
        width:100%;
        border:1px solid #ddd;
        border-radius:12px;
        padding:14px 18px;
        font-size:15px;
        transition:.3s;
    }

    .aimstorms-form-group input:focus,
    .aimstorms-form-group textarea:focus{
        outline:none;
        border-color:#c9a227;
        box-shadow:0 0 0 4px rgba(201,162,39,.15);
    }

    .aimstorms-submit-btn{
        width:100%;
        border:none;
        background:#c9a227;
        color:#000;
        font-size:16px;
        font-weight:700;
        padding:15px;
        border-radius:12px;
        cursor:pointer;
        transition:.3s;
    }

    .aimstorms-submit-btn:hover{
        background:#000;
        color:#fff;
    }

    @media(max-width:576px){

        .aimstorms-popup-box{
            max-width:100%;
        }

        .aimstorms-popup-heading{
            padding:30px 20px;
        }

        .aimstorms-popup-heading h3{
            font-size:24px;
        }

        #aimstorms-company-form,
        #aimstorms-contact-form{
            padding:25px 20px;
        }
    }


    /*about*/

    .about-aimstorms-section{
        background:#f7f7f7;
        padding:40px;
    }

    .about-aimstorms-main-card,
    .about-aimstorms-stat-card,
    .about-aimstorms-image-card,
    .about-aimstorms-service-card{
        border-radius:12px;
        overflow:hidden;
    }

    /* LEFT CARD */

    .about-aimstorms-main-card{
        min-height:530px;
        position:relative;
        background:
        linear-gradient(rgba(255,245,236,.92),rgba(255,245,236,.92)),
        url('https://images.unsplash.com/photo-1557683316-973673baf926?q=80&w=1600&auto=format&fit=crop');
        background-size:cover;
        background-position:center;
        display:flex;
        align-items:flex-end;
        padding:50px;
    }

    .about-aimstorms-shape{
        position:absolute;
        top:40%;
        left:30px;
        font-size:40px;
        color:#fff;
        line-height:.6;
    }

    .about-aimstorms-content h2{
        font-size:54px;
        line-height:1.1;
        color:#111;
        font-weight:700;
        max-width:650px;
        margin-bottom:25px;
    }

    .about-aimstorms-content p{
        color:#555;
        max-width:700px;
        margin-bottom:30px;
    }

    .about-aimstorms-btn-wrap{
        display:flex;
        align-items:center;
        gap:12px;
    }

    .about-aimstorms-btn{
        background:#b7db45;
        color:#000;
        padding:14px 28px;
        border-radius:50px;
        text-decoration:none;
        font-weight:600;
    }

    .about-aimstorms-arrow{
        width:48px;
        height:48px;
        background:#b7db45;
        color:#000;
        border-radius:50%;
        display:flex;
        align-items:center;
        justify-content:center;
        text-decoration:none;
        font-size:20px;
    }

    /* TOP RIGHT */

    .about-aimstorms-stat-card{
        height:255px;
        padding:40px;
        background:
        url('https://images.unsplash.com/photo-1579546929518-9e396f3cc809?q=80&w=1600&auto=format&fit=crop');
        background-size:cover;
        background-position:center;
    }

    .about-aimstorms-stat{
        /*display:flex;*/
        /*align-items:flex-start;*/
        gap:15px;
            justify-content: center;
            text-align:center;
    }

    .about-aimstorms-stat span{
        font-size:42px;
        font-weight:800;
        color:#484324;
        line-height:1;
    }

    .about-aimstorms-stat p{
    margin-top:20px;
        line-height:1;
    }

    .about-aimstorms-stat small{
        color:#111;
        font-size:12px;
        margin-top:10px;
        letter-spacing:1px;
    }

    /* IMAGE CARD */

    .about-aimstorms-image-card{
        height:255px;
    }

    .about-aimstorms-image-card img{
        width:100%;
        height:100%;
        object-fit:cover;
        transition:.5s;
    }

    .about-aimstorms-image-card:hover img{
        transform:scale(1.08);
    }

    /* SERVICE CARD */

    .about-aimstorms-service-card{
        background:#e8d39c;
        height:255px;
        padding:25px 25px;
        position:relative;
    }

    .about-aimstorms-icon{
        font-size:40px;
        color:#9acd32;
        margin-bottom:25px;
    }

    .about-aimstorms-service-card h4{
        font-size:34px;
        color:#000;
        margin-bottom:15px;
        font-weight:700;
    }

    .about-aimstorms-service-card p{
        color:#444;
        /*line-height:1.8;*/
    }

    /* RESPONSIVE */

    @media(max-width:991px){

        .about-aimstorms-section{
            padding:20px;
        }

        .about-aimstorms-main-card{
            min-height:450px;
            padding:30px;
        }

        .about-aimstorms-content h2{
            font-size:38px;
        }
    }

    @media(max-width:767px){

        .about-aimstorms-content h2{
            font-size:30px;
        }

        .about-aimstorms-stat span{
            font-size:50px;
        }

        .about-aimstorms-stat-card,
        .about-aimstorms-image-card,
        .about-aimstorms-service-card{
            height:auto;
            min-height:250px;
        }
    }


    /*director*/

    .director-messege-section{
        padding:60px 0;
        background:#f7f7f7;
        overflow:hidden;
    }

    .director-messege-heading{
        margin-bottom:80px;
    }

    .director-messege-heading h2{
        font-size:58px;
        line-height:1;
        font-weight:600;
        color:#111;
        /*max-width:700px;*/
    }

    .director-messege-left{
        display:flex;
        flex-direction:column;
        align-items:center;
        gap:80px;
    }

    .director-messege-small-img img{
        width:90px;
        height:90px;
        object-fit:cover;
        border-radius:10px;
    }

    .director-messege-circle-wrap{
        width:240px;
        height:240px;
        position:relative;
    }

    .director-messege-circle-text{
        position:absolute;
        inset:0;
        animation:directorAntiClockwise 18s linear infinite;
    }

    .director-messege-circle-text svg{
        width:100%;
        height:100%;
    }

    .director-messege-circle-text text{
        fill:#111;
        font-size:14px;
        letter-spacing:6px;
        text-transform:uppercase;
    }

    .director-messege-circle-logo{
        position:absolute;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%);
    }

    .director-messege-circle-logo img{
        width:55px;
    }

    @keyframes directorAntiClockwise{
        from{
            transform:rotate(360deg);
        }
        to{
            transform:rotate(0deg);
        }
    }

    .director-messege-content p{
        font-size:20px;
        line-height:2;
        color:#777;
        margin-bottom:35px;
    }

    .director-messege-btn{
        display:inline-flex;
        align-items:center;
        gap:20px;
        background:#1d1d1d;
        color:#fff;
        padding:22px 42px;
        text-decoration:none;
        font-size:20px;
        font-weight:600;
        transition:.4s;
    }

    .director-messege-btn span{
        font-size:24px;
    }

    .director-messege-btn:hover{
        background:#d4af37;
        color:#111;
    }

    .director-messege-image{
        text-align:right;
    }

    .director-messege-image img{
        width:100%;
        max-width:560px;
        aspect-ratio:1/1;
        object-fit:cover;
        border-radius:50%;
    }

    @media(max-width:1399px){

        .director-messege-heading h2{
            font-size:68px;
        }

    }

    @media(max-width:991px){

        .director-messege-section{
            padding:80px 0;
        }

        .director-messege-heading{
            text-align:center;
            margin-bottom:50px;
        }

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

        .director-messege-left{
            margin-bottom:50px;
        }

        .director-messege-content{
            text-align:center;
            margin-bottom:50px;
        }

        .director-messege-image{
            text-align:center;
        }

        .director-messege-image img{
            max-width:420px;
        }

    }

    @media(max-width:576px){

        .director-messege-heading h2{
            font-size:36px;
        }

        .director-messege-content p{
            font-size:18px;
            line-height:1.8;
        }

        .director-messege-circle-wrap{
            width:190px;
            height:190px;
        }

        .director-messege-btn{
            padding:18px 30px;
            font-size:18px;
        }

    }

    /* ==========================================================================
    Mobile Layout Updates (Courses Swiper & Hiding Reviews/Stories)
    ========================================================================== */
    @media (max-width: 767.98px) {
        /* Hide Client Reviews & Client Stories on mobile */
        .testimonial--section.five,
        .testimonial--section.two {
            display: none !important;
        }

        /* Courses Swiper slide adjustment */
        .pegani-courses-swiper .pegani-course-card {
            height: 100% !important;
            margin-bottom: 0 !important;
        }
    }

    @media (min-width: 768px) {
        /* Prevent Swiper from disabling Bootstrap grid wrapper on desktop */
        .pegani-courses-swiper {
            overflow: visible !important;
        }
        .pegani-courses-swiper > .swiper-wrapper {
            display: flex !important;
            flex-wrap: wrap !important;
            width: auto !important;
            transform: none !important;
            margin-left: -12px !important;
            margin-right: -12px !important;
            row-gap: 24px !important;
            --bs-gutter-x: 24px !important;
            --bs-gutter-y: 24px !important;
        }
        .pegani-courses-swiper .swiper-slide {
            margin-right: 0 !important;
            padding-left: 12px !important;
            padding-right: 12px !important;
        }
        /* Explicitly restore Bootstrap grid widths on desktop views */
        .pegani-courses-swiper .col-md-6 {
            width: 50% !important;
        }
    }

    @media (min-width: 992px) {
        .pegani-courses-swiper .col-lg-4 {
            width: 33.33333333% !important;
        }
    }

    @media (min-width: 1200px) {
        .pegani-courses-swiper .col-xl-3 {
            width: 25% !important;
        }
    }