/*------------------------------------------------------------------
[Main Stylesheet]

Project:        Eronix
Version:        1.1
Last change:    15 jan 2026
Primary use:    Multipurpose 

[Table of contents]

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("../../assets/fonts/t1-korium/T1Korium.woff2") format("woff2"), url("../../assets/fonts/t1-korium/T1Korium.woff") format("woff"), url("../../assets/fonts/t1-korium/T1Korium.otf") format("opentype"), url("../../assets/fonts/t1-korium/T1Korium.ttf") format("truetype");
}

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

@font-face {
    font-family: "Clash Display";
  src: url("../../assets/fonts/ClashDisplay/ClashDisplay-Variable.woff2") format("woff2"), url("../../assets/fonts/ClashDisplay/ClashDisplay-Variable.woff") format("woff"), url("../../assets/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(--heading-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: var(--secondary);
    color: var(--black);
}

.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%;
    height: 600px;
    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: 97px;
    font-weight: 400;
    margin-bottom: 50px;
}

.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("../../assets/images/common/mask4.png");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-image: url("../../assets/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: 50px;
}

.price--card .price {
    font-size: 90px;
}

.price--card .content--wrap {
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: var(--tertiary);
    padding: 120px 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 {
    padding: 30px;
    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("../../assets/images/common/mask1.png");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-image: url("../../assets/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("../../assets/images/common/mask2.png");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-image: url("../../assets/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: 90px;
    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("../../assets/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("../../assets/images/common/mask3.png");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-image: url("../../assets/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: 150px;
    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: 370px;
    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: 300px;
}

.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;
    margin-bottom: 130px;
}

.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("../../assets/images/common/mask5.png");
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: cover;
    mask-image: url("../../assets/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%;
    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: 80px;
    }

    .testimonial--section.two .section-content--wrap .title {
        font-size: 130px;
    }

    .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: 80px;
        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: 310px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 310px;
    }

    .service--section.one .content--wrap .title {
        font-size: 310px;
    }

    .achievement--section .content--wrap .title {
        font-size: 310px;
    }

    .breadcrumb .breadcrumb--title {
        font-size: 307px;
    }

    .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: 300px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 300px;
    }

    .service--section.one .content--wrap .title {
        font-size: 300px;
    }

    .achievement--section .content--wrap .title {
        font-size: 300px;
    }

    .breadcrumb .breadcrumb--title {
        font-size: 297px;
    }

    .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: 290px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 290px;
    }

    .service--section.one .content--wrap .title {
        font-size: 290px;
    }

    .achievement--section .content--wrap .title {
        font-size: 290px;
    }

    .breadcrumb .breadcrumb--title {
        font-size: 287px;
    }

    .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: 70px;
    }

    .service--card.two .content--wrap .number {
        font-size: 70px;
    }

    .testimonial--section.two .section-content--wrap .title {
        font-size: 100px;
    }

    .hero-section.five .title {
        font-size: 65px;
    }

    .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: 65px;
    }

    .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: 210px;
    }

    .service--section.one .content--wrap .title {
        font-size: 210px;
    }

    .service--section.one .content--wrap .title {
        font-size: 210px;
    }

    .achievement--section .content--wrap .title {
        font-size: 210px;
    }
}

@media (max-width: 1141px) {
    .hero-section.one .banner--title {
        font-size: 200px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 200px;
    }

    .service--section.one .content--wrap .title {
        font-size: 200px;
    }

    .achievement--section .content--wrap .title {
        font-size: 200px;
    }
}

@media (max-width: 1094px) {
    .hero-section.one .banner--title {
        font-size: 190px;
    }

    .portfolio--section .content--wrap .title {
        font-size: 190px;
    }

    .service--section.one .content--wrap .title {
        font-size: 190px;
    }

    .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: 60px;
    }

    .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%;
    }

    .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);
}
/*# sourceMappingURL=main.css.map */