

/* ===== GLOBAL STYLES & RESET (FIXED) ===== */
html {
    scroll-behavior: smooth; /* Native smooth scroll */
    overflow-x: hidden;
    width: 100%;
}

body {
    margin: 0;
    padding: 0;
    width: 100%;
    overflow-x: hidden; /* Sirf horizontal scroll rokein */
    background-color: #000;
    color: #F2E205;
    font-family: 'League Spartan', sans-serif !important;
    position: relative;
    /* overflow-y: auto !important;  <-- YE LINE HATA DEIN, browser ko khud decide karne dein */
}

@media (max-width: 1400px) and (min-width:1300px) and (min-height:900px) {
    body {
        font-size:11.485px
    }
}

@media (min-width: 1200px) {
    body {
        font-size:16px
    }
}

@media (max-width: 1199.98px) {
    body {
        font-size:14px!important
    }
}

img,svg {
    max-width: 100%;
    height: auto;
    display: block
}

a {
    text-decoration: none;
    color: #F2E205; /* Bright Yellow - Links */
}

iframe {
    border: 0;
    width: 100%
}

button {
    font-family: "The Future";
    -webkit-appearance: button;
    appearance: button
}

button:focus {
    outline: 0
}

textarea {
    resize: none
}

picture {
    display: block;
    height: 100%
}

input::-webkit-inner-spin-button,input::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

input:-webkit-autofill,input:-webkit-autofill:active,input:-webkit-autofill:focus,input:-webkit-autofill:hover {
    -webkit-background-clip: text;
    -webkit-text-fill-color: #000; /* Deep Navy */
    transition: background-color 5000s ease-in-out 0s;
    box-shadow: inset 0 0 20px 20px transparent
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration {
    display: none
}

input[type=number] {
    -moz-appearance: textfield;
    
}

.grecaptcha-badge {
    opacity: 0!important;
    visibility: hidden!important;
    pointer-events: none!important;
    z-index: -1!important;
    width: 0!important;
    height: 0!important
}

/* ===== UTILITY CLASSES ===== */
.line-height-1-35 {
    line-height: 1.35!important
}

.loadMoreBtn {
    margin: 2em auto
}

.loadMoreBtn .btnn {
    display: flex;
    align-items: center;
    justify-content: center
}

.wpcf7-not-valid-tip {
    margin-top: .5em;
    font-weight: 500
}

.error-message {
    font-weight: 500
}

/* ===== FALLBACK WRAPPER SECTION ===== */
.FallBackWrapper {
    display: flex;
    gap: 6.25em;
    align-items: center;
    height: 35.75em;
    position: relative;
    width: 100%
}

@media (max-width: 1199.98px) {
    .FallBackWrapper {
        height:22.75em
    }
}

@media (max-width: 991.98px) {
    .FallBackWrapper {
        height:16.75em
    }
}

@media (max-width: 767.98px) {
    .FallBackWrapper {
        height:100%;
        flex-wrap: wrap;
        gap: .5em
    }
}

@media (max-width: 991.98px) {
    .FallBackWrapper h2 {
        font-size:2.5em
    }
}

.FallBackWrapper .imgWrapper {
    width: 48.75em;
    height: 48.75em
}

@media (min-width: 576px) {
    .FallBackWrapper .imgWrapper {
        position:absolute;
        right: 0;
        bottom: -6.25em
    }
}

@media (max-width: 1199.98px) {
    .FallBackWrapper .imgWrapper {
        width:28.75em;
        height: 31.75em
    }
}

@media (max-width: 991.98px) {
    .FallBackWrapper .imgWrapper {
        width:20.75em;
        height: 23.75em
    }
}

@media (max-width: 767.98px) {
    .FallBackWrapper .imgWrapper {
        margin-bottom:-5em;
        width: 18.75em;
        height: 21.75em
    }
}

.FallBackWrapper .imgWrapper img {
    max-width: 100%;
    height: auto;
    display: block
}

/* ===== TYPOGRAPHY SECTION ===== */
.h1,h1 {
    font-size: 5.25em;
    line-height: 1;
    font-weight: 600;
    color: #F2E205; /* Bright Yellow - Headings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h1,h1 {
        font-size:3.5em
    }
}

@media (max-width: 767.98px) {
    .h1,h1 {
        font-size:3em;
        margin-bottom: .345em;
        line-height: normal
    }
}

.h2,h2 {
    font-size: 4.5em;
    line-height: 1.25;
    font-weight: 600;
    color: #F2E205; /* Bright Yellow - Headings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h2,h2 {
        font-size:2.5em;
        line-height: 1
    }
}

@media (max-width: 991.98px) {
    .h2,h2 {
        margin-bottom:.545em;
        line-height: 1
    }
}

@media (max-width: 767.98px) {
    .h2,h2 {
        font-size:2em;
        line-height: normal
    }
}

.h3,h3 {
    font-size: 2.875em;
    line-height: 1.2;
    font-weight: 600;
      font-size: 65px;
  margin-bottom: 0.5em;
   background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent; /* Bright Yellow - Headings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h3,h3 {
        font-size:1.75em
    }
}

@media (max-width: 575.98px) {
    .h3,h3 {
        font-size:1.5em
    }
}

.h3.lg-font,h3.lg-font {
    font-size: 4em
}

@media (max-width: 1199.98px) {
    .h3.lg-font,h3.lg-font {
        font-size:1.75em
    }
}

@media (max-width: 575.98px) {
    .h3.lg-font,h3.lg-font {
        font-size:1.5em;
        line-height: normal
    }
}

.h4,h4 {
    font-size: 2.5em;
    line-height: 1;
    font-weight: 500;
    color: #F2B035; /* Golden Orange - Subheadings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h4,h4 {
        font-size:1.25em
    }
}

.h4.sm-font,h4.sm-font {
    font-size: 1.625em;
    line-height: normal
}

@media (max-width: 1199.98px) {
    .h4.sm-font,h4.sm-font {
        font-size:1.25em
    }
}

.h5,h5 {
    font-size: 1.25em;
    font-weight: 500;
    color: #F2B035; /* Golden Orange - Subheadings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h5,h5 {
        font-size:1.2em
    }
}

.h6,h6 {
    font-size: 1.125em;
    font-weight: 500;
    color: #F2B035; /* Golden Orange - Subheadings */
    margin-bottom: .5em
}

@media (max-width: 1199.98px) {
    .h6,h6 {
        font-size:1em
    }
}

.p,p {
    color: #C8C8C8; /* Light Gray - Paragraph text */
    margin-bottom: 1.5em;
    font-size: 1.125em;
    line-height: 1.7;
    font-weight: 400
}

@media (max-width: 1199.98px) {
    .p,p {
        font-size:1em;
        margin-bottom: 1em
    }
}

.p.xl-font,p.xl-font {
    font-size: 1.375em
}

@media (max-width: 1199.98px) {
    .p.xl-font,p.xl-font {
        font-size:1em;
        margin-bottom: 1em
    }
}

.p.l-font,p.l-font {
    font-size: 1.25em
}

@media (max-width: 1199.98px) {
    .p.l-font,p.l-font {
        font-size:1em;
        margin-bottom: 1em
    }
}

.p.s-font,p.s-font {
    font-size: 1em
}

/* ===== GENERIC HEAD SECTION ===== */
.genericHead__subTitle {
    position: relative;
    font-size: 20px;
    font-family: 800;
    padding-left: 1.77em;
    text-transform: capitalize;
    width: 100%;
    max-width: max-content;
    margin-bottom: 1.6em;
    color: #F2B035; /* Golden Orange */
}

.genericHead__subTitle::before {
    content: "";
    position: absolute;
    width: .72em;
    height: .72em;
    top: 37%;
    transform: translateY(-50%);
    left: 0;
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    
    border-radius: 50%;
    box-shadow: 0 4px 15px 0 rgba(242, 224, 5, 0.5), 0 6px 20px 0 rgba(242, 176, 53, 0.4)
}

.genericHead__title {
    letter-spacing: -.02em;
      font-size: 65px;
  margin-bottom: 0.5em;
   background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}

.genericHead .content {
    padding-right: 13.172em;
    margin-top: 2.6875em
}

@media (max-width: 1199.98px) {
    .genericHead .content {
        margin-top:1.5em;
        padding-right: 0
    }
}

@media (max-width: 991.98px) {
    .genericHead .content {
        margin-top:1em
    }
}

.genericHead .btnWrapper {
    margin-top: 5.1875em
}

@media (max-width: 1199.98px) {
    .genericHead .btnWrapper {
        margin-top:1.5em
    }
}

@media (max-width: 991.98px) {
    .genericHead .btnWrapper {
        margin-top:1em
    }
}

.genericHead.noPadding {
    padding: 0
}

.genericHead.centerHead {
    text-align: center
}

.genericHead.centerHead .genericHead__subTitle {
    margin: 0 auto 1.6em auto;
    font-weight: 600;
    font-size: 18px;
}

/* ===== BODY & SCROLLBAR SECTION ===== */
body {
    font-family: "The Future";
    font-weight: 400;
    color: #F2E205; /* Bright Yellow */
    background-color: #000; /* Deep Navy */
    line-height: 1
}

body::-webkit-scrollbar {
    width: 6px;
    background-color: #030e3a;
    border-radius: 10px
}

body::-webkit-scrollbar-track {
    background-color: #0a0a0b;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3)
}
body::-webkit-scrollbar-thumb {
  background: linear-gradient(213deg, #081733 -39.81%, #0b3fa3 85.21%);
  border-radius: 10px;
  box-shadow: inset 0 0 5px rgba(255,255,255,0.1);
}

body::-webkit-scrollbar-thumb:hover {
  background: linear-gradient(213deg, #0e2b66 -39.81%, #1558e0 85.21%);
}


::selection {
    background-color: #F2B035; /* Golden Orange */
    color: #1C3059; /* Deep Navy */
}

::-moz-selection {
    background-color: #F2B035; /* Golden Orange */
    color: #1C3059; /* Deep Navy */
}

/* .loadjs {
    overflow: hidden
} */
 /* ===== SCROLL LOCK FIX - ADD THIS AT THE END ===== */
html, body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    width: 100% !important;
    height: auto !important;
    position: relative !important;
}

/* Keep loadjs but without scroll lock */
html.loadjs, 
body.loadjs {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

/* Kill all scroll blocking */
body.no-scroll,
body.overflow-hidden,
body.menu-open,
body.modal-open {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    position: static !important;
}

/* Mobile menu fix */
@media (max-width: 1199.98px) {
    .header__nav {
        overflow-y: auto !important;
    }
}

.img-wrapper {
    position: relative
}

/* ===== LAYOUT CONTAINERS SECTION ===== */
.container-fluid {
    max-width: 100%;
    padding: 0;
 
}

@media (max-width: 991.98px) {
    .container-fluid {
        padding:0 5em
    }
}

@media (max-width: 991.98px) {
    .container-fluid {
        padding:0 3em
    }
}

@media (max-width: 575.98px) {
    .container-fluid {
        padding:0 2em
    }
}

.container-s {
    max-width: 100%;
    padding: 0 3.9%;

}

@media (max-width: 991.98px) {
    .container-s {
        padding:0 3em
    }
}

@media (max-width: 575.98px) {
    .container-s {
        padding:0 2em
    }
}

.container {
    max-width: 100%;
    padding: 0 10.247%;
    background-color: #030914 !important;
}

@media (max-width: 1199.98px) {
    .container {
        padding:0 5em;
        
    }
}

@media (max-width: 991.98px) {
    .container {
        padding:0 3em
    }
}

@media (max-width: 575.98px) {
    .container {
        padding:0 1.43em
    }
}

.section {
    position: relative;
    padding: 2em 0
}

@media (min-width: 576px) {
    .section {
        padding:3em 0
    }
}

@media (min-width: 1200px) {
    .section {
        padding:6.25em 0
    }
}

.grecaptcha-badge {
    left: -11.625em;
    bottom: 5em!important
}

/* ===== FORM STYLES SECTION ===== */
@media (max-width: 767.98px) {
    .form-loader-img {
        padding-bottom:3em
    }
}

.form-loader-img .wrapper {
    display: flex;
    align-items: center;
    gap: 1em;
    margin-top: 1em
}

.form-loader-img .wrapper p {
    color: #1C3059; /* Deep Navy */
    margin-bottom: 0
}

.form-loader-img .wrapper p.white-color {
    color: #F2E205!important /* Bright Yellow */
}

@media (max-width: 767.98px) {
    .input-container .input-field {
        font-size:16px!important;
        -webkit-font-smoothing: antialiased
    }
}

@media (max-width: 767.98px) {
    .select-container .select-field {
        font-size:16px!important;
        -webkit-font-smoothing: antialiased
    }
}

.overflow-hidden {
    overflow: hidden
}





/* ===== SIDE LINKS SECTION ===== */
.leftSideLinks {
    position: fixed;
    left: -3%;
    top: 50%;
    transform: translate(-25%,-50%);
    z-index: 9999;
    transition: .4s
}

@media (max-width: 991.98px) {
    .leftSideLinks {
        left:-4%
    }
}

.leftSideLinks.show {
    left: 1.25%;
    transition: .4s
}

@media (max-width: 1199.98px) {
    .leftSideLinks.show {
        left:1.5%
    }
}

@media (max-width: 575.98px) {
    .leftSideLinks {
        display:none
    }
}

.leftSideLinks__wrapper {
    display: flex;
    flex-direction: column;
    gap: 1em;
    list-style-type: none
}

.leftSideLinks__item a {
    position: relative;
    display: block;
    width: 2.875em;
    height: 2.875em;
    display: flex;
    justify-content: center;
    align-items: center
}

@media (max-width: 1199.98px) {
    .leftSideLinks__item a {
        width:2.5em;
        height: 2.5em
    }
}

.leftSideLinks__item a img {
    width: auto;
    height: auto;
    z-index: 1;
    max-width: 50%;
    max-height: 50%
}

.leftSideLinks__item a::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    background-color: #030914; /* Deep Navy */
    transform: translate(-50%,-50%);
    transition: .25s;
    border-radius: 50%;
    border: 1px solid rgba(236, 223, 78, 0.2) /* Bright Yellow with opacity */
}

.leftSideLinks__item a::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    transform: translate(-50%,-50%) scale(0);
    transition: .25s;
    border-radius: 50%
}

@media (min-width: 1200px) {
    .leftSideLinks__item a:hover::after {
        transform:translate(-50%,-50%) scale(1);
        transition: .25s
    }

    .leftSideLinks__item a:hover::before {
        transform: translate(-50%,-50%) scale(0);
        transition: .25s
    }
}

.rightSideLinks {
    position: fixed;
    right: -3%;
    top: 75%;
    transform: translate(25%,-50%);
    z-index: 9999;
    transition: .4s
}

@media (max-width: 991.98px) {
    .rightSideLinks {
        right:-4%
    }
}

.rightSideLinks.show {
    right: 1.25%;
    transition: .4s
}

@media (max-width: 1199.98px) {
    .rightSideLinks.show {
        right:1.5%
    }
}

@media (max-width: 575.98px) {
    .rightSideLinks {
        display:none
    }
}

.rightSideLinks__wrapper {
    display: flex;
    flex-direction: column;
    gap: 1em;
    list-style-type: none
}

.rightSideLinks__item a {
    position: relative;
    display: block;
    width: 2.875em;
    height: 2.875em;
    display: flex;
    justify-content: center;
    align-items: center
}

@media (max-width: 1199.98px) {
    .rightSideLinks__item a {
        width:2.5em;
        height: 2.5em
    }
}

.rightSideLinks__item a img {
    width: auto;
    height: auto;
    z-index: 1;
    max-width: 50%;
    max-height: 50%
}

.rightSideLinks__item a::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    background-color: #030914; /* Deep Navy */
    transform: translate(-50%,-50%);
    transition: .25s;
    border-radius: 50%;
    border: 1px solid rgba(244, 228, 53, 0.2) /* Bright Yellow with opacity */
}

.rightSideLinks__item a::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    transform: translate(-50%,-50%) scale(0);
    transition: .25s;
    border-radius: 50%
}

@media (min-width: 1200px) {
    .rightSideLinks__item a:hover::after {
        transform:translate(-50%,-50%) scale(1);
        transition: .25s
    }

    .rightSideLinks__item a:hover::before {
        transform: translate(-50%,-50%) scale(0);
        transition: .25s
    }
}
/* end side links */

.h3, h3 {
    font-size: 2.875em;
    line-height: 1.2;
    font-weight: 800;
    font-size: 45px;
    margin-bottom: 0.5em;
    background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    margin-bottom: .5em;
}



/* ===== CIRCLE LIST SECTION ===== */
.circleList li {
    position: relative;
    font-size: 1.25em;
    padding: 2em 0 0 2.25em;
    list-style: none;
    gap: 1em;
    display: flex;
    flex-direction: column;
    line-height: normal;
    color: #C8C8C8; /* Light Gray */
}

.circleList li:first-child {
    padding: .875em 0 0 2.25em
}

@media (max-width: 1199.98px) {
    .circleList li {
        gap:1em
    }
}

.circleList li p {
    margin-bottom: 0
}

.circleList li strong {
    margin-bottom: 0;
    color: #F2E205; /* Bright Yellow */
}

.circleList li .circle {
    width: .9375em;
    height: .9375em;
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    border-radius: 50%;
    position: absolute;
    left: .5em
}

.circleList li .circle::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transform: translate(-50%,-50%);
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    box-shadow: 0 0 15px rgba(242, 176, 53, 0.7);
    z-index: -1
}

/* ===== ACCORDION SECTION ===== */
.accordianWrapper {
    position: relative;
    padding-bottom: 1.875em;
    margin-bottom: 1.9375em;
    background-color: #3F4B59; /* Muted Gray-Blue - Cards/Sections */
    border-radius: 12px;
    padding: 1.5em
}

@media (max-width: 991.98px) {
    .accordianWrapper {
        padding-bottom:1.25em;
        margin-bottom: 1.25em
    }
}

.accordianWrapper:hover::after {
    transform: scale(1)
}

.accordianWrapper.active::after {
    transform: scale(1)
}

.accordianWrapper.active .titleWrapper .icon img {
    transform: rotate(180deg)
}

.accordianWrapper::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #F2E205; /* Bright Yellow */
    transform: scale(0);
    transition: .5s
}

.accordianWrapper .titleWrapper {
    cursor: pointer;
    position: relative;
    
}

.accordianWrapper .titleWrapper .icon {
    position: absolute;
    right: 0;
    border-radius: 50%;
    overflow: hidden;
    background: #3F4B59; /* Muted Gray-Blue */
    top: 50%;
    transform: translateY(-50%);
    width: 2.04925em;
    height: 2.04925em;
    display: flex;
    align-items: center;
    justify-content: center
}

.accordianWrapper .titleWrapper .icon img {
    transition: .5s
}

.accordianWrapper .titleWrapper h3 {
    margin-bottom: 0
    ;
    color: #F2E205; /* Bright Yellow */
}

.accordianWrapper .accordianContentWrapper {
    display: grid;
    grid-template-rows: 0fr;
    transition: .4s;
    padding-top: 1.875em
}

@media (max-width: 991.98px) {
    .accordianWrapper .accordianContentWrapper {
        padding-top:1.25em
    }
}

.accordianWrapper .accordianContentWrapper.active {
    grid-template-rows: 1fr;
    transition: .4s
}

.accordianWrapper .accordianContentWrapper.active::after {
    transform: scale(1)
}

.accordianWrapper .accordianContent {
    overflow: hidden
}

.accordianWrapper .accordianContent p {
    margin-bottom: 0;
    color: #C8C8C8; /* Light Gray */
}

.accordianWrapper .accordianContent .primary-btn {
    margin: 1.25em 0 1.25em .125em;
    background-color: #F2B035; /* Golden Orange - Primary Button */
    color: #1C3059; /* Deep Navy */
}

@media (max-width: 991.98px) {
    .accordianWrapper .accordianContent .primary-btn {
        margin:1em 0 1em .125em
    }
}

/* ===== CIRCLE HEADING SECTION ===== */
.circleHeading {
    position: relative;
    padding-left: 2.25em;
    margin: 0;
    display: flex;
    align-items: center;
    z-index: 1;
    color: #F2E205; /* Bright Yellow */
}

.circleHeading .circle {
    width: .9375em;
    height: .9375em;
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    border-radius: 50%;
    position: absolute;
    left: .5em
}

.circleHeading .circle::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transform: translate(-50%,-50%);
    background: linear-gradient(135deg, #F2B035, #F2E205); /* Golden Gradient */
    box-shadow: 0 0 15px rgba(242, 176, 53, 0.7);
    z-index: -1
}

.full-cover-anchor:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 10
}

/* ===== COLOR UTILITY CLASSES SECTION ===== */
.primary-color {
    color: #F2B035 !important; /* Golden Orange */
}

.primary-bg {
    background-color: #F2B035 !important; /* Golden Orange */
}

.secondary-color {
    color: #3F4B59 !important; /* Muted Gray-Blue */
}

.secondary-bg {
    background-color: #3F4B59 !important; /* Muted Gray-Blue */
}

.black-color {
    color: #1C3059 !important; /* Deep Navy */
}

.black-bg {
    background-color: #1C3059 !important; /* Deep Navy */
}

.white-color {
    color: #F2E205 !important; /* Bright Yellow */
}

.white-bg {
    background-color: #F2E205 !important; /* Bright Yellow */
}

/* ===== ANIMATION SECTION ===== */
.animate {
    opacity: 0
}

.animate.fadein-Left {
    transform: translate(100px,0)
}

.animate.fadein-Right {
    transform: translate(-100px,0)
}

.animate.fadein-Up {
    transform: translate(0,100px)
}

.animate.fadein-Down {
    transform: translate(0,-100px)
}

@media (max-width: 767.98px) {
    .animate {
        opacity:1
    }

    .animate.fadein-Left {
        transform: translate(0,0)
    }

    .animate.fadein-Right {
        transform: translate(0,0)
    }

    .animate.fadein-Up {
        transform: translate(0,0)
    }

    .animate.fadein-Down {
        transform: translate(0,0)
    }
}

@keyframes anim {
    to {
        transform: translate(0,0);
        opacity: 1
    }
}

.lazy-img {
    opacity: 0
}

/* ===== GRID SYSTEM SECTION ===== */
.custom-row {
    display: flex;
    flex-wrap: wrap;
    margin: 0 -.9375em
}

.no-gutters {
    margin: 0;
    width: 100%
}

.no-gutters>[class*=col_] {
    padding: 0
}

.col_offset_0 {
    margin-left: 0
}

.col_1 {
    flex: 0 0 8.3333333333%;
    width: 8.3333333333%;
    padding: 0 .9375em
}

.col_offset_1 {
    margin-left: 8.3333333333%
}

.col_2 {
    flex: 0 0 16.6666666667%;
    width: 16.6666666667%;
    padding: 0 .9375em
}

.col_offset_2 {
    margin-left: 16.6666666667%
}

.col_3 {
    flex: 0 0 25%;
    width: 25%;
    padding: 0 .9375em
}

.col_offset_3 {
    margin-left: 25%
}

.col_4 {
    flex: 0 0 33.3333333333%;
    width: 33.3333333333%;
    padding: 0 .9375em
}

.col_offset_4 {
    margin-left: 33.3333333333%
}

.col_5 {
    flex: 0 0 41.6666666667%;
    width: 41.6666666667%;
    padding: 0 .9375em
}

.col_offset_5 {
    margin-left: 41.6666666667%
}

.col_6 {
    flex: 0 0 50%;
    width: 50%;
    padding: 0 .9375em
}

.col_offset_6 {
    margin-left: 50%
}

.col_7 {
    flex: 0 0 58.3333333333%;
    width: 58.3333333333%;
    padding: 0 .9375em
}

.col_offset_7 {
    margin-left: 58.3333333333%
}

.col_8 {
    flex: 0 0 66.6666666667%;
    width: 66.6666666667%;
    padding: 0 .9375em
}

.col_offset_8 {
    margin-left: 66.6666666667%
}

.col_9 {
    flex: 0 0 75%;
    width: 75%;
    padding: 0 .9375em
}

.col_offset_9 {
    margin-left: 75%
}

.col_10 {
    flex: 0 0 83.3333333333%;
    width: 83.3333333333%;
    padding: 0 .9375em
}

.col_offset_10 {
    margin-left: 83.3333333333%
}

.col_11 {
    flex: 0 0 91.6666666667%;
    width: 91.6666666667%;
    padding: 0 .9375em
}

.col_offset_11 {
    margin-left: 91.6666666667%
}

.col_12 {
    flex: 0 0 100%;
    width: 100%;
    padding: 0 .9375em
}

.col_offset_12 {
    margin-left: 100%
}

/* ===== HOME HERO SECTION ===== */
.homeHero{
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: radial-gradient(circle at 30% 50%, #1C3059 0%, #0C1A2E 40%, #000814 100%);
 
  z-index: 1;
}

/* Video wrapper fills hero fully */
.homeHero__video{
  position: absolute; /* was relative */
  inset: 0;           /* top:0; right:0; bottom:0; left:0 */
}

/* Actual media: DO NOT overscale */
.homeHero__video video,
.homeHero__video iframe{
  position: absolute;
  inset: 0;
  width: 100%;        /* was 109% */
  height: 100%;       /* was 109% */
  object-fit: cover;  /* no stretching, stays sharp */
  transform: none; 
    
      display:block;
  image-rendering:auto;
  filter:none;
  transform:none;   
}


.homeHero__logos {
    position: absolute;
    bottom: 7.1875em;
    right: 3.385%;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 1.875em
}

@media (max-width: 575.98px) {
    .homeHero__logos {
        gap:.75em;
        bottom: 5em;
        right: auto;
        left: 50%;
        transform: translateX(-50%)
    }
}

.homeHero__logos--item {
    width: 6.5625em
}

@media (max-width: 575.98px) {
    .homeHero__logos--item {
        width:4.5em
    }
}

.homeHero__logos--item img {
    width: 100%
}

.homeHero .scrollDownBtn {
    position: absolute;
    bottom: 5.625em;
    left: 50%;
    transform: translateX(-50%)
}

.homeHero .scrollDownBtn .btn {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: .3125em
}

.homeHero .scrollDownBtn .title {
    font-size: .75em;
    font-style: normal;
    font-weight: 300;
    letter-spacing: 3.24px;
    text-transform: uppercase;
    color: #F2E205; /* Bright Yellow */
}


/* ===== UTILITY CLASSES CONTINUED ===== */
.text-center {
    text-align: center
}

.m-auto {
    margin: 0 auto
}

.mt-auto {
    margin-top: auto
}

.m-0 {
    margin: 0
}

.mb-0 {
    margin-bottom: 0!important
}

.mb-1-5 {
    margin-bottom: 1.5em
}

.text-lower {
    text-transform: lowercase!important
}

.d-flex {
    display: flex
}

@media (max-width: 575.98px) {
    .d-flex {
        flex-wrap:wrap
    }
}

.flex-wrap {
    flex-wrap: wrap
}

.text-upper {
    text-transform: uppercase!important
}

.text-capitalize {
    text-transform: capitalize!important
}

.generic--radius {
    border-radius: 10px
}

.justify-content-center {
    justify-content: center
}

.justify-content-between {
    justify-content: space-between
}

.justify-content-around {
    justify-content: space-around
}

.justify-content-end {
    justify-content: flex-end
}

.align-item-center {
    align-items: center
}

@media (max-width: 1199.98px) {
    .align-center-lg {
        align-items:center
    }
}

.align-item-start {
    align-items: flex-start
}

.flex-direction-col {
    flex-direction: column
}

.align-item-end {
    align-items: flex-end
}

.w-100 {
    width: 100%
}

.h-100 {
    height: 100%
}

@media (min-width: 576px) {
    .mobile-only {
        display:none
    }
}

@media (max-width: 575.98px) {
    .desktop-only {
        display:none
    }
}

.img-hack,.img-hack-contain {
    width: 100%;
    height: 100%;
    object-fit: cover
}

.img-hack-contain {
    object-fit: contain
}

@media (min-width: 1200px) {
    .container-left-zero-desktop {
        padding-left:0
    }
}

@media (min-width: 1200px) {
    .container-right-zero-desktop {
        padding-right:0
    }
}

.container-left-zero-always {
    padding-left: 0
}

@media (min-width: 1200px) {
    .container-right-zero-desktop {
        padding-right:0
    }
}

.container-right-zero-always {
    padding-right: 0
}

@media (min-width: 576px) {
    .container-right-zero-except-mobile {
        padding-right:0
    }
}

.line-clamp-1 {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box!important;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 1
}

.line-clamp-2 {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box!important;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 2
}

.line-clamp-3 {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box!important;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 3
}

.line-clamp-4 {
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box!important;
    -webkit-box-orient: vertical;
    white-space: normal;
    -webkit-line-clamp: 4
}

.fw-200 {
    font-weight: 200
}

.fw-300 {
    font-weight: 300
}

.fw-400 {
    font-weight: 400
}

.fw-500 {
    font-weight: 500
}

.fw-600 {
    font-weight: 600
}

.fw-700 {
    font-weight: 700
}

.fw-800 {
    font-weight: 800
}

.pb-0 {
    padding-bottom: 0!important
}

.pt-0 {
    padding-top: 0!important
}

/* sticky section wrapper */
.stickySectionsWrapper {
    position: relative;
    min-height: 100vh;
    height: auto;
    background: #030914;
}

/* WHAT WE DO STICKY ON DESKTOP */
@media (min-width: 1200px) {
    .stickySectionsWrapper .whatWeDo {
        position: sticky;
        top: 0;
        z-index: 2;
        background-color: #030914;
    }
}

.whatWeDo {
    position: relative;
    min-height: auto;
    height: auto;
    background:#030914;
    
}

.whatWeDo__centerImg {
    width: 100%;
}

@media (min-width: 1200px) {
    .whatWeDo__centerImg {
        height:14.5em;
    }
    .whatWeDo__centerImg img {
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}

/* ================= SLIDER / LOGOS ================== */
/* ================= SLIDER / LOGOS ================== */

.whatWeDo__slider {
    position: relative;
    overflow: hidden; /* mobile pe overflow cut ho */
}

/* Fade edges – desktop only */
.whatWeDo__slider::before,
.whatWeDo__slider::after {
    content: "";
    position: absolute;
    width: 15em;
    height: 100%;
    top: 0;
    pointer-events: none;
    z-index: 2;
}

.whatWeDo__slider::before {
    left: 0;
}

.whatWeDo__slider::after {
    right: 0;
}

/* Remove edge overlays on mobile */
@media (max-width: 767.98px){
    .whatWeDo__slider::before,
    .whatWeDo__slider::after {
        display:none;
    }
}

.whatWeDo__slider .swiper-wrapper {
    transition-timing-function: linear;
}

/* Base slide style */
.whatWeDo__slider .swiper-slide {
    width: 9rem !important;
    height: 4.25rem;              /* ⬅️ height thori bari ki */
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 40px;
}

/* Mobile: slide ko zyada flexible karo */
@media (max-width: 767.98px){
    .whatWeDo__slider .swiper-slide {
        width: 55vw !important;
        height: 4.25rem;          /* ⬅️ same yahan bhi */
        margin-top: 24px;
    }
}

.whatWeDo__slider--slideImg {
    width: 100%;                  /* ⬅️ 150% hata diya */
    height: 100%;                 /* ⬅️ 150% hata diya */
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: visible;            /* ⬅️ hidden ≠ now, full logo dikhayega */
}

.whatWeDo__slider--slideImg img {
    max-width: 100%;
    max-height: 100%;             /* ⬅️ image slide se bahar nahi jayegi */
    width: auto;
    height: auto;
    object-fit: contain;
    object-position: center;

    /* White washed effect */
    /* filter: brightness(0) invert(1) opacity(0.8);
    transition: all 0.3s ease-in-out; */
}

/* Hover -> proper color */
.whatWeDo__slider .swiper-slide:hover img,
.whatWeDo__slider .swiper-slide:focus-within img,
.whatWeDo__slider .swiper-slide:hover svg,
.whatWeDo__slider .swiper-slide:focus-within svg {
    filter: none;
    -webkit-filter: none;
    opacity: 1;
}

/* ================= PRESENCE LIST (Delivering Excellence) ================== */

.whatWeDo .presenceListWrapper {
    width: 100%;
    display: flex;
    justify-content: center;
    margin-top: 10px;
    margin-bottom: 20px;
}

/* Mobile padding so pill screen se bahar na jaye */
@media (max-width: 767.98px){
    .whatWeDo .presenceListWrapper {
        padding: 0 1rem;
        margin-top: 2.5em;
    }
}

.whatWeDo .presenceList {
    display: flex;
    align-items: center;
    gap: 5em;
    border-radius: 1.625em;
    border: 1px solid rgba(237,237,237,.2);
    background: rgba(40,40,42,.3);
    backdrop-filter: blur(2.15px);
    padding: .6875em 1.75em;
    overflow: hidden;
    max-width: 100%;
    box-sizing: border-box;
}

/* Tablet: gap thoda kam + wrap allow */
@media (max-width: 991.98px) {
    .whatWeDo .presenceList {
        gap: 2em;
        flex-wrap: wrap;
    }
}

/* Mobile: full width, column layout */
@media (max-width: 575.98px) {
    .whatWeDo .presenceList {
        width:100%;
        flex-direction: column;
        align-items: stretch;
        gap: 1em;
        padding: 1em 1.25em;
    }
}

.whatWeDo .presenceList__title {
    margin: 0;
    font-size: 20px;
    font-weight: 500;
    color: #ffffff;
}

/* Title center on mobile */
@media (max-width: 575.98px){
    .whatWeDo .presenceList__title {
        text-align:center;
        font-size: 18px;
    }
}

.whatWeDo .presenceList__list {
    position: relative;
    display: flex;
    align-items: center;
    gap: 2.5em;
    padding: 1.25em 0;
    list-style-type: none;
}

/* Tablet: less gap */
@media (max-width: 991.98px) {
    .whatWeDo .presenceList__list {
        gap: 1.5em;
    }
}

/* Mobile: wrap + center so countries line break ho saken */
@media (max-width: 575.98px) {
    .whatWeDo .presenceList__list {
        gap: 1em;
        padding-bottom: 0;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }
}

.whatWeDo .presenceList__list::before {
    content: "";
    position: absolute;
    width: 2px;
    height: 100%;
    top: 0;
    left: -2.5em;
    opacity: .5;
    background: linear-gradient(180deg,rgba(153,153,153,0),#fff 45.5%,rgba(153,153,153,0) 98.5%);
    pointer-events: none;
}

@media (max-width: 991.98px) {
    .whatWeDo .presenceList__list::before {
        left:-1em;
    }
}

/* Mobile: center wali vertical line ko horizontal bana do */
@media (max-width: 575.98px) {
    .whatWeDo .presenceList__list::before {
        left:50%;
        transform: translate(-50%,-45%) rotate(90deg);
    }
}

.whatWeDo .presenceList__list--item {
    position: relative;
    font-size: 20px;
    font-weight: 500;
    color: #D6D1AF;
    padding-left: 1em;
}

/* Smaller text on mobile so text wrap clean lage */
@media (max-width: 767.98px) {
    .whatWeDo .presenceList__list--item {
        font-size: .9em;
    }
}

.whatWeDo .presenceList__list--item::before {
  content: "";
  position: absolute;
  width: .35em;
  height: .35em;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  background: linear-gradient(90deg, #f2e205 0%, #d49d00 100%);
  border-radius: 50%;
  box-shadow: 0 4px 15px 0 rgba(242, 226, 5, 0.5),
              0 6px 20px 0 rgba(212, 157, 0, 0.4);
}

/* Background glow behind pill */
.whatWeDo .presenceList__bg {
    position: absolute;
    width: 90%;
    height: 100%;
    top: 50%;
    left: 37%;
    transform: translate(-50%,-50%);
    z-index: -1;
    opacity: .25;
    pointer-events: none;
}

.whatWeDo .presenceList__bg img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* Mobile: thoda center & smaller so overflow na ho */
@media (max-width: 575.98px){
    .whatWeDo .presenceList__bg {
        width: 110%;
        left: 50%;
    }
}


/* }end */
/* ---- UNLOCK SCROLL SAFELY ---- */
html, body {
  overflow-y: auto !important;
  overflow-x: hidden; /* horizontal safe */
}

/* loadjs class scroll ko lock na kare */
html.loadjs, body.loadjs,
.loadjs {
  overflow: visible !important;
}

/* Agar kahin galti se utility lag gayi ho */
body.no-scroll,
body.lock,
body.modal-open,
body.overflow-hidden {
  overflow: auto !important;
  position: static !important;
  width: auto !important;
}


/* our clients */

.ourClients {
    background:
    radial-gradient(80% 60% at 20% 30%, #0b2242 0%, rgba(11,34,66,0) 60%),
    radial-gradient(90% 70% at 85% 75%, #08203b 0%, rgba(8,32,59,0) 60%),
    linear-gradient(180deg, #04152a 0%, #020e1d 100%); 
    position: relative;
    overflow: hidden;
    z-index: 1
}

@media (min-width: 1200px) {
    .ourClients .shadow-box {
        position:absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        z-index: -1;
        pointer-events: none
    }
}

@media (max-width: 575.98px) {
    .ourClients .shadow-box {
        display:none;
        visibility: hidden
    }
}

@media (min-width: 1200px) {
    .ourClients .shadow-box__wrapper {
        position:relative;
        width: 100%;
        height: 100%
    }
}

@media (min-width: 1200px) {
    .ourClients .shadow-box .center-shadow {
        width:35.9375em;
        height: 15.9375em;
        position: absolute;
        left: 50%;
        top: 0;
        transform: translateX(-50%);
        z-index: 0;
        transition: position .5s ease;
        pointer-events: none
    }
}

@media (min-width: 1200px) {
    .ourClients .shadow-box .center-shadow::before {
        content:"";
        opacity: .4;
         background:
    radial-gradient(80% 60% at 20% 30%, #0b2242 0%, rgba(11,34,66,0) 60%),
    radial-gradient(90% 70% at 85% 75%, #08203b 0%, rgba(8,32,59,0) 60%),
    linear-gradient(180deg, #04152a 0%, #020e1d 100%); 
        /* filter: blur(4.39375em); */
        border-radius: 35.934em;
        width: 100%;
        height: 100%;
        display: block;
        pointer-events: none
    }
}

.ourClients .shadow-box .right-shadow {
    position: absolute;
    width: 40.665625em;
    height: 20.843125em;
    z-index: 0;
    top: 3.145625em;
    transition: position .5s ease
}

@media (min-width: 1200px) {
    .ourClients .shadow-box .right-shadow {
        right:-18.5625em
    }
}

.ourClients .shadow-box .right-shadow::before {
    content: "";
    width: 35.93375em;
    height: 15.83625em;
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 35.9375em;
    opacity: .2;
     background:
    radial-gradient(80% 60% at 20% 30%, #0b2242 0%, rgba(11,34,66,0) 60%),
    radial-gradient(90% 70% at 85% 75%, #08203b 0%, rgba(8,32,59,0) 60%),
    linear-gradient(180deg, #04152a 0%, #020e1d 100%); 
    filter: blur(6.875em);
    z-index: 0
}

@media (min-width: 1200px) {
    .ourClients .shadow-box .right-shadow::before {
        transform:rotate(-174deg)
    }
}

.ourClients .shadow-box .right-shadow::after {
    content: "";
    width: 9.664375em;
    height: 18.93625em;
    position: absolute;
    top: 0;
    right: 0;
    border-radius: 18.9375em;
    opacity: .4;
    background: radial-gradient(50% 50% at 50% 50%,#fff 0,#3300d9 100%);
    filter: blur(6.875em);
    z-index: 1
}

@media (min-width: 1200px) {
    .ourClients .shadow-box .right-shadow::after {
        left:10.8125em;
        transform: rotate(-92.75deg)
    }
}

.ourClients .section-front-line {
    position: absolute;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100%;
    z-index: 0;
    pointer-events: none
}

@media (max-width: 575.98px) {
    .ourClients .section-front-line {
        display:none;
        visibility: hidden
    }
}

.ourClients .section-front-line .img-wrapper {
    width: 100%;
    height: 100%
}

.ourClients .client-list {
    display: flex;
    flex-wrap: wrap;
    position: relative;
    overflow: hidden;
    width: 100%
}

@media (min-width: 992px) {
    .ourClients .client-list {
        margin-top:5.3125em;
        margin-bottom: 7.8125em;
        margin: .625em 0 0
    }
}

@media (min-width: 992px) {
    .ourClients .client-list::after {
        content:"";
        height: 1px;
        width: 100%;
        opacity: .58;
        background: linear-gradient(90deg,#141418 0,#ededed 47%,#141418 100%);
        position: absolute;
        right: 0;
        top: 50%
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list::before {
        content:"";
        width: 1px;
        height: 100%;
        opacity: .58;
        background: linear-gradient(90deg,rgba(20,20,24,0) -23.13%,#ededed 47.61%,rgba(20,20,24,0) 127.38%);
        position: absolute;
        left: calc(50% + 1px);
        top: 0;
        transform: translate(0,0)
    }
}

.ourClients .client-list__item {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    width: 100%
}

@media (min-width: 1200px) {
    .ourClients .client-list__item {
        width:16.66667%;
        justify-content: center
    }
}

.ourClients .client-list__item:after {
    content: ""
}

@media (min-width: 1200px) {
    .ourClients .client-list__item:after {
        position:absolute;
        width: 1px;
        height: 100%;
        top: 0;
        right: 0;
        opacity: .58;
        background: linear-gradient(0,rgba(20,20,24,0) 6.5%,#ededed 47%,rgba(20,20,24,0) 107%)
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list__item:after {
        opacity:.58;
        background: linear-gradient(90deg,rgba(20,20,24,0) -23.13%,#ededed 47.61%,rgba(20,20,24,0) 127.38%);
        height: 1px;
        width: 100%;
        position: absolute;
        left: 0;
        bottom: 0
    }
}

.ourClients .client-list__item:last-child:after {
    display: none;
    visibility: hidden
}

.ourClients .client-list .item-wrapper {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    position: relative;
    overflow: hidden
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper {
        padding:2.5em;
        height: 15.0625em;
        width: 100%;
        transition: all .5s
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper {
        width:50%;
        padding: 4em 2em;
        height: 15.35714em
    }
}

.ourClients .client-list .item-wrapper .trigger-btn {
    position: absolute;
    right: 1em;
    top: 1em;
    z-index: 2;
    width: 2em;
    height: 2em;
    border: 1px solid #565656;
    border-radius: 100%
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper .trigger-btn {
        display:none;
        visibility: hidden
    }
}

.ourClients .client-list .item-wrapper .trigger-btn__wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center
}

.ourClients .client-list .item-wrapper .trigger-btn__wrapper::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 2px;
    height: .63636em;
    background-color: #fff;
    letter-spacing: 0;
    line-height: normal;
    transform: translate(-50%,-50%);
    transition: all .5s ease-in-out
}

.ourClients .client-list .item-wrapper .trigger-btn__wrapper::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: .63636em;
    height: 2px;
    background-color: #fff;
    letter-spacing: 0;
    line-height: normal;
    transform: translate(-50%,-50%);
    transition: all .5s ease-in-out
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper .img-wrapper {
        width:100%;
        max-width: 10.3125em;
        max-height: 6.25em;
        display: flex;
        align-items: center;
        justify-content: center;
        transition: all .5s
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper .img-wrapper {
        transform:scale(1);
        transition: all .5s
    }
}

@media (min-width: 992px) {
    .ourClients .client-list .item-wrapper .img-wrapper img {
        transition:all .5s
    }
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper .txt-box {
        height:0;
        overflow: hidden;
        transform: translate(0);
        transition: all .5s
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper .txt-box {
        display:flex;
        flex-wrap: wrap;
        align-items: center;
        padding: 4em 1em;
        overflow: hidden;
        width: calc(100% - 1px);
        height: calc(100% - 1px);
        background-color: #0a0a0b;
        justify-content: center;
        position: absolute;
        top: calc(50% - 2px);
        left: calc(50% + 1px);
        transform: translate(-50%,-50%);
        opacity: 0;
        z-index: 1;
        transition: all .5s
    }
}

.ourClients .client-list .item-wrapper .txt-box p {
    font-size: 1em;
    font-style: normal;
    font-weight: 300;
    line-height: 1.2em;
    letter-spacing: -.04em;
    margin: 0;
    opacity: .7;
    align-self: auto;
    max-width: 16.75rem;
    height: auto;
    overflow: visible
}

@media (min-width: 992px) {
    .ourClients .client-list .item-wrapper .txt-box p {
        padding-top:1.5em
    }
}

@media (min-width: 992px) {
    .ourClients .client-list .item-wrapper .animated-video {
        width:100%;
        max-width: 7.73439em;
        display: flex;
        align-items: center;
        justify-content: center
    }
}

.ourClients .client-list .item-wrapper .fixed-txt-box {
    margin-top: 1em
}

.ourClients .client-list .item-wrapper .fixed-txt-box p {
    font-size: 1.25em;
    font-style: normal;
    font-weight: 300;
    line-height: 1.2em;
    letter-spacing: -.04em;
    margin: 0
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper:hover .img-wrapper {
        max-height:4em;
        max-width: 7.3125em
    }
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper:hover .img-wrapper img {
        transform:scale(1)
    }
}

@media (min-width: 1200px) {
    .ourClients .client-list .item-wrapper:hover .txt-box {
        height:5.5em
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper.item-open .trigger-btn__wrapper::before {
        transform:translate(-50%,-50%) rotate(90deg)
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper.item-open .trigger-btn__wrapper::after {
        transform:rotate(90deg);
        opacity: 0
    }
}

@media (max-width: 1199.98px) {
    .ourClients .client-list .item-wrapper.item-open .txt-box {
        opacity:1
    }
}
/* .ourClients .client-list .item-wrapper .img-wrapper img {
    filter: brightness(0) invert(1); 
} */


/* blogs card  */
.ourBlogs {
    position: relative;
    background: radial-gradient(circle at 30% 50%, #1C3059 0%, #0C1A2E 40%, #000814 100%);

}



/* --- Blog Card Styling --- */

/* Give the slider container a reference point */
.ourBlogs__slider {
    position: relative;
}

/* Style the individual slide/card */
.ourBlogs__slider article {
    position: relative; /* Needed for absolute positioning of content */
    display: block;
    /* Let Swiper control the width, but set a fixed aspect ratio */
    aspect-ratio: 3 / 4; 
    border-radius: 12px;
    overflow: hidden;
    background-color: #1a1a1a; /* Fallback for slow-loading images */
}

/* --- Image Styling --- */
.ourBlogs__slider article > div:first-child {
    /* This is the <div> wrapper for your <img> */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
}

.ourBlogs__slider article img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Ensures image covers the card, may crop */
    display: block;
    /* Smooth zoom transition on hover */
    transition: transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

/* --- Content Styling --- */
.ourBlogs__slider article > div:last-child {
    /* This is the <div> wrapper for your <h3> and <a> */
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    padding: 16px 20px;
    box-sizing: border-box;
    z-index: 3;
    /* Gradient overlay to make text readable on any image */
    background: linear-gradient(0deg, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0) 100%);
    pointer-events: none; /* Allows clicks to go "through" to the link */
}

.ourBlogs__slider article h3 {
    /* Styling this as the "Category" from your image */
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 15px;
    font-weight: 600;
    color: #ffffff;
    margin: 0;
    padding: 0;
    text-transform: capitalize;
}

/* --- Link Styling --- */
/*
 * This is the clever part:
 * Your JS creates an <a> tag with "Read More".
 * The image implies the WHOLE card is clickable.
 * This CSS hides the "Read More" text and stretches the
 * link to cover the entire card.
*/
.ourBlogs__slider article a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 2; /* Positioned above image, but below text overlay */
    
    /* Hide the "Read More" text */
    font-size: 0;
    color: transparent;
    text-indent: -9999px;
}

/* --- Hover Effect --- */
.ourBlogs__slider article:hover img {
    transform: scale(1.05); /* Zoom image on hover */
}






.ourBlogs .genericHead h2 {
     font-size: 65px;
  margin-bottom: 0.5em;
   background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    
}

.ourBlogs__btnWrapper {
    display: flex;
    justify-content: flex-end;
    align-items: flex-end;
    height: 100%;
    margin-top: -50px;
}

@media (max-width: 575.98px) {
    .ourBlogs__btnWrapper {
        justify-content:flex-start;
        padding-top: 1.5em
    }
}

.ourBlogs__slider {
    margin-top: 2.25em
}

.ourBlogs__slider .swiper-wrapper {
    transition-timing-function: linear!important
}

.ourBlogs__slider .swiper-slide {
    width: 33.5em!important
}

@media (max-width: 1199.98px) {
    .ourBlogs__slider .swiper-slide {
        width:28em!important
    }
}

@media (max-width: 991.98px) {
    .ourBlogs__slider .swiper-slide {
        width:23em!important
    }
}

.blogsCard {
    position: relative
}

.blogsCard__img {
    position: relative;
    width: 100%;
    padding-top: 100%;
    border-radius: 1.25em;
    overflow: hidden;
    margin-bottom: 2.5em
}

.blogsCard__img img {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    object-fit: cover;
    transition: .45s
}

.blogsCard__img a {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1
}

.blogsCard__category {
    display: flex;
    align-items: center;
    margin-bottom: 1.25em;
    gap: .5em;
    flex-wrap: wrap
}

.blogsCard__category a {
    border-radius: 1.875em;
    border: 1px solid rgba(237,237,237,.2);
    background: rgba(255,255,255,.1);
    backdrop-filter: blur(.9499999881px);
    color: #cfcfcf;
    padding: .6875em
}

.blogsCard__title {
    margin-bottom: 1.25em
}

.blogsCard__title a {
    color: #fff;
    font-size: 1.625em;
    font-weight: 500;
    letter-spacing: -1.04px;
    line-height: 1.35
}

.blogsCard__desc {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 2em;
    padding-bottom: .25em
}

.blogsCard__desc--author a {
    color: #fff;
    position: relative
}

.blogsCard__desc--author a::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background: #ad0dce;
    transform: scaleX(0);
    transition: all .25s ease
}

@media (min-width: 1200px) {
    .blogsCard__desc--author a:hover::after {
        transition:all .25s ease;
        transform: scaleX(1)
    }
}

.blogsCard__desc--time {
    position: relative
}

.blogsCard__desc--time::before {
    content: "";
    position: absolute;
    left: -1.25em;
    top: calc(50% + .125em);
    transform: translateY(-50%);
    width: .5em;
    height: .5em;
    background-color: #fff;
    border-radius: 50%
}

@media (min-width: 1200px) {
    .blogsCard:hover .blogsCard__img img {
        transform:translate(-50%,-50%) scale(1.125);
        transition: .45s
    }
}
/* blogs card */





/* buttons */
.primary-btn {
    
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  padding: 0.9em 1em;
  font-size: 1.05rem;
  font-weight: 600;
 
  font-family: 'League Spartan', sans-serif;
  color: #fff;
  background: linear-gradient(90deg, #001F3F 0%, #002B5B 40%, #004080 100%);
  border: none;
  border-radius: 50px;
  cursor: pointer;
  overflow: hidden;
  transition: all 0.4s ease;
  box-shadow: 0 0 20px rgba(0, 64, 128, 0.4);
}

.primary-btn:hover {
  transform: scale(1.05);
  box-shadow: 0 0 35px rgba(0, 100, 200, 0.8);
}

/* 🔵 Subtle background glow */
.primary-btn__bg {
  position: absolute;
  inset: 0;
  background: radial-gradient(circle at 30% 30%, rgba(0, 150, 255, 0.25), transparent 60%);
  opacity: 0;
  transition: opacity 0.5s ease;
  border-radius: 50px;
}

.primary-btn:hover .primary-btn__bg {
  opacity: 1;
}

/* ⚡ Moving Shine (Electric Blue Spark) */
.spark {
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    120deg,
    transparent,
    rgba(173, 216, 255, 0.6),
    transparent
  );
  transform: skewX(-25deg);
  animation: sparkMove 3s infinite;
  opacity: 0.8;
}

@keyframes sparkMove {
  0% {
    left: -75%;
  }
  100% {
    left: 125%;
  }
}

/* 🖋️ Text Layer */
.primary-btn .txt {
  position: relative;
  z-index: 2;
  color: #fff;
  letter-spacing: 0.5px;
}




/* h1 (sharper) */
h1{
  font-size:4rem;
  font-weight:900;
 
  position:relative;
  display:inline-block;
  /* Softer gradient without ultra-dark band */
  background:linear-gradient(
    90deg,
    #F1B418 0%,
    #f2e205 25%,
    #d9b100 55%,
    #d49d00 75%,
    #F1B418 100%
  );
  background-size:200% auto;
  background-position:0% 50%;
  background-clip:text;                /* standard */
  -webkit-background-clip:text;        /* webkit */
  -webkit-text-fill-color:transparent;

  letter-spacing:1px;

  /* Remove heavy blur glow (or make it tiny) */
  text-shadow: 0 0 2px rgba(255,235,100,0.25);

  /* Help font rendering */
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  will-change: background-position;
  transition: background-position .4s ease;
  margin-bottom:1rem;
}

/* Optional: subtle aura without blur spill */
h1::after{
  content:"";
  position:absolute;
  inset:-6% -4%;              /* thoda chhota rakho instead of 120% box */
  border-radius:.5rem;
  background: radial-gradient(60% 60% at 50% 60%, rgba(255,235,100,0.12), transparent 70%);
  z-index:-1;
  filter:none;                 /* no extra blur */
}

/* If you want motion, define the keyframes clearly */
@keyframes shineMove{
  0%   { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}
/* Enable smooth scrolling behavior for the entire page */
html {
  scroll-behavior: smooth;
}

/* Optional: Adjust scroll snap for smoother section transitions */
/* section {
  scroll-snap-align: start;
  scroll-snap-stop: always;
} */

/* Optional: Apply snap scrolling container (for full-screen sections) */
/* body {
  scroll-snap-type: y mandatory;
  overflow-y: scroll;
} */


@media( max-width:768px){
.genericHead__title {
    letter-spacing: -.02em;
    font-size: 30px;
    margin-bottom: 0.5em;
    background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.genericHead__subTitle {
    position: relative;
 font-size: 16px;
    font-family: 800;
    padding-left: 1.77em;
    text-transform: capitalize;
    width: 100%;
    max-width: max-content;
    margin-bottom: 1.6em;
    color: #F2B035;
}
.ourBlogs .genericHead h2 {
     font-size: 30px;
  margin-bottom: 0.5em;
   background: linear-gradient(90deg, #c0c0c0 0%, #e0e0e0 50%, #9fa8b3 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    
}
}



/* FIX SCROLL LOCK PROBLEM */
* {
    overscroll-behavior: contain !important;
}



